@charset "UTF-8";
@font-face {
  font-family: "Local Noto Sans JP";
  src: local("Noto Sans JP");
}
@font-face {
  font-family: "Local Roboto";
  src: local("Roboto Black"), local("Roboto");
}
:root {
  /* inner */
  --inner: min(1200px, 100%);
  --inner-sp: min(500px, 100%);
  --padding-inner: 50px;
  --padding-inner-sp:calc(20 / 16 * 1rem);
  --inner-narrow: min(1100px, 100%);
  /* z-index */
  --z-index-header: 900;
  /* color */
  --color-white: #fff;
  --color-black: #000;
  --color-text: #333;
  --color-text-purple: #57398f;
  --color-border-gray: #aaaaaf;
  --color-red: #c03;
  --color-blue: #307dcf;
  --color-green: #3ca595;
  --color-brown: #7e664d;
  --color-gold: #a78c5c;
  --color-gray: #565656;
  --color-gray-light: #d9d9d9;
  --color-gray-pale: #f3f2f2;
  --color-bg-cream: #f8f5ed;
  --color-bg-beige: #f3eada;
  --color-beige: #ebdfd2;
  --color-beige-dark: #ded7cb;
  --color-tan: #cec1b3;
  --color-off-white: #fbf9f4;
  /* font-weight */
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semi-bold: 600;
  --fw-bold: 700;
  --fw-extra-bold: 800;
  --fw-black: 900;
  /* font-family */
  --base-font-family: "Local Noto Sans JP", "Noto Sans JP", sans-serif;
  --en-font-family: "futura-pt", sans-serif;
  --en-font-family-bold: "futura-pt-bold", sans-serif;
  --mochiy-pop-one: "Mochiy Pop One", sans-serif;
  --caveat-font-family: "Caveat", sans-serif;
  --roboto-font-family: "Local Roboto", "Roboto", sans-serif;
  --bg-cover: center center / cover no-repeat;
  --bg-cover-top: top center / cover no-repeat;
  --bg-contain: center center / contain no-repeat;
  /* font-size */
  --font-size-18: calc(18 / 16 * 1rem);
  --font-size-19: calc(19 / 16 * 1rem);
  --font-size-20: calc(20 / 16 * 1rem);
  --font-size-22: calc(22 / 16 * 1rem);
  --font-size-24: calc(24 / 16 * 1rem);
  --font-size-32: calc(32 / 16 * 1rem);
  --font-size-40: calc(40 / 16 * 1rem);
  --font-size-48: calc(48 / 16 * 1rem);
  --font-size-52: calc(52 / 16 * 1rem);
  --font-size-115: calc(115 / 16 * 1rem);
  --font-size-129: calc(129 / 16 * 1rem);
  --font-size-180: calc(180 / 16 * 1rem);
  /* transition duration */
  --duration: 0.3s;
  /* header height */
  --header-height: 100px;
}
@media screen and (max-width: 767px) {
  :root {
    --header-height: calc(60 / 375 * 100vw);
  }
}
@media screen and (width <= 1440px) {
  :root {
    --header-height: calc(100 / 1440 * 100vw);
  }
}
@media screen and (max-width: 767px) {
  :root {
    --font-size-18: calc(17 / 16 * 1rem);
    --font-size-19: calc(17 / 16 * 1rem);
    --font-size-20: calc(18 / 16 * 1rem);
    --font-size-22: calc(18 / 16 * 1rem);
    --font-size-24: calc(20 / 16 * 1rem);
    --font-size-32: calc(26 / 16 * 1rem);
    --font-size-40: calc(32 / 16 * 1rem);
    --font-size-48: calc(38 / 16 * 1rem);
    --font-size-52: calc(42 / 16 * 1rem);
    --font-size-115: calc(70 / 16 * 1rem);
    --font-size-129: calc(78 / 16 * 1rem);
    --font-size-180: calc(90 / 16 * 1rem);
    --header-height: calc(60 / 16 * 1rem);
  }
}

html {
  font-size: 16px;
}
@media screen and (width <= 1440px) {
  html {
    font-size: calc(100vw / 1440 * 16);
  }
}
@media screen and (max-width: 767px) {
  html {
    font-size: calc(100vw / 375 * 16);
  }
}

a[href^=tel] {
  text-decoration: none;
  cursor: default;
  pointer-events: none;
}
@media screen and (max-width: 767px) {
  a[href^=tel] {
    cursor: pointer;
    pointer-events: auto;
  }
}

a {
  color: inherit;
  -webkit-tap-highlight-color: transparent;
  /* 強調をなくす */
}

a:hover {
  text-decoration: none;
}

img,
svg {
  vertical-align: middle;
}

img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

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

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

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

input[type=text] {
  font-size: 1rem;
  /* = 16px */
}

textarea {
  field-sizing: content;
}

body {
  background: var(--color-white);
  color: var(--color-text);
  font-family: var(--base-font-family);
  font-size: 1rem;
  font-weight: var(--fw-medium);
  line-height: 1.6;
}

html {
  box-sizing: border-box;
  /* Prevent adjustments of font size after orientation changes in iOS */
  word-break: normal;
  -webkit-text-size-adjust: 100%;
          text-size-adjust: 100%;
  tab-size: 4;
}

*,
::before,
::after {
  /* Set `background-repeat: no-repeat` to all elements and pseudo elements */
  box-sizing: inherit;
  box-sizing: border-box;
  background-repeat: no-repeat;
}

::before,
::after {
  /* Inherit text-decoration and vertical align to ::before and ::after pseudo elements */
  vertical-align: inherit;
  text-decoration: inherit;
}

* {
  /* Reset `padding` and `margin` of all elements */
  margin-block: 0;
  margin-inline: 0;
  padding-block: 0;
  padding-inline: 0;
}

/* # =================================================================
     # General elements
     # ================================================================= */
hr {
  overflow: visible;
  /* Show the overflow in Edge and IE */
  height: 0;
  /* Add the correct box sizing in Firefox */
  color: inherit;
  /* Correct border color in Firefox. */
}

details,
main {
  display: block;
  /* Render the `main` element consistently in IE. */
}

summary {
  display: list-item;
  /* Add the correct display in all browsers */
}

small {
  font-size: 80%;
  /* Set font-size to 80% in `small` elements */
}

[hidden] {
  display: none;
  /* Add the correct display in IE */
}

abbr[title] {
  border-bottom: none;
  /* Remove the bottom border in Chrome 57 */
  /* Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari */
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

a {
  background-color: transparent;
  color: inherit;
  text-decoration: none;
  transition: opacity 0.3s;
  /* Remove the gray background on active links in IE 10 */
}

a:active,
a:hover {
  outline-width: 0;
  /* Remove the outline when hovering in all browsers */
}

code,
kbd,
pre,
samp {
  font-family: monospace;
  /* Specify the font family of code elements */
}

pre {
  font-size: 1em;
  /* Correct the odd `em` font sizing in all browsers */
}

b,
strong {
  font-weight: bolder;
  /* Add the correct font weight in Chrome, Edge, and Safari */
}

/* https://gist.github.com/unruthless/413930 */
sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

table {
  border-color: inherit;
  /* Correct border color in all Chrome, Edge, and Safari. */
  text-indent: 0;
  /* Remove text indentation in Chrome, Edge, and Safari */
}

iframe {
  border-style: none;
}

/* # =================================================================
     # Forms
     # ================================================================= */
input {
  border-radius: 0;
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
  /* Correct the cursor style of increment and decrement buttons in Chrome */
}

[type=search] {
  /* Correct the odd appearance in Chrome and Safari */
  outline-offset: -2px;
  appearance: textfield;
  appearance: none;
  /* Correct the outline style in Safari */
}

[type=search]::-webkit-search-decoration {
  appearance: none;
  /* Remove the inner padding in Chrome and Safari on macOS */
}

textarea {
  overflow: auto;
  resize: vertical;
}

button,
input,
optgroup,
select,
textarea {
  font: inherit;
  /* Specify font inheritance of form elements */
}

optgroup {
  font-weight: bold;
  /* Restore the font weight unset by the previous rule */
}

button {
  overflow: visible;
  /* Address `overflow` set to `hidden` in IE 8/9/10/11 */
}

button,
select {
  text-transform: none;
  /* Firefox 40+, Internet Explorer 11- */
}

/* Apply cursor pointer to button elements */
button,
[type=button],
[type=reset],
[type=submit],
[role=button] {
  cursor: pointer;
}

/* Remove inner padding and border in Firefox 4+ */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  padding-block: 0;
  padding-inline: 0;
  border-style: none;
}

