@charset "UTF-8";
@font-face {
  font-family: "Local Noto Sans JP";
  src: local("Noto Sans JP");
}
:root {
  --black: #2F2F2F;
  --black-light: #585858;
  --white: #ffffff;
  --pink: #FC7791;
  --pink-light: #FEC0CB;
  --pink-white: #FFF4F6;
  --gray-dark: #A3A3A3;
  --gray: #F1F1F1;
  --gray-white: #FAFAFA;
  --gray-placeholder: #BCBCBC;
  --yellow: #F5E73D;
  --yellow-light: #FFEE72;
  --blue: #4599FA;
  --blue-light: #AADCEB;
  --red: #B10017;
  --green-line: #4D9A1A;
  --shadow-size: clamp(0.188rem, 0.123rem + 0.263vw, 0.313rem);
  --shadow-primary: var(--shadow-size) var(--shadow-size) 0 rgb(47 47 47 / .2);
  --shadow-primary-none: 0 0 0 rgb(47 47 47 / .2);
  --shadow-secondary: var(--shadow-size) var(--shadow-size) 0 var(--black);
  --shadow-secondary-none: 0 0 0 var(--black);
  --shadow-tertiary: var(--shadow-size) var(--shadow-size) 0 #D5D5D5;
  --transition-btn: opacity 0.1s ease-in, box-shadow 0.2s ease-in, translate 0.2s ease-in;
  --border-primary: var(--black);
  --border-secondary: var(--gray-dark);
  --radius-xl: clamp(2.188rem, 1.065rem + 4.605vw, 4.375rem);
  --radius-lg: clamp(0.938rem, 0.456rem + 1.974vw, 1.875rem);
  --radius-md: clamp(0.625rem, 0.304rem + 1.316vw, 1.25rem);
  --radius-sm: clamp(0.313rem, 0.152rem + 0.658vw, 0.625rem);
  --radius-xs: clamp(0.188rem, 0.123rem + 0.263vw, 0.313rem);
  --radius-full: calc(1px / 0);
  --font-primary: var(--black);
  --notosansjp: "Noto Sans JP", sans-serif;
  --family-primary: "Local Noto Sans JP", var(--notosansjp);
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-bold: 700;
  --family-secondary: "deuterium-variable", sans-serif;
  --weight-secondary-medium: 480;
  --weight-secondary-bold: 560;
  --line-height-tight: 1.2;
  --line-height-snug: 1.4;
  --line-height-default: 1.5;
  --line-height-normal: 1.75;
  --line-height-relaxed: 2;
  --header-height: 100px;
  --header-height-sm: 72px;
  --spacing-xl: clamp(5rem, 3.076rem + 7.895vw, 8.75rem);
  --spacing-lg: clamp(4rem, 2.204rem + 7.368vw, 7.5rem);
  --spacing-gutter: clamp(1.25rem, -0.161rem + 5.789vw, 4rem);
  --spacing-gutter-sm: clamp(0.875rem, -0.729rem + 6.579vw, 4rem);
  --gap-xl: clamp(1.5rem, 0.217rem + 5.263vw, 4rem);
  --gap-lg: clamp(1.25rem, 0.480rem + 3.158vw, 2.75rem);
  --gap-md: clamp(1.125rem, 0.484rem + 2.632vw, 2.375rem);
  --gap-sm: clamp(0.75rem, 0.365rem + 1.579vw, 1.5rem);
  --leading-trim: calc((1em - 1lh) / 2);
  --text-box: trim-both cap alphabetic;
}

:root {
  --icon-arrow-right: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="12.347" height="11.364" viewBox="0 0 12.347 11.364"><path d="M0,0,2.5,5.655,0,11.364,12.347,5.683Z" fill="black"/></svg>');
}

