@charset "UTF-8";
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
  scrollbar-gutter: stable;
}
@media (min-width: 769px) and (max-width: 1440px) {
  html {
    font-size: 1.1111111111vw;
  }
}

body {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1rem;
  line-height: 1.8;
  color: #1f1f1f;
  background-color: #f5f5f5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  padding-top: 4.125rem;
  overflow-x: clip;
}
@media (min-width: 769px) {
  body {
    padding-top: 5.8125rem;
  }
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: baseline;
}

a {
  color: inherit;
  text-decoration: none;
}

ul,
ol {
  list-style: none;
}

button {
  cursor: pointer;
  background: none;
  border: none;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

input,
textarea,
select {
  font-family: inherit;
  font-size: inherit;
  outline: none;
}

br.pc-only {
  display: none;
}
@media (min-width: 769px) {
  br.pc-only {
    display: block;
  }
}

br.sp-only {
  display: block;
}
@media (min-width: 769px) {
  br.sp-only {
    display: none;
  }
}

@media (max-width: 768px) {
  .pc-only {
    display: none !important;
  }
}

@media (min-width: 769px) {
  .sp-only {
    display: none !important;
  }
}

.u-shift {
  display: inline-block;
  transform: translateX(var(--x, 0));
}

.page-hero {
  padding-top: 40px;
}
@media (min-width: 769px) {
  .page-hero {
    padding-top: 60px;
  }
}
.page-hero__watermark {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 64px;
  line-height: 1;
  color: rgba(255, 27, 167, 0.12);
  margin-bottom: -16px;
}
@media (min-width: 769px) {
  .page-hero__watermark {
    font-size: 110px;
    margin-bottom: -28px;
  }
}
.page-hero__heading {
  font-size: 26px;
  font-weight: 700;
  position: relative;
  z-index: 1;
}
@media (min-width: 769px) {
  .page-hero__heading {
    font-size: 40px;
  }
}

.breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #666666;
  margin-top: 12px;
}
.breadcrumb a {
  color: #666666;
}
.breadcrumb a:hover {
  color: #ff1ba7;
}
.breadcrumb__sep {
  font-size: 10px;
}

.section-heading {
  font-size: 20px;
  font-weight: 700;
  text-align: center;
}
@media (min-width: 769px) {
  .section-heading {
    font-size: 32px;
  }
}

.section-sub {
  font-size: 13px;
  color: #666666;
  text-align: center;
  margin-top: 8px;
}
@media (min-width: 769px) {
  .section-sub {
    font-size: 15px;
  }
}

.tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0.0625rem solid #ff1ba7;
  color: #ff1ba7;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0;
  max-width: 100%;
  white-space: nowrap;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 16px 28px;
  border-radius: 50px;
  font-weight: 700;
  font-size: 14px;
  line-height: 1.4;
  transition: transform 0.2s ease;
  cursor: pointer;
}
@media (min-width: 769px) {
  .btn {
    font-size: 15px;
    padding: 18px 36px;
  }
}
@media (hover: hover) {
  .btn:hover {
    transform: scale(1.1);
  }
}
.btn--primary {
  background-color: #ff1ba7;
  color: #ffffff;
}
.btn--line {
  background-color: #06c755;
  color: #ffffff;
  position: relative;
  overflow: hidden;
  scale: 1;
  transition: scale 0.25s ease;
}
@media (prefers-reduced-motion: no-preference) {
  .btn--line {
    animation: btn-line-breathe 2.4s ease-in-out infinite;
  }
}
@media (hover: hover) {
  .btn--line:hover {
    transform: none;
    scale: 1.1;
  }
}
.btn--line::before {
  content: "";
  display: block;
  width: 22px;
  height: 22px;
  background: url("../assets/icons/fv/line.svg") no-repeat center/contain;
  flex-shrink: 0;
}
.btn--line::after {
  content: "";
  position: absolute;
  top: -6.25rem;
  left: -6.25rem;
  width: 3.125rem;
  height: 3.125rem;
  background: linear-gradient(100deg, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0.85) 100%, rgba(255, 255, 255, 0));
  pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
  .btn--line::after {
    animation: btn-line-shine 3s ease-in-out infinite;
  }
}
.btn--outline {
  background-color: #ffffff;
  border: 2px solid #ff1ba7;
  color: #ff1ba7;
}
.btn--full {
  width: 100%;
}
.btn--arrow::after {
  content: "↗";
  display: block;
  font-size: 0.9em;
}

@keyframes btn-line-breathe {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.04);
  }
}
@keyframes btn-line-shine {
  0% {
    transform: scale(0) rotate(25deg);
    opacity: 0;
  }
  50% {
    transform: scale(1) rotate(25deg);
    opacity: 1;
  }
  100% {
    transform: scale(50) rotate(25deg);
    opacity: 0;
  }
}
.btn-line {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.84375rem;
  width: 89.3333333333vw;
  max-width: 20.9375rem;
  height: 14.4vw;
  max-height: 3.375rem;
  background-color: #06c755;
  border-radius: 0.25rem;
  padding: 0.625rem 1.5rem;
  color: #ffffff;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 0.843125rem;
  font-weight: 700;
  font-style: normal;
  line-height: 1.6;
  letter-spacing: 0;
  scale: 1;
  transition: scale 0.25s ease;
  position: relative;
  overflow: hidden;
}
@media (prefers-reduced-motion: no-preference) {
  .btn-line {
    animation: btn-line-breathe 2.4s ease-in-out infinite;
  }
}
@media (hover: hover) {
  .btn-line:hover {
    scale: 1.1;
  }
}
.btn-line::after {
  content: "";
  position: absolute;
  top: -6.25rem;
  left: -6.25rem;
  width: 3.125rem;
  height: 3.125rem;
  background: linear-gradient(100deg, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0.85) 100%, rgba(255, 255, 255, 0));
  pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
  .btn-line::after {
    animation: btn-line-shine 3s ease-in-out infinite;
  }
}
.btn-line__icon {
  width: 1rem;
  height: 0.953125rem;
  flex-shrink: 0;
  position: relative;
  right: -0.21875rem;
}
@media (min-width: 769px) {
  .btn-line__icon {
    width: 1.625rem;
    height: 1.5625rem;
    right: -0.41875rem;
  }
}

.header {
  position: fixed;
  top: 0.625rem;
  z-index: 100;
  left: 0.9375rem;
  right: 0.9375rem;
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-radius: 0.625rem;
}
@media (min-width: 769px) {
  .header {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    width: 83.75rem;
    max-width: calc(100% - 2.5rem);
  }
}
.header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 3.5rem;
  width: calc(100vw - 1.875rem);
  padding: 0.375rem 0.5rem;
}
@media (min-width: 769px) {
  .header__inner {
    height: 5.1875rem;
    padding: 0 1.25rem;
    width: 100%;
  }
}
.header__logo {
  display: flex;
  align-items: center;
}
.header__logo img {
  height: 2.75rem;
  width: auto;
  -o-object-fit: contain;
     object-fit: contain;
}
@media (min-width: 769px) {
  .header__logo img {
    width: 5.375rem;
    height: 3.9375rem;
  }
}
.header__nav {
  display: none;
}
@media (min-width: 769px) {
  .header__nav {
    display: block;
  }
}
.header__nav-list {
  display: flex;
  align-items: center;
  gap: 2.5rem;
}
.header__nav-list a {
  position: relative;
  font-size: 1rem;
  font-weight: 500;
  color: #1f1f1f;
  white-space: nowrap;
}
.header__nav-list .nav-swap {
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}
.header__nav-list .nav-swap__a, .header__nav-list .nav-swap__b {
  display: block;
  transition: transform 600ms cubic-bezier(0.43, 0.05, 0.17, 1);
}
.header__nav-list .nav-swap__b {
  position: absolute;
  inset: 0;
  transform: translateY(100%);
}
@media (hover: hover) {
  .header__nav-list a:hover .nav-swap__a {
    transform: translateY(-100%);
  }
  .header__nav-list a:hover .nav-swap__b {
    transform: translateY(0);
    transition-delay: 100ms;
  }
}
@media (prefers-reduced-motion: reduce) {
  .header__nav-list .nav-swap__a,
  .header__nav-list .nav-swap__b {
    transition: none;
  }
}
.header__menu-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0.875rem 0.75rem 0.9375rem;
  background-color: #1f1f1f;
  border-radius: 0.25rem;
  flex-shrink: 0;
}
@media (min-width: 769px) {
  .header__menu-btn {
    display: none;
  }
}
.header__menu-btn span {
  display: block;
  width: 1rem;
  height: 0.0625rem;
  background-color: #ffffff;
  transition: transform 0.3s ease, opacity 0.3s ease;
}
.header__menu-btn.is-active span:nth-child(1) {
  transform: translateY(0.3125rem) rotate(45deg);
}
.header__menu-btn.is-active span:nth-child(2) {
  opacity: 0;
}
.header__menu-btn.is-active span:nth-child(3) {
  transform: translateY(-0.3125rem) rotate(-45deg);
}

@keyframes footer-flicker {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0.7;
  }
}
.footer {
  background-color: #344d4d;
  color: #ffffff;
}
.footer__body {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .footer__body {
    padding-inline: 3.75rem;
  }
}
.footer__body {
  padding-top: 40px;
  padding-bottom: 80px;
}
@media (min-width: 769px) {
  .footer__body {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    -moz-column-gap: 40px;
         column-gap: 40px;
    max-width: 1440px;
    padding-top: 60px;
    padding-inline: 50px;
    padding-bottom: 0;
  }
}
@media (min-width: 769px) {
  .footer__right {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 40px;
    margin-top: 20px;
  }
}
.footer__logo {
  display: block;
  margin-bottom: 1.9375rem;
}
@media (min-width: 769px) {
  .footer__logo {
    margin-bottom: 0;
    flex-shrink: 0;
  }
}
.footer__logo img {
  height: 3.9375rem;
  width: 5.375rem;
}
@media (min-width: 769px) {
  .footer__logo img {
    width: 5.375rem;
    height: 3.9375rem;
  }
}
.footer__nav {
  margin-bottom: 2.5rem;
  width: 96%;
}
@media (min-width: 769px) {
  .footer__nav {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 40.5px;
    margin-bottom: 0;
    width: auto;
  }
}
.footer__nav-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px 0px;
}
@media (min-width: 769px) {
  .footer__nav-list {
    display: flex;
    flex-direction: row;
    gap: 40px;
  }
}
.footer__nav-list > li {
  line-height: 1.3;
}
.footer__nav-list a {
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.3;
  color: rgba(255, 255, 255, 0.75);
  transition: color 0.2s;
}
.footer__nav-list a:hover {
  color: #ffffff;
}
.footer__nav-list .footer__letter {
  display: inline-block;
  white-space: pre;
}
@media (hover: hover) {
  .footer__nav-list a:hover .footer__letter {
    animation-name: footer-flicker;
    animation-duration: 0.1s;
    animation-timing-function: cubic-bezier(0.83, 0.08, 0.11, 0.93);
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-fill-mode: both;
  }
}
@media (prefers-reduced-motion: reduce) {
  .footer__nav-list a:hover .footer__letter {
    animation: none;
  }
}
.footer__nav-list--sub {
  margin-top: 20px;
  grid-column: 1/-1;
}
@media (min-width: 769px) {
  .footer__nav-list--sub {
    margin-top: 0;
  }
}
.footer__line-btn {
  width: 100%;
  border-radius: 5px;
  position: relative;
  padding-left: 17%;
  font-size: 0.843125rem;
  height: 3.375rem;
  white-space: nowrap;
}
@media (min-width: 769px) {
  .footer__line-btn {
    width: 23.4375rem;
    max-width: 100%;
    height: 80px;
    justify-content: flex-start;
    padding-left: 2.875rem;
    gap: 1.025rem;
    font-size: 1.25rem;
    flex-shrink: 0;
  }
}
.footer__line-btn::before {
  position: absolute;
  left: 22%;
  width: 1rem;
  height: 0.953125rem;
}
@media (min-width: 769px) {
  .footer__line-btn::before {
    position: static;
    left: auto;
    width: 1.666875rem;
    height: 1.588125rem;
  }
}
.footer__copy {
  text-align: center;
  padding-bottom: 1.75rem;
  font-family: "Poppins", sans-serif;
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.45);
}
@media (min-width: 769px) {
  .footer__copy {
    font-size: 0.875rem;
    padding: 6.4375rem 3.75rem 2.25rem;
  }
}

.drawer {
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: #f8f8f8;
  z-index: 50;
  transform: translateX(100%);
  visibility: hidden;
  transition: transform 0.35s ease, visibility 0s linear 0.35s;
  overflow-y: auto;
}
.drawer.is-open {
  transform: translateX(0);
  visibility: visible;
  transition: transform 0.35s ease;
}
.drawer__inner {
  padding: 6.625rem 25px 3rem;
  min-height: 100%;
  display: flex;
  flex-direction: column;
}
.drawer__nav-list a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 15px;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.3;
  color: #1f1f1f;
  position: relative;
}
.drawer__nav-list a .arrow {
  font-size: 1rem;
  color: #666666;
  position: absolute;
  right: 5%;
}
.drawer__line-btn {
  width: 100%;
  margin-top: 40px;
  justify-content: flex-start;
  font-size: 0.843125rem;
  border-radius: 0rem;
  padding-top: 1.125rem;
  padding-bottom: 1.125rem;
  padding-left: 29%;
}
.drawer__line-btn::before {
  position: absolute;
  left: 21.1%;
  width: 16px;
  height: 18px;
}

.drawer-overlay {
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 40;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s ease;
}
.drawer-overlay.is-open {
  opacity: 1;
  pointer-events: all;
}

.vup-loader {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: #ffffff;
  flex-direction: column;
  overflow: hidden;
}
.vup-loader__preview {
  position: relative;
  flex: 1;
  min-height: 0;
  display: grid;
  place-items: center;
  background: radial-gradient(120% 120% at 50% 38%, #ffffff 0%, #eef0f3 78%);
  overflow: hidden;
}
.vup-loader__preview img {
  height: clamp(60px, 15vh, 140px);
  width: auto;
  opacity: 0;
  transform: rotate(-360deg) scale(0.15);
  transform-origin: center;
  animation: vup-ld-spin 0.9s cubic-bezier(0.34, 1.45, 0.5, 1) 0.25s forwards;
}
.vup-loader__preview::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.025) 0 1px, transparent 1px 3px);
}
.vup-loader__cap {
  position: absolute;
  bottom: 1rem;
  left: 0;
  right: 0;
  text-align: center;
  color: #1f1f1f;
  font-family: "Poppins", sans-serif;
  font-size: 0.8125rem;
  letter-spacing: 0.22em;
  opacity: 0.7;
}
.vup-loader__cap .dots span {
  animation: vup-ld-blink 1.2s steps(1) infinite;
}
.vup-loader__cap .dots span:nth-child(2) {
  animation-delay: 0.2s;
}
.vup-loader__cap .dots span:nth-child(3) {
  animation-delay: 0.4s;
}
.vup-loader__panel {
  background: #f1f1f5;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  padding: 0.875rem 1.125rem 1.125rem;
}
.vup-loader__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 0.6875rem;
  font-family: "Poppins", sans-serif;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  color: rgba(31, 31, 31, 0.55);
}
.vup-loader__pct {
  color: #ff1ba7;
  font-weight: 700;
  font-size: 1.25rem;
}
.vup-loader__tracks {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  container-type: inline-size;
}
.vup-loader__track {
  display: flex;
  gap: 0.3125rem;
  height: 1rem;
}
.vup-loader__clip {
  height: 100%;
  border-radius: 0.1875rem;
  opacity: 0;
  transform: translateY(26px) scale(0.5);
  animation: vup-ld-snap 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
  animation-delay: var(--d, 0s);
}
.vup-loader__playhead {
  position: absolute;
  top: -2px;
  bottom: -2px;
  left: 0;
  width: 2px;
  background: #1f1f1f;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.25);
  opacity: 0;
  will-change: transform;
  animation: vup-ld-ph 2.2s linear 0.4s forwards;
}
.vup-loader__prog {
  height: 0.3125rem;
  border-radius: 0.1875rem;
  background: rgba(0, 0, 0, 0.1);
  margin-top: 0.75rem;
  overflow: hidden;
}
.vup-loader__prog span {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: 0.1875rem;
  background: linear-gradient(90deg, #ff1ba7, #ff7ad1);
}
.vup-loader.is-exit {
  animation: vup-ld-fade 0.5s ease-out 0.3s forwards;
}
.vup-loader.is-exit .vup-loader__panel {
  animation: vup-ld-fade 0.28s ease forwards;
}
.vup-loader.is-exit .vup-loader__cap {
  animation: vup-ld-fade 0.24s ease forwards;
}
.vup-loader.is-exit .vup-loader__preview img {
  animation: vup-ld-pop 0.5s cubic-bezier(0.33, 0, 0.2, 1) forwards;
}

html.is-loading {
  overflow: hidden;
}
html.is-loading .vup-loader {
  display: flex;
}

.vup-fade {
  position: fixed;
  inset: 0;
  z-index: 9998;
  background: #ffffff;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s ease;
}
.vup-fade.is-on {
  opacity: 1;
}

@keyframes vup-ld-spin {
  to {
    opacity: 1;
    transform: rotate(0deg) scale(1);
  }
}
@keyframes vup-ld-blink {
  0%, 100% {
    opacity: 0.2;
  }
  50% {
    opacity: 1;
  }
}
@keyframes vup-ld-snap {
  to {
    opacity: 0.95;
    transform: none;
  }
}
@keyframes vup-ld-ph {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    transform: translateX(calc(100cqi - 2px));
    opacity: 1;
  }
}
@keyframes vup-ld-pop {
  from {
    transform: scale(1);
    opacity: 1;
  }
  to {
    transform: scale(2);
    opacity: 0;
  }
}
@keyframes vup-ld-fade {
  to {
    opacity: 0;
  }
}
@property --a {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}
@keyframes about-deco-pop {
  0%, 6% {
    transform: scale(0);
  }
  10% {
    transform: scale(1.1);
  }
  12%, 80% {
    transform: scale(1);
  }
  82% {
    transform: scale(1.1);
  }
  86%, 100% {
    transform: scale(0);
  }
}
@keyframes about-float {
  0%, 100% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(-2%, -5%);
  }
  50% {
    transform: translate(0, -8%);
  }
  75% {
    transform: translate(2%, -4%);
  }
}
@keyframes about-label-pop {
  0% {
    opacity: 0;
    transform: translateY(40%) scale(0.7);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@keyframes hero-feat-in {
  0% {
    opacity: 0;
    transform: translateY(30px) scale(0.8);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@keyframes hero-feat-sway {
  0%, 100% {
    transform: rotate(-6deg);
  }
  50% {
    transform: rotate(6deg);
  }
}
@keyframes hero-feat-bob {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-12%);
  }
}
@keyframes hero-feat-pulse {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.12);
  }
}
@keyframes vcal-draw {
  from {
    clip-path: inset(0 100% 0 0);
  }
  to {
    clip-path: inset(0 0 0 0);
  }
}
@keyframes vcal-pop {
  from {
    opacity: 0;
    transform: scale(0) rotate(-120deg);
  }
  to {
    opacity: 1;
    transform: scale(1) rotate(0);
  }
}
@keyframes vjob-draw {
  from {
    clip-path: inset(0 100% 0 0);
  }
  to {
    clip-path: inset(0 0 0 0);
  }
}
@keyframes vplane-fly {
  from {
    opacity: 0;
    transform: translate(155%, 99%);
  }
  25% {
    opacity: 1;
  }
  to {
    opacity: 1;
    transform: translate(0, 0);
  }
}
@keyframes vcloud-drift {
  0%, 100% {
    transform: translate(-14%, 9.2%);
  }
  50% {
    transform: translate(14%, -9.2%);
  }
}
@keyframes vjob-shadow-breathe {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(var(--grow, 1.14));
  }
}
.hero {
  margin-top: 1rem;
  position: relative;
  overflow-x: clip;
}
@media (min-width: 769px) {
  .hero {
    margin-top: 1.1875rem;
  }
}
.hero__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media (min-width: 769px) {
  .hero__inner {
    position: relative;
    flex-direction: row-reverse;
    align-items: flex-start;
    max-width: 1440px;
    margin-inline: auto;
    padding-inline: clamp(1.5rem, 5.6vw, 5rem);
    gap: 2.5rem;
  }
}
.hero__bg-deco {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  z-index: 0;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  top: 10rem;
  width: 140vw;
}
@media (min-width: 769px) {
  .hero__bg-deco {
    top: -113px;
    width: 100vw;
  }
}
.hero__bg-shape {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  --a: 0deg;
  will-change: --a;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}