/* Replace focus style removed in the border reset above */
button:-moz-focusring,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  outline: 1px dotted ButtonText;
}

button,
html [type=button],
[type=reset],
[type=submit] {
  appearance: button;
  /* Correct the inability to style clickable types in iOS */
}

button,
input,
select,
textarea {
  border-style: none;
  background-color: transparent;
  appearance: none;
}

a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus {
  outline-width: 0;
}

/* Style select like a standard input */
select {
  appearance: none;
}

select::-ms-expand {
  display: none;
  /* Internet Explorer 11+ */
}

select::-ms-value {
  color: currentcolor;
  /* Internet Explorer 11+ */
}

legend {
  /* Correct the color inheritance from `fieldset` elements in IE */
  display: table;
  /* Correct the text wrapping in Edge and IE */
  /* Correct the text wrapping in Edge and IE */
  max-width: 100%;
  border: 0;
  /* Correct `color` not being inherited in IE 8/9/10/11 */
  color: inherit;
  /* Correct the text wrapping in Edge and IE */
  white-space: normal;
  /* Correct the text wrapping in Edge 18- and IE */
}

::-webkit-file-upload-button {
  color: inherit;
  font: inherit;
  /* Correct the inability to style clickable types in iOS and Safari */
  appearance: button;
  /* Change font properties to `inherit` in Chrome and Safari */
}

/* Replace pointer cursor in disabled elements */
[disabled] {
  cursor: default;
}

/* # =================================================================
     # Specify media element style
     # ================================================================= */
img {
  border-style: none;
  /* Remove border when inside `a` element in IE 8/9/10 */
}

/* Add the correct vertical alignment in Chrome, Firefox, and Opera */
progress {
  vertical-align: baseline;
}

/* # =================================================================
     # Accessibility
     # ================================================================= */
/* Specify the progress cursor of updating elements */
[aria-busy=true] {
  cursor: progress;
}

/* Specify the pointer cursor of trigger elements */
[aria-controls] {
  cursor: pointer;
}

/* Specify the unstyled cursor of disabled, not-editable, or otherwise inoperable elements */
[aria-disabled=true] {
  cursor: default;
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
ul,
ol,
figure,
blockquote,
dl,
dd {
  margin-block: 0;
  margin-inline: 0;
}

/* Remove default padding */
ul,
ol {
  padding-block: 0;
  padding-inline: 0;
  list-style: "";
}

.l-header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: var(--z-index-header);
  width: 100%;
}

.l-inner {
  max-width: calc(var(--inner) + var(--padding-inner) * 2);
  margin-inline: auto;
  padding-inline: var(--padding-inner);
}
.l-inner.l-inner--narrow {
  max-width: calc(var(--inner-narrow) + var(--padding-inner) * 2);
}
@media screen and (max-width: 767px) {
  .l-inner {
    max-width: 600px;
    padding-inline: 20px;
  }
  .l-inner.l-inner--narrow {
    max-width: 600px;
    padding-inline: 20px;
  }
}

.c-accordion {
  --_text-color: var(--color-text);
  --_background-default: var(--color-white);
  --_background-interactive: var(--color-gray);
  --_background-opened: var(--color-accent);
  --_text-color-opened: var(--color-white);
  --_duration: 0.2s;
}
.c-accordion::details-content {
  content-visibility: unset;
  display: block grid;
}
@media (prefers-reduced-motion: no-preference) {
  .c-accordion::details-content {
    transition-duration: 300ms;
    transition-property: grid-template-rows;
  }
}
.c-accordion:not([open])::details-content {
  grid-template-rows: 0fr;
}
.c-accordion[open]::details-content {
  grid-template-rows: 1fr;
}

.c-accordion__summary {
  display: block grid;
  grid-template: ". icon"/1fr max-content;
  gap: 1rem;
  align-items: center;
  padding-block: 1rem;
  padding-inline: 1.5rem;
  background-color: var(--_background-default);
  color: var(--_text-color);
  transition: background-color var(--_duration) ease, color var(--_duration) ease;
  transition: opacity var(--duration) ease;
}
.c-accordion__summary::before {
  content: "";
  display: inline-block;
  grid-area: icon;
  width: 1.375rem;
  height: 0.125rem;
  background-color: currentcolor;
}
.c-accordion__summary::after {
  content: "";
  display: inline-block;
  grid-area: icon;
  width: 1.375rem;
  height: 0.125rem;
  background-color: currentcolor;
  rotate: 90deg;
  transition: rotate var(--_duration) ease;
}
.c-accordion__summary:focus-visible {
  background-color: var(--_background-interactive);
  outline: 2px solid currentcolor;
  outline-offset: -2px;
}
@media (any-hover: hover) {
  .c-accordion__summary:hover {
    opacity: 0.8;
  }
}

.c-accordion[open] .c-accordion__summary {
  background-color: var(--_background-opened);
  color: var(--_text-color-opened);
}
.c-accordion[open] .c-accordion__summary::after {
  rotate: 0deg;
}

.c-accordion__contents {
  overflow: hidden;
}

.c-accordion__inner {
  padding-block: 1rem;
  padding-inline: 1.5rem;
}

.c-btn-border {
  display: grid;
  place-items: center;
  width: max-content;
  padding-block: 0.75rem;
  padding-inline: 1.25rem;
  border: 2px solid var(--color-white);
  border-radius: 10px;
  box-shadow: 0 0.25rem 0.75rem 0 rgba(0, 0, 0, 0.25);
  background-color: var(--color-red);
  transition: background-color var(--duration) ease, border-color var(--duration) ease, color var(--duration) ease;
}
@media (any-hover: hover) {
  .c-btn-border:hover {
    background-color: var(--color-white);
    border-color: var(--color-red);
  }
  .c-btn-border:hover .c-btn-border__text {
    color: var(--color-red);
  }
}
.c-btn-border.c-btn-border--fv {
  min-width: 21.75rem;
  min-height: 3.4375rem;
}
.c-btn-border.c-btn-border--fv .c-btn-border__text {
  font-size: 1.125rem;
  line-height: 1.6;
  font-weight: var(--fw-extra-bold);
}
.c-btn-border.c-btn-border--cta {
  min-width: 20rem;
  min-height: 5rem;
}
.c-btn-border.c-btn-border--cta .c-btn-border__text {
  font-size: var(--font-size-20);
  line-height: 1.4;
}
.c-btn-border.c-btn-border--drawer {
  min-width: 18.75rem;
  min-height: 3.75rem;
}
.c-btn-border.c-btn-border--drawer .c-btn-border__text {
  font-size: var(--font-size-18);
  line-height: 1.4;
}
@media screen and (max-width: 767px) {
  .c-btn-border {
    border-radius: 8px;
  }
  .c-btn-border.c-btn-border--fv {
    min-width: 16.25rem;
    min-height: 3.125rem;
  }
  .c-btn-border.c-btn-border--fv .c-btn-border__text {
    font-size: 1rem;
    line-height: 1.1625;
  }
  .c-btn-border.c-btn-border--cta {
    min-width: 18.75rem;
    min-height: 4.375rem;
  }
  .c-btn-border[data-position=left-sp] {
    margin-inline-end: auto;
  }
  .c-btn-border[data-position=center-sp] {
    margin-inline: auto;
  }
  .c-btn-border[data-position=right-sp] {
    margin-inline-start: auto;
  }
}
.c-btn-border[data-position=left] {
  margin-inline-end: auto;
}
.c-btn-border[data-position=center] {
  margin-inline: auto;
}
.c-btn-border[data-position=right] {
  margin-inline-start: auto;
}

.c-btn-border__text {
  color: var(--color-white);
  font-weight: var(--fw-black);
  transition: color var(--duration) ease;
}