/* ---------------------------
  CSS Reset
----------------------------- */
* {
  min-inline-size: 0;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

:where(html) {
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
       text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}

:where(body) {
  text-rendering: optimizeSpeed;
  line-height: 1.5;
}

:where(body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd,
ul,
ol) {
  margin: 0;
}

:where(ul, ol) {
  list-style-type: "";
  padding: unset;
}

:where(a:not([class])) {
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}

:where(a) {
  text-decoration: none;
}

:where(img, picture) {
  max-width: 100%;
  height: auto;
  display: block;
}

:where(input, button, textarea, select) {
  font: inherit;
}

:where(input[type=text], textarea) {
  font-size: 16px;
}

:where(textarea) {
  field-sizing: content;
}

:where(button, [type=button], [type=reset], [type=submit]) {
  touch-action: manipulation;
}

:where(:-moz-any-link,
button,
[type=button],
[type=reset],
[type=submit],
label[for],
select,
summary,
[role=tab],
[role=button]) {
  cursor: pointer;
}

:where(:any-link,
button,
[type=button],
[type=reset],
[type=submit],
label[for],
select,
summary,
[role=tab],
[role=button]) {
  cursor: pointer;
}

:focus:not(:focus-visible) {
  outline: none;
}

:where(address) {
  font-style: normal;
}

:where(table) {
  border-collapse: collapse;
}

:where(dialog) {
  width: unset;
  max-width: unset;
  height: unset;
  max-height: unset;
  padding: unset;
  color: unset;
  background-color: unset;
  border: unset;
  overflow: unset;
}

@media (prefers-reduced-motion: reduce) {
  *,
  ::before,
  ::after,
  ::backdrop {
    background-attachment: scroll !important;
    transition-delay: 0s !important;
    transition-duration: 1ms !important;
    animation-duration: 1ms !important;
    animation-delay: 0s !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}
body {
  color: var(--font-primary);
  font-size: clamp(0.875rem, 0.81rem + 0.263vw, 1rem);
  font-family: var(--family-primary);
  font-weight: var(--weight-medium);
  letter-spacing: 0.05em;
  overflow-x: clip;
  overflow-wrap: anywhere;
  word-break: normal;
  line-break: strict;
  text-autospace: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body:has(dialog[open]) {
  overflow: hidden;
}
@-moz-document url-prefix() {
  body {
    font-family: var(--notosansjp);
  }
}

a {
  color: var(--font-primary);
}

button {
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  background-color: transparent;
  border: none;
  border-radius: 0;
  margin: 0;
  padding: 0;
}

fieldset {
  min-width: 0;
  margin: 0;
  border: 0;
  padding: 0;
}

legend {
  width: 100%;
  margin: 0;
  padding: 0;
}

:where(:focus-visible) {
  outline-width: 3px;
  outline-offset: 0.125rem;
  outline-style: solid;
}

.hamburger {
  display: none;
  width: 80px;
  height: var(--header-height-sm);
  position: fixed;
  top: 0;
  right: 0;
  z-index: 9999;
}
.hamburger:focus-visible {
  outline-offset: -3px;
}
@media (max-width: 979px) {
  .hamburger {
    display: grid;
    place-content: center;
  }
}
.hamburger--close {
  position: static;
}
.hamburger--close .hamburger__inner {
  position: relative;
}
.hamburger--close .hamburger__inner span {
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  transform-origin: center;
}
.hamburger--close .hamburger__inner span:first-child {
  rotate: 45deg;
}
.hamburger--close .hamburger__inner span:last-child {
  rotate: -45deg;
}

.hamburger__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 3px;
  width: 49px;
  height: 49px;
  background-color: var(--yellow-light);
  border: 2px solid var(--border-primary);
  border-radius: 50%;
  box-shadow: var(--shadow-primary);
  padding: 0 16px;
}
.hamburger__inner span {
  display: block;
  width: 16px;
  height: 2px;
  background-color: var(--black);
}

.folded-nav {
  position: fixed;
  inset: 0;
  transition: opacity 0.2s ease-out;
}
.folded-nav[open] {
  display: block;
}
.folded-nav:not(.is-open) {
  opacity: 0;
}
.folded-nav:not(.is-open) .folded-nav__inner {
  opacity: 0;
}
.folded-nav::backdrop {
  background-color: transparent;
  backdrop-filter: blur(4px);
  transition: opacity 0.2s ease-out;
}
.folded-nav:not(.is-open)::backdrop {
  opacity: 0;
}

.folded-nav__inner {
  height: 100%;
  overflow: auto;
  overscroll-behavior: contain;
}

.using-mouse dialog * {
  outline: none;
}
.using-mouse .hamburger {
  outline: none;
}

.c-nopost {
  text-align: center;
}

.u-sm-only {
  display: none;
}
@media (max-width: 979px) {
  .u-sm-only {
    display: block;
  }
}

@media (max-width: 979px) {
  br.u-sm-only {
    display: inline;
  }
}

.u-md-only {
  display: none;
}
@media (max-width: 979px) {
  .u-md-only {
    display: block;
  }
}

@media (max-width: 979px) {
  br.u-md-only {
    display: inline;
  }
}

.u-wrapper {
  margin-inline: auto;
  padding-left: var(--spacing-gutter);
  padding-right: var(--spacing-gutter);
  max-width: 78vw;
}
@media (max-width: 1640px) {
  .u-wrapper {
    max-width: calc(1150px + var(--spacing-gutter) * 2);
  }
}

.u-inner {
  margin-inline: auto;
  max-width: 61vw;
}
@media (max-width: 1640px) {
  .u-inner {
    max-width: 1000px;
  }
}

.u-inner-1000 {
  max-width: 1000px;
  margin-inline: auto;
}

.u-inner-900 {
  max-width: 900px;
  margin-inline: auto;
}

.u-gutter {
  padding-left: var(--spacing-gutter);
  padding-right: var(--spacing-gutter);
}

.u-gutter-sm {
  padding-left: calc(var(--spacing-gutter) / 2);
  padding-right: calc(var(--spacing-gutter) / 2);
}

.u-visually-hidden {
  position: fixed !important;
  inset: 0 !important;
  contain: strict !important;
  visibility: initial !important;
  inline-size: 4px !important;
  block-size: 4px !important;
  margin: unset !important;
  padding: unset !important;
  border: unset !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.top-hero-section {
  height: calc(100vh - 40px);
  height: calc(100svh - 40px);
  padding-top: var(--header-height);
  padding-bottom: 32px;
  background-color: #F6C7D7;
}
@media (max-width: 979px) {
  .top-hero-section {
    padding-top: var(--header-height-sm);
  }
}
@media (max-width: 599px) {
  .top-hero-section {
    height: calc(100vh - 38px);
    height: calc(100svh - 38px);
    padding-bottom: 56px;
  }
}
@media (orientation: landscape) and (max-width: 979px) {
  .top-hero-section {
    height: 100vh;
    height: 100svh;
    padding-bottom: 16px;
  }
}

.top-hero {
  width: 89.5vw;
  height: 100%;
  position: relative;
  margin-inline: auto;
}
@media (max-width: 979px) {
  .top-hero {
    width: 86.5vw;
  }
}
@media (orientation: landscape) and (max-width: 979px) {
  .top-hero {
    width: 92vw;
  }
}

.top-hero__left {
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  translate: -100% 0;
  font-size: clamp(0.6875rem, 0.46rem + 0.921vw, 1.125rem);
  font-family: var(--family-secondary);
  font-weight: var(--weight-secondary-medium);
  line-height: var(--line-height-tight);
  letter-spacing: 0.1em;
  text-align: center;
  text-transform: uppercase;
  writing-mode: sideways-lr;
  padding: 0.2em;
}
@media (max-width: 979px) {
  .top-hero__left {
    text-align: left;
  }
}
@media (orientation: landscape) and (max-width: 979px) {
  .top-hero__left {
    display: none;
  }
}

.top-hero__right {
  position: absolute;
  top: 50%;
  right: 0;
  translate: 100% -50%;
  display: grid;
  grid-template-columns: auto auto;
  align-items: center;
  gap: 0.8em;
  font-size: clamp(0.625rem, 0.43rem + 0.789vw, 1rem);
  font-family: var(--family-secondary);
  font-weight: var(--weight-secondary-medium);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  writing-mode: sideways-rl;
  padding: 0.2em;
}
@media (max-width: 979px) {
  .top-hero__right {
    top: auto;
    bottom: 0;
    translate: 100% 0;
  }
}
.top-hero__right .triangle {
  display: block;
  width: 0.7em;
  overflow: hidden;
  -webkit-mask-image: var(--icon-chevron-3);
          mask-image: var(--icon-chevron-3);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-size: contain;
          mask-size: contain;
  aspect-ratio: 11/40;
  position: relative;
}
.top-hero__right .triangle::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 102%;
  height: 102%;
  background-color: var(--black);
  animation-name: loop_blinking;
  animation-duration: 1.5s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

@keyframes loop_blinking {
  0% {
    translate: 0 -101%;
  }
  20% {
    translate: 0 -101%;
  }
  80% {
    translate: 0 -1%;
  }
  100% {
    translate: 0 -1%;
  }
}
.top-hero__main {
  height: 100%;
  position: relative;
}

.top-hero__healdine {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 10;
  width: max(13.5vw, 215px);
}
@media (max-width: 979px) {
  .top-hero__healdine {
    top: 14px;
    right: 14px;
    width: max(4.26vw, 16px);
  }
}
@media (orientation: landscape) and (max-width: 979px) {
  .top-hero__healdine {
    width: 16px;
  }
}
.top-hero__healdine img {
  width: 100%;
}

.top-hero__img {
  width: 100%;
  height: 100%;
  border: 2px solid var(--border-primary);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.top-hero__img picture, .top-hero__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.top-hero__action {
  width: 100%;
  max-width: calc(968px + var(--spacing-gutter-sm) * 2);
  position: absolute;
  bottom: 0;
  left: 50%;
  translate: -50% 50%;
  z-index: 100;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  align-items: center;
  gap: var(--gap-md);
  padding: 0 var(--spacing-gutter-sm);
}
@media (max-width: 599px) {
  .top-hero__action {
    bottom: -56px;
    padding: 0;
    gap: 8px;
  }
}

.top-hero__message {
  position: absolute;
  top: 32%;
  right: 0;
  padding-left: 58%;
  padding-right: 20px;
  width: 100%;
}
@media (max-width: 979px) {
  .top-hero__message {
    padding-left: 5.4vw;
    padding-right: 8.6vw;
    right: auto;
    left: 0;
    top: 10%;
  }
}
@media (orientation: landscape) and (max-width: 979px) {
  .top-hero__message {
    padding-right: 56px;
    top: 20%;
  }
}

.top-hero-btn {
  container-type: inline-size;
  display: block;
  position: relative;
  width: 100%;
  max-width: clamp(13.375rem, 6.61rem + 27.763vw, 26.5625rem);
  margin-inline: auto;
  border-radius: var(--radius-lg);
  color: var(--black);
  background-color: #faeaed;
  box-shadow: 5px 5px 10px rgba(47, 47, 47, 0.1);
}
@media (min-width: 1280px) {
  .top-hero-btn {
    max-width: min(32.2vw, 700px);
  }
}
@media (max-width: 979px) {
  .top-hero-btn {
    margin-inline: inherit;
    max-width: clamp(13.375rem, 5.19rem + 34.934vw, 26.5625rem);
  }
}
@media (orientation: landscape) and (max-width: 979px) {
  .top-hero-btn {
    margin-left: auto;
  }
}
.top-hero-btn:active {
  box-shadow: 0 0 10px rgba(47, 47, 47, 0.1);
  translate: 2px 2px;
}

.top-hero-notice {
  position: relative;
  z-index: 100;
  display: grid;
  grid-template-columns: max-content 1fr;
  align-items: center;
  gap: max(3.8cqw, 10px);
  width: 100%;
  padding: 5.3cqw;
  border-radius: var(--radius-lg);
  background-color: var(--white);
  text-align: left;
  transition: padding 0.2s linear;
}
.top-hero-notice:focus-visible + .top-hero-shadow span {
  width: 100%;
  translate: -50% 0;
}
@media (any-hover: hover) {
  .top-hero-notice:hover + .top-hero-shadow span {
    width: 100%;
    translate: -50% 0;
  }
}

.top-hero-notice__icon {
  position: relative;
}
.top-hero-notice__icon::after {
  content: "4";
  display: grid;
  place-content: center;
  position: absolute;
  top: 0;
  right: 0;
  translate: 30% -30%;
  width: 1.9em;
  height: auto;
  aspect-ratio: 1/1;
  font-size: max(3.5cqw, 9px);
  font-family: var(--family-secondary);
  font-weight: var(--weight-secondary-bold);
  color: var(--white);
  line-height: 1;
  background-color: var(--red);
  border-radius: 50%;
  padding-bottom: 0.1em;
}
.top-hero-notice__icon img {
  width: max(16.3cqw, 33px);
  border: 1px solid #FFC0CB;
  border-radius: 3.5cqw;
  transition: width 0.2s linear;
}

.top-hero-notice__title {
  display: block;
  font-size: max(3.5cqw, 10px);
  font-weight: var(--weight-bold);
}

.top-hero-notice__meta {
  display: block;
  font-size: max(3.3cqw, 8.5px);
  font-weight: var(--weight-regular);
  margin-top: 0.4em;
}

.top-hero-notice__time {
  position: absolute;
  top: 1em;
  right: 1.5em;
  z-index: 10;
  font-size: max(3.8cqw, 8.5px);
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: normal;
  color: var(--gray-dark);
}

.top-hero-shadow {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  --_gap: 1.9cqw;
}
.top-hero-shadow span {
  display: block;
  height: 100%;
  overflow: hidden;
  border-radius: var(--radius-lg);
  position: absolute;
  top: 0;
  left: 50%;
  transition: translate 0.3s ease-out, width 0.3s ease-out;
}
.top-hero-shadow span:nth-child(4) {
  width: 95%;
  background-color: #F7F7F7;
  opacity: 0.54;
  translate: -50% var(--_gap);
}
.top-hero-shadow span:nth-child(3) {
  width: 85%;
  background-color: #DDDDDD;
  opacity: 0.7;
  translate: -50% calc(var(--_gap) * 2);
}
.top-hero-shadow span:nth-child(2) {
  width: 75%;
  background-color: #D8D8D8;
  opacity: 0.6;
  translate: -50% calc(var(--_gap) * 3);
}
.top-hero-shadow span:nth-child(1) {
  width: 65%;
  background-color: #CECDCD;
  opacity: 0.34;
  translate: -50% calc(var(--_gap) * 4);
}

.top-hero-display {
  display: block;
  overflow: hidden;
  height: 0;
  width: 100%;
  position: relative;
  z-index: 10;
  background-color: #FAEAED;
  text-align: left;
  border-bottom-left-radius: var(--radius-lg);
  border-bottom-right-radius: var(--radius-lg);
}
.top-hero-display img {
  display: inline;
  width: auto;
  height: max(4.7cqw, 9px);
  vertical-align: baseline;
  translate: 0 0.06em;
}

.top-hero-display__inner {
  padding: 3.8cqw 5.6cqw 5.2cqw;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr max-content;
  gap: 2.9cqw;
}
.top-hero-display__inner::after {
  content: "次の通知を見る";
  display: block;
  font-size: max(3.3cqw, 8.5px);
  font-weight: var(--weight-regular);
  color: var(--gray-dark);
}
.top-hero-display__inner span {
  display: none;
  align-self: center;
  font-size: max(5.2cqw, 11px);
  font-weight: var(--weight-bold);
}
.top-hero-display__inner span:first-child {
  display: block;
}

.top-hero-btn.is-active .top-hero-notice {
  gap: 1.9cqw;
  padding: 3.9cqw;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.top-hero-btn.is-active .top-hero-notice__icon img {
  width: 9.6cqw;
  border-radius: 1.2cqw;
}
.top-hero-btn.is-active .top-hero-notice__icon::after {
  opacity: 0;
}
.top-hero-btn.is-active .top-hero-notice__meta {
  display: none;
}
.top-hero-btn.is-active .top-hero-shadow {
  display: none;
}

.top-common-section {
  position: relative;
  padding-top: var(--spacing-xl);
  padding-bottom: var(--spacing-xl);
  border-top-left-radius: var(--radius-xl);
  border-top-right-radius: var(--radius-xl);
  overflow-x: clip;
}
.top-common-section > .u-wrapper {
  position: relative;
}

.top-typo {
  position: absolute;
  top: 0;
  right: var(--spacing-gutter);
  translate: 0 -54%;
}
@media (max-width: 599px) {
  .top-typo {
    left: 50%;
    right: auto;
  }
}

.top-typo__anim {
  width: -moz-max-content;
  width: max-content;
  font-size: clamp(2.1875rem, 0.42rem + 7.237vw, 5.625rem);
  font-family: var(--family-secondary);
  font-weight: var(--weight-secondary-bold);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  white-space: nowrap;
  color: #F5F5F5;
  transform: translate(-100px);
}
@media (max-width: 979px) {
  .top-typo__anim {
    transform: translate(-20vw);
  }
}

.top-news-section {
  padding-top: clamp(6rem, 4.27rem + 7.105vw, 9.375rem);
}
.top-news-section .top-typo {
  left: 50%;
  right: auto;
}

@media (max-width: 599px) {
  .top-news-slider > .u-wrapper {
    padding-right: 0;
    padding-left: calc(var(--spacing-gutter) + var(--spacing-gutter-sm));
  }
}
.top-news-slider .splide__slide {
  padding-right: var(--shadow-size);
  padding-bottom: var(--shadow-size);
}
.top-news-slider .splide__arrows .u-wrapper {
  padding: 0;
}
@media (max-width: 599px) {
  .top-news-slider .splide__arrows .u-wrapper {
    padding-right: var(--spacing-gutter);
  }
}

.top-about-section {
  z-index: 10;
  background-color: var(--pink-light);
  padding-bottom: clamp(3.75rem, 1.18rem + 10.526vw, 8.75rem);
}

.top-about {
  display: grid;
  grid-template-columns: 5.2fr 5.7fr;
  align-items: center;
  gap: 40px var(--gap-lg);
}
@media (max-width: 979px) {
  .top-about {
    grid-template-columns: 1fr;
  }
}

.top-about__text .c-hgroup {
  margin-bottom: clamp(2rem, 1.62rem + 1.579vw, 2.75rem);
}
.top-about__text h3 {
  font-size: clamp(1rem, 0.74rem + 1.053vw, 1.5rem);
  font-weight: var(--weight-bold);
  line-height: var(--line-height-relaxed);
  margin-bottom: 1.5em;
}
.top-about__text ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: center;
  gap: 12px;
  max-width: 530px;
  margin-right: auto;
}
@media (max-width: 979px) {
  .top-about__text ul {
    margin-left: auto;
  }
}
@media (max-width: 599px) {
  .top-about__text ul {
    gap: 6px;
    padding: 0 var(--spacing-gutter-sm);
  }
}
.top-about__text li {
  container-type: inline-size;
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
  background-color: var(--white);
  border-radius: 50%;
  aspect-ratio: 1/1;
  padding: 10px;
}
.top-about__text li span {
  font-size: 13.5cqw;
  font-weight: var(--weight-bold);
  text-align: center;
}
.top-about__text li img {
  width: 60%;
  margin-inline: auto;
  align-self: end;
}
@media (max-width: 599px) {
  .top-about__text li img {
    width: 80%;
  }
}
.top-about__text .c-btn-round {
  margin-top: clamp(2rem, 1.1rem + 3.684vw, 3.75rem);
}
@media (max-width: 979px) {
  .top-about__text .c-btn-round {
    margin-inline: auto;
  }
}

.top-about__img img {
  width: 100%;
  border: 2px solid var(--border-primary);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.top-insert {
  overflow: hidden;
  border-top: 2px solid var(--white);
  border-bottom: 2px solid var(--white);
  background-color: var(--pink-light);
}

.top-insert__inner {
  width: -moz-max-content;
  width: max-content;
  display: flex;
  align-items: center;
  padding: clamp(0.625rem, 0.3rem + 1.316vw, 1.25rem) 0;
  animation: loop_insert 20s linear infinite;
}
.top-insert__inner img {
  width: auto;
  height: clamp(1.1875rem, 0.58rem + 2.5vw, 2.375rem);
  padding-right: clamp(3.5rem, 1.7rem + 7.368vw, 7rem);
}
.top-insert__inner img:first-child {
  animation: insert_loop_1 80s -40s linear infinite;
}
.top-insert__inner img:last-child {
  animation: insert_loop_2 80s linear infinite;
}

@keyframes insert_loop_1 {
  0% {
    translate: 100%;
  }
  to {
    translate: -100%;
  }
}
@keyframes insert_loop_2 {
  0% {
    translate: 0;
  }
  to {
    translate: -200%;
  }
}
.top-reason-section {
  padding-top: clamp(3.75rem, 1.18rem + 10.526vw, 8.75rem);
  z-index: 10;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-left-radius: var(--radius-xl);
  border-bottom-right-radius: var(--radius-xl);
  background-color: var(--pink-light);
  margin-bottom: calc(-1 * var(--radius-xl));
}

.top-reason-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gap-md);
}
@media (max-width: 979px) {
  .top-reason-list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 599px) {
  .top-reason-list {
    grid-template-columns: 1fr;
  }
}

.top-reason-list__item {
  position: relative;
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 3;
  gap: 24px;
  background-color: var(--white);
  border-radius: var(--radius-md);
  border: 2px solid var(--border-primary);
  overflow: hidden;
  padding: 30px 26px 32px;
}
@-moz-document url-prefix() {
  .top-reason-list__item {
    grid-template-rows: auto auto auto;
  }
}
@media (max-width: 599px) {
  .top-reason-list__item {
    gap: 20px;
    padding: 16px 16px 20px;
  }
}
.top-reason-list__item img {
  width: 100%;
  border-radius: var(--radius-md);
  border: 1px solid var(--border-primary);
  overflow: hidden;
}
.top-reason-list__item h3 {
  font-size: clamp(1rem, 0.74rem + 1.053vw, 1.5rem);
  font-weight: var(--weight-bold);
  line-height: var(--line-height-snug);
  align-self: center;
  text-align: center;
}
.top-reason-list__item p {
  font-size: clamp(0.6875rem, 0.59rem + 0.395vw, 0.875rem);
  line-height: var(--line-height-normal);
}
.top-reason-list__item::before {
  content: "";
  display: block;
  width: clamp(3.5rem, 2.86rem + 2.632vw, 4.75rem);
  height: auto;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  aspect-ratio: 76/71;
  position: absolute;
  top: -2px;
  right: 20px;
  z-index: 10;
}
@media (max-width: 599px) {
  .top-reason-list__item::before {
    right: 24px;
  }
}
.top-reason-list__item:nth-child(1)::before {
  background-image: url("../img/top/reason_1_badge.svg");
}
.top-reason-list__item:nth-child(2)::before {
  background-image: url("../img/top/reason_2_badge.svg");
}
.top-reason-list__item:nth-child(3)::before {
  background-image: url("../img/top/reason_3_badge.svg");
}

.top-reason-feature {
  margin-top: clamp(3.5rem, 1.45rem + 8.421vw, 7.5rem);
  border-radius: var(--radius-xl);
  background-color: var(--pink-white);
  padding: clamp(3rem, 2.62rem + 1.579vw, 3.75rem) var(--spacing-gutter);
  display: grid;
  grid-template-columns: max-content 1fr;
  align-items: center;
  gap: 36px var(--gap-md);
}
@media (min-width: 1280px) {
  .top-reason-feature {
    display: flex;
    justify-content: center;
    gap: 9vw;
  }
}
@media (max-width: 979px) {
  .top-reason-feature {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 979px) {
  .top-reason-feature__headline {
    text-align: center;
  }
}
.top-reason-feature__headline::before {
  content: "And more reasons";
  display: block;
  font-size: clamp(0.9375rem, 0.46rem + 1.974vw, 1.875rem);
  font-family: var(--family-secondary);
  font-weight: var(--weight-secondary-bold);
  letter-spacing: 0.1em;
  color: var(--pink-light);
  white-space: nowrap;
  margin-bottom: 0.2em;
}
.top-reason-feature__headline p {
  font-size: clamp(0.875rem, 0.55rem + 1.316vw, 1.5rem);
  margin-bottom: 0.6em;
}
.top-reason-feature__headline h3 {
  display: inline-block;
  font-size: clamp(1.25rem, 0.54rem + 2.895vw, 2.625rem);
  font-weight: var(--weight-bold);
  line-height: var(--line-height-tight);
  color: var(--white);
  background-color: var(--black);
  padding: 0 0.3em 0.1em;
}

.top-reason-feature__list {
  max-width: 565px;
  width: 100%;
  margin-left: auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
@media (min-width: 1280px) {
  .top-reason-feature__list {
    margin-left: 0;
  }
}
@media (max-width: 979px) {
  .top-reason-feature__list {
    margin-right: auto;
    padding: 0 var(--spacing-gutter);
  }
}
@media (max-width: 599px) {
  .top-reason-feature__list {
    gap: 20px 15px;
    grid-template-columns: repeat(2, 1fr);
  }
}
.top-reason-feature__list li {
  container-type: inline-size;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1.2fr 1fr;
  gap: 12px;
  background-color: var(--pink);
  border-radius: 50%;
  aspect-ratio: 1/1;
  padding: 10px;
}
.top-reason-feature__list li span {
  font-size: 9cqw;
  font-weight: var(--weight-bold);
  line-height: var(--line-height-snug);
  color: var(--white);
  text-align: center;
}
@media (max-width: 599px) {
  .top-reason-feature__list li span {
    font-size: 10cqw;
  }
}
.top-reason-feature__list li img {
  width: 50.3%;
  margin-inline: auto;
  align-self: end;
}

.top-voice-section {
  z-index: 1;
  border-radius: 0;
  background-color: var(--gray);
  background-image: radial-gradient(circle, #ffffff 2.5px, transparent 2.5px);
  background-position: 0 0;
  background-size: 27px 27px;
  padding-top: calc(var(--spacing-xl) + var(--radius-xl));
  padding-bottom: calc(var(--spacing-xl) + var(--radius-xl));
}
@media (max-width: 599px) {
  .top-voice-section {
    background-image: radial-gradient(circle, #ffffff 1.25px, transparent 1.25px);
    background-size: 11px 11px;
  }
}
.top-voice-section .top-typo__anim {
  color: #FDFDFD;
}

.top-voice-slider .splide__track {
  padding-bottom: 40px;
}

.top-salon-section {
  z-index: 10;
  background-color: var(--blue-light);
  padding-bottom: calc(var(--spacing-xl) + var(--radius-xl));
  margin-top: calc(-1 * var(--radius-xl));
}
.top-salon-section .top-typo__anim {
  color: #BAEAF8;
}

.top-salon-archive {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--gap-md);
}
@media (max-width: 599px) {
  .top-salon-archive {
    grid-template-columns: 1fr;
  }
}

.top-salon-article a {
  position: relative;
  height: 100%;
  display: grid;
  grid-template-columns: max-content 1fr max-content;
  align-items: center;
  gap: 10px;
  border-radius: var(--radius-sm);
  border: 2px solid var(--border-primary);
  background-color: var(--white);
  box-shadow: var(--shadow-secondary);
  overflow: hidden;
  padding: clamp(2rem, 1.49rem + 2.105vw, 3rem) clamp(0.875rem, 0.55rem + 1.316vw, 1.5rem) clamp(0.875rem, 0.43rem + 1.842vw, 1.75rem);
  transition: var(--transition-btn);
}
.top-salon-article a:focus-visible {
  opacity: 0.8;
  translate: var(--shadow-size) var(--shadow-size);
  box-shadow: var(--shadow-secondary-none);
}
@media (any-hover: hover) {
  .top-salon-article a:hover {
    opacity: 0.8;
    translate: var(--shadow-size) var(--shadow-size);
    box-shadow: var(--shadow-secondary-none);
  }
}
.top-salon-article a::before {
  content: "";
  display: block;
  width: 0.75em;
}
.top-salon-article a::after {
  content: "";
  display: block;
  width: 0.75em;
  height: auto;
  -webkit-mask-image: var(--icon-arrow-right);
          mask-image: var(--icon-arrow-right);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-size: contain;
          mask-size: contain;
  aspect-ratio: 12/11;
  background-color: var(--black);
}

.top-salon-article__cat {
  position: absolute;
  top: -1px;
  left: 50%;
  translate: -50% 0;
  z-index: 10;
}
.top-salon-article__cat dd {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  background-color: var(--yellow-light);
  border: 1px solid var(--border-primary);
  border-bottom-left-radius: var(--radius-sm);
  border-bottom-right-radius: var(--radius-sm);
  font-size: clamp(0.625rem, 0.43rem + 0.789vw, 1rem);
  font-weight: var(--weight-bold);
  padding: 0.2em 1.7em 0.3em;
}

.top-salon-article__title {
  font-size: clamp(0.9375rem, 0.78rem + 0.658vw, 1.25rem);
  font-weight: var(--weight-bold);
  text-align: center;
}

.top-salon-article__address dd {
  font-size: clamp(0.6875rem, 0.59rem + 0.395vw, 0.875rem);
  text-align: center;
  color: var(--black-dark);
  margin-top: 0.7em;
}

.top-column-section {
  z-index: 20;
  background-color: var(--white);
  margin-top: calc(-1 * var(--radius-xl));
}

@media (max-width: 599px) {
  .top-column-slider > .u-wrapper {
    padding-left: 0;
    padding-right: 0;
  }
}
.top-column-slider .splide__slide {
  padding-right: var(--shadow-size);
  padding-bottom: var(--shadow-size);
}
.top-column-slider .splide__arrows .u-wrapper {
  padding: 0;
}
@media (max-width: 599px) {
  .top-column-slider .splide__arrows .u-wrapper {
    padding-right: var(--spacing-gutter);
  }
}

.top-contact-section {
  padding-top: 0;
  padding-bottom: 0;
  overflow: hidden;
}

.top-contact-fg {
  position: absolute;
  inset: 0;
  padding-bottom: var(--radius-xl);
}
.top-contact-fg > .u-wrapper {
  width: 100%;
  height: 100%;
}

.top-contact-fg__inner {
  position: relative;
  max-width: 1920px;
  margin-inline: auto;
  width: 100%;
  height: 100%;
  padding-left: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
@media (max-width: 599px) {
  .top-contact-fg__inner {
    padding: 18% var(--spacing-gutter) 0;
    justify-content: flex-start;
  }
}
.top-contact-fg__inner h2 {
  position: relative;
  z-index: 100;
  font-size: clamp(0.875rem, 0.55rem + 1.316vw, 1.5rem);
  font-weight: var(--weight-bold);
  line-height: var(--line-height-relaxed);
  color: var(--white);
  margin-bottom: 1.5em;
}
@media (max-width: 599px) {
  .top-contact-fg__inner h2 {
    text-align: center;
  }
}
.top-contact-fg__inner a {
  position: relative;
}
@media (max-width: 599px) {
  .top-contact-fg__inner a {
    width: calc(100% - var(--spacing-gutter) * 2);
    position: absolute;
    bottom: 0;
    left: 50%;
    translate: -50% 50%;
    z-index: 100;
  }
}

.top-contact-bg {
  padding-bottom: var(--radius-xl);
  background-color: #F7C2CB;
}
.top-contact-bg img {
  max-width: 1920px;
  margin-inline: auto;
  width: 100%;
}

.p-breadcrumb {
  padding-top: 12px;
}
@media (max-width: 979px) {
  .p-breadcrumb > .u-wrapper {
    padding: 0;
  }
}

.p-breadcrumb__inner {
  overflow-x: auto;
  background-color: var(--gray-white);
  border-radius: var(--radius-full);
  padding: 11px 32px;
}
@media (max-width: 979px) {
  .p-breadcrumb__inner {
    border-radius: 0;
    padding: 10px 15px;
  }
}
.p-breadcrumb__inner ol {
  width: -moz-max-content;
  width: max-content;
  min-width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.2em 0;
}
.p-breadcrumb__inner li {
  font-size: clamp(0.625rem, 0.56rem + 0.263vw, 0.75rem);
  white-space: nowrap;
}
.p-breadcrumb__inner span {
  color: var(--gray-dark);
}
.p-breadcrumb__inner a {
  color: var(--pink);
  text-decoration: underline;
  text-underline-offset: 0.1em;
}
.p-breadcrumb__inner a:focus-visible {
  text-decoration: none;
}
@media (any-hover: hover) {
  .p-breadcrumb__inner a:hover {
    text-decoration: none;
  }
}
.p-breadcrumb__inner a > span {
  color: var(--pink);
}
.p-breadcrumb__inner li:not(:first-child)::before {
  content: "＞";
  display: inline-block;
  font-size: 1em;
  color: var(--gray-dark);
  margin: 0 1em;
}

.p-pagination {
  margin-top: clamp(2.75rem, 1.6rem + 4.737vw, 5rem);
}

.pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 clamp(0.25rem, -0.01rem + 1.053vw, 0.75rem);
}

.pagination__item .page-numbers {
  display: grid;
  place-content: center;
  width: 2em;
  aspect-ratio: 1/1;
  font-family: var(--family-secondary);
  font-weight: var(--weight-secondary-medium);
  line-height: 1;
  border-radius: 50%;
}
.pagination__item a.page-numbers {
  transition: background-color 0.2s ease-in;
}
.pagination__item a.page-numbers:focus-visible {
  background-color: var(--pink-light);
}
@media (any-hover: hover) {
  .pagination__item a.page-numbers:hover {
    background-color: var(--pink-light);
  }
}
.pagination__item .current {
  background-color: var(--pink-light);
}
.pagination__item.next a, .pagination__item.prev a {
  width: 2em;
  aspect-ratio: 1/1;
  display: grid;
  place-content: center;
  transition: opacity 0.2s ease-in-out;
}
.pagination__item.next a:focus-visible, .pagination__item.prev a:focus-visible {
  opacity: 0.7;
}
@media (any-hover: hover) {
  .pagination__item.next a:hover, .pagination__item.prev a:hover {
    opacity: 0.7;
  }
}
.pagination__item.next a::before, .pagination__item.prev a::before {
  content: "";
  display: inline-block;
  width: 0.8em;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-size: contain;
          mask-size: contain;
  aspect-ratio: 12/18;
  background-color: var(--black);
}
.pagination__item.next {
  margin-left: 1em;
}
.pagination__item.next a::before {
  -webkit-mask-image: var(--icon-next);
          mask-image: var(--icon-next);
}
.pagination__item.prev {
  margin-right: 1em;
}
.pagination__item.prev a::before {
  -webkit-mask-image: var(--icon-prev);
          mask-image: var(--icon-prev);
}

.p-header {
  padding-top: clamp(2.5rem, 1.47rem + 4.211vw, 4.5rem);
  padding-bottom: clamp(2.5rem, 1.86rem + 2.632vw, 3.75rem);
}
.p-header hgroup {
  text-align: center;
}
.p-header h1 {
  font-size: clamp(1.5rem, 0.99rem + 2.105vw, 2.5rem);
  font-weight: var(--weight-bold);
  letter-spacing: 0.05em;
}
.p-header p {
  font-family: var(--family-secondary);
  font-size: clamp(0.75rem, 0.56rem + 0.789vw, 1.125rem);
  font-weight: var(--weight-secondary-bold);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 0.5em;
}
.p-header p::before {
  content: "";
  display: block;
  margin-inline: auto;
  aspect-ratio: 22/31;
  width: clamp(1rem, 0.81rem + 0.789vw, 1.375rem);
  background-image: url("../img/common/logo_mark.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-bottom: 0.8em;
}

.p-section {
  padding-top: var(--spacing-lg);
  padding-bottom: var(--spacing-lg);
  background-color: var(--white);
  border-top-left-radius: var(--radius-xl);
  border-top-right-radius: var(--radius-xl);
}
.p-section--pb-lg {
  padding-bottom: calc(var(--spacing-lg) + var(--radius-xl));
}
.p-section--pb-lg + .p-section {
  margin-top: calc(-1 * var(--radius-xl));
}
.p-section--pink {
  background-color: var(--pink-white);
}
.p-section--gray {
  background-color: var(--gray);
}
.p-section--radius {
  border-radius: var(--radius-xl);
}

.p-content {
  padding-bottom: var(--spacing-lg);
}

.p-more {
  margin-top: clamp(2.25rem, 1.48rem + 3.158vw, 3.75rem);
}
.p-more a {
  margin-inline: auto;
}

.p-details {
  border: 2px solid var(--border-primary);
  border-radius: var(--radius-sm);
  background-color: var(--gray-white);
}
.p-details + .p-details {
  margin-top: clamp(1.125rem, 0.55rem + 2.368vw, 2.25rem);
}
.p-details summary {
  position: relative;
  display: grid;
  align-items: center;
  grid-template-columns: max-content 1fr max-content;
  gap: var(--gap-sm);
  font-size: clamp(0.875rem, 0.75rem + 0.526vw, 1.125rem);
  cursor: pointer;
  padding: clamp(1rem, 0.23rem + 3.158vw, 2.5rem) clamp(0.875rem, -0.22rem + 4.474vw, 3rem);
  background-color: var(--white);
  border-radius: var(--radius-sm);
}
.p-details summary::before {
  content: "Q";
  display: inline-block;
  font-size: clamp(1.25rem, 0.93rem + 1.316vw, 1.875rem);
  font-family: var(--family-secondary);
  font-weight: var(--weight-secondary-bold);
  line-height: 1;
  color: var(--pink);
  translate: 0 -0.1em;
}
.p-details summary span {
  position: relative;
  display: block;
  width: clamp(1.25rem, 0.93rem + 1.316vw, 1.875rem);
  aspect-ratio: 1/1;
  border-radius: 50%;
  border: 2px solid var(--black);
}
.p-details summary span::before, .p-details summary span::after {
  content: "";
  display: block;
  background-color: var(--black);
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
}
.p-details summary span::after {
  width: 50%;
  height: 2px;
}
.p-details summary span::before {
  width: 2px;
  height: 50%;
}
.p-details summary::-webkit-details-marker {
  display: none;
}
.p-details[open] summary span::before {
  opacity: 0;
}

.p-details-answer {
  overflow: hidden;
}

.p-details-answer__inner {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: var(--gap-sm);
  padding: clamp(1.125rem, 0.68rem + 1.842vw, 2rem) clamp(1.25rem, 0.35rem + 3.684vw, 3rem);
}
.p-details-answer__inner::before {
  content: "A";
  display: inline-block;
  font-size: clamp(1.25rem, 0.93rem + 1.316vw, 1.875rem);
  font-family: var(--family-secondary);
  font-weight: var(--weight-secondary-bold);
  line-height: 1;
  color: var(--black);
}
.p-details-answer__inner p {
  font-size: clamp(0.8125rem, 0.72rem + 0.395vw, 1rem);
  line-height: var(--line-height-normal);
}
.p-details-answer__inner p + p {
  margin-top: 1.5em;
}
.p-details-answer__inner a {
  text-decoration: underline;
  text-underline-offset: 0.1em;
}
.p-details-answer__inner a:focus-visible {
  text-decoration: none;
}
@media (any-hover: hover) {
  .p-details-answer__inner a:hover {
    text-decoration: none;
  }
}

.p-form-headline {
  font-size: clamp(0.875rem, 0.75rem + 0.526vw, 1.125rem);
  font-weight: var(--weight-medium);
  margin-bottom: clamp(1.75rem, 1.11rem + 2.632vw, 3rem);
  text-align: center;
}

.p-form-lead {
  font-size: clamp(0.75rem, 0.62rem + 0.526vw, 1rem);
  line-height: var(--line-height-normal);
  margin-bottom: clamp(2rem, 1.74rem + 1.053vw, 2.5rem);
  text-align: center;
}
@media (max-width: 599px) {
  .p-form-lead {
    text-align: left;
  }
}

.p-form h4 {
  display: grid;
  align-items: center;
  grid-template-columns: 1fr max-content 1fr;
  gap: 1em;
  font-size: clamp(1.0625rem, 0.97rem + 0.395vw, 1.25rem);
  font-weight: var(--weight-bold);
  text-align: center;
  margin-bottom: 2em;
  margin-top: 2.5em;
}
.p-form h4::before, .p-form h4::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background-color: var(--border-secondary);
}
.p-form fieldset + fieldset {
  margin-top: clamp(1.75rem, 1.49rem + 1.053vw, 2.25rem);
}
.p-form legend {
  display: flex;
  align-items: center;
  gap: 0.6em;
  font-weight: var(--weight-bold);
  margin-bottom: 0.8em;
}
.p-form legend span {
  display: inline-block;
  font-size: clamp(0.6875rem, 0.59rem + 0.395vw, 0.875rem);
  font-weight: var(--weight-regular);
  text-align: center;
  color: var(--white);
  border-radius: var(--radius-full);
  padding: 0 1em 0.1em;
  background-color: var(--gray-dark);
}
@media (max-width: 599px) {
  .p-form legend span {
    translate: 0 0.1em;
  }
}
.p-form legend .must {
  background-color: var(--pink);
}
.p-form input[type=text],
.p-form input[type=email],
.p-form input[type=tel],
.p-form textarea {
  width: 100%;
  border: 2px solid var(--border-primary);
  border-radius: var(--radius-xs);
  padding: 1.25em 1em;
  font-size: 1rem;
  line-height: var(--line-height-normal);
}
.p-form input[type=text]::-moz-placeholder, .p-form input[type=email]::-moz-placeholder, .p-form input[type=tel]::-moz-placeholder, .p-form textarea::-moz-placeholder {
  font-size: clamp(0.875rem, 0.81rem + 0.263vw, 1rem);
  color: var(--gray-placeholder);
}
.p-form input[type=text]::placeholder,
.p-form input[type=email]::placeholder,
.p-form input[type=tel]::placeholder,
.p-form textarea::placeholder {
  font-size: clamp(0.875rem, 0.81rem + 0.263vw, 1rem);
  color: var(--gray-placeholder);
}
.p-form input[type=text]:focus,
.p-form input[type=email]:focus,
.p-form input[type=tel]:focus,
.p-form textarea:focus {
  background-color: #fffce4;
}
@media (max-width: 599px) {
  .p-form input[type=text],
  .p-form input[type=email],
  .p-form input[type=tel],
  .p-form textarea {
    padding: 0.8em 1em;
  }
}
.p-form textarea {
  display: block;
  min-height: 200px;
  resize: vertical;
}
.p-form label {
  display: flex;
  align-items: center;
  gap: 0.45em;
  cursor: pointer;
}
.p-form label img {
  width: 100%;
  border: 2px solid var(--border-primary);
  border-radius: var(--radius-sm);
  margin-bottom: 0.5em;
}
@media (max-width: 599px) {
  .p-form label img {
    margin-bottom: 0.2em;
  }
}
.p-form input[type=radio] {
  display: grid;
  place-content: center;
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  border: 1px solid var(--border-secondary);
  border-radius: 50%;
  background-color: var(--white);
  margin: 0;
  padding: 0;
  cursor: pointer;
}
.p-form input[type=radio]::after {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  background-color: var(--blue);
  border-radius: 50%;
  opacity: 0;
}
.p-form input[type=radio]:checked::after {
  opacity: 1;
}
.p-form input[type=checkbox] {
  display: grid;
  place-content: center;
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  width: 17px;
  height: 17px;
  border: 1px solid var(--border-secondary);
  border-radius: 3px;
  background-color: var(--white);
  margin: 0;
  padding: 0;
  cursor: pointer;
  background-image: url("../img/common/check.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px;
}
.p-form input[type=checkbox]:checked {
  background-color: var(--blue);
}
.p-form label:has(input[type=checkbox]:checked) img {
  border-color: var(--blue);
}
.p-form .grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--gap-md);
}
@media (max-width: 979px) {
  .p-form .grid {
    grid-template-columns: repeat(3, 1fr);
    gap: calc(var(--gap-md) * 1.5) var(--gap-md);
  }
}
@media (max-width: 599px) {
  .p-form .grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
.p-form .grid label {
  flex-wrap: wrap;
  font-weight: var(--weight-bold);
}
.p-form .grid--full {
  grid-template-columns: 1fr;
}
.p-form .grid--full div {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--gap-md);
}
@media (max-width: 979px) {
  .p-form .grid--full div {
    grid-template-columns: repeat(3, 1fr);
    gap: calc(var(--gap-md) * 1.5) var(--gap-md);
  }
}
.p-form .notice {
  font-size: clamp(0.75rem, 0.62rem + 0.526vw, 1rem);
  line-height: var(--line-height-normal);
  margin-top: 3.5em;
  margin-bottom: 2em;
}
.p-form .confirm {
  font-size: clamp(0.75rem, 0.69rem + 0.263vw, 0.875rem);
  text-align: center;
  margin-top: 20px;
}
.p-form .confirm a {
  color: var(--black);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.p-form .confirm a:focus-visible {
  text-decoration: none;
}
@media (any-hover: hover) {
  .p-form .confirm a:hover {
    text-decoration: none;
  }
}
.p-form .confirm--sm {
  margin-top: 0.8em;
  font-size: clamp(0.625rem, 0.56rem + 0.263vw, 0.75rem);
}
.p-form .submit {
  margin-top: clamp(2.5rem, 2.18rem + 1.316vw, 3.125rem);
  width: 100%;
  max-width: 300px;
  margin-inline: auto;
  position: relative;
}
.p-form .submit::after {
  position: absolute;
  top: 50%;
  right: 24px;
  translate: 0 -50%;
  z-index: 10;
  content: "";
  display: inline-block;
  width: 0.75em;
  -webkit-mask-image: var(--icon-arrow-right);
          mask-image: var(--icon-arrow-right);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-size: contain;
          mask-size: contain;
  aspect-ratio: 11/12;
  background-color: var(--white);
}
.p-form .submit input[type=submit] {
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  border: none;
  margin: 0;
  width: 100%;
  display: block;
  color: var(--white);
  font-weight: var(--weight-bold);
  text-align: center;
  border-radius: var(--radius-full);
  background-color: var(--black);
  box-shadow: var(--shadow-primary);
  padding: 1.44em 1.5em;
  transition: opacity 0.2s ease-in-out;
}
.p-form .submit input[type=submit]:focus-visible {
  opacity: 0.7;
}
@media (any-hover: hover) {
  .p-form .submit input[type=submit]:hover {
    opacity: 0.7;
  }
}
.p-form .submit .wpcf7-spinner {
  position: absolute;
  top: 50%;
  left: 24px;
  margin: 0;
  translate: 0 -50%;
}
.p-form input[aria-invalid=true] {
  border-color: var(--red);
}
.p-form .wpcf7-form-control-wrap + .wpcf7-form-control-wrap {
  display: block;
  margin-top: 24px;
}
.p-form .wpcf7-list-item {
  margin: 0;
}
.p-form .wpcf7-not-valid-tip {
  color: var(--red);
  font-size: 0.875rem;
  margin-top: 0.3em;
}
.p-form .wpcf7-radio {
  display: flex;
  flex-wrap: wrap;
  gap: 1em 1.4em;
  margin-top: 0.4em;
}
.p-form .wpcf7-checkbox {
  display: flex;
  flex-wrap: wrap;
  gap: 1em 2.5em;
  margin-top: 0.4em;
}
.p-form .fieldset-custom .wpcf7-checkbox {
  margin-top: 0;
}
.p-form .fieldset-custom .wpcf7-list-item {
  display: flex;
  align-items: center;
  gap: 0.45em;
}
.p-form .fieldset-custom .wpcf7-list-item span {
  font-size: clamp(0.875rem, 0.81rem + 0.263vw, 1rem);
}

.using-mouse .p-form input:focus-visible, .using-mouse .p-form textarea:focus-visible {
  outline: none;
}

.p-slider .splide__arrows {
  width: 100%;
  position: absolute;
  top: calc(-1 * clamp(4rem, 2.97rem + 4.211vw, 6rem));
  right: 0;
}
.p-slider .splide__arrows > .u-wrapper {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(0.625rem, 0.46rem + 0.658vw, 0.9375rem);
}
.p-slider .splide__arrow {
  width: clamp(2.1875rem, 2.03rem + 0.658vw, 2.5rem);
  height: auto;
  aspect-ratio: 1/1;
  transform: none;
  position: relative;
  z-index: 10;
  top: auto;
  bottom: auto;
  left: auto;
  right: auto;
  background: var(--white);
  border: 1px solid var(--border-primary);
  border-radius: 50%;
  opacity: 1;
  transition: opacity 0.2s ease-in-out;
}
.p-slider .splide__arrow:focus-visible {
  opacity: 0.7;
}
@media (any-hover: hover) {
  .p-slider .splide__arrow:hover {
    opacity: 0.7;
  }
}
.p-slider .splide__arrow::before {
  content: "";
  display: inline-block;
  width: 0.75em;
  -webkit-mask-image: var(--icon-arrow-right);
          mask-image: var(--icon-arrow-right);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-size: contain;
          mask-size: contain;
  aspect-ratio: 11/12;
  background-color: var(--black);
}
.p-slider .splide__arrow--next::before {
  -webkit-mask-image: var(--icon-arrow-right);
          mask-image: var(--icon-arrow-right);
}
.p-slider .splide__arrow--prev::before {
  -webkit-mask-image: var(--icon-arrow-left);
          mask-image: var(--icon-arrow-left);
}
.p-slider .splide:not(.is-overflow) .splide__list {
  justify-content: center;
}
.p-slider .splide:not(.is-overflow) .splide__slide:last-child {
  margin: 0 !important;
}

.error-content {
  text-align: center;
}
.error-content h2 {
  font-size: 1.25rem;
  font-weight: var(--weight-bold);
  margin-bottom: 1em;
}
.error-content p {
  text-align: center;
  line-height: var(--line-height-normal);
}
.error-content .c-btn-round {
  margin-inline: auto;
  margin-top: 2em;
}

h1.wp-block-heading {
  font-size: var(--wp--preset--font-size--xxl);
  margin-block-start: 2em;
  margin-block-end: 2em;
}

h2.wp-block-heading {
  font-size: var(--wp--preset--font-size--xl);
  margin-block-start: 2em;
  margin-block-end: 2em;
}

h3.wp-block-heading {
  font-size: var(--wp--preset--font-size--md);
  margin-block-start: 2em;
  margin-block-end: 2em;
}

:where(ol.wp-block-list) {
  list-style: decimal;
}

:where(ul.wp-block-list) {
  list-style: disc;
}

.wp-block-post-content {
  font-weight: var(--weight-medium);
  line-height: var(--line-height-normal);
}
.wp-block-post-content img {
  display: inline;
}
/*# sourceMappingURL=style.css.map */