.hero__bg-shape img {
  display: block;
  width: 100%;
  height: auto;
}
.hero__bg-shape.is-reveal {
  -webkit-mask-image: conic-gradient(from var(--from) at var(--ox) var(--oy), #000000 calc(var(--a) - var(--soft)), transparent var(--a));
  mask-image: conic-gradient(from var(--from) at var(--ox) var(--oy), #000000 calc(var(--a) - var(--soft)), transparent var(--a));
}
.hero__bg-shape.is-erase {
  -webkit-mask-image: conic-gradient(from var(--from) at var(--ox) var(--oy), transparent var(--a), #000000 calc(var(--a) + var(--soft)));
  mask-image: conic-gradient(from var(--from) at var(--ox) var(--oy), transparent var(--a), #000000 calc(var(--a) + var(--soft)));
}
@media (prefers-reduced-motion: reduce) {
  .hero__bg-shape {
    --a: 382deg !important;
  }
}
.hero__bg-shape {
  --hero-shape-gap: 6rem;
  transform: translateY(var(--hero-shape-gap));
}
.hero__bg-shape:first-child {
  --s1-x: 0vw;
  --s1-y: -10rem;
  transform: translate(var(--s1-x), calc(var(--hero-shape-gap) * -1 + var(--s1-y)));
}
@media (min-width: 769px) {
  .hero__bg-shape {
    --hero-shape-gap: 0rem;
  }
}
.hero__image {
  width: 88vw;
  aspect-ratio: 330/363;
  overflow: hidden;
}
@media (min-width: 769px) {
  .hero__image {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    width: 49%;
    aspect-ratio: 630/740;
    border-radius: 10px;
  }
}
.hero__image > img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: 110% 100%;
  object-position: 110% 100%;
  transform: scale(1.1);
}
.hero__text {
  width: 100%;
  padding: 0rem 1.25rem;
  margin-top: 1.5rem;
}
@media (min-width: 769px) {
  .hero__text {
    padding: 0;
    margin-top: 3.25rem;
  }
}
.hero .tag {
  font-size: 0.875rem;
  line-height: 1.3;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 14.375rem;
  height: 1.875rem;
  padding: 0.625rem 1.25rem;
}
@media (min-width: 769px) {
  .hero .tag {
    width: 21.25rem;
    height: 2.875rem;
    max-width: none;
    font-size: 1.25rem;
    line-height: 1.3;
    padding: 0.625rem 1.25rem;
    border-width: 0.0625rem;
  }
}
.hero__heading {
  margin-top: 0.625rem;
  font-size: 2.25rem;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-style: normal;
  line-height: 1.3;
  letter-spacing: 0;
  color: #1f1f1f;
}
@media (min-width: 769px) {
  .hero__heading {
    margin-top: 1rem;
    font-size: 4.25rem;
  }
}
.hero__heading-accent {
  color: #ff1ba7;
  margin-left: 0.25rem;
}
.hero__features {
  display: flex;
  gap: 1rem;
  margin-top: 0.625rem;
  width: 100%;
}
@media (min-width: 769px) {
  .hero__features {
    width: 24.5rem;
    height: 7rem;
    gap: 1.75rem;
    margin-top: 1.625rem;
  }
}
.hero__feature-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.135rem;
  width: 4.625rem;
  height: 4.625rem;
  background-color: #ffffff;
  border-radius: 0.25rem;
}
@media (min-width: 769px) {
  .hero__feature-box {
    width: 7rem;
    height: 7rem;
    gap: 0.25rem;
    justify-content: center;
  }
}
.hero__feature-icon {
  width: 1.5rem;
  height: 1.5rem;
  -o-object-fit: contain;
  object-fit: contain;
}
@media (min-width: 769px) {
  .hero__feature-icon {
    width: 2.25rem;
    height: 2.25rem;
  }
}
.hero__feature-text {
  font-size: 0.875rem;
  font-weight: 500;
  text-align: center;
  line-height: 1.2;
  color: #1f1f1f;
}
@media (min-width: 769px) {
  .hero__feature-text {
    font-size: 1.125rem;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .hero__feature-box {
    opacity: 0;
    animation: hero-feat-in 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) both;
  }
  .hero__feature-box:nth-child(1) {
    animation-delay: 0.2s;
  }
  .hero__feature-box:nth-child(2) {
    animation-delay: 0.35s;
  }
  .hero__feature-box:nth-child(3) {
    animation-delay: 0.5s;
  }
  .hero__feature-box:nth-child(1) .hero__feature-icon img {
    transform-origin: bottom center;
    animation: hero-feat-sway 3.2s ease-in-out 1s infinite;
  }
  .hero__feature-box:nth-child(2) .hero__feature-icon img {
    animation: hero-feat-bob 2.6s ease-in-out 1.15s infinite;
  }
  .hero__feature-box:nth-child(3) .hero__feature-icon img {
    animation: hero-feat-pulse 2.4s ease-in-out 1.3s infinite;
  }
}
.hero .btn-line {
  margin-top: 1.25rem;
}
@media (min-width: 769px) {
  .hero .btn-line {
    margin-top: 2.5rem;
    max-width: none;
    width: 89.4%;
    height: 6.25rem;
    max-height: none;
    gap: 1.5rem;
    font-size: 1.5625rem;
  }
}

.about {
  position: relative;
  padding: 3.75rem 0 0 0;
  max-width: 125rem;
  margin-inline: auto;
}
@media (min-width: 769px) {
  .about {
    padding: 6.375rem 0 9.6875rem;
  }
}
.about__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .about__inner {
    padding-inline: 3.75rem;
  }
}
.about__inner {
  text-align: center;
}
.about::before {
  content: "What";
  position: absolute;
  top: 2px;
  left: 0;
  transform: rotate(90deg) translateY(0.6125rem);
  transform-origin: left bottom;
  white-space: nowrap;
  font-family: "Poppins", sans-serif;
  font-size: 3.625rem;
  font-weight: 700;
  line-height: 1;
  color: rgba(31, 31, 31, 0.08);
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
@media (min-width: 769px) {
  .about::before {
    font-size: 11.25rem;
    top: 10.325rem;
    transform: rotate(90deg) translateY(1.8125rem);
  }
}
.about__heading {
  font-size: 2.25rem;
  font-weight: 700;
  line-height: 1.6;
}
@media (min-width: 769px) {
  .about__heading {
    font-size: 3rem;
  }
}
.about__heading-sub {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.6;
}
@media (min-width: 769px) {
  .about__heading-sub {
    font-size: 2.25rem;
  }
}
.about__body.pc {
  height: 4.1875rem;
  margin-top: 1.25rem;
  margin-left: 0.5rem;
}
@media (min-width: 769px) {
  .about__body.pc {
    position: absolute;
    top: 21.1rem;
    left: calc(50% - 45rem + 4.5rem);
    height: auto;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.125rem;
    z-index: 2;
  }
}
.about__body.students {
  margin-top: 0.375rem;
  align-items: flex-start;
  justify-content: end;
  margin-right: 1%;
  gap: 1%;
}
@media (min-width: 769px) {
  .about__body.students {
    position: absolute;
    right: calc(50% - 45rem + 5.3rem);
    bottom: 4.175rem;
    margin: 0;
    align-items: flex-end;
    flex-direction: column;
    gap: 0rem;
    z-index: 2;
  }
}
.about__body {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
  height: 6.125rem;
}
@media (min-width: 769px) {
  .about__body {
    gap: 2.5rem;
    margin-top: 3.5rem;
  }
}
.about__label {
  flex-shrink: 0;
  width: 9.5rem;
  height: 4.125rem;
  background: url("../assets/images/shapes/shape1.webp") no-repeat center/100% 100%;
  display: flex;
  align-items: center;
  padding-left: 0.3125rem;
  padding-top: 0.0625rem;
}
@media (min-width: 769px) {
  .about__label {
    width: 12.9rem;
    height: 7.2rem;
    align-items: flex-start;
    padding-left: 0;
    justify-content: center;
    background: url("../assets/images/shapes/shape3.webp") no-repeat center/100% 100%;
  }
}
.about__label.shape2 {
  width: 9.275rem;
  height: 4.058125rem;
  background-image: url("../assets/images/shapes/shape2.webp");
  padding-left: 0.75rem;
  padding-top: 0.0625rem;
}
@media (min-width: 769px) {
  .about__label.shape2 {
    width: 12.875rem;
    height: 7.209375rem;
    padding-left: 0;
    background: url("../assets/images/shapes/shape3.webp") no-repeat center/100% 100%;
  }
}
.about__label-text {
  color: #ffffff;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.6;
  white-space: nowrap;
  text-align: center;
}
@media (min-width: 769px) {
  .about__label-text {
    font-size: 1.25rem;
    padding-top: 1rem;
  }
}
.about__media {
  height: 100%;
  position: relative;
}
@media (min-width: 769px) {
  .about__media {
    width: 50%;
    flex-shrink: 0;
  }
  .about__media.students {
    transform: translateX(-34%);
  }
}
.about__media.students {
  width: 25.61%;
}
@media (min-width: 769px) {
  .about__media.students {
    width: 50%;
  }
}
.about__media img {
  height: 100%;
}
.about__media .about__media-deco {
  position: absolute;
  left: 41.4%;
  top: 1.7%;
  width: 31.2%;
  aspect-ratio: 77/127;
  background: url("../assets/icons/movie/pc-deco.webp") no-repeat center/contain;
  pointer-events: none;
  transform-origin: center;
}
@media (prefers-reduced-motion: no-preference) {
  .about__media .about__media-deco {
    transform: scale(0);
  }
}
@media (prefers-reduced-motion: no-preference) {
  .about__media.is-deco-on .about__media-deco {
    animation: about-deco-pop 10s ease-in-out infinite;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .about__media.students.is-deco-on img {
    animation: about-float 6s ease-in-out infinite;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .about__label.is-pop-ready {
    opacity: 0;
    transform: translateY(40%) scale(0.7);
  }
  .about__label.is-pop {
    animation: about-label-pop 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) both;
  }
}
@media (min-width: 769px) {
  .about__body.pc .about__media, .about__body.students .about__media {
    width: auto;
    height: auto;
    flex-shrink: 0;
    margin-left: 3%;
  }
  .about__body.pc .about__media img, .about__body.students .about__media img {
    height: auto;
  }
}
@media (min-width: 769px) {
  .about__body.pc .about__media img {
    width: 7.2rem;
  }
}
@media (min-width: 769px) {
  .about__body.students .about__media img {
    width: 8rem;
    justify-content: center;
  }
}
.about__text {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .about__text {
    padding-inline: 3.75rem;
  }
}
.about__text {
  margin-top: 1.25rem;
  text-align: center;
}
@media (min-width: 769px) {
  .about__text {
    margin-top: 1.25rem;
  }
}
.about__text p {
  font-size: 1.125rem;
  font-family: "Noto Sans JP", sans-serif;
  line-height: 1.6;
}
@media (min-width: 769px) {
  .about__text p {
    font-size: 1.25rem;
  }
}
.about__video {
  margin: 0 auto;
  margin-top: 0.5rem;
  width: 20.9375rem;
  aspect-ratio: 335/280;
  border-radius: 0.625rem;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (min-width: 769px) {
  .about__video {
    width: 47rem;
    max-width: calc(100% - 11.25rem);
    aspect-ratio: 3/2;
    margin-top: 2.6rem;
    background-color: #d9d9d9;
    border-radius: 1rem;
  }
}
.about__video video {
  width: 100%;
  height: 100%;
  border: none;
  display: block;
  -o-object-fit: contain;
     object-fit: contain;
  background-color: #000000;
}
.about__video-pc {
  display: block;
  margin: 0 auto;
  max-width: 17.5rem;
  height: auto;
}
@media (min-width: 769px) {
  .about__video-pc {
    display: none;
  }
}

.values {
  padding-top: 5rem;
  background-color: #f5f5f5;
}
@media (min-width: 769px) {
  .values {
    padding: 2.2375rem 0;
  }
}
.values__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .values__inner {
    padding-inline: 3.75rem;
  }
}
.values__heading {
  font-size: 1.75rem;
  line-height: 1.2;
  font-weight: 700;
  text-align: center;
  position: relative;
}
@media (min-width: 769px) {
  .values__heading {
    font-size: 3rem;
  }
}
.values__heading::after {
  content: "Value";
  display: block;
  position: absolute;
  font-size: 5rem;
  top: -3.2rem;
  left: 50%;
  transform: translateX(-50%);
  color: #ff1ba7;
  opacity: 0.08;
  font-family: "Poppins", sans-serif;
}
@media (min-width: 769px) {
  .values__heading::after {
    font-size: 11.25rem;
    top: -5.2rem;
  }
}
.values__heading-span {
  color: #ff1ba7;
}
.values__heading-span--number {
  font-size: 2.375rem;
}
@media (min-width: 769px) {
  .values__heading-span--number {
    font-size: 4.5rem;
  }
}
.values__list {
  display: flex;
  flex-direction: column;
  gap: 3rem;
  margin: 0 auto;
  margin-top: 2.875rem;
  max-width: 17.5rem;
}
@media (min-width: 769px) {
  .values__list {
    flex-direction: row;
    gap: 7.5rem;
    margin-top: 1.8rem;
    max-width: 87.5rem;
    width: 90%;
    margin-left: 5.833%;
    margin-right: 4.167%;
  }
}
.values__item {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
}
.values__item-image {
  width: 100%;
  height: 11.25rem;
  overflow: hidden;
  border-radius: 1rem;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (min-width: 769px) {
  .values__item-image {
    height: 11.3rem;
  }
}
.values__item-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
.values__illust {
  width: 64%;
  height: 99%;
}
.values__illust.no2 {
  width: 44%;
}
.values__illust.no3 {
  width: 70%;
}
.values__illust img {
  width: 100%;
  display: block;
  -o-object-fit: contain;
  object-fit: contain;
}
.values__illust--travel {
  width: auto;
  height: 84%;
  aspect-ratio: 358/296;
  position: relative;
}
.values__illust-base {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: contain;
  object-fit: contain;
}
.values .vtravel {
  position: absolute;
  background: no-repeat center/contain;
  pointer-events: none;
}
.values .vtravel--cloud1 {
  left: 83.2%;
  top: 29.7%;
  width: 16.95%;
  aspect-ratio: 91/86;
  z-index: 1;
  background-image: url("../assets/images/top/values/travel-cloud-lg.webp");
}
.values .vtravel--cloud2 {
  left: 19%;
  top: 68.9%;
  width: 16.95%;
  aspect-ratio: 91/86;
  z-index: 1;
  background-image: url("../assets/images/top/values/travel-cloud-lg.webp");
}
.values .vtravel--cloud3 {
  left: 37.4%;
  top: 49.3%;
  width: 12.66%;
  aspect-ratio: 68/65;
  z-index: 1;
  background-image: url("../assets/images/top/values/travel-cloud-sm.webp");
}
.values .vtravel--plane {
  left: 0%;
  top: 0.45%;
  width: 60.34%;
  aspect-ratio: 327/208;
  z-index: 5;
  background-image: url("../assets/images/top/values/travel-plane.webp");
}
.values__illust--cal {
  width: 44%;
  height: auto;
  aspect-ratio: 243/273;
  position: relative;
}
.values .vcal {
  position: absolute;
  background: no-repeat center/contain;
  pointer-events: none;
}
.values .vcal--line4 {
  left: 51.44%;
  top: 37%;
  width: 24.69%;
  aspect-ratio: 61/37;
  background-image: url("../assets/images/top/values/cal/line1.webp");
}
.values .vcal--line1 {
  left: 28.81%;
  top: 57.51%;
  width: 25.1%;
  aspect-ratio: 61/37;
  background-image: url("../assets/images/top/values/cal/line1.webp");
}
.values .vcal--line2 {
  left: 29.22%;
  top: 45.05%;
  width: 48.97%;
  aspect-ratio: 119/71;
  background-image: url("../assets/images/top/values/cal/line2.webp");
}
.values .vcal--line3 {
  left: 28.81%;
  top: 71.79%;
  width: 16.05%;
  aspect-ratio: 39/24;
  background-image: url("../assets/images/top/values/cal/line3.webp");
}
.values .vcal--circle {
  left: 43.21%;
  top: 66.67%;
  width: 8.23%;
  aspect-ratio: 20/25;
  background-image: url("../assets/images/top/values/cal/circle.webp");
}
.values__illust--job {
  width: 70%;
  height: auto;
  aspect-ratio: 390/270;
  position: relative;
  isolation: isolate;
}
.values .vjob-shadow {
  position: absolute;
  z-index: -1;
  width: 34%;
  aspect-ratio: 176/103;
  background: url("../assets/images/top/values/job/job-shadow.webp") no-repeat center/contain;
  transform-origin: 80% 26%;
  pointer-events: none;
  will-change: transform;
}
.values .vjob-shadow--s1 {
  left: 1%;
  top: 46%;
  --sd: 0s;
  --dur: 4.6s;
}
.values .vjob-shadow--s2 {
  left: 19%;
  top: 31%;
  --sd: -1.5s;
  --dur: 5.1s;
}
.values .vjob-shadow--s3 {
  left: 37%;
  top: 16%;
  --sd: -3s;
  --dur: 4.2s;
}
.values .vjob-sq,
.values .vjob-ln {
  position: absolute;
  background: no-repeat center/contain;
  pointer-events: none;
}
.values .vjob-sq {
  background-image: url("../assets/images/top/values/job/job-static.webp");
}
.values .vjob-sq--l1,
.values .vjob-ln--p1 {
  left: 15.9%;
  top: 30%;
  width: 14.62%;
  aspect-ratio: 57/120;
  --pd: 0s;
}
.values .vjob-sq--l2,
.values .vjob-ln--p2 {
  left: 33.85%;
  top: 14.81%;
  width: 14.62%;
  aspect-ratio: 57/120;
  --pd: 0.62s;
}
.values .vjob-sq--l3,
.values .vjob-ln--p3 {
  left: 51.79%;
  top: 0.37%;
  width: 14.62%;
  aspect-ratio: 57/120;
  --pd: 1.24s;
}
.values .vjob-ln--n1 {
  background-image: url("../assets/images/top/values/job/job-ln-1.webp");
  --ld: 0s;
}
.values .vjob-ln--n2 {
  background-image: url("../assets/images/top/values/job/job-ln-2.webp");
  --ld: 0.07s;
}
.values .vjob-ln--n3 {
  background-image: url("../assets/images/top/values/job/job-ln-3.webp");
  --ld: 0.14s;
}
.values .vjob-ln--n4 {
  background-image: url("../assets/images/top/values/job/job-ln-4.webp");
  --ld: 0.21s;
}
.values .vjob-ln--n5 {
  background-image: url("../assets/images/top/values/job/job-ln-5.webp");
  --ld: 0.28s;
}
.values .vjob-ln--n6 {
  background-image: url("../assets/images/top/values/job/job-ln-6.webp");
  --ld: 0.35s;
}
.values .vjob-ln--n7 {
  background-image: url("../assets/images/top/values/job/job-ln-7.webp");
  --ld: 0.42s;
}
.values .vjob-ln--n8 {
  background-image: url("../assets/images/top/values/job/job-ln-8.webp");
  --ld: 0.49s;
}
.values .vjob-ln--n9 {
  background-image: url("../assets/images/top/values/job/job-ln-9.webp");
  --ld: 0.56s;
}
.values .vjob-ln--n10 {
  background-image: url("../assets/images/top/values/job/job-ln-10.webp");
  --ld: 0.63s;
}
.values .vjob-ln--n11 {
  background-image: url("../assets/images/top/values/job/job-ln-11.webp");
  --ld: 0.7s;
}
.values .vjob-ln--n12 {
  background-image: url("../assets/images/top/values/job/job-ln-12.webp");
  --ld: 0.77s;
}
.values .vjob-ln--n13 {
  background-image: url("../assets/images/top/values/job/job-ln-13.webp");
  --ld: 0.84s;
}
@media (prefers-reduced-motion: no-preference) {
  .values .values__illust--travel.anim-js .vtravel--plane {
    opacity: 0;
    transform: translate(155%, 99%);
  }
  .values .values__illust--travel.is-anim .vtravel--plane {
    animation: vplane-fly 1.15s cubic-bezier(0.22, 0.61, 0.36, 1) 0.2s forwards;
  }
  .values .values__illust--travel .vtravel--cloud1 {
    animation: vcloud-drift 7s ease-in-out infinite;
  }
  .values .values__illust--travel .vtravel--cloud2 {
    animation: vcloud-drift 9s ease-in-out -3s infinite;
  }
  .values .values__illust--travel .vtravel--cloud3 {
    animation: vcloud-drift 8s ease-in-out -5s infinite;
  }
  .values .values__illust--job .vjob-shadow {
    animation: vjob-shadow-breathe var(--dur, 4.5s) ease-in-out infinite;
    animation-delay: var(--sd, 0s);
  }
  .values .values__illust--cal.anim-js .vcal--line4,
  .values .values__illust--cal.anim-js .vcal--line1,
  .values .values__illust--cal.anim-js .vcal--line2,
  .values .values__illust--cal.anim-js .vcal--line3 {
    clip-path: inset(0 100% 0 0);
  }
  .values .values__illust--cal.anim-js .vcal--circle {
    opacity: 0;
    transform: scale(0) rotate(-120deg);
    transform-origin: center;
  }
  .values .values__illust--cal.is-anim .vcal--line4 {
    animation: vcal-draw 0.4s ease-out 0.15s forwards;
  }
  .values .values__illust--cal.is-anim .vcal--line2 {
    animation: vcal-draw 0.5s ease-out 0.55s forwards;
  }
  .values .values__illust--cal.is-anim .vcal--line1 {
    animation: vcal-draw 0.4s ease-out 0.95s forwards;
  }
  .values .values__illust--cal.is-anim .vcal--line3 {
    animation: vcal-draw 0.3s ease-out 1.25s forwards;
  }
  .values .values__illust--cal.is-anim .vcal--circle {
    animation: vcal-pop 0.45s cubic-bezier(0.34, 1.56, 0.64, 1) 1.55s forwards;
  }
  .values .values__illust--job.anim-js .vjob-ln {
    clip-path: inset(0 100% 0 0);
  }
  .values .values__illust--job.is-anim .vjob-ln {
    animation: vjob-draw 0.4s ease-out both;
    animation-delay: calc(var(--pd, 0s) + var(--ld, 0s));
  }
}
.values__num {
  position: absolute;
  top: 0;
  left: 0;
  font-family: "Poppins", sans-serif;
  font-size: 3.75rem;
  font-weight: 700;
  color: #ff1ba7;
  line-height: 1;
  transform: translate(-27%, -32%);
}
.values__num.no1 {
  transform: translate(-34.2%, -33%);
}
@media (min-width: 769px) {
  .values__num.no1 {
    transform: translate(-7%, 33%);
  }
}
@media (min-width: 769px) {
  .values__num {
    font-size: 3.75rem;
    position: relative;
    transform: translate(-7%, 33%);
  }
}
.values__item-body {
  text-align: center;
  margin-top: 1.25rem;
}
.values__title {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.3;
}
@media (min-width: 769px) {
  .values__title {
    font-size: 1.5rem;
  }
}
.values__desc {
  font-size: 1rem;
  line-height: 1.6;
  margin-top: 0.625rem;
  text-align: left;
}
@media (min-width: 769px) {
  .values__desc {
    font-size: 1rem;
  }
}

@keyframes change-sub-bob {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-16%);
  }
}
@keyframes change-heading-pulse {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.035);
  }
}
@keyframes change-arrow-nudge-x {
  0%, 100% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(0.75rem);
  }
}
@keyframes change-arrow-nudge-y {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(0.5rem);
  }
}
@keyframes change-arrow-blink {
  0%, 100% {
    opacity: 0.25;
  }
  25% {
    opacity: 1;
  }
  55% {
    opacity: 0.25;
  }
}
.change {
  padding-top: 5rem;
  padding-bottom: 3.75rem;
}
@media (min-width: 769px) {
  .change {
    padding-top: 3.85rem;
    padding-bottom: 8.125rem;
  }
}
@media (min-width: 769px) {
  .change__head {
    padding: 2rem 0;
  }
}
.change__head-inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .change__head-inner {
    padding-inline: 3.75rem;
  }
}
.change__head-inner {
  text-align: center;
}
.change__heading {
  font-size: 2.25rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  margin-top: 0.125rem;
}
@media (min-width: 769px) {
  .change__heading {
    font-size: 3rem;
    margin-top: 10px;
  }
}
.change__heading-span {
  color: #ff1ba7;
}
.change__heading-sub {
  font-size: 1.25rem;
  font-weight: 700;
  padding-left: 0.5rem;
  position: relative;
  display: inline-block;
}
.change__heading-sub::before {
  content: "";
  position: absolute;
  left: -1.85%;
  top: 50%;
  transform: translateY(-50%) rotate(-37deg);
  width: 0.125rem;
  height: 1.5rem;
  background-color: #1f1f1f;
  border-radius: 0.125rem;
}
.change__heading-sub::after {
  content: "";
  position: absolute;
  right: -1.75%;
  top: 50%;
  transform: translateY(-50%) rotate(37deg);
  width: 0.125rem;
  height: 1.5rem;
  background-color: #1f1f1f;
  border-radius: 0.125rem;
}
.change__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .change__inner {
    padding-inline: 3.75rem;
  }
}
.change__inner {
  padding-inline: 1.40625rem;
  margin-top: 2.5rem;
}
@media (min-width: 769px) {
  .change__inner {
    padding-inline: 1.4375rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: flex-start;
    margin-top: 6.45rem;
    width: 73.5%;
    gap: 28.8%;
    position: relative;
    max-width: 66.15rem;
  }
}
.change__content {
  position: relative;
}
@media (min-width: 769px) {
  .change__content {
    max-width: 26.25rem;
    width: 34.2%;
  }
}
.change__content.before::before {
  content: "Before";
  color: #ffffff;
  font-family: "Poppins", sans-serif;
  font-size: 0.875rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -5.4%;
  left: -3.5%;
  width: 22%;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background-color: #0d508b;
}
@media (min-width: 769px) {
  .change__content.before::before {
    font-size: 1.875rem;
    top: -26.6%;
    left: -21%;
    width: 43.35%;
  }
}
.change__content.after {
  margin-top: 1.75rem;
}
@media (min-width: 769px) {
  .change__content.after {
    margin-top: 0;
  }
}
.change__content.after::before {
  content: "After";
  color: #ffffff;
  font-family: "Poppins", sans-serif;
  font-size: 0.875rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -5.4%;
  left: -3.5%;
  width: 22%;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background-color: #ff1ba7;
}
@media (min-width: 769px) {
  .change__content.after::before {
    font-size: 1.875rem;
    top: -26.6%;
    left: -28.1%;
    width: 43.35%;
  }
}
.change__content.before .change__list li::before {
  width: 1rem;
  height: 1rem;
  border-radius: 0;
  background: url("../assets/images/shapes/checkmark.webp") no-repeat center/contain;
}
@media (min-width: 769px) {
  .change__content.before .change__list li::before {
    width: 22px;
    height: 14px;
    top: 32%;
    left: -1.15em;
  }
}
.change__content.after .change__list li::before {
  background: url("../assets/images/shapes/checkmark-pink.webp") no-repeat center/contain;
  width: 1rem;
  height: 0.8125rem;
}
@media (min-width: 769px) {
  .change__content.after .change__list li::before {
    width: 24px;
    height: 24px;
  }
}
@media (min-width: 769px) {
  .change__image {
    max-width: none;
    margin-inline: auto;
  }
}
.change__image img {
  width: 100%;
  border-radius: 0.75rem;
}
.change__comparison {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin-top: 1.125rem;
}
@media (min-width: 769px) {
  .change__comparison {
    gap: 2.5rem;
    align-items: flex-start;
    margin-top: 1.55rem;
  }
}
.change__before, .change__after {
  width: 100%;
  background: #f8f8f8;
  border-radius: 0.75rem;
  padding: 1.25rem 1rem;
}
@media (min-width: 769px) {
  .change__before, .change__after {
    padding: 2rem 1.75rem;
  }
}
.change__label {
  font-family: "Poppins", sans-serif;
  font-size: 1.25rem;
  font-weight: 700;
}
@media (min-width: 769px) {
  .change__label {
    font-size: 1.75rem;
  }
}
.change__before .change__label {
  color: #666666;
}
.change__after .change__label {
  color: #ff1ba7;
}
.change__list {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
@media (min-width: 769px) {
  .change__list {
    gap: 0.5rem;
  }
}
.change__list li {
  font-size: 1.25rem;
  padding-left: 1.6875rem;
  position: relative;
  line-height: 1.6;
  color: #0d508b;
}
@media (min-width: 769px) {
  .change__list li {
    font-size: 1.5rem;
    padding-left: 3px;
  }
}
.change__list li::before {
  content: "";
  display: block;
  position: absolute;
  top: 27%;
  left: 0.15em;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
}
@media (min-width: 769px) {
  .change__list li::before {
    top: 16%;
    left: -1.15em;
  }
}
.change__list.after li {
  color: #ff1ba7;
  font-weight: 700;
  margin-left: 0%;
}
@media (min-width: 769px) {
  .change__list.after li {
    margin-left: -5%;
  }
}
.change__arrow {
  display: flex;
  flex-direction: column;
  gap: 0.4375rem;
  align-items: center;
  flex-shrink: 0;
  margin-top: 2.5rem;
}
@media (min-width: 769px) {
  .change__arrow {
    flex-direction: row;
    gap: 0.7rem;
    margin-top: 5.7rem;
    position: absolute;
    right: 43.06%;
  }
}
.change__arrow span {
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 1.14375rem 0.863125rem 0 0.863125rem;
  border-color: transparent transparent transparent transparent;
}
.change__arrow span:nth-child(1) {
  border-top-color: #0d508b;
}
.change__arrow span:nth-child(2) {
  border-top-color: #618484;
}
.change__arrow span:nth-child(3) {
  border-top-color: #00abed;
}
@media (min-width: 769px) {
  .change__arrow span {
    border-width: 1.8696875rem 0 1.8696875rem 2.478125rem;
  }
  .change__arrow span:nth-child(1) {
    border-top-color: transparent;
    border-left-color: #0d508b;
  }
  .change__arrow span:nth-child(2) {
    border-top-color: transparent;
    border-left-color: #618484;
  }
  .change__arrow span:nth-child(3) {
    border-top-color: transparent;
    border-left-color: #00abed;
  }
}
.change__cta {
  margin-top: 2.9375rem;
  margin-left: -1%;
  text-align: center;
}
@media (min-width: 769px) {
  .change__cta {
    flex-basis: 100%;
    width: 100%;
    margin-left: 0;
    margin-top: 2.5rem;
  }
}
@media (min-width: 769px) {
  .change__cta .btn-line {
    gap: 1.44375rem;
    max-width: 34.3375rem;
    height: 24.4vw;
    max-height: 6.175rem;
    font-size: 1.5625rem;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .change__heading-sub {
    animation: change-sub-bob 1.8s ease-in-out infinite;
  }
  .change__heading {
    transform-origin: center;
    animation: change-heading-pulse 2.8s ease-in-out infinite;
  }
  .change__arrow span {
    animation: change-arrow-blink 1.6s ease-in-out infinite;
  }
  .change__arrow span:nth-child(2) {
    animation-delay: 0.22s;
  }
  .change__arrow span:nth-child(3) {
    animation-delay: 0.44s;
  }
}
@media (prefers-reduced-motion: no-preference) and (min-width: 769px) {
  .change__inner.is-reveal-init .change__content.before {
    opacity: 0;
    transform: translateX(-40px);
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .change__inner.is-reveal-init .change__content.after {
    opacity: 0;
    transform: translateX(40px);
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.55s, transform 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.55s;
  }
  .change__inner.is-reveal-init.is-inview .change__content.before,
  .change__inner.is-reveal-init.is-inview .change__content.after {
    opacity: 1;
    transform: none;
  }
}

.message {
  background-color: #ED0591;
  color: #ffffff;
  padding-top: 3.75rem;
  padding-bottom: 6.5625rem;
  position: relative;
}
@media (min-width: 769px) {
  .message {
    padding: 0 0;
  }
}
.message::before {
  content: "Message";
  display: block;
  position: absolute;
  font-family: "Poppins", sans-serif;
  font-size: 5rem;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.32);
  line-height: 1;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  bottom: 0.75rem;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}
@media (min-width: 769px) {
  .message::before {
    bottom: 1.4375rem;
    font-size: 10rem;
    left: 74.3%;
  }
}
.message__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .message__inner {
    padding-inline: 3.75rem;
  }
}
@media (min-width: 769px) {
  .message__inner {
    display: flex;
    flex-direction: row-reverse;
    align-items: flex-start;
    gap: 4.7rem;
    justify-content: flex-end;
    padding-inline: 0;
    padding-left: 20px;
  }
}
.message__content {
  position: relative;
}
@media (min-width: 769px) {
  .message__content {
    margin-top: 14rem;
  }
}
.message__heading {
  font-size: 2.25rem;
  font-weight: 700;
  position: relative;
  line-height: 1.6;
}
@media (min-width: 769px) {
  .message__heading {
    font-size: 3rem;
    margin-top: -1.5rem;
  }
}
.message__text {
  font-size: 1.125rem;
  line-height: 1.8;
  color: #ffffff;
  margin-top: 1.5rem;
  font-weight: 700;
}
@media (min-width: 769px) {
  .message__text {
    font-size: 1.25rem;
    margin-top: 2rem;
  }
}
.message__text + .message__text {
  margin-top: 0.875rem;
}
@media (min-width: 769px) {
  .message__text + .message__text {
    margin-top: 1px;
  }
}
.message__photos {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  margin-top: 1.875rem;
  margin-inline: -20px;
}
@media (min-width: 769px) {
  .message__photos {
    width: 46.7%;
    margin-top: 0;
    margin-inline: 0;
    flex-direction: row;
    gap: 4.6%;
    height: 55.0625rem;
  }
}
.message__photos-track {
  display: flex;
  width: -moz-max-content;
  width: max-content;
}
@media (min-width: 769px) {
  .message__photos-track {
    flex-direction: column;
    width: 100%;
    height: -moz-max-content;
    height: max-content;
  }
}
.message__photos-track--left {
  animation: photos-scroll-left 12s linear infinite;
}
@media (min-width: 769px) {
  .message__photos-track--left {
    animation: photos-scroll-down 12s linear infinite;
  }
}
.message__photos-track--right {
  animation: photos-scroll-right 12s linear infinite;
}
@media (min-width: 769px) {
  .message__photos-track--right {
    animation: photos-scroll-up 12s linear infinite;
  }
}
.message__photo-item {
  width: 48vw;
  height: 14.0625rem;
  margin-right: 1.25rem;
  border-radius: 0.625rem;
  overflow: hidden;
  flex-shrink: 0;
}
@media (min-width: 769px) {
  .message__photo-item {
    width: 100%;
    height: 13.375rem;
    margin-right: 0;
    margin-bottom: 1.75rem;
  }
}
.message__photo-item--pc-extra {
  display: none;
}
@media (min-width: 769px) {
  .message__photo-item--pc-extra {
    display: block;
  }
}
.message__photo-item img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@keyframes photos-scroll-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
@keyframes photos-scroll-right {
  0% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes photos-scroll-down {
  0% {
    transform: translateY(-43.125rem);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes photos-scroll-up {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-43.125rem);
  }
}
.top-support {
  padding: 3.75rem 0 5.0625rem 0;
}
@media (min-width: 769px) {
  .top-support {
    padding: 8.6875rem 0 80px;
  }
}
.top-support__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .top-support__inner {
    padding-inline: 3.75rem;
  }
}
.top-support__heading {
  font-size: 2.25rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}
@media (min-width: 769px) {
  .top-support__heading {
    font-size: 3rem;
  }
}
.top-support__heading > .pink {
  color: #ff1ba7;
}
@media (min-width: 769px) {
  .top-support__heading br {
    display: none;
  }
}
.top-support__list {
  display: flex;
  flex-direction: column;
  gap: 1.3125rem;
  margin-top: 2.5rem;
}
@media (min-width: 769px) {
  .top-support__list {
    gap: 60px;
    margin-top: 2.875rem;
  }
}
.top-support__item {
  display: flex;
  flex-direction: column;
  border-radius: 0.75rem;
  overflow: hidden;
  background: #ffffff;
}
@media (min-width: 769px) {
  .top-support__item {
    flex-direction: row;
    align-items: stretch;
    border-radius: 1.25rem;
    /* box-shadow: 0 0.25rem 1.5rem rgba(0, 0, 0, 0.06); */
    min-height: 330px;
    width: 91.67%;
  }
  .top-support__item:nth-child(odd) {
    margin-left: 1.67%;
    margin-right: auto;
  }
  .top-support__item:nth-child(even) {
    flex-direction: row-reverse;
    margin-left: auto;
    margin-right: 1.67%;
  }
}
.top-support__image {
  width: 100%;
  aspect-ratio: 335/300;
  overflow: hidden;
  border-radius: 0.625rem 0.625rem 0 0;
  position: relative;
}
@media (min-width: 769px) {
  .top-support__image {
    width: 40%;
    aspect-ratio: 440/330;
    border-radius: 0;
    flex-shrink: 0;
  }
}
.top-support__image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  display: block;
  transform-origin: top left;
  transform: translate(var(--bx, 0%), var(--by, 0%)) scale(var(--bs, 1));
}
.top-support__body {
  padding: 4.25rem 1rem 5.375rem;
  position: relative;
}
@media (min-width: 769px) {
  .top-support__body {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    /* カード幅1100px基準: 画像との間92px=8.36% / 外側200px=18.18% */
    padding: 7.75rem 18.18% 1.5rem 8.36%; /* 上124px */
  }
}
@media (min-width: 769px) {
  .top-support__item:nth-child(even) .top-support__body {
    padding: 7.75rem 8.36% 0.5rem 18.18%; /* 上124px */
  }
}
@media (min-width: 769px) {
  .top-support__item:nth-child(1) .top-support__body {
    padding-top: 9.1rem; /* 1枚目だけ約144px */
  }
}
.top-support__title {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.3;
  position: relative;
  z-index: 1;
}
.top-support__title::before {
  content: attr(data-num);
  font-family: "Poppins", sans-serif;
  font-size: 5rem;
  font-weight: 700;
  line-height: 1;
  position: absolute;
  left: -5%;
  top: -4rem;
  z-index: -1;
}
@media (min-width: 769px) {
  .top-support__title {
    font-size: 2rem;
    padding-left: 4.1%;
    text-wrap: nowrap;
  }
  .top-support__title::before {
    font-size: 7.136875rem;
    left: 0;
    top: -4.875rem;
  }
}
.top-support__item:nth-child(1) .top-support__title::before {
  background: linear-gradient(180deg, #ff999d 0%, #ffffff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.top-support__item:nth-child(2) .top-support__title::before {
  background: linear-gradient(180deg, #55d3d3 0%, #ffffff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.top-support__item:nth-child(3) .top-support__title::before {
  background: linear-gradient(180deg, #FCA83F 0%, #ffffff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.top-support__item:nth-child(4) .top-support__title::before {
  background: linear-gradient(180deg, #FFD320 0%, #ffffff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.top-support__item:nth-child(5) .top-support__title::before {
  background: linear-gradient(180deg, #C9F0A3 0%, #ffffff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.top-support__item:nth-child(1) .top-support__image img {
  --bx: -11%;
  --by: -1%;
  --bs: 1.3574;
}
@media (min-width: 769px) {
  .top-support__item:nth-child(1) .top-support__image img {
    --bx: -6.5%;
    --by: 0%;
    --bs: 1.13;
  }
}
.top-support__item:nth-child(2) .top-support__image img {
  --bx: -43%;
  --by: -26%;
  --bs: 1.45882;
}
@media (min-width: 769px) {
  .top-support__item:nth-child(2) .top-support__image img {
    --bx: -21%;
    --by: -21%;
    --bs: 1.26588;
  }
}
.top-support__item:nth-child(3) .top-support__image img {
  --bx: -34.5%;
  --by: -6.2%;
  --bs: 1.39916;
}
@media (min-width: 769px) {
  .top-support__item:nth-child(3) .top-support__image img {
    --bx: -4.5%;
    --by: 0%;
    --bs: 1.13;
  }
}
.top-support__item:nth-child(4) .top-support__image img {
  --bx: -14%;
  --by: -1%;
  --bs: 1.34545;
}
@media (min-width: 769px) {
  .top-support__item:nth-child(4) .top-support__image img {
    --bx: -8.7%;
    --by: 0%;
    --bs: 1.18405;
  }
}
.top-support__item:nth-child(5) .top-support__image img {
  --bx: -17%;
  --by: 0%;
  --bs: 1.36;
}
@media (min-width: 769px) {
  .top-support__item:nth-child(5) .top-support__image img {
    --bx: -12.3%;
    --by: 0%;
    --bs: 1.22723;
  }
}
.top-support__desc {
  font-size: 1rem;
  line-height: 1.6;
  margin-top: 1.25rem;
}
@media (min-width: 769px) {
  .top-support__desc {
    font-size: 1rem;
    margin-top: 2.5rem;
    padding-left: 4.1%;
  }
}
.top-support__label {
  position: absolute;
  left: 50%;
  bottom: 1.25rem;
  transform: translateX(-50%);
  font-family: "Poppins", sans-serif;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
  color: rgba(31, 31, 31, 0.5019607843);
  text-align: center;
  margin-top: 1rem;
}
@media (min-width: 769px) {
  .top-support__label {
    writing-mode: vertical-rl;
    left: auto;
    right: 1.5rem;
    bottom: auto;
    top: 50%;
    transform: translateY(-50%);
    margin: 0;
  }
}
@media (min-width: 769px) {
  .top-support__item:nth-child(even) .top-support__label {
    right: auto;
    left: 1.5rem;
  }
}
.top-support__cta {
  text-align: center;
  background-color: #ff1ba7;
  color: #ffffff;
  width: 100%;
  margin-top: 2.5rem;
  height: 4.5rem;
  border-radius: 0.25rem;
  font-weight: 700;
  font-size: 1.25rem;
  line-height: 1.6;
  display: flex;
  align-items: center;
  padding-left: 15.4%;
  position: relative;
  transition: transform 0.2s ease;
}
@media (min-width: 769px) {
  .top-support__cta {
    width: 352px;
    max-width: 100%; /* 狭い画面ではみ出さない保険 */
    height: 72px;
    margin-top: 60px;
    margin-inline: auto;
    border-radius: 0.125rem;
    font-size: 20px;
    padding-left: 5%;
  }
}
@media (hover: hover) {
  .top-support__cta:hover {
    transform: scale(1.1);
  }
}
.top-support__cta::before {
  content: "";
  position: absolute;
  right: 15.3%;
  top: 0;
  width: 1rem;
  height: 100%;
  background: url("../assets/images/shapes/arrow.webp") no-repeat center/contain;
}
@media (min-width: 769px) {
  .top-support__cta::before {
    right: 17%;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .top-support__list.is-reveal-init .top-support__item {
    opacity: 0;
    transform: translateY(40px) scale(0.98);
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .top-support__list.is-reveal-init .top-support__item.is-inview {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.voice {
  padding: 2.5rem 0;
  background-color: #f8f8f8;
  position: relative;
  overflow: hidden;
}
.voice::before {
  content: "";
  position: absolute;
  /* 右だけ40pxはみ出させて overflow:hidden で隠す＝左ずらし時に右端へ出る継ぎ目を視界外へ逃がす。
     left/top/bottom は 0 のままなので位相（background-position: -9px のピッタリ感）は不変。 */
  inset: 0 -40px 0 0;
  /* 縞の太さは「38.89px」を変えるだけ(2つ目は必ずその2倍にする) */
  /* カンプ実測: 横55px間隔・135° → 垂直幅 55/√2 ≈ 38.89px */
  background: repeating-linear-gradient(135deg, #ffb6e4 0 38.89px, #ff8ed4 38.89px 77.78px);
  background-size: 110px 110px;
  z-index: 0;
  background-position: -9px;
}
@media (min-width: 769px) {
  .voice {
    padding: 42px 0; /* シマシマの見える幅: 上下42px */
    background-position: 65px;
  }
}
.voice__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .voice__inner {
    padding-inline: 3.75rem;
  }
}
.voice__inner {
  position: relative;
  z-index: 1;
  background: #ffffff;
  width: 94.1%;
  padding: 2.5rem 0;
  padding-inline: 9px;
  border-radius: 1.125rem;
}
@media (min-width: 769px) {
  .voice__inner {
    /* カンプ1440: 白枠1360px(左右40px) / 上60px / 内側左右50px(50/1440) */
    width: 94.44%;
    /* 1440超で広がりすぎる対策：白枠を1440時の幅1360pxで頭打ち＋中央寄せ。
       rem(1360)=1360×(vw/1440)=94.44%×vw なので1440以下はwidthと完全一致＝1440は不変。 */
    max-width: 85rem;
    padding: 60px 3.47%;
  }
}
.voice__heading {
  font-size: 2.25rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.6;
  color: #ff1ba7;
}
@media (min-width: 769px) {
  .voice__heading {
    font-size: 48px;
  }
}
.voice__grid {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-top: 2.5rem;
}
@media (min-width: 769px) {
  .voice__grid {
    display: flex;
    flex-direction: row;
    justify-content: space-between; /* カード間76px(=コンテンツ1260-592×2) */
    margin-top: 40px;
  }
}
.voice__card {
  border-radius: 0.75rem;
}
@media (min-width: 769px) {
  .voice__card {
    display: flex;
    align-items: flex-start;
    gap: 5.4%; /* 画像↔テキスト 32px(592px基準) */
    width: 46.98%; /* 592/1260 */
  }
}
.voice__photo {
  aspect-ratio: 335/316;
  position: relative;
}
@media (min-width: 769px) {
  .voice__photo {
    width: 44.1%; /* 261/592 */
    aspect-ratio: 261/347;
    flex-shrink: 0;
  }
}
.voice__photo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
.voice__photo.no1::before {
  content: "";
  background: url("../assets/images/shapes/voice01.svg") no-repeat center/contain;
  position: absolute;
  bottom: -1.7%;
  left: -5.5%;
  width: 24.3405%;
  aspect-ratio: 119.27/73.29;
  z-index: 1;
}
@media (min-width: 769px) {
  .voice__photo.no1::before {
    bottom: -7.5%;
    left: -8.9%;
    /* カンプ1440: 119.27×73.29 / 写真261px基準で%化、高さは比率で追従 */
    width: 45.7%;
    z-index: -1;
  }
}
.voice__photo.no2::before {
  content: "";
  background: url("../assets/images/shapes/voice02.svg") no-repeat center/contain;
  position: absolute;
  top: -3.4%;
  right: -4%;
  z-index: 1;
  width: 19.963%;
  /* カンプ1440: 89.71×57.81 / 写真261px基準 */
  aspect-ratio: 89.71/57.81;
}
@media (min-width: 769px) {
  .voice__photo.no2::before {
    top: -7.1%;
    right: -3.3%;
    width: 34.4%;
    z-index: -1;
  }
}
.voice {
  /* 角丸クリップ専用フレーム(本体に掛けると::beforeのバッジが切れるため分離) */
}
.voice__photo-frame {
  width: 100%;
  height: 100%;
}
@media (min-width: 769px) {
  .voice__photo-frame {
    border-radius: 7%;
    overflow: hidden;
  }
}
.voice__body {
  padding: 1.5rem 0rem;
}
@media (min-width: 769px) {
  .voice__body {
    width: 100%;
    padding: 0; /* 隙間はgap 32pxで管理 */
  }
}
.voice__body.no2 {
  padding-top: 2rem;
}
@media (min-width: 769px) {
  .voice__body.no2 {
    padding-top: 20px;
  }
}
.voice__name {
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.3;
  padding-left: 4.2%;
  position: relative;
}
.voice__name::before {
  content: "";
  position: absolute;
  left: 0%;
  top: 50%;
  transform: translateY(-50%);
  width: 0.65rem;
  aspect-ratio: 1/1;
  background-color: #00abed;
  border-radius: 50%;
}
.voice__highlight {
  list-style: none;
  padding: 0;
  margin: 0.46875rem 0 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.25rem; /* 行間4px */
}
@media (min-width: 769px) {
  .voice__highlight {
    margin-top: 12px; /* 名前との間 */
  }
}
.voice__highlight li {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.3;
  background: #00abed;
  color: #ffffff;
  padding: 0.125rem 0.25rem;
}
.voice__quote {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.8;
  margin-top: 1.25rem;
}
@media (min-width: 769px) {
  .voice__quote {
    margin-top: 26px; /* ハイライトとの間 */
  }
}
.voice__cta {
  margin-top: 1rem;
  text-align: center;
}
@media (min-width: 769px) {
  .voice__cta {
    margin-top: 60px; /* カードとの間 */
  }
}
.voice__cta .btn {
  width: 100%;
  height: 4.5rem;
  border-radius: 0.25rem;
  font-size: 1.25rem;
  padding-left: 15.5%;
  position: relative;
  justify-content: flex-start;
}
.voice__cta .btn::after {
  position: absolute;
  right: 15%;
}
@media (min-width: 769px) {
  .voice__cta .btn::after {
    right: 60px;
  }
}
@media (min-width: 769px) {
  .voice__cta .btn {
    width: 352px;
    max-width: 100%; /* 狭い画面ではみ出さない保険 */
    height: 72px;
    font-size: 20px;
    padding-left: 60px;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .voice__grid.is-reveal-init .voice__card {
    opacity: 0;
    transform: translateY(32px);
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .voice__grid.is-reveal-init .voice__card:nth-child(2) {
    transition-delay: 0.1s;
  }
  .voice__grid.is-reveal-init .voice__card.is-inview {
    opacity: 1;
    transform: none;
  }
  .voice__grid.is-reveal-init .voice__highlight li {
    clip-path: inset(0 100% 0 0);
    transition: clip-path 0.5s ease;
  }
  .voice__grid.is-reveal-init .voice__card.is-inview .voice__highlight li {
    clip-path: inset(0 0 0 0);
  }
  .voice__grid.is-reveal-init .voice__card.is-inview .voice__highlight li:nth-child(1) {
    transition-delay: 0.45s;
  }
  .voice__grid.is-reveal-init .voice__card.is-inview .voice__highlight li:nth-child(2) {
    transition-delay: 0.6s;
  }
  .voice__grid.is-reveal-init .voice__card.is-inview .voice__highlight li:nth-child(3) {
    transition-delay: 0.75s;
  }
}

@keyframes cloud-cycle-c1 {
  0%, 2.5% {
    opacity: 0;
    transform: scale(0);
  }
  8.75% {
    opacity: 1;
    transform: scale(1.12);
  }
  12.5%, 65% {
    opacity: 1;
    transform: scale(1);
  }
  72% {
    opacity: 0;
    transform: scale(0.4);
  }
  100% {
    opacity: 0;
    transform: scale(0);
  }
}
@keyframes cloud-cycle-c2 {
  0%, 7% {
    opacity: 0;
    transform: scale(0);
  }
  13.25% {
    opacity: 1;
    transform: scale(1.12);
  }
  17%, 65% {
    opacity: 1;
    transform: scale(1);
  }
  72% {
    opacity: 0;
    transform: scale(0.4);
  }
  100% {
    opacity: 0;
    transform: scale(0);
  }
}
@keyframes cloud-cycle-blob {
  0%, 11.5% {
    opacity: 0;
    transform: scale(0);
  }
  17.75% {
    opacity: 1;
    transform: scale(1.1);
  }
  21.5%, 65% {
    opacity: 1;
    transform: scale(1);
  }
  72% {
    opacity: 0;
    transform: scale(0.4);
  }
  100% {
    opacity: 0;
    transform: scale(0);
  }
}
@keyframes cloud-cycle-q {
  0%, 18% {
    opacity: 0;
    transform: scale(0);
  }
  24.25% {
    opacity: 1;
    transform: scale(1.15);
  }
  28.5%, 65% {
    opacity: 1;
    transform: scale(1);
  }
  72% {
    opacity: 0;
    transform: scale(0.4);
  }
  100% {
    opacity: 0;
    transform: scale(0);
  }
}
.page-head {
  position: relative;
  padding-top: 2.5rem;
  overflow: hidden;
  background-color: #f5f5f5;
}
@media (min-width: 769px) {
  .page-head {
    padding-top: 4rem;
  }
}
.page-head::before {
  content: attr(data-en);
  position: absolute;
  top: 1.5rem;
  left: 1.15rem;
  font-family: "Poppins", sans-serif;
  font-size: 3.5rem;
  font-weight: 700;
  line-height: 1;
  color: rgba(255, 27, 167, 0.08);
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
@media (min-width: 769px) {
  .page-head::before {
    top: 2.5rem;
    left: 3rem;
    font-size: 6.875rem;
  }
}
.page-head__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .page-head__inner {
    padding-inline: 3.75rem;
  }
}
.page-head__inner {
  position: relative;
}
@media (min-width: 769px) {
  .page-head__inner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 2.5rem;
  }
}
@media (min-width: 769px) {
  .page-head__body {
    width: 100%;
    padding-top: 1.5rem;
  }
}
.page-head__title {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.3;
  padding-top: 1.25rem;
}
@media (min-width: 769px) {
  .page-head__title {
    font-size: 2.5rem;
    padding-top: 1.75rem;
  }
}
.page-head__breadcrumb {
  margin-top: 1.25rem;
  font-size: 0.75rem;
  line-height: 1;
  font-weight: 700;
}
.page-head__breadcrumb a {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #1f1f1f;
}
.page-head__home {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  background-color: #CCD8D8;
  border-radius: 50%;
  flex-shrink: 0;
}
.page-head__home::before {
  content: "";
  width: 0.46875rem;
  height: 0.364375rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7.5 5.83' fill='none'%3E%3Cpath d='M7.2 2.915H0.8M3.3 0.4 0.8 2.915l2.5 2.515' stroke='%231F1F1F' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center/contain;
  transform: rotate(45deg);
}
.page-head__lead {
  margin-top: 2.1rem;
  font-size: 1rem;
  line-height: 1.8;
}
@media (min-width: 769px) {
  .page-head__lead {
    max-width: 35rem;
  }
}
.page-head__illust {
  position: absolute;
  top: 0.95rem;
  right: 1rem;
  width: 5.3125rem;
}
@media (min-width: 769px) {
  .page-head__illust {
    position: static;
    flex-shrink: 0;
    width: 16.25rem;
    align-self: center;
  }
}
.page-head__illust img {
  width: 100%;
  height: auto;
  display: block;
}

.page-head--contact {
  overflow: visible;
}
@media (min-width: 769px) {
  .page-head--contact {
    min-height: 26.25rem;
    padding-top: 8.875rem;
  }
}
@media (min-width: 769px) {
  .page-head--contact::before {
    top: 3.7rem;
    left: 7.5rem;
    font-size: 11.25rem;
  }
}
@media (min-width: 769px) {
  .page-head--contact .page-head__body {
    padding-top: 0;
  }
}
@media (min-width: 769px) {
  .page-head--contact .page-head__title {
    font-size: 3rem;
  }
}
@media (min-width: 769px) {
  .page-head--contact .page-head__breadcrumb {
    margin-top: 1.875rem;
  }
}
@media (min-width: 769px) {
  .page-head--contact .page-head__lead {
    margin-top: 2.5rem;
    max-width: none;
  }
}
.page-head--contact .page-head__illust {
  aspect-ratio: 255/300.5;
  min-height: 0;
  top: 1.05rem;
  right: 4.2%;
}
@media (min-width: 769px) {
  .page-head--contact .page-head__illust {
    top: 2.45rem;
    right: 5.2%;
    position: absolute;
    width: 16.375rem;
  }
}
.page-head--contact .page-head__illust .ph-illust {
  position: absolute;
  background: no-repeat center/contain;
  pointer-events: none;
}
.page-head--contact .page-head__illust .ph-illust--person {
  left: 1%;
  top: 22.6%;
  width: 97.33%;
  aspect-ratio: 510/465;
  z-index: 1;
  background-image: url("../assets/images/contact/contact-person.webp");
}
.page-head--contact .page-head__illust .ph-illust--cloud {
  left: 51.9%;
  top: 1%;
  width: 24.83%;
  aspect-ratio: 131/193;
  z-index: 2;
}
.page-head--contact .page-head__illust .cloud-piece {
  position: absolute;
  background: no-repeat center/contain;
}
.page-head--contact .page-head__illust .cloud-piece--c1 {
  left: 9.16%;
  top: 92.75%;
  width: 8.4%;
  aspect-ratio: 11/14;
  background-image: url("../assets/images/contact/bubble/cloud-c1.webp");
}
.page-head--contact .page-head__illust .cloud-piece--c2 {
  left: 17.56%;
  top: 77.72%;
  width: 15.27%;
  aspect-ratio: 20/25;
  background-image: url("../assets/images/contact/bubble/cloud-c2.webp");
}
.page-head--contact .page-head__illust .cloud-piece--blob {
  left: 0;
  top: 0;
  width: 99.24%;
  aspect-ratio: 130/141;
  background-image: url("../assets/images/contact/bubble/cloud-blob.webp");
}
.page-head--contact .page-head__illust .ph-illust--q {
  left: 60.3%;
  top: 6.7%;
  width: 6.805%;
  aspect-ratio: 36/79;
  z-index: 3;
  background-image: url("../assets/images/contact/contact-q.webp");
}
@media (prefers-reduced-motion: no-preference) {
  .page-head--contact .page-head__illust.anim-js .cloud-piece,
  .page-head--contact .page-head__illust.anim-js .ph-illust--q {
    opacity: 0;
    transform: scale(0);
  }
  .page-head--contact .page-head__illust.is-anim .cloud-piece--c1 {
    animation: cloud-cycle-c1 4s ease-out infinite;
  }
  .page-head--contact .page-head__illust.is-anim .cloud-piece--c2 {
    animation: cloud-cycle-c2 4s ease-out infinite;
  }
  .page-head--contact .page-head__illust.is-anim .cloud-piece--blob {
    animation: cloud-cycle-blob 4s ease-out infinite;
  }
  .page-head--contact .page-head__illust.is-anim .ph-illust--q {
    animation: cloud-cycle-q 4s ease-out infinite;
  }
}

.contact {
  background-color: #f5f5f5;
  padding: 2.5rem 0 5rem;
}
@media (min-width: 769px) {
  .contact {
    padding: 2.75rem 0 8.125rem;
  }
}
.contact__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .contact__inner {
    padding-inline: 3.75rem;
  }
}

.contact-form {
  background-color: #ffffff;
  border-radius: 1rem;
  padding: 2.5rem 1.09375rem;
}
@media (min-width: 769px) {
  .contact-form {
    max-width: 52.95rem;
    margin-inline: auto;
    padding: 3.8rem 3.7rem;
  }
}
@media (min-width: 769px) {
  .contact-form__row {
    display: flex;
    gap: 1.3rem;
  }
}
@media (min-width: 769px) {
  .contact-form__row .contact-form__group {
    width: 100%;
  }
}
.contact-form__group {
  margin: 0 0 2rem;
  padding: 0;
  border: none;
}
@media (min-width: 769px) {
  .contact-form__group {
    margin-bottom: 2.45rem;
  }
}
.contact-form__label {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 0.75rem;
}
@media (min-width: 769px) {
  .contact-form__label {
    line-height: 1.4;
    margin-bottom: 0.95rem;
  }
}
.contact-form__label--gap16 {
  gap: 1rem;
}
.contact-form__required {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #ed5053;
  color: #ffffff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.3;
  padding: 0.125rem 0.3125rem;
  border-radius: 0.25rem;
}
.contact-form__input, .contact-form__textarea {
  width: 100%;
  height: 3.125rem;
  background-color: #f5f5f5;
  border: 0.0625rem solid #D9D9D9;
  border-radius: 0.375rem;
  padding: 0 0.975rem 0.5rem;
  font-size: 1rem;
  font-family: "Noto Sans JP", sans-serif;
  line-height: 1.6;
  color: #1f1f1f;
  transition: border-color 0.2s ease;
  font-weight: 700;
}
.contact-form__input::-moz-placeholder, .contact-form__textarea::-moz-placeholder {
  color: rgba(31, 31, 31, 0.2);
}
.contact-form__input::placeholder, .contact-form__textarea::placeholder {
  color: rgba(31, 31, 31, 0.2);
}
.contact-form__input[type=email]::-moz-placeholder, .contact-form__input[type=tel]::-moz-placeholder, .contact-form__textarea[type=email]::-moz-placeholder, .contact-form__textarea[type=tel]::-moz-placeholder {
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.3;
}
.contact-form__input[type=email]::placeholder, .contact-form__input[type=tel]::placeholder, .contact-form__textarea[type=email]::placeholder, .contact-form__textarea[type=tel]::placeholder {
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.3;
}
.contact-form__input:focus, .contact-form__textarea:focus {
  outline: none;
  border-color: #ff1ba7;
}
.contact-form__textarea {
  min-height: 16.4375rem;
  resize: vertical;
}
.contact-form__radio {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  font-size: 1rem;
  line-height: 1.3;
  cursor: pointer;
}
.contact-form__radio + .contact-form__radio {
  margin-top: 0.5rem;
}
.contact-form__radio input[type=radio] {
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  width: 1.125rem;
  height: 1.125rem;
  border: 0.125rem solid #CCD8D8;
  border-radius: 50%;
  flex-shrink: 0;
  position: relative;
  cursor: pointer;
}
.contact-form__radio input[type=radio]:checked {
  border-color: #ff1ba7;
}
.contact-form__radio input[type=radio]:checked::after {
  content: "";
  position: absolute;
  inset: 0.1875rem;
  border-radius: 50%;
  background-color: #ff1ba7;
}
.contact-form__agree {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  font-size: 1rem;
  line-height: 1.6;
  margin-top: -0.5rem;
  cursor: pointer;
}
@media (min-width: 769px) {
  .contact-form__agree {
    margin-top: -0.5625rem;
    font-weight: 700;
  }
}
.contact-form__agree input[type=checkbox] {
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  width: 1.25rem;
  height: 1.25rem;
  border: 0.125rem solid #CCD8D8;
  border-radius: 0.1875rem;
  flex-shrink: 0;
  position: relative;
  cursor: pointer;
}
.contact-form__agree input[type=checkbox]:checked {
  background-color: #ff1ba7;
  border-color: #ff1ba7;
}
.contact-form__agree input[type=checkbox]:checked::after {
  content: "";
  position: absolute;
  top: 0.125rem;
  left: 0.3125rem;
  width: 0.375rem;
  height: 0.6875rem;
  border: solid #ffffff;
  border-width: 0 0.125rem 0.125rem 0;
  transform: rotate(45deg);
}
.contact-form__submit {
  margin-top: 1.8rem;
  text-align: center;
}
@media (min-width: 769px) {
  .contact-form__submit {
    margin-top: 2.35rem;
  }
}

.contact-form__input.is-error, .contact-form__textarea.is-error {
  border-color: #ed5053;
  background-color: rgba(237, 80, 83, 0.1);
}
.contact-form__input.is-error:focus, .contact-form__textarea.is-error:focus {
  border-color: #ed5053;
}
.contact-form__radio input[type=radio].is-error, .contact-form__agree input[type=checkbox].is-error {
  border-color: #ed5053;
  background-color: rgba(237, 80, 83, 0.1);
}
.contact-form__error {
  display: none;
  margin-top: 0.5rem;
  color: #ed5053;
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1.4;
}
.contact-form__error.is-visible {
  display: block;
}
.contact-form__error--agree {
  text-align: center;
}
.contact-form__success {
  display: none;
  margin-top: 1rem;
  text-align: center;
  color: #ff1ba7;
  font-weight: 700;
  line-height: 1.6;
}
.contact-form__success.is-visible {
  display: block;
}

.btn-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  width: 100%;
  max-width: 25rem;
  height: 4.5rem;
  background-color: #ff1ba7;
  color: #ffffff;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.6;
  border: none;
  border-radius: 0.3125rem;
  cursor: pointer;
  transition: transform 0.2s ease;
}
@media (min-width: 769px) {
  .btn-submit {
    max-width: 22rem;
  }
}
@media (hover: hover) {
  .btn-submit:hover {
    transform: scale(1.1);
  }
}
.btn-submit::after {
  content: "";
  width: 1rem;
  height: 1rem;
  background: url("../assets/images/shapes/arrow.webp") no-repeat center/contain;
  flex-shrink: 0;
}

.page-head__accent {
  color: #ff1ba7;
  font-weight: 700;
}

.page-head--sup {
  position: relative;
  padding-top: 2.5rem;
  overflow: hidden;
  background-color: #f5f5f5;
  max-width: 90rem;
  margin-inline: auto;
}
@media (min-width: 769px) {
  .page-head--sup {
    padding-top: 9.125rem;
  }
}
.page-head--sup::before {
  content: attr(data-en);
  position: absolute;
  top: 1.5rem;
  left: 1.15rem;
  font-family: "Poppins", sans-serif;
  font-size: 3.5rem;
  font-weight: 700;
  line-height: 1;
  color: rgba(255, 27, 167, 0.08);
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  text-transform: lowercase;
}
@media (min-width: 769px) {
  .page-head--sup::before {
    top: 3.7rem;
    left: 8.2%;
    font-size: 11.25rem;
    text-transform: none;
  }
}
.page-head--sup .page-head__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .page-head--sup .page-head__inner {
    padding-inline: 3.75rem;
  }
}
.page-head--sup .page-head__inner {
  position: relative;
}
@media (min-width: 769px) {
  .page-head--sup .page-head__inner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 2.5rem;
  }
}
@media (min-width: 769px) {
  .page-head--sup .page-head__body {
    width: 100%;
  }
}
.page-head--sup .page-head__title {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.3;
  padding-top: 1.25rem;
}
@media (min-width: 769px) {
  .page-head--sup .page-head__title {
    font-size: 3rem;
    padding-top: 0;
  }
}
.page-head--sup .page-head__breadcrumb {
  margin-top: 1.25rem;
}
@media (min-width: 769px) {
  .page-head--sup .page-head__breadcrumb {
    margin-top: 1.85rem;
  }
}
.page-head--sup .page-head__lead {
  margin-top: 2rem;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.6;
}
@media (min-width: 769px) {
  .page-head--sup .page-head__lead {
    font-size: 2rem;
    max-width: none;
    margin-top: 7.5rem;
    text-align: center;
  }
}
.page-head--sup .page-head__illust {
  top: 0.95rem;
  right: 1rem;
  width: 5.3125rem;
}
@media (min-width: 769px) {
  .page-head--sup .page-head__illust {
    position: absolute;
    width: 17.875rem;
    top: -6.1rem;
    right: 8%;
  }
}
.page-head--sup .page-head__illust > img {
  display: block;
  width: 100%;
  height: auto;
}
.page-head--sup .page-head__illust .sup-ico {
  position: absolute;
  pointer-events: none;
  will-change: transform, opacity;
  transform-origin: center;
}
@media (prefers-reduced-motion: no-preference) {
  .page-head--sup .page-head__illust .sup-ico {
    animation: sup-icon-cycle 9s ease-in-out var(--sd, 0s) infinite both;
  }
}
.page-head--sup .page-head__illust .sup-ico--heart {
  left: 44.41%;
  top: 24.67%;
  width: 5.59%;
  height: 7.33%;
  --sd: 0.1s;
}
.page-head--sup .page-head__illust .sup-ico--like {
  left: 53.15%;
  top: 28.33%;
  width: 5.94%;
  height: 7%;
  --sd: 0.85s;
}
.page-head--sup .page-head__illust .sup-ico--star {
  left: 56.99%;
  top: 15.67%;
  width: 5.94%;
  height: 7.33%;
  --sd: 0.35s;
}
.page-head--sup .page-head__illust .sup-ico--search {
  left: 67.13%;
  top: 8.33%;
  width: 8.04%;
  height: 11.33%;
  --sd: 1.05s;
}
.page-head--sup .page-head__illust .sup-ico--youtube {
  left: 62.94%;
  top: 21.67%;
  width: 14.69%;
  height: 16.67%;
  --sd: 0.55s;
}
.page-head--sup .page-head__illust .sup-ico--share {
  left: 80.77%;
  top: 10.33%;
  width: 10.14%;
  height: 14.67%;
  --sd: 0.15s;
}
.page-head--sup .page-head__illust .sup-ico--chart {
  left: 76.92%;
  top: 29.67%;
  width: 8.04%;
  height: 11.33%;
  --sd: 0.95s;
}
.page-head--sup .page-head__illust .sup-ico--chat {
  left: 60.14%;
  top: 41.67%;
  width: 11.19%;
  height: 12.67%;
  --sd: 0.7s;
}
.page-head--sup .page-head__illust .sup-ico--mail {
  left: 71.33%;
  top: 45.67%;
  width: 16.43%;
  height: 12.67%;
  --sd: 1.25s;
}

@keyframes sup-icon-cycle {
  0% {
    opacity: 0;
    transform: translateY(0) scale(0);
  }
  4% {
    opacity: 1;
    transform: translateY(0) scale(1.18);
  }
  8% {
    transform: translateY(0) scale(0.94);
  }
  11% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  24% {
    transform: translateY(-13%) scale(1);
  }
  38% {
    transform: translateY(8%) scale(1);
  }
  52% {
    transform: translateY(-11%) scale(1);
  }
  64% {
    transform: translateY(5%) scale(1);
  }
  70% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  78% {
    opacity: 0;
    transform: translateY(-8%) scale(0);
  }
  100% {
    opacity: 0;
    transform: translateY(0) scale(0);
  }
}
.change__image--before-sup,
.change__image--after-sup {
  position: relative;
  aspect-ratio: 330/247;
  overflow: hidden;
  border-radius: 0.75rem;
  background-color: #f8f8f8;
}
.change__image--before-sup img,
.change__image--after-sup img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  display: block;
  transform-origin: top left;
  transform: translate(var(--bx, 0%), var(--by, 0%)) scale(var(--bs, 1));
}

.change__image--before-sup img {
  --bx: -55.9%;
  --by: -14.7%;
  --bs: 1.63426;
}
@media (min-width: 769px) {
  .change__image--before-sup img {
    --bx: -53%;
    --by: -12%;
    --bs: 1.55385;
  }
}

.change__image--after-sup img {
  --bx: -2.1%;
  --by: -3%;
  --bs: 1.3661;
}

.change__content.before:has(.change__image--before-sup)::before,
.change__content.after:has(.change__image--after-sup)::before {
  z-index: 1;
}

.reason {
  position: relative;
  overflow: clip;
  padding: 5rem 0 3.75rem;
  max-width: 125rem;
  margin-inline: auto;
}
@media (min-width: 769px) {
  .reason {
    padding: 5rem 0 8.125rem;
  }
}
.reason::before {
  content: attr(data-en);
  position: absolute;
  top: 5rem;
  left: -1.640625rem;
  writing-mode: vertical-rl;
  font-family: "Poppins", sans-serif;
  font-size: 3.5rem;
  font-weight: 700;
  line-height: 1.6;
  color: rgba(255, 27, 167, 0.08);
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
@media (min-width: 769px) {
  .reason::before {
    font-size: 11.25rem;
    left: -5rem;
    top: 22.7rem;
  }
}
.reason__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .reason__inner {
    padding-inline: 3.75rem;
  }
}
.reason__inner {
  position: relative;
}
@media (min-width: 769px) {
  .reason__inner {
    display: flex;
    justify-content: space-between;
  }
}
.reason__head {
  margin-bottom: 2.5rem;
}
@media (min-width: 769px) {
  .reason__head {
    margin-top: 2.5rem;
    width: 20%;
    position: sticky;
    top: calc(50vh - 7.0625rem);
    align-self: flex-start;
  }
}
.reason__heading {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.3;
}
@media (min-width: 769px) {
  .reason__heading {
    font-size: 3rem;
  }
}
.reason__heading-num {
  color: #ff1ba7;
  font-size: 2.75rem;
}
@media (min-width: 769px) {
  .reason__heading-num {
    font-size: 4.125rem;
    line-height: 1.3;
    margin-top: 0.4rem;
    display: inline-block;
  }
}
.reason__sub {
  margin-top: 1.25rem;
  font-size: 1rem;
  line-height: 1.6;
  font-weight: 700;
  color: #1f1f1f;
}
@media (min-width: 769px) {
  .reason__sub {
    font-size: 1rem;
    margin-top: 1.25rem;
  }
}
.reason__list {
  list-style: none;
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
}
@media (min-width: 769px) {
  .reason__list {
    grid-template-columns: 1fr 1fr;
    gap: 3.75rem 2.5rem;
    width: 69.6666666667%;
  }
}

.reason-card {
  background-color: #ffffff;
  border-radius: 1.25rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1.25rem 0;
  border: 1px solid #CCD8D8;
}
@media (min-width: 769px) {
  .reason-card {
    padding: 1.5rem 0;
  }
}
.reason-card__photo {
  width: 83.5820895522%;
  aspect-ratio: 300/180;
  border-radius: 0.25rem;
  overflow: hidden;
}
@media (min-width: 769px) {
  .reason-card__photo {
    width: 75.3768844221%;
  }
}
.reason-card__photo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
  transform: scale(var(--bs, 1)) translate(var(--bx, 0%), var(--by, 0%));
}
.reason-card__title {
  margin-top: 1rem;
  text-align: center;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.6;
  color: #1f1f1f;
}
.reason-card__title-line {
  position: relative;
  display: table;
  margin-inline: auto;
  margin-top: var(--shift-y, 0);
  transform: translateX(var(--shift, 0));
}
.reason-card__title-line::after {
  content: "";
  position: absolute;
  left: calc(var(--ul-l, 0px) * -1);
  right: calc(var(--ul-r, 0px) * -1);
  bottom: var(--ul-b, -0.125rem);
  height: 0.625rem;
  background-color: rgba(241, 5, 147, 0.3098039216);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.6s ease;
}
.reason-card__title-line + .reason-card__title-line {
  margin-top: calc(0.25rem + var(--shift-y, 0));
}
.reason-card__title.is-show .reason-card__title-line::after {
  transform: scaleX(1);
}
.reason-card__text {
  margin-top: 1rem;
  font-size: 1rem;
  line-height: 1.6;
  color: #1f1f1f;
  padding: 0 8.2089552239;
  width: 83.5820895522%;
}
@media (min-width: 769px) {
  .reason-card__text {
    width: 87.9396984925%;
  }
}

.reason__list .reason-card:nth-child(1) .reason-card__photo img {
  --bs: 1.20505;
  --bx: -5.3%;
  --by: 9.4%;
}
@media (min-width: 769px) {
  .reason__list .reason-card:nth-child(1) .reason-card__photo img {
    --bs: 1.1;
    --bx: 1.9%;
    --by: 5.5%;
  }
}
.reason__list .reason-card:nth-child(2) .reason-card__photo img {
  --bs: 1.09745;
  --bx: -4.1%;
  --by: -7.1%;
}
@media (min-width: 769px) {
  .reason__list .reason-card:nth-child(2) .reason-card__photo img {
    --bs: 1.025;
    --bx: 1.1%;
    --by: 0.9%;
  }
}
.reason__list .reason-card:nth-child(3) .reason-card__photo img {
  --bs: 1.1692;
  --bx: 6.5%;
  --by: 2.6%;
}
@media (min-width: 769px) {
  .reason__list .reason-card:nth-child(3) .reason-card__photo img {
    --bs: 1.1;
    --bx: 2.8%;
    --by: -0.4%;
  }
}
.reason__list .reason-card:nth-child(4) .reason-card__photo img {
  --bs: 1.07595;
  --bx: 3.5%;
  --by: 2.8%;
  -o-object-position: top;
     object-position: top;
}
@media (min-width: 769px) {
  .reason__list .reason-card:nth-child(4) .reason-card__photo img {
    --bs: 1;
    --bx: 0.5%;
    --by: 1.6%;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .js-reveal .reason__list .reason-card {
    opacity: 0;
    transform: translateY(32px);
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .js-reveal .reason__list .reason-card:nth-child(2) {
    transition-delay: 0.08s;
  }
  .js-reveal .reason__list .reason-card:nth-child(3) {
    transition-delay: 0.16s;
  }
  .js-reveal .reason__list .reason-card:nth-child(4) {
    transition-delay: 0.24s;
  }
  .js-reveal .reason__list .reason-card.is-inview {
    opacity: 1;
    transform: none;
  }
}
.price {
  background-color: #ffffff;
  padding: 2.5rem 0 3.75rem;
}
@media (min-width: 769px) {
  .price {
    padding: 5rem 0 6.25rem;
  }
}
.price__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .price__inner {
    padding-inline: 3.75rem;
  }
}
.price__heading {
  text-align: center;
  font-size: 1.75rem;
  font-weight: 700;
  margin-bottom: 1.25rem;
}
@media (min-width: 769px) {
  .price__heading {
    font-size: 3rem;
    margin-bottom: 1.0625rem;
  }
}
.price__table-wrap {
  padding: 3rem 0 1rem;
}
@media (max-width: 768px) {
  .price__table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding: 1.5rem 0 1rem;
  }
}

.price-table {
  display: grid;
  grid-template-columns: 280fr 300fr 280fr 280fr;
  grid-template-rows: repeat(6, 5rem);
  width: 100%;
  max-width: 71.25rem;
  margin-inline: auto;
  text-align: center;
  font-family: "Noto Sans JP", sans-serif;
}
@media (max-width: 768px) {
  .price-table {
    grid-template-columns: 10.625rem 12.5rem 12.5rem 12.5rem;
    grid-template-rows: repeat(6, 4.5rem);
    width: 48.125rem;
  }
}
.price-table > * {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 0.9375rem 1.375rem;
}
@media (max-width: 768px) {
  .price-table > * {
    padding: 0.9375rem 0.625rem;
  }
}
.price-table__corner {
  background-color: transparent;
}
.price-table__label {
  background-color: #eaf1f1;
  border: 0.0625rem solid #CCD8D8;
  border-top: 0;
  color: #1f1f1f;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.6;
  white-space: nowrap;
}
@media (max-width: 768px) {
  .price-table__label {
    font-size: 1.125rem;
  }
}
.price-table__label:nth-child(5) {
  border-top: 0.0625rem solid #CCD8D8;
  border-top-left-radius: 1.25rem;
}
.price-table__label:nth-child(21) {
  border-bottom-left-radius: 1.25rem;
}
.price-table__brand {
  background-color: #eaf1f1;
  border: 0.0625rem solid #CCD8D8;
  color: #1f1f1f;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.6;
}
@media (max-width: 768px) {
  .price-table__brand {
    font-size: 1.125rem;
  }
}
.price-table__brand img {
  height: 3.9375rem;
  width: auto;
}
@media (max-width: 768px) {
  .price-table__brand img {
    width: 4.5rem;
    height: 3.25rem;
  }
}
.price-table__brand:nth-child(4) {
  border-left: 0;
}
.price-table__cell {
  background-color: #ffffff;
  border: 0;
  border-right: 0.0625rem solid #CCD8D8;
  border-bottom: 0.0625rem solid #CCD8D8;
  color: #1f1f1f;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.6;
}
@media (max-width: 768px) {
  .price-table__cell {
    font-size: 1.125rem;
  }
}
.price-table__brand--vup, .price-table__cell--vup {
  background-color: rgba(255, 27, 167, 0.0509803922);
  border-left: 0.1875rem solid #ff1ba7;
  border-right: 0.1875rem solid #ff1ba7;
  border-top: 0;
  border-bottom: 0.0625rem solid rgba(255, 27, 167, 0.2392156863);
  color: #ff1ba7;
}
.price-table__brand--vup {
  position: relative;
  height: 5.625rem;
  align-self: end;
  border-top: 0.1875rem solid #ff1ba7;
  border-radius: 1.25rem 1.25rem 0 0;
}
@media (max-width: 768px) {
  .price-table__brand--vup {
    height: 5rem;
    border-radius: 0.625rem 0.625rem 0 0;
  }
}
.price-table__cell--vup:nth-child(22) {
  height: 5.625rem;
  align-self: start;
  border-bottom: 0.1875rem solid #ff1ba7;
  border-radius: 0 0 1.25rem 1.25rem;
}
@media (max-width: 768px) {
  .price-table__cell--vup:nth-child(22) {
    height: 5rem;
    border-radius: 0 0 0.625rem 0.625rem;
  }
}
.price-table__cell:nth-child(6), .price-table__cell:nth-child(7), .price-table__cell:nth-child(8) {
  flex-wrap: wrap;
  align-items: baseline;
  font-size: 2rem;
}
@media (max-width: 768px) {
  .price-table__cell:nth-child(6), .price-table__cell:nth-child(7), .price-table__cell:nth-child(8) {
    font-size: 1.625rem;
    flex-wrap: nowrap;
    white-space: nowrap;
    padding-inline: 0.25rem;
  }
}
.price-table__tax {
  font-size: 1.125rem;
  font-weight: 700;
}
@media (max-width: 768px) {
  .price-table__tax {
    font-size: 0.875rem;
  }
}
.price-table__badge {
  position: absolute;
  top: -2.7625rem;
  left: -10%;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  width: 5.023125rem;
  height: 6.7rem;
  padding-top: 15.1%;
  padding-left: 4.7%;
  background: url("../assets/images/shapes/shape5.svg") no-repeat center/100% 100%;
  color: #ffffff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.6;
  text-align: center;
}
@media (min-width: 769px) {
  .price-table__badge {
    position: absolute;
    top: -2.7625rem;
    left: -10%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    width: 7.5625rem;
    height: 5.26875rem;
    padding-top: 3.1%;
    padding-left: 7%;
    background: url("../assets/images/shapes/shape5.svg") no-repeat center/100% 100%;
    color: #ffffff;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.6;
    text-align: center;
  }
}

.change--sup {
  padding-bottom: 5rem;
}
@media (min-width: 769px) {
  .change--sup {
    padding-bottom: 8.125rem;
  }
}
@media (min-width: 769px) {
  .change--sup .change__cta .btn-line {
    width: 38vw;
  }
}

.faq {
  background-color: #f5f5f5;
  padding: 4.5rem 0 0rem;
}
@media (min-width: 769px) {
  .faq {
    padding: 8.0625rem 0 2.25rem;
  }
}
.faq__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .faq__inner {
    padding-inline: 3.75rem;
  }
}
.faq__inner {
  max-width: 62.5rem;
}
@media (min-width: 769px) {
  .faq__inner {
    padding-inline: 0;
    left: 2.1%;
    position: relative;
  }
}
.faq__heading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.6;
  text-align: center;
  margin-bottom: 2rem;
  position: relative;
}
@media (min-width: 769px) {
  .faq__heading {
    gap: 0.75rem;
    font-size: 3rem;
    margin-bottom: 2rem;
  }
}
.faq__heading-icon {
  width: 5rem;
  height: 4.375rem;
  position: absolute;
  left: 2.39%;
  top: -2.5rem;
}
@media (min-width: 769px) {
  .faq__heading-icon {
    width: 12.34375rem;
    height: 10.55625rem;
    left: 11.4%;
    top: -4.75rem;
  }
}
.faq__heading-icon img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  display: block;
}
.faq__list {
  display: flex;
  flex-direction: column;
  gap: 1.9375rem;
}
@media (min-width: 769px) {
  .faq__list {
    gap: 2rem;
  }
}

.faq-item {
  background-color: #ffffff;
  border-radius: 0.625rem;
  border: solid 1px #D9D9D9;
}
.faq-item__q {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.75rem 1.25rem;
  cursor: pointer;
  transition: padding 0.3s ease;
}
@media (min-width: 769px) {
  .faq-item__q {
    padding: 2rem;
    padding-right: 1.75rem;
  }
}
.faq-item__q::-webkit-details-marker {
  display: none;
}
.faq-item.is-open .faq-item__q {
  padding-bottom: 1.25rem;
  padding-right: 1.25rem;
}
@media (min-width: 769px) {
  .faq-item.is-open .faq-item__q {
    padding-right: 1.75rem;
  }
}
.faq-item__q-body {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.8;
  color: #1f1f1f;
}
@media (min-width: 769px) {
  .faq-item__q-body {
    gap: 1.45rem;
  }
}
.faq-item__q-body::before {
  content: "Q";
  flex-shrink: 0;
  width: 1.75rem;
  height: 1.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #ff1ba7;
  color: #ffffff;
  font-family: "Poppins", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1;
  border-radius: 50%;
}
@media (min-width: 769px) {
  .faq-item__q-body::before {
    width: 3.75rem;
    height: 3.75rem;
    font-size: 1.75rem;
  }
}
.faq-item__toggle {
  position: relative;
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
}
@media (min-width: 769px) {
  .faq-item__toggle {
    width: 2rem;
    height: 2rem;
  }
}
.faq-item__toggle::before, .faq-item__toggle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background-color: #1f1f1f;
  border-radius: 0.0625rem;
}
.faq-item__toggle::before {
  width: 0.729375rem;
  height: 0.125rem;
  transform: translate(-50%, -50%);
}
@media (min-width: 769px) {
  .faq-item__toggle::before {
    width: 1.166875rem;
  }
}
.faq-item__toggle::after {
  width: 0.125rem;
  height: 0.729375rem;
  transform: translate(-50%, -50%);
  transition: transform 0.3s ease, opacity 0.3s ease;
}
@media (min-width: 769px) {
  .faq-item__toggle::after {
    height: 1.166875rem;
  }
}
.faq-item.is-open .faq-item__toggle::after {
  opacity: 0;
  transform: translate(-50%, -50%) scaleY(0);
}
.faq-item__a {
  overflow: hidden;
}
.faq-item__a-inner {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1.25rem 1.25rem 1.75rem;
  border-top: 0.0625rem solid #d9d9d9;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.8;
  color: #1f1f1f;
}
@media (min-width: 769px) {
  .faq-item__a-inner {
    gap: 1.45rem;
    padding: 1.25rem 2rem 2rem;
  }
}
.faq-item__a-inner::before {
  content: "A";
  flex-shrink: 0;
  width: 1.75rem;
  height: 1.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #00abed;
  color: #ffffff;
  font-family: "Poppins", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1;
  border-radius: 50%;
}
@media (min-width: 769px) {
  .faq-item__a-inner::before {
    width: 3.75rem;
    height: 3.75rem;
    font-size: 1.75rem;
  }
}