.c-btn-more {
  display: inline-flex;
  column-gap: 0.5625rem;
  align-items: center;
}
.c-btn-more.c-btn-more--about {
  column-gap: 0.9375rem;
}

.c-btn-more__text {
  padding-block-end: 0.125rem;
  border-bottom: 0.0625rem solid var(--color-brown);
  color: var(--color-brown);
  font-size: 1rem;
  font-weight: var(--fw-bold);
  line-height: 1.5;
}

.c-btn-more__icon {
  position: relative;
  width: 3.5rem;
  height: 2.53125rem;
}

.c-btn-more__circle {
  position: absolute;
  top: 50%;
  right: 0;
  width: 2.65625rem;
  height: 2.53125rem;
  translate: 0 -50%;
}

.c-btn-more__arrow {
  position: absolute;
  top: 50%;
  left: 0;
  width: 2.75rem;
  height: 0.25rem;
  translate: 0 -50%;
  transition: translate var(--duration) ease;
}

@media (any-hover: hover) {
  .c-btn-more:hover .c-btn-more__arrow {
    translate: 0.375rem -50%;
  }
}
.c-section-deco-title {
  color: var(--color-gold);
  opacity: 0.2;
  font-family: var(--caveat-font-family);
  font-size: var(--font-size-180);
  font-weight: var(--fw-regular);
  line-height: 1;
  rotate: -10.782deg;
}

.c-section-title-en {
  position: relative;
  display: inline-block;
  color: var(--color-red);
  font-family: var(--caveat-font-family);
  font-size: 1.375rem;
  font-weight: var(--fw-bold);
  line-height: 1.6;
}
.c-section-title-en.c-section-title-en--line::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -27.8125rem;
  width: 26.8125rem;
  height: 0.0625rem;
  background-color: currentcolor;
  translate: 0 -50%;
}
.c-section-title-en[data-position=center] {
  text-align: center;
}
.c-section-title-en[data-position=left] {
  text-align: left;
}
.c-section-title-en[data-position=right] {
  text-align: right;
}
@media screen and (max-width: 767px) {
  .c-section-title-en.c-section-title-en--line::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -4.125rem;
    width: 3.125rem;
    height: 0.0625rem;
    background-color: currentcolor;
    translate: 0 -50%;
  }
}

.c-swiper-button.swiper-button-prev,
.c-swiper-button.swiper-button-next {
  position: static;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 2.8125rem;
  height: 2.8125rem;
  margin-block-start: 0;
  border-radius: 50%;
  background-color: var(--color-brown);
  color: var(--color-white);
}
.c-swiper-button.swiper-button-prev .swiper-navigation-icon,
.c-swiper-button.swiper-button-next .swiper-navigation-icon {
  width: 0.5625rem;
  height: 0.9375rem;
  transition: translate var(--duration) ease;
}
@media screen and (max-width: 767px) {
  .c-swiper-button.swiper-button-prev,
  .c-swiper-button.swiper-button-next {
    width: 2.5rem;
    height: 2.5rem;
  }
}

.c-swiper-button.swiper-button-prev:hover .swiper-navigation-icon {
  translate: -3px 0;
}

.c-swiper-button.swiper-button-next:hover .swiper-navigation-icon {
  translate: 3px 0;
}

.c-swiper-pagination.swiper-pagination {
  position: static;
  display: flex;
  gap: 0 0.1875rem;
  align-items: center;
  width: auto;
}

.c-swiper-pagination .swiper-pagination-bullet {
  width: 2.1875rem;
  height: 0.125rem;
  margin-block: 0 !important;
  margin-inline: 0 !important;
  border-radius: 0;
  background-color: var(--color-white);
  opacity: 1;
}
@media screen and (max-width: 767px) {
  .c-swiper-pagination .swiper-pagination-bullet {
    width: 1.625rem;
  }
}

.c-swiper-pagination .swiper-pagination-bullet-active {
  background-color: var(--color-red);
}

.c-swiper-pagination.c-swiper-pagination--beige-dark .swiper-pagination-bullet {
  background-color: var(--color-beige-dark);
}
.c-swiper-pagination.c-swiper-pagination--beige-dark .swiper-pagination-bullet-active {
  background-color: var(--color-red);
}

.c-triangle {
  display: inline-block;
  width: 4rem;
  aspect-ratio: 1/1;
  background-color: var(--color-black);
}

.c-triangle[data-direction=top] {
  clip-path: var(--clip-triangle-top);
}

.c-triangle[data-direction=bottom] {
  clip-path: var(--clip-triangle-bottom);
}

.c-triangle[data-direction=left] {
  clip-path: var(--clip-triangle-left);
}

.c-triangle[data-direction=right] {
  clip-path: var(--clip-triangle-right);
}

.c-triangle[data-direction=lower-left] {
  clip-path: var(--clip-triangle-lower-left);
}

.c-triangle[data-direction=upper-left] {
  clip-path: var(--clip-triangle-upper-left);
}

.c-triangle[data-direction=lower-right] {
  clip-path: var(--clip-triangle-lower-right);
}

.c-triangle[data-direction=upper-right] {
  clip-path: var(--clip-triangle-upper-right);
}

.p-bottom-navi__inner {
  max-width: calc(77.5rem + var(--padding-inner) * 2);
  margin-inline: auto;
  padding-inline: var(--padding-inner);
}
@media screen and (max-width: 767px) {
  .p-bottom-navi__inner {
    padding-inline: var(--padding-inner-sp);
  }
}

.p-bottom-navi__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 1.4375rem;
}
@media screen and (max-width: 767px) {
  .p-bottom-navi__list {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 1.25rem;
  }
}

.p-bottom-navi__link {
  display: flex;
  align-items: center;
  overflow: hidden;
  height: 9.375rem;
  border-radius: 10px;
  box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.1);
  background-color: var(--color-white);
}
@media screen and (max-width: 767px) {
  .p-bottom-navi__link {
    height: 7.5rem;
  }
}
@media (any-hover: hover) {
  .p-bottom-navi__link:hover .p-bottom-navi__image img {
    scale: 1.02;
  }
}

.p-bottom-navi__image {
  flex-shrink: 0;
  width: 16.5625rem;
  overflow: hidden;
}
.p-bottom-navi__image img {
  height: auto;
  aspect-ratio: 265/150;
  transition: scale var(--duration) ease;
}
@media screen and (max-width: 767px) {
  .p-bottom-navi__image {
    width: 14.375rem;
  }
}

.p-bottom-navi__label {
  margin-inline-start: -1.25rem;
  font-size: var(--font-size-24);
  font-weight: var(--fw-extra-bold);
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-bottom-navi__label {
    margin-inline-start: -0.625rem;
  }
}

.p-footer-cta {
  position: relative;
  overflow-x: clip;
  padding-block: 8.75rem 5rem;
  background: url("../images/footerCta-bg.webp") var(--bg-cover);
}
@media screen and (max-width: 767px) {
  .p-footer-cta {
    padding-block: 5rem 3.75rem;
  }
}

.p-footer-cta__inner {
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: 2.5rem;
  max-width: 65.375rem;
  margin-inline: auto;
  padding-inline: 1.5rem;
}
@media screen and (max-width: 767px) {
  .p-footer-cta__inner {
    row-gap: 1.5rem;
  }
}

.p-footer-cta__deco {
  position: absolute;
  top: -5.6875rem;
  left: 50%;
  color: var(--color-white);
  opacity: 0.15;
  font-family: var(--caveat-font-family);
  font-size: var(--font-size-115);
  font-weight: var(--fw-regular);
  line-height: 1;
  white-space: nowrap;
  pointer-events: none;
  translate: -51% 0;
}
@media screen and (max-width: 767px) {
  .p-footer-cta__deco {
    top: -3.8125rem;
  }
}

.p-footer-cta__head {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
  align-items: center;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-footer-cta__head {
    row-gap: 0.25rem;
  }
}

.p-footer-cta__title {
  color: var(--color-white);
  font-size: var(--font-size-32);
  font-weight: var(--fw-black);
  line-height: 1.8;
}

.p-footer-cta__lead {
  margin-inline-start: 0.75rem;
  color: var(--color-white);
  line-height: 1.75;
}
@media screen and (max-width: 767px) {
  .p-footer-cta__lead {
    margin-inline-start: 0;
  }
}

.p-footer-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .p-footer-cta__actions {
    row-gap: 1.25rem;
    flex-direction: column-reverse;
  }
}

.p-footer-cta__tel {
  position: relative;
  display: flex;
  flex-direction: column;
  padding-block: 0.3125rem;
  padding-inline-start: 2rem;
  text-align: center;
}
.p-footer-cta__tel::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0.0625rem;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.3);
}
@media screen and (max-width: 767px) {
  .p-footer-cta__tel {
    padding-inline-start: 0;
  }
  .p-footer-cta__tel::before {
    display: none;
  }
}

.p-footer-cta__tel-badge {
  padding-block: 0.25rem 0.375rem;
  padding-inline: 0.75rem 0.3125rem;
  background-color: var(--color-brown);
  color: var(--color-white);
  font-size: 0.875rem;
  font-weight: var(--fw-medium);
  line-height: 1;
}

.p-footer-cta__tel-number {
  display: inline-block;
  margin-block-start: 0.5rem;
  margin-inline-start: 1rem;
  color: var(--color-white);
  font-size: var(--font-size-32);
  font-weight: var(--fw-black);
  line-height: 1;
}

.p-footer-cta__tel-note {
  margin-block-start: 0.3125rem;
  color: var(--color-white);
  font-size: 0.75rem;
  font-weight: var(--fw-medium);
  line-height: 1.33;
}

.p-footer {
  overflow-x: clip;
  padding-block: 3.75rem 1.25rem;
  background-color: var(--color-text);
  color: var(--color-white);
}

.p-footer__inner {
  max-width: calc(77.5rem + var(--padding-inner) * 2);
  margin-inline: auto;
  padding-inline: var(--padding-inner);
}
@media screen and (max-width: 767px) {
  .p-footer__inner {
    padding-inline: var(--padding-inner-sp);
  }
}

.p-footer__top {
  display: flex;
  flex-wrap: wrap;
  gap: 2.5rem 3.75rem;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .p-footer__top {
    flex-direction: column;
  }
}

.p-footer__info {
  display: flex;
  flex-direction: column;
  row-gap: 1.25rem;
}

.p-footer__logo {
  width: fit-content;
  padding-block: 0.3125rem;
  padding-inline: 0.625rem;
  background-color: var(--color-white);
}
.p-footer__logo img {
  display: block;
  width: 10.625rem;
  height: 3rem;
}

.p-footer__address {
  display: flex;
  flex-direction: column;
  row-gap: 0.125rem;
}

.p-footer__company {
  font-size: 0.75rem;
  font-weight: var(--fw-extra-bold);
  line-height: 1.625;
}

.p-footer__address-text {
  font-size: 0.75rem;
  font-weight: var(--fw-medium);
  line-height: 1.625;
}

.p-footer__contact-item {
  font-size: 0.75rem;
  font-weight: var(--fw-medium);
  line-height: 1.625;
}

.p-footer__tel {
  color: var(--color-white);
}

.p-footer__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem 3.75rem;
}
@media screen and (max-width: 767px) {
  .p-footer__nav {
    column-gap: 1.25rem;
    justify-content: space-between;
  }
}

.p-footer__nav-list {
  display: flex;
  flex: 0 0 16.125rem;
  flex-direction: column;
  row-gap: 0.375rem;
}
.p-footer__nav-list:last-child {
  flex: 0 0 17.875rem;
}
@media screen and (max-width: 767px) {
  .p-footer__nav-list {
    flex: 0 0 auto;
  }
  .p-footer__nav-list:last-child {
    flex: 0 0 auto;
  }
}

.p-footer__nav-link {
  color: var(--color-white);
  font-size: 0.875rem;
  font-weight: var(--fw-medium);
  line-height: 1.3928571429;
  transition: color var(--duration) ease;
}
@media (any-hover: hover) {
  .p-footer__nav-link:hover {
    color: var(--color-red);
  }
}

.p-footer__copyright {
  margin-block-start: 3.25rem;
  margin-inline-start: 0.375rem;
  color: var(--color-white);
  font-size: 0.625rem;
  font-weight: var(--fw-medium);
  line-height: 1.6;
}
@media screen and (max-width: 767px) {
  .p-footer__copyright {
    margin-block-start: 2.5rem;
    text-align: center;
  }
}

.p-fv {
  overflow-x: clip;
  margin-block-start: calc(var(--header-height) - 1.25rem);
}
@media screen and (max-width: 767px) {
  .p-fv {
    margin-block-start: var(--header-height);
  }
}

.p-fv__inner {
  position: relative;
  max-width: 123.75rem;
  margin-inline: auto;
}

.p-fv__swiper-container {
  position: relative;
}

.p-fv__swiper-slide picture {
  display: block;
  width: 100%;
  height: 100%;
}
.p-fv__swiper-slide img {
  height: auto;
  aspect-ratio: 1440/770;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .p-fv__swiper-slide img {
    aspect-ratio: 375/588;
  }
}

.p-fv__content {
  position: absolute;
  top: clamp(9.125rem, 0.125rem + 10vw, 12.5rem);
  left: clamp(5.125rem, -4.5416666667rem + 10.7407407407vw, 8.75rem);
  z-index: 2;
}
@media screen and (width <= 1440px) {
  .p-fv__content {
    top: 9.125rem;
    left: 5.125rem;
  }
}
@media screen and (max-width: 767px) {
  .p-fv__content {
    top: 21.125rem;
    left: 0.375rem;
  }
}

.p-fv__content-label {
  display: inline-block;
  margin-inline-start: 1.375rem;
  padding-block: 0.328125rem;
  padding-inline: 1.5625rem;
  border-radius: 20px;
  background: var(--color-brown);
}
@media screen and (max-width: 767px) {
  .p-fv__content-label {
    margin-inline-start: 0.875rem;
    padding-block: 0rem 0.125rem;
    padding-inline: 1rem;
  }
}

.p-fv__content-label-text {
  color: var(--color-white);
  font-size: 1.2366875rem;
  font-weight: var(--fw-extra-bold);
  line-height: 1.3999595694;
}
@media screen and (max-width: 767px) {
  .p-fv__content-label-text {
    font-size: 0.7986875rem;
    line-height: 1.399953048;
  }
}

.p-fv__content-title {
  margin-block-start: 0.9375rem;
}
.p-fv__content-title img {
  width: 33.3125rem;
  height: auto;
  aspect-ratio: 533/145;
}
@media screen and (max-width: 767px) {
  .p-fv__content-title {
    margin-block-start: 0.75rem;
  }
  .p-fv__content-title img {
    width: 21.5rem;
    aspect-ratio: 344/90;
  }
}

.p-fv__content-btn {
  margin-block-start: 2.4375rem;
  margin-inline-start: 3.0625rem;
}
@media screen and (max-width: 767px) {
  .p-fv__content-btn {
    margin-block-start: 1.25rem;
    margin-inline-start: 1.25rem;
  }
}

.p-fv__deco {
  position: absolute;
  right: 5.0625rem;
  bottom: 4.5rem;
  z-index: 2;
  display: flex;
  flex-direction: column;
  rotate: -10.782deg;
}
@media screen and (max-width: 767px) {
  .p-fv__deco {
    right: 1.3125rem;
    bottom: 15rem;
  }
}

.p-fv__deco-text {
  color: var(--color-white);
  font-family: var(--caveat-font-family);
  font-size: 8.0675rem;
  font-weight: var(--fw-regular);
  line-height: 1;
  text-shadow: 0 0 0.90225rem rgba(88, 51, 21, 0.3);
}
.p-fv__deco-text:nth-child(2) {
  margin-inline-start: 11.75rem;
}
@media screen and (max-width: 767px) {
  .p-fv__deco-text {
    text-shadow: 0 0 5.345px rgba(88, 51, 21, 0.3);
    font-size: 2.9871875rem;
    line-height: 100%;
  }
  .p-fv__deco-text:nth-child(2) {
    margin-inline-start: 4.375rem;
  }
}