@keyframes case-scroll-line {
  0% {
    transform: translateX(-50%) scaleY(0);
    transform-origin: center top;
  }
  35%, 45% {
    transform: translateX(-50%) scaleY(1);
    transform-origin: center top;
  }
  45.01% {
    transform: translateX(-50%) scaleY(1);
    transform-origin: center bottom;
  }
  80%, 100% {
    transform: translateX(-50%) scaleY(0);
    transform-origin: center bottom;
  }
}
@keyframes case-scroll-dot {
  0%, 35% {
    transform: translateX(-50%) scale(0);
  }
  42% {
    transform: translateX(-50%) scale(1.35);
  }
  48%, 80% {
    transform: translateX(-50%) scale(1);
  }
  86%, 100% {
    transform: translateX(-50%) scale(0);
  }
}
.page-case {
  background-color: #f5f5f5;
}

.page-case .case-hero {
  overflow-x: clip;
  overflow-y: visible;
  clip-path: inset(-100rem 0 -100rem 0);
}

.case-hero {
  position: relative;
  overflow: hidden;
  background-color: #f5f5f5;
  padding: 4.25rem 0 0;
  text-align: center;
}
.case-hero__deco {
  position: absolute;
  top: 16%;
  left: -15%;
  transform: rotate(-10deg);
  width: 147.3%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
@media (min-width: 769px) {
  .case-hero__deco {
    transform: rotate(0deg);
    position: absolute;
    top: -12%;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
  }
}
.case-hero__deco-shape {
  display: block;
  position: relative;
  width: 108.60139%;
  aspect-ratio: 1563.86/955.844;
  transform: translate(-3.90756%, -24.41106%);
  --a: 0deg;
  will-change: --a;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-image: conic-gradient(from var(--from) at var(--ox) var(--oy), #000000 calc(var(--a) - var(--soft)), transparent var(--a));
  mask-image: conic-gradient(from var(--from) at var(--ox) var(--oy), #000000 calc(var(--a) - var(--soft)), transparent var(--a));
}
@media (scripting: none) {
  .case-hero__deco-shape {
    --a: 382deg;
  }
}
.case-hero__deco-comet {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  --c-rot: 0deg;
  --c-tx: 0%;
  --c-ty: 0%;
  opacity: 0.35;
  transform: translate(var(--c-tx), var(--c-ty)) rotate(var(--c-rot));
  transform-origin: center;
}
.case-hero__deco-photoclip {
  position: absolute;
  left: 3.90756%;
  top: 24.41106%;
  width: 92.07984%;
  height: 75.64493%;
  clip-path: url(#cometClip);
}
.case-hero__deco-photos {
  position: absolute;
  top: 1%;
  left: 0%;
  width: 95.1%;
  max-width: none;
  height: auto;
  --p-rot: 0.1deg;
  --p-tx: 0%;
  --p-ty: -0.4%;
  transform: translate(var(--p-tx), var(--p-ty)) rotate(var(--p-rot));
  transform-origin: center;
}
@media (min-width: 769px) {
  .case-hero__deco-photos {
    top: 1%;
    left: 0%;
    width: 95.1%;
  }
}
@media (min-width: 769px) {
  .case-hero {
    display: flex;
    align-items: center;
    padding: 9.25rem 0 16.4375rem;
  }
}
.case-hero::before {
  content: attr(data-en);
  position: absolute;
  top: 1.9rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  font-family: "Poppins", sans-serif;
  font-size: 3.5rem;
  font-weight: 700;
  line-height: 1;
  color: rgba(255, 27, 167, 0.08);
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
@media (min-width: 769px) {
  .case-hero::before {
    font-size: 11.25rem;
    top: 3.5rem;
  }
}
.case-hero__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .case-hero__inner {
    padding-inline: 3.75rem;
  }
}
.case-hero__inner {
  position: relative;
  z-index: 1;
}
.case-hero__title {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 8.125rem;
  aspect-ratio: 206/97;
  padding-bottom: 1rem;
  background: url("../assets/images/shapes/shape4.svg") no-repeat center/contain;
  color: #ffffff;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.4;
}
@media (min-width: 769px) {
  .case-hero__title {
    width: 15.875rem;
    font-size: 3rem;
  }
}
.case-hero__breadcrumb {
  margin-top: 0.77rem;
  font-size: 0.75rem;
  line-height: 1;
}
@media (min-width: 769px) {
  .case-hero__breadcrumb {
    margin-top: 1.375rem;
  }
}
.case-hero__breadcrumb a {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #1f1f1f;
  font-family: "Poppins", sans-serif;
}
.case-hero__sub {
  margin-top: 1.25rem;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.6;
}
@media (min-width: 769px) {
  .case-hero__sub {
    font-size: 2.25rem;
    margin-top: 8.39px;
  }
}
.case-hero__accent {
  color: #ff1ba7;
}
.case-hero__scroll {
  display: none;
  position: relative;
  width: 2.75rem;
  height: 5.625rem;
  font-family: "Poppins", sans-serif;
  font-size: 0.6875rem;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.06em;
  color: #ff1ba7;
  text-align: center;
  white-space: nowrap;
}
@media (min-width: 769px) {
  .case-hero__scroll {
    display: block;
    margin: 24px auto 0;
  }
}
.case-hero__scroll::before {
  content: "";
  position: absolute;
  top: 1.25rem;
  left: 50%;
  width: 1px;
  height: 70px;
  background: #ff1ba7;
  transform: translateX(-50%) scaleY(0);
  transform-origin: center top;
  animation: case-scroll-line 2.4s ease-in-out infinite;
}
.case-hero__scroll::after {
  content: "";
  position: absolute;
  top: 82px;
  left: 50%;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: #ff1ba7;
  transform: translateX(-50%) scale(0);
  animation: case-scroll-dot 2.4s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  .case-hero__scroll::before {
    animation: none;
    transform: translateX(-50%) scaleY(1);
  }
  .case-hero__scroll::after {
    animation: none;
    transform: translateX(-50%) scale(1);
  }
}

.case-list {
  background-color: #f5f5f5;
  padding: 8.5rem 0 5rem;
}
@media (min-width: 769px) {
  .case-list {
    padding: 0 0 10rem;
  }
}
.case-list__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .case-list__inner {
    padding-inline: 3.75rem;
  }
}
.case-list__inner {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
@media (min-width: 769px) {
  .case-list__inner {
    gap: 3.75rem;
  }
}

.case-card {
  --border-c: #00abed;
  position: relative;
  background-color: #ffffff;
  border: 0.25rem solid var(--border-c);
  border-radius: 1.25rem;
  padding: 2.25rem 0.75rem;
  display: flex;
  flex-direction: column;
}
@media (min-width: 769px) {
  .case-card {
    flex-direction: row;
    align-items: center;
    gap: 5rem;
    padding: 3.75rem 5.625rem;
    border: none;
    box-shadow: inset 0 0 0 0.25rem var(--border-c);
  }
}
.case-card--cyan {
  --border-c: #00abed;
}
.case-card--orange {
  --border-c: #FCA83F;
}
.case-card--pink {
  --border-c: #ff999d;
}
.case-card--green {
  --border-c: #C9F0A3;
}
.case-card--yellow {
  --border-c: #FFD320;
}
.case-card__media {
  display: contents;
}
@media (min-width: 769px) {
  .case-card__media {
    display: block;
    width: 25.4901960784%;
  }
}
.case-card__photo {
  aspect-ratio: 260/240;
  border-radius: 0.625rem;
  overflow: hidden;
  width: 85.7%;
  margin: 0 auto;
}
@media (min-width: 769px) {
  .case-card__photo {
    aspect-ratio: 260/347;
    width: 100%;
    margin: 0;
  }
}
.case-card__photo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
  transform: scale(var(--bs, 1)) translate(var(--bx, 0%), var(--by, 0%));
}
.case-card:nth-child(1) .case-card__photo img {
  -o-object-position: 35% 100%;
     object-position: 35% 100%;
}
.case-card:nth-child(2) .case-card__photo img {
  -o-object-position: 65.7% 101%;
     object-position: 65.7% 101%;
  --bs: 1.175;
}
@media (min-width: 769px) {
  .case-card:nth-child(4) .case-card__photo img {
    -o-object-position: 42% 100%;
       object-position: 42% 100%;
  }
  .case-card:nth-child(5) .case-card__photo img {
    -o-object-position: 50% 100%;
       object-position: 50% 100%;
  }
}
.case-card__name {
  margin-top: 0.75rem;
  padding-left: 28%;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.3;
  position: relative;
}
@media (min-width: 769px) {
  .case-card__name {
    padding-left: 24%;
    font-size: 1.125rem;
  }
}
.case-card__name::before {
  content: "";
  position: absolute;
  left: 23.2%;
  top: 50%;
  transform: translateY(-50%);
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 50%;
  background-color: #00abed;
}
@media (min-width: 769px) {
  .case-card__name::before {
    left: 19%;
    width: 0.625rem;
    height: 0.625rem;
  }
}
.case-card__link {
  width: 74.8%;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 2.25rem;
  padding-bottom: 0.625rem;
  padding-right: 0.75rem;
  border-bottom: 0.0625rem solid #000000;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.6;
  color: #1f1f1f;
}
.case-card__link::after {
  content: "";
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9.33 12' fill='none'%3E%3Cpath d='M4.665 0.8V11.2M1.2 7.3 4.665 11.2 8.13 7.3' stroke='%231F1F1F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center/0.583125rem 0.75rem;
}
@media (min-width: 769px) {
  .case-card__link {
    width: 33%;
    margin-inline: 0;
    display: inline-flex;
    justify-content: space-between;
    gap: 0.375rem;
    margin-top: 3rem;
    padding-bottom: 0.625rem;
    padding-right: 1.5%;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.6;
    border-bottom: solid 1px #000000;
  }
  .case-card__link::after {
    content: "↓";
    width: auto;
    height: auto;
    background: none;
    font-size: 1rem;
  }
}
.case-card {
  /* 卒業生の作品ドロワー：「卒業生の作品を見る」(.js-case-video)で開閉。
     動画はクリックの瞬間にJSが同期生成＝1タップで即・音声つき自動再生（YouTube・制御は js/main.js）。
     動画はYouTubeホスト（先輩事例は4〜17分の長編が多く、自社ホストMP4は容量が重いため）。
     横/縦の見せ方は data-orientation で切替（landscape=既定 / portrait=下の &[data-orientation] 分岐）。
     ※現状HTMLは全部 landscape 指定だが、1・2・5番は実際は縦動画→portrait にすると縦比で収まる。 */
}
.case-card__video {
  overflow: hidden;
}
.case-card__video-frame {
  margin-top: 2.5rem;
  width: 100%;
  aspect-ratio: 500/333;
  border-radius: 1.25rem;
  overflow: hidden;
  background-color: #d9d9d9;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
  color: #1f1f1f;
}
@media (min-width: 769px) {
  .case-card__video-frame {
    width: 73.5294117647%;
    font-size: 2.5rem;
  }
}
.case-card__video-frame[data-orientation=portrait] {
  aspect-ratio: 9/16;
  width: 70%;
}
@media (min-width: 769px) {
  .case-card__video-frame[data-orientation=portrait] {
    width: 44.1176470588%;
  }
}
.case-card__video-frame iframe,
.case-card__video-frame video {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
}
.case-card__video-play {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  cursor: pointer;
  background-color: #1f1f1f;
  overflow: hidden;
}
.case-card__video-play img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.case-card__video-play-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.92);
  transition: transform 0.2s ease, background-color 0.2s ease;
}
@media (min-width: 769px) {
  .case-card__video-play-icon {
    width: 5.25rem;
    height: 5.25rem;
  }
}
.case-card__video-play-icon::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 54%;
  transform: translate(-50%, -50%);
  border-style: solid;
  border-width: 0.6875rem 0 0.6875rem 1.125rem;
  border-color: transparent transparent transparent #ff1ba7;
}
@media (hover: hover) {
  .case-card__video-play:hover .case-card__video-play-icon {
    transform: translate(-50%, -50%) scale(1.08);
    background-color: #ffffff;
  }
}
.case-card__body {
  margin-top: 1.5rem;
}
@media (min-width: 769px) {
  .case-card__body {
    margin-top: 0;
    width: 66.6666666667%;
  }
}
.case-card__highlight {
  list-style: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.25rem;
  margin-left: 1.5px;
}
@media (min-width: 769px) {
  .case-card__highlight {
    gap: 0.1875rem;
    font-size: 1.5rem;
  }
}
.case-card__highlight li {
  background-color: #00abed;
  color: #ffffff;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
  padding: 0.125rem 0.25rem;
}
@media (min-width: 769px) {
  .case-card__highlight li {
    font-size: 1.5rem;
  }
}
.case-card__quote {
  margin-top: 1.25rem;
  font-size: 1rem;
  line-height: 1.8;
  color: #1f1f1f;
  width: 98%;
  margin-left: 1px;
}
@media (min-width: 769px) {
  .case-card__quote {
    margin-top: 1.25rem;
    font-size: 1rem;
    width: auto;
    margin-left: 0;
  }
}
.case-card__result {
  margin: 0 auto;
  margin-top: 1.3125rem;
  width: 99%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0;
  background-color: #eaf1f1;
  border-radius: 1.25rem;
  padding: 1.25rem 1.9375rem;
}
@media (min-width: 769px) {
  .case-card__result {
    flex-direction: row;
    align-items: center;
    text-align: left;
    gap: 2.5rem;
    margin: 0 auto;
    margin-top: 1.25rem;
    margin-inline: 0;
    width: 100%;
    height: 98px;
    background-color: #eaf1f1;
    border-radius: 0.5rem;
    padding: 1.9375rem 0;
  }
}
.case-card__before {
  font-size: 0.875rem;
  line-height: 1.6;
  color: #1f1f1f;
}
@media (min-width: 769px) {
  .case-card__before {
    font-size: 1rem;
    line-height: 1.5;
  }
}
.case-card__arrow {
  flex-shrink: 0;
  width: 2.25rem;
  height: 2.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.case-card__arrow::before {
  content: "";
  width: 0;
  height: 0;
  border-left: 0.8625rem solid transparent;
  border-right: 0.8625rem solid transparent;
  border-top: 1.14375rem solid #00abed;
}
@media (min-width: 769px) {
  .case-card__arrow::before {
    border-style: solid;
    border-width: 0.84375rem 0 0.84375rem 1.14375rem;
    border-color: transparent transparent transparent #00abed;
  }
}
.case-card__after {
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.6;
  color: #005677;
}
@media (min-width: 769px) {
  .case-card__after {
    font-size: 1.25rem;
    line-height: 1.5;
  }
}
.case-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 0 solid var(--border-c);
  border-radius: 1.25rem;
  pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
  .js .case-card {
    opacity: 0;
    transform: translateY(2.5rem);
    border-color: transparent;
  }
}
@media (prefers-reduced-motion: no-preference) and (min-width: 769px) {
  .js .case-card {
    box-shadow: inset 0 0 0 0.25rem transparent;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .js .case-card::after {
    border-width: 0.25rem;
    clip-path: inset(0 100% 0 0);
  }
  .js .case-card.is-inview {
    opacity: 1;
    transform: none;
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .js .case-card.is-inview::after {
    clip-path: inset(0 0 0 0);
    transition: clip-path 0.85s cubic-bezier(0.22, 1, 0.36, 1) 0.25s;
  }
}

.case-list__inner .case-card:nth-child(1) .case-card__photo img {
  -o-object-position: 30% 100%;
     object-position: 30% 100%;
}
@media (min-width: 769px) {
  .case-list__inner .case-card:nth-child(1) .case-card__photo img {
    -o-object-position: 35% 100%;
       object-position: 35% 100%;
  }
}
.case-list__inner .case-card:nth-child(2) .case-card__photo img {
  -o-object-position: 72% 100%;
     object-position: 72% 100%;
  --bs: 1.2;
}
@media (min-width: 769px) {
  .case-list__inner .case-card:nth-child(2) .case-card__photo img {
    --bs: 1.15;
    --bx: 6%;
    --by: 0%;
  }
}
.case-list__inner .case-card:nth-child(3) .case-card__photo img {
  -o-object-position: 51% 100%;
     object-position: 51% 100%;
}
.case-list__inner .case-card:nth-child(4) .case-card__photo img {
  -o-object-position: 42% 100%;
     object-position: 42% 100%;
}
.case-list__inner .case-card:nth-child(5) .case-card__photo img {
  -o-object-position: 51% 100%;
     object-position: 51% 100%;
}
@media (max-width: 768px) {
  .case-list__inner .case-card:nth-child(6) .case-card__result {
    padding: 1.25rem;
  }
}

.cur-main {
  position: relative;
  overflow: clip;
}

.cur-bg {
  position: absolute;
  z-index: 0;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  top: 59.1rem;
  left: 7.2%;
  width: 969px;
  transform: rotate(14.65deg);
  transform-origin: top left;
  transform-origin: top left;
}
@media (min-width: 769px) {
  .cur-bg {
    top: 41.8rem;
    left: 0;
    width: 100%;
    transform: none;
  }
}
.cur-bg__shape {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  --a: 0deg;
  will-change: --a;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  display: block;
}
.cur-bg__shape.is-reveal {
  -webkit-mask-image: conic-gradient(from var(--from) at var(--ox) var(--oy), #000000 calc(var(--a) - var(--soft)), transparent var(--a));
  mask-image: conic-gradient(from var(--from) at var(--ox) var(--oy), #000000 calc(var(--a) - var(--soft)), transparent var(--a));
}
.cur-bg__shape.is-erase {
  -webkit-mask-image: conic-gradient(from var(--from) at var(--ox) var(--oy), transparent var(--a), #000000 calc(var(--a) + var(--soft)));
  mask-image: conic-gradient(from var(--from) at var(--ox) var(--oy), transparent var(--a), #000000 calc(var(--a) + var(--soft)));
}
.cur-bg__shape img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1985/1220;
}

.page-head--cur,
.cur-intro,
.cur-voice {
  position: relative;
  z-index: 1;
  background-color: transparent;
}

.page-head--cur {
  overflow: visible;
}
.page-head--cur::before {
  color: rgba(255, 27, 167, 0.08);
}
@media (min-width: 769px) {
  .page-head--cur::before {
    top: 3.7rem;
    left: 7.5rem;
    font-size: 11.25rem;
    text-transform: capitalize;
  }
}
@media (min-width: 769px) {
  .page-head--cur .page-head__title {
    font-size: 3rem;
    padding-top: 5.5rem;
    line-height: 1;
  }
}
@media (min-width: 769px) {
  .page-head--cur .page-head__breadcrumb {
    margin-top: 2.375rem;
  }
}
.page-head--cur .page-head__illust {
  position: absolute;
  width: 5.0625rem;
  aspect-ratio: 278.6/297.3;
  min-height: 0;
  top: 2.4625rem;
  right: 1.0625rem;
}
@media (min-width: 769px) {
  .page-head--cur .page-head__illust {
    width: 17.4125rem;
    top: 3.54375rem;
    right: 0.4375rem;
  }
}
.page-head--cur .page-head__illust .ph-illust-rise {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
  .page-head--cur .page-head__illust .ph-illust-rise {
    animation: cur-illust-float 4.5s ease-in-out infinite;
  }
}
.page-head--cur .page-head__illust .ph-illust {
  position: absolute;
  background: no-repeat center/contain;
  pointer-events: none;
}
.page-head--cur .page-head__illust .ph-illust--laptop {
  left: 0;
  top: 44.5%;
  width: 55.4%;
  aspect-ratio: 512/545;
  z-index: 1;
  background-image: url("../assets/images/curriculum/cur-laptop.webp");
}
.page-head--cur .page-head__illust .ph-illust--person {
  left: 23.7%;
  top: 0;
  width: 67.2%;
  aspect-ratio: 512/513;
  z-index: 2;
  background-image: url("../assets/images/curriculum/cur-person.webp");
  transform-origin: 0% 100%;
}
.page-head--cur .page-head__illust .ph-illust--spark {
  left: 89.6%;
  top: 2.7%;
  width: 10.4%;
  aspect-ratio: 512/468;
  z-index: 3;
  background-image: url("../assets/images/curriculum/cur-spark.webp");
  transform-origin: center;
}
@media (prefers-reduced-motion: no-preference) {
  .page-head--cur .page-head__illust.anim-js .ph-illust--person {
    opacity: 0;
    transform: scale(0.2);
  }
  .page-head--cur .page-head__illust.anim-js .ph-illust--spark {
    opacity: 0;
    transform: scale(0.3);
  }
  .page-head--cur .page-head__illust.is-anim .ph-illust--person {
    animation: cur-person-loop 6s ease-in-out infinite both;
  }
  .page-head--cur .page-head__illust.is-anim .ph-illust--spark {
    animation: cur-spark-loop 6s ease-in-out infinite both;
  }
}

@keyframes cur-illust-float {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-3.5%);
  }
}
@keyframes cur-person-loop {
  0% {
    opacity: 0;
    transform: scale(0.2);
  }
  12% {
    opacity: 1;
    transform: scale(1);
  }
  72% {
    opacity: 1;
    transform: scale(1);
  }
  82% {
    opacity: 0;
    transform: scale(0.2);
  }
  100% {
    opacity: 0;
    transform: scale(0.2);
  }
}
@keyframes cur-spark-loop {
  0% {
    opacity: 0;
    transform: scale(0.3) rotate(-6deg);
  }
  13% {
    opacity: 0;
    transform: scale(0.3) rotate(-6deg);
  }
  16% {
    opacity: 0.85;
    transform: scale(0.8) rotate(-2deg);
  }
  19% {
    opacity: 1;
    transform: scale(1.32) rotate(5deg);
  }
  22% {
    transform: scale(0.93) rotate(-3deg);
  }
  25% {
    opacity: 1;
    transform: scale(1) rotate(0deg);
  }
  38% {
    transform: scale(1.06) rotate(3deg);
  }
  48% {
    transform: scale(0.97) rotate(-3deg);
  }
  56% {
    opacity: 1;
    transform: scale(1) rotate(0deg);
  }
  62% {
    opacity: 0;
    transform: scale(0.3) rotate(-6deg);
  }
  100% {
    opacity: 0;
    transform: scale(0.3) rotate(-6deg);
  }
}
.cur-intro {
  padding: 2rem 0 3.75rem;
}
@media (min-width: 769px) {
  .cur-intro {
    padding: 3.75rem 0 0;
  }
}
.cur-intro__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .cur-intro__inner {
    padding-inline: 3.75rem;
  }
}
.cur-intro__inner {
  padding-left: 0.6875rem;
  padding-right: 1.375rem;
}
@media (min-width: 769px) {
  .cur-intro__inner {
    padding-inline: 3.75rem;
  }
}
.cur-intro__lead {
  text-align: left;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.6;
  padding-left: 3%;
}
@media (min-width: 769px) {
  .cur-intro__lead {
    font-size: 2.25rem;
    margin-bottom: 2rem;
    text-align: center;
    padding-left: 0;
  }
}
.cur-intro__lead-from {
  color: #ff1ba7;
}
.cur-intro__compare {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  margin-top: 2.5rem;
}
@media (min-width: 769px) {
  .cur-intro__compare {
    flex-direction: row;
    justify-content: space-between;
    gap: 2rem;
    margin: 0 auto;
    width: 68.264vw;
    max-width: 61.4375rem;
  }
}
.cur-intro__item {
  position: relative;
  width: 100%;
  max-width: 22.5rem;
}
@media (min-width: 769px) {
  .cur-intro__item {
    max-width: none;
    width: 39.3692777213%;
  }
}
.cur-intro__item--before .cur-intro__photo img {
  --bx: 0.5%;
  --by: 0%;
  --bs: 1.05;
}
@media (min-width: 769px) {
  .cur-intro__item--before .cur-intro__photo img {
    --bx: 0;
    --bs: 0;
  }
}
.cur-intro__item--after .cur-intro__photo img {
  --bx: -2.1%;
  --by: -3%;
  --bs: 1.43247;
}
@media (min-width: 769px) {
  .cur-intro__item--after .cur-intro__photo img {
    --bs: 1.3661;
  }
}
.cur-intro__item--after {
  margin-top: 0.75rem;
}
@media (min-width: 769px) {
  .cur-intro__item--after {
    margin-top: 0;
  }
}
.cur-intro__badge {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 4.5rem;
  height: 4.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #ffffff;
  font-size: 0.875rem;
  font-weight: 700;
}
@media (min-width: 769px) {
  .cur-intro__badge {
    width: 5.625rem;
    height: 5.625rem;
    font-size: 1rem;
  }
}
.cur-intro__badge--before {
  background-color: #0d508b;
}
.cur-intro__badge--after {
  background-color: #ff1ba7;
}
.cur-intro__photo {
  position: relative;
  border-radius: 0.625rem;
  overflow: hidden;
  aspect-ratio: 330/248;
  width: calc(100% - 0.75rem);
  margin-left: auto;
  margin-top: 1.25rem;
}
@media (min-width: 769px) {
  .cur-intro__photo {
    width: 89.5483870968%;
    margin-top: 2.6rem;
    aspect-ratio: 347/260;
  }
}
.cur-intro__photo img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  display: block;
  transform-origin: top left;
  transform: translate(var(--bx, 0%), var(--by, 0%)) scale(var(--bs, 1));
}
.cur-intro__caption {
  position: relative;
  z-index: 1;
  margin-top: -2.725rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.25rem;
}
@media (min-width: 769px) {
  .cur-intro__caption {
    margin-top: -3.225rem;
    padding-left: 1.3125rem;
  }
}
.cur-intro__caption-line {
  background-color: #ffffff;
  color: #1f1f1f;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.6;
  padding: 0.25rem 0.625rem;
  border-radius: 0.125rem;
}
.cur-intro__arrow {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.44375rem;
  margin-top: 1.8125rem;
  margin-left: 3%;
}
@media (min-width: 769px) {
  .cur-intro__arrow {
    position: absolute;
    flex-direction: row;
    justify-content: center;
    margin-top: 0;
    margin-left: 0;
    left: 41.8%;
    width: 18.3112919634%;
    gap: 0.625rem;
  }
}
.cur-intro__arrow span {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 1.14375rem 0.8628125rem 0 0.8628125rem;
  border-color: transparent;
  border-top-color: #0d508b;
}
.cur-intro__arrow span:nth-child(2) {
  border-top-color: #618484;
}
.cur-intro__arrow span:nth-child(3) {
  border-top-color: #00abed;
}
@media (min-width: 769px) {
  .cur-intro__arrow span {
    border-width: 1.8696875rem 0 1.8696875rem 2.478125rem;
    border-color: transparent;
    border-left-color: #0d508b;
  }
  .cur-intro__arrow span:nth-child(2) {
    border-top-color: transparent;
    border-left-color: #618484;
  }
  .cur-intro__arrow span:nth-child(3) {
    border-top-color: transparent;
    border-left-color: #00abed;
  }
}
.cur-intro__copy {
  margin-top: 2.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.6;
}
@media (min-width: 769px) {
  .cur-intro__copy {
    margin-top: 5rem;
    font-size: 2.25rem;
  }
}
.cur-intro__copy-line {
  position: relative;
  color: #1f1f1f;
  padding-bottom: 0.25rem;
}
.cur-intro__copy-line::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0.5rem;
  width: 100%;
  height: 0.75rem;
  background-color: rgba(255, 27, 167, 0.3);
  transform-origin: left center;
}
@media (min-width: 769px) {
  .cur-intro__copy-line::after {
    height: 0.625rem;
  }
}
.cur-intro__copy-line + .cur-intro__copy-line {
  margin-top: -0.25rem;
}