.p-header {
  background-color: var(--color-white);
}

.p-header__inner {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: var(--header-height);
  max-width: 90rem;
  margin-inline: auto;
  padding-inline: 1.25rem 0.625rem;
}
@media screen and (max-width: 767px) {
  .p-header__inner {
    padding-inline: 1.25rem;
  }
}

.p-header__main {
  display: flex;
  column-gap: 1.25rem;
  align-items: center;
}

.p-header__logo {
  flex-shrink: 0;
  width: 10.625rem;
  line-height: 0;
}
.p-header__logo a {
  display: block;
  transition: opacity var(--duration) ease;
}
@media (any-hover: hover) {
  .p-header__logo a:hover {
    opacity: 0.8;
  }
}
.p-header__logo img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}
@media screen and (max-width: 767px) {
  .p-header__logo {
    width: 6.6875rem;
    height: 1.875rem;
  }
}

.p-header__nav {
  margin-inline-end: 2rem;
}
@media screen and (max-width: 767px) {
  .p-header__nav {
    display: none;
  }
}

.p-header__nav-list {
  display: flex;
  gap: 0 1.5625rem;
  align-items: center;
}

.p-header__nav-link {
  position: relative;
  color: var(--color-text);
  font-size: 1rem;
  font-weight: var(--fw-extra-bold);
  line-height: 1.25;
  transition: color var(--duration) ease, border-color var(--duration) ease;
}
.p-header__nav-link::after {
  content: "";
  position: absolute;
  bottom: -0.25rem;
  left: 0;
  width: 100%;
  height: 0.125rem;
  background-color: var(--color-red);
  opacity: 0;
  transition: opacity var(--duration) ease;
}
@media (any-hover: hover) {
  .p-header__nav-link:hover {
    color: var(--color-red);
  }
  .p-header__nav-link:hover::after {
    opacity: 1;
  }
}

.p-header__tel {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .p-header__tel {
    display: none;
  }
}

.p-header__tel-label {
  font-size: 0.875rem;
  font-weight: var(--fw-extra-bold);
  line-height: 0.7142857143;
}

.p-header__tel-link {
  display: flex;
  column-gap: 0.125rem;
  justify-content: flex-end;
  align-items: center;
}

.p-header__tel-icon {
  flex-shrink: 0;
  width: 1.125rem;
  height: 1.4375rem;
}

.p-header__tel-number {
  font-family: var(--roboto-font-family);
  font-size: 1.625rem;
  font-weight: var(--fw-black);
  line-height: 0.6153846154;
}

.p-header__btn {
  display: flex;
  flex-direction: column;
  row-gap: 0.1875rem;
  justify-content: center;
  align-items: center;
  width: 5.625rem;
  height: 5.625rem;
  border: 0.125rem solid var(--color-white);
  border-radius: 100vmax;
  box-shadow: 0 0.25rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  background-color: var(--color-red);
  transition: background-color var(--duration) ease, border-color var(--duration) ease, color var(--duration) ease;
}
@media (any-hover: hover) {
  .p-header__btn:hover {
    background-color: var(--color-white);
    border-color: var(--color-red);
  }
  .p-header__btn:hover .p-header__btn-icon {
    background-color: var(--color-red);
  }
  .p-header__btn:hover .p-header__btn-text {
    color: var(--color-red);
  }
}
@media screen and (max-width: 767px) {
  .p-header__btn {
    display: none;
  }
}

.p-header__btn-icon {
  display: block;
  flex-shrink: 0;
  width: 1.375rem;
  height: 1.125rem;
  background-color: var(--color-white);
  transition: background-color var(--duration) ease;
  mask-image: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='22'%20height='18'%20viewBox='0%200%2022%2018'%20fill='none'%3e%3cg%20clip-path='url(%23clip0_1116_2215)'%3e%3cpath%20d='M11.5146%2013.5996C11.3643%2013.7114%2011.1866%2013.7684%2011.0067%2013.7684C10.8267%2013.7684%2010.6491%2013.7114%2010.4988%2013.5996L0.0078125%205.74677V17.2193C0.0078125%2017.7485%200.438292%2018.1795%200.966711%2018.1795H21.0489C21.5773%2018.1795%2022.0078%2017.7485%2022.0078%2017.2193V5.74677L11.5146%2013.5996Z'%20fill='white'%20/%3e%3cpath%20d='M11.0071%2011.8617L21.7782%203.79895C21.6028%203.58911%2021.3409%203.45454%2021.0493%203.45454H0.967135C0.673316%203.45454%200.413662%203.59139%200.238281%203.80123L11.0094%2011.8617H11.0071Z'%20fill='white'%20/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_1116_2215'%3e%3crect%20width='22'%20height='18'%20fill='white'%20/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.p-header__btn-text {
  color: var(--color-white);
  font-size: 0.875rem;
  font-weight: var(--fw-extra-bold);
  line-height: 1.4285714286;
  transition: color var(--duration) ease;
}

.p-header__hamburger {
  display: none;
}
@media screen and (max-width: 767px) {
  .p-header__hamburger {
    position: relative;
    display: flex;
    flex-direction: column;
    row-gap: 0.25rem;
    justify-content: center;
    width: 1.625rem;
    height: 0.625rem;
  }
  .p-header__hamburger span {
    display: block;
    width: 1.625rem;
    height: 0.125rem;
    background-color: var(--color-red);
    transition: transform var(--duration) ease, opacity var(--duration) ease;
  }
  .p-header__hamburger.is-open span:nth-child(1) {
    transform: translateY(0.25rem) rotate(35deg);
  }
  .p-header__hamburger.is-open span:nth-child(2) {
    transform: translateY(-0.125rem) rotate(-35deg);
  }
}

.p-header__drawer {
  display: none;
}
@media screen and (max-width: 767px) {
  .p-header__drawer {
    position: fixed;
    top: var(--header-height);
    left: 0;
    display: block;
    overflow-y: auto;
    width: 100%;
    height: calc(100% - var(--header-height));
    padding-block: 1.875rem;
    padding-inline: 1.25rem;
    background-color: var(--color-white);
    transform: translateX(100%);
    transition: transform 0.3s ease;
    z-index: 40;
  }
  .p-header__drawer.is-open {
    transform: translateX(0);
  }
}

.p-header__drawer-list {
  margin-block-start: 1.875rem;
  display: flex;
  flex-direction: column;
  row-gap: 2rem;
  align-items: center;
}

.p-header__drawer-link {
  display: block;
  color: var(--color-text);
  font-size: 1rem;
  font-weight: var(--fw-extra-bold);
  line-height: 1.25;
}

.p-header__drawer-tel {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
  margin-inline: auto;
  margin-block-start: 2.5rem;
  width: fit-content;
}

.p-header__drawer-tel-label {
  font-size: 0.875rem;
  font-weight: var(--fw-extra-bold);
  line-height: 0.7142857143;
}

.p-header__drawer-tel-link {
  display: flex;
  column-gap: 0.125rem;
  justify-content: flex-end;
  align-items: center;
}

.p-header__drawer-tel-icon {
  flex-shrink: 0;
  width: 1.125rem;
  height: 1.4375rem;
}

.p-header__drawer-tel-number {
  font-family: var(--roboto-font-family);
  font-size: 1.625rem;
  font-weight: var(--fw-black);
  line-height: 0.6153846154;
}

.p-header__drawer-btn {
  margin-block-start: 2rem;
}

.p-top-about {
  position: relative;
  overflow-x: clip;
  padding-block: 6.25rem;
}
@media screen and (max-width: 767px) {
  .p-top-about {
    padding-block: 4.125rem;
  }
}

.p-top-about__inner {
  position: relative;
  max-width: 96.25rem;
  margin-inline: auto;
  padding-inline: 3.125rem;
}
.p-top-about__inner::before {
  content: "";
  position: absolute;
  top: 13.125rem;
  left: 19.375rem;
  width: 100%;
  height: 30.5625rem;
  border-radius: 0 0 0 120px;
  background-color: var(--color-bg-cream);
  opacity: 0.6;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .p-top-about__inner {
    padding-inline: var(--padding-inner-sp);
  }
  .p-top-about__inner::before {
    top: 18.75rem;
    left: 2.5rem;
    height: 29.625rem;
    border-radius: 0 0 0 60px;
  }
}

.p-top-about__grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: max-content 1fr;
  column-gap: 4.25rem;
}
@media screen and (max-width: 767px) {
  .p-top-about__grid {
    grid-template-columns: 1fr;
    row-gap: 1.875rem;
  }
}

.p-top-about__visual {
  position: relative;
  width: 36.875rem;
  height: 39.3125rem;
}
@media screen and (max-width: 767px) {
  .p-top-about__visual {
    order: 2;
    width: 100%;
    height: auto;
  }
}

.p-top-about__img {
  overflow: hidden;
  border-radius: 1.25rem;
  box-shadow: 0 0 0.875rem 0 rgba(0, 0, 0, 0.1);
}
.p-top-about__img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-top-about__img--main {
  width: 34.0625rem;
  height: 22.375rem;
}
@media screen and (max-width: 767px) {
  .p-top-about__img--main {
    width: 14.31925rem;
    height: 9.3986875rem;
  }
}

.p-top-about__img--sub {
  position: absolute;
  top: 25.1875rem;
  left: 12.625rem;
  width: 24.25rem;
  height: 14.125rem;
}
@media screen and (max-width: 767px) {
  .p-top-about__img--sub {
    position: relative;
    top: auto;
    left: auto;
    width: 10.20375rem;
    height: 5.9479375rem;
    margin-block-start: 1.25rem;
    margin-inline-start: 7.5rem;
  }
}

.p-top-about__illust {
  position: absolute;
  top: -1.625rem;
  right: 0.5rem;
  z-index: 2;
  width: 27.5rem;
  height: 18.3125rem;
  opacity: 0.6;
}
.p-top-about__illust img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
@media screen and (max-width: 767px) {
  .p-top-about__illust {
    width: 13.0625rem;
    height: 8.75rem;
    top: -3.75rem;
    right: -1.5625rem;
  }
}

.p-top-about__content {
  padding-block-start: 4.375rem;
  padding-inline-end: 10.625rem;
}
@media screen and (max-width: 767px) {
  .p-top-about__content {
    order: 1;
    padding-block-start: 0;
    padding-inline-end: 0;
  }
}

.p-top-about__title {
  margin-block-start: 1.25rem;
  font-size: var(--font-size-32);
  font-weight: var(--fw-extra-bold);
  line-height: 1.6;
}
@media screen and (max-width: 767px) {
  .p-top-about__title {
    margin-block-start: 1rem;
  }
}

.p-top-about__title--gold {
  color: var(--color-gold);
}

.p-top-about__title--gray {
  color: var(--color-gray);
}

.p-top-about__text {
  margin-block-start: 2.625rem;
}
.p-top-about__text p + p {
  margin-block-start: 1.625rem;
}
@media screen and (max-width: 767px) {
  .p-top-about__text {
    margin-block-start: 1.5rem;
  }
}

.p-top-about__btn {
  margin-block-start: 2.0625rem;
  text-align: right;
}
@media screen and (max-width: 767px) {
  .p-top-about__btn {
    margin-block-start: 1.5rem;
  }
}

.p-top-faq {
  position: relative;
  overflow-x: clip;
  padding-block: 7.5rem;
}
.p-top-faq::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 100%;
  border-radius: 120px 120px 0 0;
  background-color: var(--color-bg-cream);
  opacity: 0.6;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .p-top-faq {
    padding-block: 5rem 3.75rem;
  }
  .p-top-faq::before {
    border-radius: 60px 60px 0 0;
  }
}

.p-top-faq__illust {
  position: absolute;
  top: -17.875rem;
  left: -15.875rem;
  z-index: 2;
  width: 35.0625rem;
  height: 23.375rem;
  opacity: 0.6;
  pointer-events: none;
}
.p-top-faq__illust img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
@media screen and (max-width: 767px) {
  .p-top-faq__illust {
    width: 20rem;
    height: auto;
    top: -160px;
    left: -104px;
    aspect-ratio: 561/374;
  }
}

.p-top-faq__inner {
  position: relative;
  max-width: calc(50rem + var(--padding-inner) * 2);
  margin-inline: auto;
  padding-inline: var(--padding-inner);
}
@media screen and (max-width: 767px) {
  .p-top-faq__inner {
    padding-inline: var(--padding-inner-sp);
  }
}

.p-top-faq__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.p-top-faq__title {
  font-size: var(--font-size-32);
  font-weight: var(--fw-extra-bold);
}

.p-top-faq__list {
  display: flex;
  flex-direction: column;
  row-gap: 0.9375rem;
  margin-block-start: 2.375rem;
}
@media screen and (max-width: 767px) {
  .p-top-faq__list {
    margin-block-start: 2rem;
  }
}

.p-top-faq__item {
  --_text-color: var(--color-brown);
  --_background-default: var(--color-beige);
  --_background-interactive: var(--color-beige);
  --_background-opened: var(--color-beige);
  --_text-color-opened: var(--color-brown);
}

.p-top-faq__summary {
  column-gap: 0.8125rem;
  padding-block: 0.5625rem;
  padding-inline: 0.6875rem 1.25rem;
  border-radius: 25px;
  font-size: var(--font-size-18);
  font-weight: var(--fw-extra-bold);
  line-height: 1.6;
}
@media screen and (max-width: 767px) {
  .p-top-faq__summary {
    padding-inline: 0.5rem 0.75rem;
  }
}

.p-top-faq__question {
  display: flex;
  column-gap: 0.8125rem;
  align-items: center;
}

.p-top-faq__answer {
  display: flex;
  column-gap: 0.625rem;
  align-items: flex-start;
  padding-block: 0.625rem;
  padding-inline: 0.6875rem 2rem;
}

.p-top-faq__answer-text {
  margin-block-start: 0.25rem;
}

.p-top-faq__badge {
  display: grid;
  flex-shrink: 0;
  place-items: center;
  width: 2.125rem;
  height: 2.125rem;
  border-radius: 100vmax;
}

.p-top-faq__badge-text {
  font-family: var(--caveat-font-family);
  font-size: var(--font-size-22);
  font-weight: var(--fw-bold);
  line-height: 1;
  translate: -2px 0;
}

.p-top-faq__badge.p-top-faq__badge--q {
  background-color: var(--color-white);
  color: var(--color-brown);
}

.p-top-faq__badge.p-top-faq__badge--a {
  background-color: var(--color-red);
  color: var(--color-white);
}

.p-top-faq__btn {
  margin-block-start: 2.5rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-top-faq__btn {
    margin-block-start: 2rem;
  }
}

.p-top-faq__bottom {
  margin-block-start: 6.25rem;
}
@media screen and (max-width: 767px) {
  .p-top-faq__bottom {
    margin-block-start: 5rem;
  }
}

.p-top-reason {
  position: relative;
  overflow-x: clip;
  padding-block: 13.75rem 6.25rem;
}
.p-top-reason::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 57.8125rem;
  background-color: var(--color-bg-cream);
  opacity: 0.6;
  z-index: -1;
}
.p-top-reason::after {
  content: "";
  position: absolute;
  top: 7.5rem;
  left: calc(50% - 21.75rem);
  width: 100%;
  height: 38.4375rem;
  border-radius: 120px 0 0;
  background-color: var(--color-beige);
  opacity: 0.6;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .p-top-reason {
    padding-block: 7.5rem 3.75rem;
  }
  .p-top-reason::before {
    height: calc(100% - 7.5rem);
    top: 7.5rem;
  }
  .p-top-reason::after {
    top: 3.75rem;
    left: calc(50% - 8.75rem);
    height: 38.4375rem;
  }
}