.cur-voice {
  position: relative;
  overflow: clip;
  background-color: transparent;
  padding: 1rem 0 3.75rem;
}
@media (min-width: 769px) {
  .cur-voice {
    padding: 7.5rem 0 5.5rem;
  }
}
.cur-voice__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .cur-voice__inner {
    padding-inline: 3.75rem;
  }
}
.cur-voice__inner {
  position: relative;
  padding-left: 1.4375rem;
  padding-right: 1.0625rem;
}
@media (min-width: 769px) {
  .cur-voice__inner {
    padding-inline: 3.75rem;
    display: flex;
    align-items: flex-start;
    gap: 5.25rem;
  }
}
.cur-voice__head {
  margin-bottom: 2.5rem;
}
@media (min-width: 769px) {
  .cur-voice__head {
    flex: 1 1 24.25rem;
    margin-bottom: 0;
    position: sticky;
    top: 7.5rem;
    align-self: flex-start;
  }
}
.cur-voice__heading {
  display: inline-block;
  background-color: #ffffff;
  color: #0d508b;
  font-size: 1.75rem;
  line-height: 1.6;
  font-weight: 700;
  padding: 0.625rem 1.25rem;
  border-radius: 1.25rem;
}
@media (min-width: 769px) {
  .cur-voice__heading {
    font-size: 2.25rem;
  }
}
.cur-voice__sub {
  margin-top: 1.25rem;
  font-size: 1rem;
  line-height: 1.8;
  color: #1f1f1f;
}
@media (min-width: 769px) {
  .cur-voice__sub {
    margin-top: 2.5rem;
  }
}
.cur-voice__list {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
@media (min-width: 769px) {
  .cur-voice__list {
    flex: 1 1 45.5rem;
    gap: 3.75rem;
  }
}

.cur-voice-card {
  --border-c: #00abed;
}
.cur-voice-card--orange {
  --border-c: #fca83f;
}
.cur-voice-card--pink {
  --border-c: #ff999d;
}
.cur-voice-card {
  background-color: #ffffff;
  border: none;
  box-shadow: inset 0 0 0 0.25rem var(--border-c);
  border-radius: 1.25rem;
  padding: 2.5rem 1rem;
  display: flex;
  flex-direction: column;
}
@media (min-width: 769px) {
  .cur-voice-card {
    flex-direction: row;
    gap: 6.192%;
    padding: 3.75rem 2.5625rem;
  }
}
.cur-voice-card__media {
  display: block;
}
@media (min-width: 769px) {
  .cur-voice-card__media {
    width: 37.153%;
  }
}
.cur-voice-card__photo {
  aspect-ratio: 260/240;
  border-radius: 0.625rem;
  overflow: hidden;
  width: 100%;
  max-width: 16.25rem;
  margin: 0 auto;
}
@media (min-width: 769px) {
  .cur-voice-card__photo {
    aspect-ratio: 260/347;
    margin: 0;
  }
}
.cur-voice-card__photo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.cur-voice-card__name {
  margin-top: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.40625rem;
  padding-left: 0;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.3;
  position: relative;
}
.cur-voice-card__name::before {
  content: "";
  position: static;
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 50%;
  background-color: #00abed;
}
@media (min-width: 769px) {
  .cur-voice-card__name {
    display: block;
    padding-left: 24%;
  }
  .cur-voice-card__name::before {
    position: absolute;
    left: 19%;
    top: 50%;
    transform: translateY(-50%);
  }
}
.cur-voice-card__body {
  margin-top: 1.5rem;
}
@media (min-width: 769px) {
  .cur-voice-card__body {
    margin-top: 0;
    width: 56.657%;
    container-type: inline-size;
  }
}
.cur-voice-card__highlight {
  list-style: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.25rem;
  margin-left: 1.5px;
}
@media (min-width: 769px) {
  .cur-voice-card__highlight {
    gap: 0.1875rem;
    font-size: 1.5rem;
  }
}
.cur-voice-card__highlight li {
  background-color: #00abed;
  color: #ffffff;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
  padding: 0.125rem 0.25rem;
}
@media (min-width: 769px) {
  .cur-voice-card__highlight li {
    font-size: 6.557cqi;
    text-wrap: nowrap;
  }
}
.cur-voice-card__quote {
  margin-top: 1.25rem;
  font-size: 1rem;
  line-height: 1.8;
  color: #1f1f1f;
  width: 98%;
  margin-left: 1px;
}
@media (min-width: 769px) {
  .cur-voice-card__quote {
    width: auto;
    margin-left: 0;
  }
}
.cur-voice-card__result {
  margin-top: 1.3125rem;
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0;
  background-color: #eaf1f1;
  border-radius: 1.25rem;
  padding: 1.25rem 1.9375rem;
  width: 100%;
}
@media (min-width: 769px) {
  .cur-voice-card__result {
    padding: 1.25rem 2.5rem;
  }
}
.cur-voice-card__before {
  font-size: 0.875rem;
  line-height: 1.6;
  color: #1f1f1f;
}
@media (min-width: 769px) {
  .cur-voice-card__before {
    font-size: 1rem;
    line-height: 1.5;
  }
}
.cur-voice-card__arrow {
  flex-shrink: 0;
  width: 2.25rem;
  height: 2.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cur-voice-card__arrow::before {
  content: "";
  width: 0;
  height: 0;
  border-left: 0.8625rem solid transparent;
  border-right: 0.8625rem solid transparent;
  border-top: 1.14375rem solid #00abed;
  position: relative;
  top: 0.1125rem;
}
@media (min-width: 769px) {
  .cur-voice-card__arrow::before {
    border-style: solid;
    border-width: 0.84375rem 0 0.84375rem 1.14375rem;
    border-color: transparent transparent transparent #00abed;
    transform: rotate(90deg);
  }
}
.cur-voice-card__after {
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.6;
  color: #005677;
}
@media (min-width: 769px) {
  .cur-voice-card__after {
    font-size: 1.25rem;
    line-height: 1.5;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .cur-list__inner.is-reveal-init {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
  }
  .cur-list__inner.is-reveal-init.is-inview {
    opacity: 1;
    transform: none;
  }
}
.cur-list {
  background: repeating-linear-gradient(-45deg, rgba(255, 27, 167, 0.55), rgba(255, 27, 167, 0.55) 2.430625rem, rgba(255, 27, 167, 0.4) 2.430625rem, rgba(255, 27, 167, 0.4) 4.86125rem);
  background-size: 6.875rem 6.875rem;
  background-position: -46px 0;
  padding: 2.5rem 0 2.5rem 1.25rem;
}
@media (min-width: 769px) {
  .cur-list {
    padding: 3.75rem 2.5rem;
    background-position: -44px 0;
  }
}
.cur-list__inner {
  position: relative;
  max-width: 69.375rem;
  margin-inline: auto;
  background-color: #ffffff;
  border-radius: 1.25rem 0 0 1.25rem;
  padding: 2.25rem 0 2.5rem 1.25rem;
}
@media (min-width: 769px) {
  .cur-list__inner {
    max-width: 85rem;
    padding: 4rem 2.5rem 4rem;
    border-radius: 1.25rem;
  }
}
.cur-list__hint {
  margin-bottom: 0.5rem;
  font-size: 0.75rem;
  color: #666666;
  text-align: right;
}
.cur-list__head {
  margin-bottom: 2.05rem;
  text-align: center;
}
@media (min-width: 769px) {
  .cur-list__head {
    margin: 1.2rem auto 0;
  }
}
.cur-list__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 13.71625rem;
  height: 3.375rem;
  padding-bottom: 0.58125rem;
  background: url("../assets/images/shapes/shape6.svg") no-repeat center/contain;
  color: #ffffff;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  margin-left: -11.5%;
}
@media (min-width: 769px) {
  .cur-list__badge {
    width: 20.25rem;
    height: 4.9825rem;
    padding-bottom: 0.858125rem;
    font-size: 2.25rem;
    margin: auto;
  }
}
.cur-list__sub {
  margin-top: 0.26875rem;
  font-size: 1rem;
  line-height: 1.6;
  width: clamp(200px, 80vw, 300px);
  text-align: left;
}
@media (min-width: 769px) {
  .cur-list__sub {
    font-size: 1rem;
    margin-top: -0.1875rem;
    text-align: center;
    width: auto;
  }
}
.cur-list__table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
@media (min-width: 769px) {
  .cur-list__table-wrap {
    display: flex;
    justify-content: center;
    margin-top: 30px;
    margin-left: 2.3%;
    position: relative;
    z-index: 1;
  }
}
.cur-list__deco {
  display: none;
}
@media (min-width: 769px) {
  .cur-list__deco {
    display: block;
    position: absolute;
    z-index: 1;
    height: auto;
    pointer-events: none;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
  }
}
@media (min-width: 769px) {
  .cur-list__deco--stand {
    width: 47px;
    top: 3.88125rem;
    left: 21.64375rem;
    z-index: 0;
  }
}
@media (min-width: 769px) {
  .cur-list__deco--sit {
    width: 4.9375rem;
    right: 2.96875rem;
    bottom: 3.96875rem;
    z-index: 2;
  }
}

.cur-table {
  width: 64.375rem;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  text-align: left;
  color: #1f1f1f;
}
.cur-table th,
.cur-table td {
  border-top: 0.0625rem solid #CCD8D8;
  border-left: 0.0625rem solid #CCD8D8;
}
.cur-table th:last-child,
.cur-table td:last-child {
  border-right: 0.0625rem solid #CCD8D8;
}
.cur-table tr:last-child td {
  border-bottom: 0.0625rem solid #CCD8D8;
}
.cur-table thead th:first-child {
  border-top-left-radius: 1.25rem;
}
.cur-table thead th:last-child {
  border-top-right-radius: 1.25rem;
}
.cur-table__th {
  background-color: #f5f5f5;
  font-size: 1rem;
  line-height: 1.6;
  font-weight: 700;
  color: #1f1f1f;
  text-align: center;
  height: 4.125rem;
}
.cur-table__th--step {
  width: 6.25rem;
}
.cur-table__th--name {
  width: 14.375rem;
}
.cur-table__step {
  width: 6.25rem;
  padding: 0 1rem;
  vertical-align: middle;
  white-space: nowrap;
}
.cur-table__step .cur-table__step-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.1875rem;
  width: 4.25rem;
  height: 3.1875rem;
}
.cur-table__step b {
  color: #ff1ba7;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 2rem;
  line-height: 1.6;
}
.cur-table__step-unit {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.6;
  color: #1f1f1f;
}
.cur-table__name {
  width: 14.375rem;
  padding: 0 1.875rem 0 0.625rem;
  vertical-align: middle;
  font-size: 1rem;
  font-weight: 700;
  white-space: nowrap;
}
.cur-table__icon {
  display: inline-block;
  width: 2.25rem;
  height: 1.625rem;
  margin-right: 0.625rem;
  vertical-align: middle;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.cur-table__icon svg {
  display: block;
  width: 100%;
  height: 100%;
}
.cur-table__desc {
  padding: 0 0.625rem;
  vertical-align: middle;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.6;
  color: #1f1f1f;
}
.cur-table tbody td {
  height: 5.6875rem;
}

.flow {
  background-color: #f5f5f5;
  padding: 4.8125rem 0 5.0625rem;
}
@media (min-width: 769px) {
  .flow {
    padding: 8.125rem 0 8.125rem;
  }
}
.flow__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .flow__inner {
    padding-inline: 3.75rem;
  }
}
.flow__heading {
  text-align: center;
  font-size: 1.75rem;
  font-weight: 700;
  margin-bottom: 1.875rem;
}
@media (min-width: 769px) {
  .flow__heading {
    font-size: 2rem;
    margin-bottom: 2rem;
    line-height: 1.6;
  }
}
.flow__steps {
  width: 81.86vw;
  max-width: 19.1875rem;
  list-style: none;
  display: flex;
  align-items: flex-end;
  flex-direction: column;
  gap: 3.125rem;
  position: relative;
  margin: 0 auto;
}
.flow__steps::before {
  content: "";
  position: absolute;
  display: block;
  left: 3.3%;
  height: 100%;
  width: 1px;
  background-color: #ff1ba7;
}
@media (min-width: 769px) {
  .flow__steps {
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    gap: 5cqw;
    width: min(80rem, 100vw - 5rem);
    max-width: none;
    margin: 0;
    left: 50%;
    transform: translateX(-50%);
    container-type: inline-size;
  }
  .flow__steps::before {
    display: block;
    top: 1.171875cqw;
    left: 0;
    width: 100%;
    height: 1px;
    transform: translateY(-50%);
  }
}
.flow__copy {
  margin-top: 5rem;
  text-align: center;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.6;
}
@media (min-width: 769px) {
  .flow__copy {
    margin-top: 8.125rem;
    font-size: 2rem;
  }
}
.flow__copy-accent {
  color: #ff1ba7;
}
.flow__features {
  list-style: none;
  margin-top: 2rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
}
@media (min-width: 769px) {
  .flow__features {
    grid-template-columns: repeat(3, 1fr);
    gap: 4.375rem;
    max-width: 68.75rem;
    margin-inline: auto;
    margin-top: 2rem;
  }
}
.flow__cta {
  margin: 0 auto;
  margin-top: 2.5rem;
  text-align: center;
}
@media (min-width: 769px) {
  .flow__cta {
    margin-top: 2.5rem;
    width: 27.7%;
  }
}

.flow-step {
  text-align: center;
  position: relative;
  width: 100%;
}
@media (min-width: 769px) {
  .flow-step {
    width: 21.25cqw;
    flex: 0 1 21.25cqw;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}
@media (min-width: 769px) {
  .flow-step:nth-child(-n+3) .flow-step__content::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -2.5cqw;
    transform: translateY(-50%);
    width: 1px;
    height: 90%;
    background-color: #ff1ba7;
  }
}
@media (min-width: 769px) {
  .flow-step:not(:first-child) .flow-step__no {
    margin-left: -8%;
  }
}
.flow-step__no {
  position: absolute;
  left: 0;
  top: 0;
  display: inline-flex;
  justify-content: space-between;
  background-color: #ff1ba7;
  color: #ffffff;
  font-family: "Poppins", sans-serif;
  font-size: 0.875rem;
  font-weight: 700;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  line-height: 1.3;
  align-items: center;
}
.flow-step__no > .step {
  position: relative;
  display: flex;
  align-items: center;
}
.flow-step__no > .step::after {
  content: "";
  position: absolute;
  right: -0.25rem;
  top: 0;
  width: 1px;
  height: 100%;
  background-color: currentColor;
}
.flow-step__no > .num {
  display: flex;
  align-items: center;
  font-size: 1.125rem;
  margin-left: 0.5625rem;
}
@media (min-width: 769px) {
  .flow-step__no {
    position: relative;
    z-index: 1;
    align-self: flex-start;
    font-size: 1.09375cqw;
    padding: 0.3125cqw 0.625cqw;
    border-radius: 0.3125cqw;
  }
  .flow-step__no > .step::after {
    right: -0.3125cqw;
  }
  .flow-step__no > .num {
    font-size: 1.40625cqw;
    margin-left: 0.703125cqw;
  }
}
.flow-step__content {
  max-width: 17rem;
  margin: 3.5rem 0 0 auto;
}
@media (min-width: 769px) {
  .flow-step__content {
    width: 100%;
    height: 18.125cqw;
    margin: 2.875cqw 0 0;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}
.flow-step__icon {
  width: 42.66vw;
  max-width: 10rem;
  aspect-ratio: 1/1;
  margin: 1.125rem auto 0;
}
@media (min-width: 769px) {
  .flow-step__icon {
    width: 58.82%;
    max-width: 10rem;
    margin: 0 auto;
  }
}
.flow-step__text {
  margin-top: 0.71875rem;
  font-size: 1rem;
  line-height: 1.6;
  font-weight: 700;
  color: #1f1f1f;
}
@media (min-width: 769px) {
  .flow-step__text {
    margin-top: 1.5625cqw;
    font-size: 1.25cqw;
  }
}

.reason-card--cur {
  width: 85.3333333333vw;
  max-width: 20rem;
  aspect-ratio: 320/341;
  margin-inline: auto;
}
@media (min-width: 769px) {
  .reason-card--cur {
    width: 100%;
  }
}
.reason-card--cur {
  padding: 0;
  overflow: hidden;
  border: none;
  border-radius: 1.25rem;
  box-shadow: 0 0 0 0.25rem #CCD8D8;
}
.reason-card--cur .reason-card__photo {
  width: 100%;
  aspect-ratio: 320/213;
  border-radius: 0;
}
.reason-card--cur .reason-card__title {
  margin-top: 1.125rem;
  font-size: 1.5rem;
}
@media (min-width: 769px) {
  .reason-card--cur .reason-card__title {
    margin-top: 1.25rem;
  }
}
.reason-card--cur:nth-child(1) .reason-card__photo img {
  transform: scale(1.1875) translate(5%, 10px);
}
.reason-card--cur:nth-child(2) .reason-card__photo img {
  transform: scale(1.97811) translate(-7.5%, 19%);
}
.reason-card--cur:nth-child(3) .reason-card__photo img {
  transform: scale(1.68436) translate(5.2%, 12.9%);
}

.btn-pill {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  min-width: 16.25rem;
  padding: 1.2rem 2rem;
  background-color: #ff1ba7;
  color: #ffffff;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.6;
  transition: transform 0.2s ease;
}
.btn-pill::after {
  content: "↗";
  font-size: 1rem;
}
@media (hover: hover) {
  .btn-pill:hover {
    transform: scale(1.1);
  }
}

@keyframes cur-icon-bob {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-7%);
  }
}
@keyframes cur-icon-tilt {
  0%, 100% {
    transform: rotate(-3deg);
  }
  50% {
    transform: rotate(3deg);
  }
}
@keyframes cur-icon-bob2 {
  0%, 100% {
    transform: translateY(0) rotate(0);
  }
  50% {
    transform: translateY(-6%) rotate(2deg);
  }
}
@keyframes cur-icon-sway {
  0%, 100% {
    transform: rotate(-5deg);
  }
  50% {
    transform: rotate(5deg);
  }
}
@media (prefers-reduced-motion: no-preference) and (min-width: 769px) {
  .js-reveal .cur-intro__item--before {
    opacity: 0;
    transform: translateX(-40px);
    transition: opacity 0.55s cubic-bezier(0.22, 1, 0.36, 1), transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .js-reveal .cur-intro__item--after {
    opacity: 0;
    transform: translateX(40px);
    transition: opacity 0.55s cubic-bezier(0.22, 1, 0.36, 1) 0.3s, transform 0.55s cubic-bezier(0.22, 1, 0.36, 1) 0.3s;
  }
  .cur-intro__compare.is-inview .cur-intro__item--before,
  .cur-intro__compare.is-inview .cur-intro__item--after {
    opacity: 1;
    transform: none;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .cur-intro__arrow span {
    animation: change-arrow-blink 1.6s ease-in-out infinite;
  }
  .cur-intro__arrow span:nth-child(2) {
    animation-delay: 0.22s;
  }
  .cur-intro__arrow span:nth-child(3) {
    animation-delay: 0.44s;
  }
  .js-reveal .cur-intro__copy-line {
    opacity: 0;
    transform: translateY(12px);
    transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .cur-intro__copy.is-inview .cur-intro__copy-line {
    opacity: 1;
    transform: none;
  }
  .cur-intro__copy.is-inview .cur-intro__copy-line:nth-child(2) {
    transition-delay: 0.12s;
  }
  .js-reveal .cur-intro__copy-line::after {
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.7s ease-out;
  }
  .cur-intro__copy.is-inview .cur-intro__copy-line::after {
    transform: scaleX(1);
  }
  .cur-intro__copy.is-inview .cur-intro__copy-line:nth-child(1)::after {
    transition-delay: 0.25s;
  }
  .cur-intro__copy.is-inview .cur-intro__copy-line:nth-child(2)::after {
    transition-delay: 0.45s;
  }
  .js-reveal .cur-voice-card {
    opacity: 0;
    transform: translateY(32px);
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .cur-voice-card.is-inview {
    opacity: 1;
    transform: none;
  }
  .js-reveal .cur-voice-card__name {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .cur-voice-card.is-inview .cur-voice-card__name {
    opacity: 1;
    transform: none;
    transition-delay: 0.3s;
  }
  .js-reveal .cur-voice-card__highlight li {
    clip-path: inset(0 100% 0 0);
    transition: clip-path 0.5s ease;
  }
  .cur-voice-card.is-inview .cur-voice-card__highlight li {
    clip-path: inset(0 0 0 0);
  }
  .cur-voice-card.is-inview .cur-voice-card__highlight li:nth-child(1) {
    transition-delay: 0.45s;
  }
  .cur-voice-card.is-inview .cur-voice-card__highlight li:nth-child(2) {
    transition-delay: 0.6s;
  }
  .cur-voice-card.is-inview .cur-voice-card__highlight li:nth-child(3) {
    transition-delay: 0.75s;
  }
  .js-reveal .cur-voice-card__quote {
    opacity: 0;
    transition: opacity 0.6s ease;
  }
  .cur-voice-card.is-inview .cur-voice-card__quote {
    opacity: 1;
    transition-delay: 0.7s;
  }
  .js-reveal .cur-voice-card__result {
    opacity: 0;
    transform: scale(0.92);
    transform-origin: center;
    transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
  }
  .cur-voice-card.is-inview .cur-voice-card__result {
    opacity: 1;
    transform: none;
    transition-delay: 0.95s;
  }
  .js-reveal .flow-step {
    opacity: 0;
    transform: translateY(24px) scale(0.85);
    transition: opacity 0.7s ease, transform 0.7s cubic-bezier(0.34, 1.56, 0.64, 1);
  }
  .flow__steps.is-inview .flow-step {
    opacity: 1;
    transform: none;
  }
  .flow__steps.is-inview .flow-step:nth-child(1) {
    transition-delay: 0.1s;
  }
  .flow__steps.is-inview .flow-step:nth-child(2) {
    transition-delay: 0.32s;
  }
  .flow__steps.is-inview .flow-step:nth-child(3) {
    transition-delay: 0.54s;
  }
  .flow__steps.is-inview .flow-step:nth-child(4) {
    transition-delay: 0.76s;
  }
  .js-reveal .flow__steps::before {
    transform: scaleY(0);
    transform-origin: top center;
    transition: transform 0.9s ease-out;
  }
  .flow__steps.is-inview::before {
    transform: scaleY(1);
  }
}
@media (prefers-reduced-motion: no-preference) and (min-width: 769px) {
  .js-reveal .flow__steps::before {
    transform: translateY(-50%) scaleX(0);
    transform-origin: left center;
    transition: transform 0.9s ease-out 0.15s;
  }
  .flow__steps.is-inview::before {
    transform: translateY(-50%) scaleX(1);
  }
}
@media (prefers-reduced-motion: no-preference) {
  .flow__steps.is-inview .flow-step__icon img {
    will-change: transform;
  }
  .flow__steps.is-inview .flow-step:nth-child(1) .flow-step__icon img {
    animation: cur-icon-bob 3.2s ease-in-out 1s infinite;
  }
  .flow__steps.is-inview .flow-step:nth-child(2) .flow-step__icon img {
    animation: cur-icon-tilt 3.6s ease-in-out 1.2s infinite;
  }
  .flow__steps.is-inview .flow-step:nth-child(3) .flow-step__icon img {
    animation: cur-icon-bob2 3.4s ease-in-out 1.4s infinite;
  }
  .flow__steps.is-inview .flow-step:nth-child(4) .flow-step__icon img {
    transform-origin: bottom center;
    animation: cur-icon-sway 2.8s ease-in-out 1.6s infinite;
  }
  .js-reveal .flow__copy {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .flow__copy.is-inview {
    opacity: 1;
    transform: none;
  }
  .js-reveal .flow__copy-accent {
    display: inline-block;
    transform: scale(0.8);
    transition: transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
  }
  .flow__copy.is-inview .flow__copy-accent {
    transform: none;
    transition-delay: 0.35s;
  }
  .js-reveal .flow__features .reason-card--cur {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .flow__features.is-inview .reason-card--cur {
    opacity: 1;
    transform: none;
  }
  .flow__features.is-inview .reason-card--cur:nth-child(2) {
    transition-delay: 0.13s;
  }
  .flow__features.is-inview .reason-card--cur:nth-child(3) {
    transition-delay: 0.26s;
  }
}
.cur-sit {
  aspect-ratio: 235/381;
}
.cur-sit__layer {
  position: absolute;
  display: block;
}
.cur-sit__base {
  left: 0;
  top: 0;
  width: 100%;
}
.cur-sit__legs {
  left: 17.02%;
  top: 49.87%;
  width: 55.32%;
}
.cur-sit__laptop {
  left: 0;
  top: 2.1%;
  width: 59.57%;
}
.cur-sit__larm {
  left: 8.51%;
  top: 28.87%;
  width: 61.7%;
}
.cur-sit__cup {
  left: 9%;
  top: 33%;
  width: 14.47%;
}
.cur-sit__rarm {
  left: 41.7%;
  top: 18.9%;
  width: 57.02%;
  transform-origin: 98.7% 26%;
}
@media (prefers-reduced-motion: no-preference) {
  .cur-sit__rarm {
    animation: cur-sit-type 0.34s ease-in-out infinite;
  }
}
.cur-sit__coffee {
  position: absolute;
  inset: 0;
  transform-origin: 78% 24%;
}
@media (prefers-reduced-motion: no-preference) {
  .cur-sit__coffee {
    animation: cur-sit-coffee 5s ease-in-out infinite;
  }
}

@keyframes cur-sit-type {
  0%, 100% {
    transform: rotate(0);
  }
  50% {
    transform: rotate(1.6deg);
  }
}
@keyframes cur-sit-coffee {
  0%, 40% {
    transform: rotate(0);
  }
  60%, 76% {
    transform: rotate(11deg);
  }
  92%, 100% {
    transform: rotate(0);
  }
}
.cur-stand__base {
  display: block;
  width: 100%;
  height: auto;
}
.cur-stand__arm {
  position: absolute;
  left: 61.97%;
  top: 5.54%;
  width: 111.27%;
  max-width: none;
  height: auto;
  transform-origin: 9.49% 86.47%;
}
@media (prefers-reduced-motion: no-preference) {
  .cur-stand__arm {
    animation: cur-stand-wave 3.4s ease-in-out infinite;
  }
}

@keyframes cur-stand-wave {
  0%, 12% {
    transform: rotate(0deg);
  }
  26% {
    transform: rotate(-8deg);
  }
  40% {
    transform: rotate(3deg);
  }
  54% {
    transform: rotate(-8deg);
  }
  68% {
    transform: rotate(3deg);
  }
  82%, 100% {
    transform: rotate(0deg);
  }
}
@media (prefers-reduced-motion: no-preference) {
  .ci--orient .ci-play {
    transform-box: fill-box;
    transform-origin: center;
    animation: ci-play-blink 1.4s ease-in-out infinite;
  }
  @keyframes ci-play-blink {
    0%, 40% {
      opacity: 1;
      transform: scale(1);
    }
    50%, 90% {
      opacity: 0;
      transform: scale(0.7);
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
  .ci--cut .ci-armL,
  .ci--cut .ci-armR {
    transform-box: view-box;
    transform-origin: 17.74px 13.45px;
  }
  .ci--cut .ci-armL {
    animation: ci-snip-l 0.5s ease-in-out infinite;
  }
  .ci--cut .ci-armR {
    animation: ci-snip-r 0.5s ease-in-out infinite;
  }
  @keyframes ci-snip-l {
    0%, 100% {
      transform: rotate(0);
    }
    50% {
      transform: rotate(8deg);
    }
  }
  @keyframes ci-snip-r {
    0%, 100% {
      transform: rotate(0);
    }
    50% {
      transform: rotate(-8deg);
    }
  }
  .ci--telop .ci-l {
    transform-box: fill-box;
    transform-origin: center;
    animation: ci-letter 2.4s ease-in-out infinite;
  }
  .ci--telop .ci-l1 {
    animation-delay: 0s;
  }
  .ci--telop .ci-l2 {
    animation-delay: 0.22s;
  }
  .ci--telop .ci-l3 {
    animation-delay: 0.44s;
  }
  .ci--telop .ci-l4 {
    animation-delay: 0.66s;
  }
  .ci--telop .ci-l5 {
    animation-delay: 0.88s;
  }
  @keyframes ci-letter {
    0% {
      opacity: 0;
      transform: scale(0.4);
    }
    10% {
      opacity: 1;
      transform: scale(1);
    }
    60% {
      opacity: 1;
      transform: scale(1);
    }
    72%, 100% {
      opacity: 0;
      transform: scale(0.4);
    }
  }
  .ci--bar .ci-bar {
    transform-box: view-box;
    animation: ci-bar-grow 2.6s ease-in-out infinite;
  }
  .ci--bar .ci-bar1 {
    transform-origin: 5.5556px 8px;
    animation-delay: 0s;
  }
  .ci--bar .ci-bar2 {
    transform-origin: 5.5556px 10.665px;
    animation-delay: 0.2s;
  }
  .ci--bar .ci-bar3 {
    transform-origin: 5.5556px 13.337px;
    animation-delay: 0.4s;
  }
  @keyframes ci-bar-grow {
    0% {
      transform: scaleX(0);
    }
    35% {
      transform: scaleX(1);
    }
    75% {
      transform: scaleX(1);
    }
    100% {
      transform: scaleX(0);
    }
  }
  .ci--img .ci-sun {
    transform-box: fill-box;
    transform-origin: center;
    animation: ci-sun-pop 1.8s ease-in-out infinite;
  }
  @keyframes ci-sun-pop {
    0%, 12% {
      opacity: 0;
      transform: scale(0);
    }
    28% {
      opacity: 1;
      transform: scale(1.15);
    }
    40%, 68% {
      opacity: 1;
      transform: scale(1);
    }
    82%, 100% {
      opacity: 0;
      transform: scale(0);
    }
  }
  .ci--bgm .ci-note {
    transform-box: fill-box;
    transform-origin: center bottom;
    animation: ci-note-dance 1.1s ease-in-out infinite;
  }
  @keyframes ci-note-dance {
    0%, 100% {
      transform: translateY(0) rotate(-6deg);
    }
    50% {
      transform: translateY(-1.5px) rotate(6deg);
    }
  }
  .ci--bgm .ci-plus {
    transform-box: fill-box;
    transform-origin: center;
    animation: ci-plus-pulse 1.1s ease-in-out infinite;
  }
  @keyframes ci-plus-pulse {
    0%, 100% {
      opacity: 0.5;
      transform: scale(0.85);
    }
    50% {
      opacity: 1;
      transform: scale(1.1);
    }
  }
  .ci--kf .ci-kf {
    transform-box: fill-box;
    transform-origin: center;
    animation: ci-kf-glow 2s ease-in-out infinite;
  }
  .ci--kf .ci-kf1 {
    animation-delay: 0s;
  }
  .ci--kf .ci-kf2 {
    animation-delay: 0.35s;
  }
  .ci--kf .ci-kf3 {
    animation-delay: 0.7s;
  }
  @keyframes ci-kf-glow {
    0%, 100% {
      opacity: 0.5;
      transform: scale(1);
    }
    12% {
      opacity: 1;
      transform: scale(1.3);
    }
    28% {
      opacity: 0.5;
      transform: scale(1);
    }
  }
  .ci--kf .ci-kfline {
    animation: ci-kf-flow 0.6s linear infinite;
  }
  @keyframes ci-kf-flow {
    from {
      stroke-dashoffset: 0;
    }
    to {
      stroke-dashoffset: -6;
    }
  }
  .ci--edit .ci-edit {
    animation: ci-edit-blink 1.6s ease-in-out infinite;
  }
  .ci--edit .ci-edit1 {
    animation-delay: 0s;
  }
  .ci--edit .ci-edit2 {
    animation-delay: 0.2s;
  }
  .ci--edit .ci-edit3 {
    animation-delay: 0.4s;
  }
  .ci--edit .ci-edit4 {
    animation-delay: 0.6s;
  }
  .ci--edit .ci-edit5 {
    animation-delay: 0.8s;
  }
  .ci--edit .ci-edit6 {
    animation-delay: 1s;
  }
  @keyframes ci-edit-blink {
    0%, 100% {
      opacity: 0.25;
    }
    50% {
      opacity: 1;
    }
  }
}
.page-head--legal {
  padding-bottom: 2rem;
}
@media (min-width: 769px) {
  .page-head--legal {
    min-height: 15rem;
    padding-bottom: 3rem;
  }
}

.legal {
  padding-block: 3rem 4.5rem;
}
@media (min-width: 769px) {
  .legal {
    padding-block: 4.5rem 7.5rem;
  }
}
.legal__inner {
  width: 100%;
  max-width: 82.5rem;
  margin-inline: auto;
  padding-inline: 20px;
}
@media (min-width: 769px) {
  .legal__inner {
    padding-inline: 3.75rem;
  }
}
.legal__inner {
  max-width: calc(55px * 1rem);
}
.legal__lead {
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 769px) {
  .legal__lead {
    font-size: 1rem;
  }
}
.legal__block {
  margin-top: 2.5rem;
}
@media (min-width: 769px) {
  .legal__block {
    margin-top: 3rem;
  }
}
.legal__block > * + * {
  margin-top: 1rem;
}
.legal__heading {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
  padding-left: 0.875rem;
  border-left: 0.25rem solid #ff1ba7;
}
@media (min-width: 769px) {
  .legal__heading {
    font-size: 1.375rem;
  }
}
.legal__subheading {
  margin-top: 1.5rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.3;
  color: #ff1ba7;
}
.legal p {
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 769px) {
  .legal p {
    font-size: 1rem;
  }
}
.legal__list {
  padding-left: 1.25rem;
  list-style: disc;
}
.legal__list li {
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 769px) {
  .legal__list li {
    font-size: 1rem;
  }
}
.legal__list li + .legal__list li {
  margin-top: 0.375rem;
}
.legal__contact li {
  font-size: 0.9375rem;
  line-height: 1.8;
}
@media (min-width: 769px) {
  .legal__contact li {
    font-size: 1rem;
  }
}
.legal__contact-label {
  display: inline-block;
  min-width: 4.5rem;
  font-weight: 700;
  color: #ff1ba7;
}

.legal-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9375rem;
  line-height: 1.6;
}
@media (min-width: 769px) {
  .legal-table {
    font-size: 1rem;
  }
}
.legal-table th,
.legal-table td {
  text-align: left;
  vertical-align: top;
  padding: 1rem;
  border: 0.0625rem solid rgba(255, 27, 167, 0.2392156863);
}
@media (min-width: 769px) {
  .legal-table th,
  .legal-table td {
    padding: 1.25rem 1.5rem;
  }
}
.legal-table th {
  width: 13.75rem;
  font-weight: 700;
  background-color: rgba(255, 27, 167, 0.0509803922);
}
@media (min-width: 769px) {
  .legal-table th {
    width: 17.5rem;
  }
}
.legal-table strong {
  font-weight: 700;
}
@media (max-width: 768px) {
  .legal-table,
  .legal-table tbody,
  .legal-table tr,
  .legal-table th,
  .legal-table td {
    display: block;
    width: 100%;
  }
  .legal-table tr {
    border: 0.0625rem solid rgba(255, 27, 167, 0.2392156863);
  }
  .legal-table tr + tr {
    border-top: none;
  }
  .legal-table th,
  .legal-table td {
    border: none;
    padding: 0.75rem 1rem;
  }
}