.p-top-reason__DecoLine {
  position: absolute;
  background: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='280'%20height='674'%20viewBox='0%200%20280%20674'%20fill='none'%3e%3cpath%20d='M297%201.95459C196.766%2023.6787%20-27.6556%2087.8857%205.26645%20265.058C25.7194%20375.127%20145.771%20423.886%20221.385%20488.093C281.877%20539.458%20297%20633.403%20297%20673.955'%20stroke='white'%20stroke-width='4'%20stroke-dasharray='6%206'%20/%3e%3c/svg%3e") var(--bg-contain);
  width: 18.4375rem;
  height: 42rem;
  top: -4rem;
  right: -0.625rem;
}
@media screen and (max-width: 767px) {
  .p-top-reason__DecoLine {
    width: 8.75rem;
    height: auto;
    aspect-ratio: 295/672;
  }
}

.p-top-reason__inner {
  position: relative;
  max-width: calc(62.5rem + var(--padding-inner) * 2);
  margin-inline: auto;
  padding-inline: var(--padding-inner);
}
@media screen and (max-width: 767px) {
  .p-top-reason__inner {
    padding-inline: var(--padding-inner-sp);
  }
}

.p-top-reason__head {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.p-top-reason__label {
  color: var(--color-red);
  font-family: var(--caveat-font-family);
  font-size: var(--font-size-22);
  font-weight: var(--fw-bold);
  line-height: 1.6;
}

.p-top-reason__title {
  display: flex;
  column-gap: 0.75rem;
  align-items: center;
  margin-block-start: -0.25rem;
  font-size: var(--font-size-22);
  font-weight: var(--fw-extra-bold);
}
@media screen and (max-width: 767px) {
  .p-top-reason__title {
    flex-direction: column;
    row-gap: 0.25rem;
    align-items: center;
  }
}

.p-top-reason__title-main {
  font-size: var(--font-size-40);
  font-weight: var(--fw-extra-bold);
}

.p-top-reason__title-num {
  color: var(--color-red);
  line-height: 1;
  font-weight: var(--fw-extra-bold);
}

.p-top-reason__title-num-large {
  font-size: var(--font-size-52);
}

.p-top-reason__line {
  width: 28.9375rem;
  height: auto;
  margin-block-start: 0.125rem;
}
@media screen and (max-width: 767px) {
  .p-top-reason__line {
    width: 14.5rem;
  }
}

.p-top-reason__lead {
  margin-block-start: 2rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-top-reason__lead {
    margin-block-start: 1rem;
  }
}

.p-top-reason__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 2.5rem;
  margin-block-start: 7.375rem;
}
@media screen and (max-width: 767px) {
  .p-top-reason__cards {
    grid-template-columns: 1fr;
    margin-block-start: 4.375rem;
    row-gap: 4.375rem;
  }
}

.p-top-reason__card {
  position: relative;
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 4;
  row-gap: 0;
}
.p-top-reason__card:nth-child(2) .p-top-reason__badge {
  padding-inline-end: 1.5rem;
}
.p-top-reason__card:nth-child(3) .p-top-reason__badge {
  padding-inline-end: 0.8125rem;
}
@media screen and (max-width: 767px) {
  .p-top-reason__card:nth-child(2) .p-top-reason__badge {
    padding-inline-end: 1.25rem;
  }
  .p-top-reason__card:nth-child(3) .p-top-reason__badge {
    padding-inline-end: 0.625rem;
  }
}

.p-top-reason__number {
  position: absolute;
  top: -5.75rem;
  left: -1.25rem;
  z-index: 2;
  color: var(--color-gold);
  opacity: 0.5;
  font-family: var(--caveat-font-family);
  font-size: var(--font-size-129);
  font-weight: var(--fw-regular);
  line-height: 1;
  rotate: -10.782deg;
}
@media screen and (max-width: 767px) {
  .p-top-reason__number {
    top: -3.4375rem;
    left: -0.625rem;
  }
}

.p-top-reason__image {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
}
.p-top-reason__image img {
  height: auto;
  aspect-ratio: 306/218;
}

.p-top-reason__badge {
  position: relative;
  z-index: 1;
  width: fit-content;
  margin-block-start: -1.875rem;
  padding-block: 0.875rem;
  padding-inline: 0.8125rem 1.75rem;
  background-color: var(--color-white);
}
@media screen and (max-width: 767px) {
  .p-top-reason__badge {
    padding-block: 0.5rem;
    padding-inline: 0.625rem 1.25rem;
  }
}

.p-top-reason__badge-text {
  font-size: var(--font-size-19);
  font-weight: var(--fw-extra-bold);
  line-height: 1.7;
}

.p-top-reason__text {
  margin-block-start: 0.9375rem;
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  .p-top-reason__text {
    margin-block-start: 0.75rem;
  }
}

.p-top-reason__strong {
  font-weight: var(--fw-extra-bold);
}

.p-top-reason__btn {
  margin-block-start: 1.75rem;
  text-align: right;
}

.p-top-voice {
  position: relative;
  overflow-x: clip;
  padding-block: 8.75rem 7.5rem;
}
.p-top-voice::after {
  content: "";
  position: absolute;
  background: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='790'%20height='651'%20viewBox='0%200%20790%20651'%20fill='none'%3e%3cpath%20d='M-53%202C59.413%202%20177.241%2043.5%20237%20184.5C296.759%20325.5%20378%20392.5%20529.199%20433.131C607.784%20454.249%20761.155%20580.143%20788%20650'%20stroke='%23F3EADA'%20stroke-width='4'%20stroke-dasharray='6%206'%20/%3e%3c/svg%3e") var(--bg-contain);
  width: 52.5625rem;
  height: 40.5rem;
  top: -6.875rem;
  left: -1.5rem;
}
@media screen and (max-width: 767px) {
  .p-top-voice {
    padding-block: 6.25rem 3.75rem;
  }
  .p-top-voice::after {
    display: none;
  }
}

.p-top-voice__inner {
  position: relative;
  max-width: calc(90rem + var(--padding-inner) * 2);
  margin-inline: auto;
  padding-inline: var(--padding-inner);
}
@media screen and (max-width: 767px) {
  .p-top-voice__inner {
    padding-inline: var(--padding-inner-sp);
  }
}

.p-top-voice__title {
  position: relative;
  z-index: 2;
  font-size: var(--font-size-32);
  font-weight: var(--fw-extra-bold);
  line-height: 1.6;
  text-align: center;
}

.p-top-voice__deco {
  position: absolute;
  top: -3.8125rem;
  right: 6.75rem;
}
@media screen and (max-width: 767px) {
  .p-top-voice__deco {
    top: -4.375rem;
    left: 0;
    right: auto;
  }
}

.p-top-voice__swiper-container {
  position: relative;
  margin-block-start: 2.5rem;
}
@media screen and (max-width: 767px) {
  .p-top-voice__swiper-container {
    margin-block-start: 2rem;
  }
}

.p-top-voice__swiper {
  overflow: hidden;
  width: 100vw;
  margin-inline: calc(50% - 50vw);
  padding-block-end: 1.25rem;
}

.p-top-voice__swiper-slide {
  width: 17.625rem;
  height: auto;
}

.p-top-voice__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding-block: 0.25rem 1rem;
  padding-inline: 0.75rem;
  border: 0.25rem solid var(--color-bg-cream);
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.25);
  background-color: var(--color-white);
}
@media (any-hover: hover) {
  .p-top-voice__card:hover .p-top-voice__image img {
    scale: 1.02;
  }
}

.p-top-voice__image {
  overflow: hidden;
}
.p-top-voice__image img {
  display: block;
  height: auto;
  aspect-ratio: 250/354;
  transition: scale var(--duration) ease;
}

.p-top-voice__body {
  width: 100%;
  padding-block: 0.6875rem;
  border-top: 0.0625rem dashed var(--color-beige-dark);
}

.p-top-voice__stars {
  display: flex;
  align-items: center;
}

.p-top-voice__star {
  width: 1.290625rem;
  height: 1.290625rem;
}
.p-top-voice__star img {
  display: block;
}

.p-top-voice__text {
  margin-block-start: 0.3125rem;
  color: var(--color-brown);
  font-size: 0.875rem;
  font-weight: var(--fw-extra-bold);
  line-height: 1.5;
  text-decoration: underline;
  text-underline-offset: 0.25rem;
}

.p-top-voice__nav {
  display: flex;
  column-gap: 1.875rem;
  justify-content: flex-end;
  align-items: center;
  margin-block-start: 0.75rem;
  margin-inline-end: 3.125rem;
}
@media screen and (max-width: 767px) {
  .p-top-voice__nav {
    margin-inline-end: 0;
    flex-direction: column;
    row-gap: 1.25rem;
    justify-content: center;
  }
}

.p-top-voice__nav-btns {
  display: flex;
  column-gap: 0.625rem;
}
@media screen and (max-width: 767px) {
  .p-top-voice__nav-btns {
    column-gap: 1.875rem;
  }
}

.p-top-voice__btn {
  position: relative;
  z-index: 2;
  margin-block-start: -2.8125rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-top-voice__btn {
    margin-block-start: 2rem;
  }
}

.p-top-works {
  position: relative;
  overflow-x: clip;
  padding-block: 7.5rem;
}
.p-top-works::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 38.375rem;
  background-color: var(--color-beige);
  opacity: 0.6;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .p-top-works {
    padding-block: 3.75rem;
  }
  .p-top-works::before {
    height: 31.25rem;
  }
}

.p-top-works__inner {
  position: relative;
  max-width: 96.25rem;
  margin-inline: auto;
  padding-inline: 3.125rem;
}
.p-top-works__inner::after {
  top: -18.5rem;
  left: 31.625rem;
  content: "";
  position: absolute;
  background: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='855'%20height='625'%20viewBox='0%200%20855%20625'%20fill='none'%3e%3cpath%20d='M0%202C134%202%20284.631%2057.2721%20363.5%20207C442.369%20356.728%20580%20415.5%20694%20415.5C791%20415.5%20970.5%20556.5%201002.5%20623.5'%20stroke='%23F3EADA'%20stroke-width='4'%20stroke-dasharray='6%206'%20/%3e%3c/svg%3e") var(--bg-contain);
  width: 62.65625rem;
  height: 38.84375rem;
}
@media screen and (max-width: 767px) {
  .p-top-works__inner {
    padding-inline: var(--padding-inner-sp);
  }
  .p-top-works__inner::after {
    background: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='497'%20height='309'%20viewBox='0%200%20497%20309'%20fill='none'%3e%3cpath%20d='M0%201C66.2983%201%20140.825%2028.3025%20179.846%20102.263C218.868%20176.224%20286.963%20205.255%20343.366%20205.255C391.358%20205.255%20480.168%20274.904%20496%20308'%20stroke='%23F3EADA'%20stroke-width='2'%20stroke-dasharray='6%206'%20/%3e%3c/svg%3e") var(--bg-contain);
    top: -22.5rem;
    left: -8.125rem;
    width: 31rem;
    height: 19.1875rem;
  }
}

.p-top-works__deco {
  position: absolute;
  top: -4.125rem;
  left: 4.125rem;
}
@media screen and (max-width: 767px) {
  .p-top-works__deco {
    left: 0rem;
  }
}

.p-top-works__title {
  font-size: var(--font-size-32);
  font-weight: var(--fw-extra-bold);
  line-height: 1.6;
  text-align: center;
}

.p-top-works__swiper-container {
  position: relative;
  margin-block-start: 2.5rem;
}
@media screen and (max-width: 767px) {
  .p-top-works__swiper-container {
    margin-block-start: 2rem;
  }
}

.p-top-works__swiper {
  overflow: hidden;
  width: 100vw;
  margin-inline: calc(50% - 50vw);
  padding-block-end: 0.625rem;
}

.p-top-works__swiper-slide {
  width: 23.75rem;
  height: auto;
}
@media screen and (max-width: 767px) {
  .p-top-works__swiper-slide {
    width: 17.5rem;
  }
}

.p-top-works__card {
  overflow: hidden;
  display: block;
  height: 100%;
  width: 100%;
  border-radius: 12px;
  box-shadow: 0 0 0.875rem 0 rgba(0, 0, 0, 0.1);
  background-color: var(--color-off-white);
  transition: opacity var(--duration) ease;
}
@media (any-hover: hover) {
  .p-top-works__card:hover .p-top-works__image {
    opacity: 0.8;
  }
  .p-top-works__card:hover .p-top-works__image img {
    scale: 1.02;
  }
}

.p-top-works__image {
  overflow: hidden;
}
.p-top-works__image img {
  height: auto;
  aspect-ratio: 379.028/267.229;
  transition: scale var(--duration) ease;
}

.p-top-works__body {
  padding-block: 1.625rem 1.875rem;
  padding-inline: 1.5rem;
}
@media screen and (max-width: 767px) {
  .p-top-works__body {
    padding-block: 1rem 1.25rem;
    padding-inline: 1rem;
  }
}

.p-top-works__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.625rem;
}
@media screen and (max-width: 767px) {
  .p-top-works__tags {
    column-gap: 0.375rem;
    row-gap: 0.5rem;
  }
}

.p-top-works__tag {
  padding-block: 0.3rem;
  padding-inline: 0.8125rem;
  border: 1px solid var(--color-tan);
  border-radius: 14.4px;
  color: var(--color-brown);
  font-size: 0.875rem;
  font-weight: var(--fw-extra-bold);
  line-height: 1.2857142857;
}
@media screen and (max-width: 767px) {
  .p-top-works__tag {
    padding-block: 0.1875rem;
    padding-inline: 0.375rem 0.625rem;
    font-size: 0.75rem;
  }
}

.p-top-works__card-title {
  margin-block-start: 0.75rem;
  color: var(--color-text);
  font-size: var(--font-size-24);
  font-weight: var(--fw-extra-bold);
  line-height: 1.6;
}
@media screen and (max-width: 767px) {
  .p-top-works__card-title {
    margin-block-start: 0.5rem;
  }
}

.p-top-works__card-text {
  margin-block-start: 0.5rem;
}

.p-top-works__nav {
  display: flex;
  column-gap: 1.875rem;
  justify-content: flex-end;
  align-items: center;
  margin-block-start: 2rem;
  margin-inline-end: 3.125rem;
}
@media screen and (max-width: 767px) {
  .p-top-works__nav {
    margin-block-start: 1.375rem;
    margin-inline-end: 0;
    flex-direction: column;
    row-gap: 1.25rem;
    justify-content: center;
  }
}

.p-top-works__nav-btns {
  display: flex;
  column-gap: 0.625rem;
}
@media screen and (max-width: 767px) {
  .p-top-works__nav-btns {
    column-gap: 1.875rem;
  }
}

.p-top-works__btn {
  position: relative;
  z-index: 2;
  margin-block-start: -2.5rem;
  margin-inline-start: 3rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-top-works__btn {
    margin-block-start: 2rem;
    margin-inline-start: 0;
  }
}

.p-top-works__illust {
  position: absolute;
  bottom: -15rem;
  left: 1.125rem;
  width: 35.4375rem;
  height: 23.625rem;
  opacity: 0.6;
}
.p-top-works__illust img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
@media screen and (max-width: 767px) {
  .p-top-works__illust {
    display: none;
  }
}

:root {
  --clip-triangle-top: polygon(50% 0, 100% 100%, 0 100%);
  --clip-triangle-bottom: polygon(0 0, 100% 0, 50% 100%);
  --clip-triangle-right: polygon(0 0, 100% 50%, 0 100%);
  --clip-triangle-left: polygon(0 50%, 100% 0, 100% 100%);
  --clip-triangle-lower-left: polygon(0 0, 100% 100%, 0 100%);
  --clip-triangle-upper-left: polygon(0 0, 100% 0, 0 100%);
  --clip-triangle-lower-right: polygon(100% 0, 100% 100%, 0 100%);
  --clip-triangle-upper-right: polygon(0 0, 100% 0, 100% 100%);
}

@media (width <= 767px) {
  [data-only-device=md] {
    display: none;
  }
}

@media (width >= 768px) {
  [data-only-device=sm] {
    display: none;
  }
}

.u-sr-only {
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(100%);
  width: 1px;
  height: 1px;
  margin-block: -1px;
  margin-inline: -1px;
  padding-block: 0;
  padding-inline: 0;
  border: 0;
  white-space: nowrap;
}