@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Aboreto&family=Shippori+Mincho&display=swap");
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul, summary {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

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

img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

a {
  text-decoration: none;
  transition: all 0.3s ease-out;
}

.pc {
  display: initial !important;
}

.sp {
  display: none !important;
}

@media (max-width: 767px) {
  .pc {
    display: none !important;
  }
  .sp {
    display: initial !important;
  }
}
:root {
  --primary: #141414;
  --accent: #947D20;
  --success: #4caf50;
  --warning: #ff9800;
  --error: #f44336;
  --disabled: #999;
  --emphasis: #cc3300;
  --text: #141414;
  --text-light: #CCCCCC;
  --gray-dark:#999999;
  --gray:#CCCCCC;
  --gray-light:#F4F4F4;
  --highlight: #f8f882;
  --white: #fff;
  --black: #000;
}

:root {
  --fs-page-title: clamp(2.25rem, 1.65rem + 1.5vw, 3rem);
  --fs-section-heading: clamp(1.5rem, 1.1rem + 1vw, 2rem);
  --fs-subsection-heading: clamp(1.25rem, 0.85rem + 1vw, 1.75rem);
  --fs-card-heading: clamp(1.125rem, 0.925rem + 0.5vw, 1.375rem);
  --fs-inline-heading: clamp(1rem, 0.9rem + 0.25vw, 1.125rem);
  --fs-lead: clamp(1rem, 0.8rem + 0.5vw, 1.25rem);
  --fs-body: clamp(0.875rem, 0.775rem + 0.25vw, 1rem);
  --fs-note: clamp(0.75rem, 0.65rem + 0.25vw, 0.875rem);
  --fs-small: clamp(0.625rem, 0.525rem + 0.25vw, 0.75rem);
}

@-webkit-keyframes navfadein {
  0% {
    transform: translateX(-24px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes navfadein {
  0% {
    transform: translateX(-24px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes bigTextMove {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
@keyframes bigTextMove {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
@-webkit-keyframes photoAnim {
  0% {
    -webkit-mask-size: 0% 50%;
            mask-size: 0% 50%;
    opacity: 0;
  }
  100% {
    -webkit-mask-size: 100% 100%;
            mask-size: 100% 100%;
    opacity: 1;
  }
}
@keyframes photoAnim {
  0% {
    -webkit-mask-size: 0% 50%;
            mask-size: 0% 50%;
    opacity: 0;
  }
  100% {
    -webkit-mask-size: 100% 100%;
            mask-size: 100% 100%;
    opacity: 1;
  }
}
@-webkit-keyframes bgMove {
  0% {
    transform: translateX(0%);
  }
  50% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0%);
  }
}
@keyframes bgMove {
  0% {
    transform: translateX(0%);
  }
  50% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0%);
  }
}
@-webkit-keyframes fadePhoto1 {
  0% {
    transform: translateX(-20%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes fadePhoto1 {
  0% {
    transform: translateX(-20%);
  }
  100% {
    transform: translateX(0);
  }
}
@-webkit-keyframes fadePhoto2 {
  0% {
    transform: translateX(20%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes fadePhoto2 {
  0% {
    transform: translateX(20%);
  }
  100% {
    transform: translateX(0);
  }
}
@-webkit-keyframes fadePhoto3 {
  0% {
    transform: translateX(20%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes fadePhoto3 {
  0% {
    transform: translateX(20%);
  }
  100% {
    transform: translateX(0);
  }
}
@-webkit-keyframes fadePhoto4 {
  0% {
    transform: translateY(-20%);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes fadePhoto4 {
  0% {
    transform: translateY(-20%);
  }
  100% {
    transform: translateY(0);
  }
}
@-webkit-keyframes fadePhoto5 {
  0% {
    transform: translateY(20%);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes fadePhoto5 {
  0% {
    transform: translateY(20%);
  }
  100% {
    transform: translateY(0);
  }
}
.ff-jp .ff-mincho {
  font-family: "Shippori Mincho", serif;
}

.ff-en {
  font-family: "Aboreto", cursive;
}

h1.site-title {
  font-size: 0;
  visibility: hidden;
  opacity: 0;
  position: absolute;
  top: -100px;
  left: -100px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  pointer-events: none;
}

.page-title {
  display: flex;
  flex-direction: column;
  width: 88%;
  margin-inline: auto;
}
.page-title h1, .page-title h2 {
  font-size: clamp(5rem, -1rem + 15vw, 12.5rem);
  line-height: 1.2;
  color: rgba(255, 255, 255, 0.2);
  font-family: "Aboreto", cursive;
}
.page-title p {
  font-size: clamp(1rem, 0.4rem + 1.5vw, 1.75rem);
  color: var(--white);
  font-family: "Shippori Mincho", serif;
}

.top-heading {
  position: relative;
  padding-top: clamp(70px, 12.5vw, 180px);
  display: flex;
  flex-direction: column;
  gap: clamp(16px, 1.6666666667vw, 24px);
}
.top-heading.eng h2 {
  font-size: max(40 / 16 * 1rem, 120 / 1920 * 100vw);
  font-family: "Aboreto", cursive;
}
.top-heading.eng p {
  font-size: max(16 / 16 * 1rem, 40 / 1920 * 100vw);
}
.top-heading::before {
  content: "";
  position: absolute;
  width: 1px;
  height: clamp(60px, 11.1111111111vw, 160px);
  background: var(--white);
  top: 0;
  left: 50%;
}
.top-heading h2 {
  font-family: "Shippori Mincho", serif;
  font-size: max(36 / 16 * 1rem, 80 / 1920 * 100vw);
  line-height: 1.3;
  text-align: center;
  color: var(--white);
  letter-spacing: 0.1em;
}
.top-heading p {
  font-family: "Shippori Mincho", serif;
  font-size: max(16 / 16 * 1rem, 28 / 1920 * 100vw);
  line-height: 1.4;
  text-align: center;
  color: var(--white);
}

.section-heading {
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 1.6666666667vw, 24px);
  align-items: center;
  position: relative;
}
.section-heading.left {
  align-items: flex-start;
}
@media (max-width: 767px) {
  .section-heading.left {
    align-items: center;
  }
}
.section-heading h2 {
  font-size: max(40 / 16 * 1rem, 120 / 1920 * 100vw);
  font-family: "Aboreto", cursive;
  line-height: 1.2;
  text-align: center;
}
.section-heading h2.ff-mincho {
  font-family: "Shippori Mincho", serif;
}
@media (max-width: 767px) {
  .section-heading h2.ff-mincho {
    letter-spacing: 0;
  }
}
.section-heading p {
  font-size: max(20 / 16 * 1rem, 40 / 1920 * 100vw);
  font-family: "Shippori Mincho", serif;
  line-height: 1.4;
  text-align: center;
}
.section-heading span {
  font-size: clamp(0.875rem, 0.775rem + 0.25vw, 1rem);
  line-height: 1.4;
  text-align: center;
}
.section-heading span.icon {
  position: relative;
  padding-left: 1.75em;
}
.section-heading span.icon::before {
  content: "";
  width: 1.5em;
  aspect-ratio: 1;
  -webkit-mask: url(../images/icon/instagram.svg) no-repeat center/contain;
          mask: url(../images/icon/instagram.svg) no-repeat center/contain;
  background: var(--text);
  position: absolute;
  left: 0;
  top: calc(0.5lh - 0.75em);
}
.section-heading .btn {
  position: absolute;
  top: 0;
  right: 0;
}
@media (max-width: 767px) {
  .section-heading .btn {
    position: relative;
    margin-inline: auto;
    margin-top: 40px;
  }
}

.lower-parts-heading {
  font-size: clamp(1.25rem, 0.85rem + 1vw, 1.75rem);
  line-height: 1.3;
  font-family: "Shippori Mincho", serif;
  padding-left: 0.75em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--gray);
  position: relative;
}
.lower-parts-heading::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 4px;
  height: calc(100% - 0.5em);
  background: var(--primary);
}
.lower-parts-heading.white {
  color: var(--white);
  border-bottom-color: var(--gray-dark);
}
.lower-parts-heading.white::before {
  background: var(--white);
}

.lead {
  font-size: clamp(1rem, 0.9rem + 0.25vw, 1.125rem);
  line-height: 1.8;
}

.text-price {
  font-size: clamp(1.75rem, 1.15rem + 1.5vw, 2.5rem);
  line-height: 1.6;
  color: var(--text);
}

.text-l {
  font-size: clamp(1.25rem, 0.85rem + 1vw, 1.75rem);
  line-height: 1.6;
  color: var(--text);
}

.text {
  font-size: clamp(0.875rem, 0.775rem + 0.25vw, 1rem);
  line-height: 2.4;
  color: var(--text);
}

.note {
  font-size: clamp(0.75rem, 0.65rem + 0.25vw, 0.875rem);
  line-height: 1.6;
}

.text-s {
  font-size: clamp(0.625rem, 0.525rem + 0.25vw, 0.75rem);
  line-height: 1;
}

.copyright {
  color: var(--gray-dark);
  font-size: clamp(0.625rem, 0.425rem + 0.5vw, 0.875rem);
  line-height: 1;
  margin-left: auto;
}
@media (max-width: 767px) {
  .copyright {
    margin-left: 0;
    margin-right: auto;
  }
}

.ff-jp {
  font-family: "Noto Sans JP", "Yu Gothic", "YuGothic", sans-serif;
}

.ff-mincho {
  font-family: "Shippori Mincho", serif;
}

.ff-en {
  font-family: "Aboreto", cursive;
}

.c-accent {
  color: var(--accent);
}

.c-white {
  color: var(--white);
}

.c-gray-dark {
  color: var(--gray-dark);
}

.c-gray {
  color: var(--gray);
}

.c-textlight {
  color: var(--text-light);
}

.t-center {
  text-align: center;
}

.t-right {
  text-align: right;
}

.bold {
  font-weight: 700;
}

.marker {
  background: linear-gradient(to top, var(--highlight) 50%, transparent 50%);
}

.underline {
  text-decoration: underline;
  text-underline-offset: 0.1em;
}

.kome {
  position: relative;
  padding-left: 1em;
  text-indent: -1em;
}
.kome::before {
  content: "※";
}

.header {
  width: 100%;
  height: 124px;
  padding-inline: clamp(24px, 2.7777777778vw, 40px);
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 99;
  mix-blend-mode: exclusion;
}
@media (max-width: 1024px) {
  .header {
    height: 60px;
    mix-blend-mode: initial;
  }
}
.header .site-logo {
  width: clamp(180px, 20.8333333333vw, 300px);
}

.gnav {
  margin-left: auto;
  position: fixed;
  right: 24px;
  top: 50px;
}
@media (max-width: 1024px) {
  .gnav.is-open ul {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
}
.gnav ul {
  display: flex;
}
@media (max-width: 1024px) {
  .gnav ul {
    transition: all 0.3s ease-out;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    flex-direction: column;
    justify-content: center;
    position: fixed;
    top: 0;
    left: 0;
    width: 100cqi;
    background: var(--primary);
    padding: 2rem;
    height: 100dvh;
  }
  .gnav ul li.fadein {
    -webkit-animation: navfadein 0.5s ease-out both;
            animation: navfadein 0.5s ease-out both;
  }
  .gnav ul li.fadein:nth-child(1) {
    -webkit-animation-delay: 0ms;
            animation-delay: 0ms;
  }
  .gnav ul li.fadein:nth-child(2) {
    -webkit-animation-delay: 100ms;
            animation-delay: 100ms;
  }
  .gnav ul li.fadein:nth-child(3) {
    -webkit-animation-delay: 200ms;
            animation-delay: 200ms;
  }
  .gnav ul li.fadein:nth-child(4) {
    -webkit-animation-delay: 300ms;
            animation-delay: 300ms;
  }
  .gnav ul li.fadein:nth-child(5) {
    -webkit-animation-delay: 400ms;
            animation-delay: 400ms;
  }
  .gnav ul li.fadein:nth-child(6) {
    -webkit-animation-delay: 500ms;
            animation-delay: 500ms;
  }
  .gnav ul li.fadein:nth-child(7) {
    -webkit-animation-delay: 600ms;
            animation-delay: 600ms;
  }
}
.gnav ul .nav-item {
  padding: 1em;
  font-size: clamp(1rem, 0.9rem + 0.25vw, 1.125rem);
  font-family: "Aboreto", cursive;
  color: var(--white);
}
@media (max-width: 1024px) {
  .gnav ul .nav-item {
    font-size: 2rem;
    display: block;
    padding: 0.5em 0;
  }
}
.gnav ul .nav-item:hover {
  opacity: 0.3;
}

@media (min-width: 1024px) {
  .gnav ul .nav-item.active {
    opacity: 0.3;
  }
}
.toggle {
  display: none;
}
@media (max-width: 1024px) {
  .toggle {
    mix-blend-mode: exclusion;
    position: fixed;
    top: 32px;
    right: 24px;
    transform: translateY(-50%);
    width: 64px;
    height: 32px;
    z-index: 99;
    cursor: pointer;
    display: grid;
    place-items: center;
  }
  .toggle span {
    width: 80%;
    height: 2px;
    background: transparent;
    border-radius: 1px;
    position: relative;
    transition: all 0.3s ease-out;
  }
  .toggle span::before, .toggle span::after {
    content: "";
    width: 100%;
    height: 1px;
    border-radius: 1px;
    background: var(--white);
    position: absolute;
    transition: all 0.3s ease-out;
  }
  .toggle span::before {
    top: -6px;
    left: 0;
  }
  .toggle span::after {
    top: 6px;
    left: 0;
  }
  .toggle.is-active span {
    height: 0;
  }
  .toggle.is-active span::before, .toggle.is-active span::after {
    top: initial;
  }
  .toggle.is-active span::before {
    transform: rotate(30deg);
  }
  .toggle.is-active span::after {
    transform: rotate(-30deg);
  }
}

.footer {
  padding: clamp(56px, 5.5555555556vw, 80px) 0;
  background: var(--primary);
}

.f-content-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: max(16 / 16 * 1rem, 40 / 1920 * 100vw);
  position: relative;
}
@media (max-width: 767px) {
  .f-content-wrap {
    flex-direction: column;
    align-items: center;
  }
}
.f-content-wrap .f-nav-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: max(32 / 16 * 1rem, 40 / 1920 * 100vw);
}
@media (max-width: 767px) {
  .f-content-wrap .f-nav-wrap {
    width: 100%;
  }
}
.f-content-wrap .f-nav-wrap .site-logo {
  width: clamp(180px, 13.8888888889vw, 200px);
}
.f-content-wrap .f-nav-wrap .f-nav ul {
  display: flex;
}
@media (max-width: 767px) {
  .f-content-wrap .f-nav-wrap .f-nav ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 1rem;
  }
}
.f-content-wrap .f-nav-wrap .f-nav ul li:first-of-type a {
  padding-left: 0;
}
.f-content-wrap .f-nav-wrap .f-nav ul a {
  font-size: clamp(0.875rem, 0.675rem + 0.5vw, 1.125rem);
  color: var(--white);
  font-family: "Aboreto", cursive;
  padding: 1em;
}
@media (max-width: 767px) {
  .f-content-wrap .f-nav-wrap .f-nav ul a {
    display: block;
    font-size: 1rem;
    padding: 1em 0;
  }
}
.f-content-wrap .f-nav-wrap .f-nav ul a:hover {
  opacity: 0.3;
}

.pagetop {
  position: absolute;
  bottom: 0;
  right: -100px;
  display: grid;
  place-items: center;
  width: max(40 / 16 * 1rem, 88 / 1920 * 100vw);
  aspect-ratio: 1;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
}
@media (max-width: 767px) {
  .pagetop {
    bottom: 0;
    right: 0;
  }
}
.pagetop::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  padding: 1px;
  background: linear-gradient(-45deg, var(--white), #5e5e5e, var(--white));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  transition: transform 0.5s ease-out;
}
.pagetop:hover span {
  transform: translateY(-8%) rotate(-90deg);
}
.pagetop:hover::before {
  transform: rotate(90deg);
}
.pagetop span {
  display: block;
  width: 40%;
  aspect-ratio: 1;
  -webkit-mask: url(../images/icon/arrow-pagetop.svg) no-repeat center/contain;
          mask: url(../images/icon/arrow-pagetop.svg) no-repeat center/contain;
  background: var(--primary);
  transform: rotate(-90deg);
  transition: transform 0.3s ease-out;
}

.list-normal > li {
  position: relative;
  padding-left: 1em;
}
.list-normal > li::before {
  content: "";
  width: 1em;
  height: 1lh;
  background: radial-gradient(var(--text) 0.2em, transparent 0.2em) no-repeat center/1em 1em;
  position: absolute;
  inset: 0;
}

.list-counter {
  counter-reset: list-counter;
}
.list-counter > li {
  counter-increment: list-counter;
  position: relative;
  padding-left: 1em;
}
.list-counter > li::before {
  content: counter(list-counter) ". ";
  position: absolute;
  inset: 0;
}

.link-text {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 0.25em;
}

.link-text-outside {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 0.25em;
  padding-right: 1.25em;
  position: relative;
  display: inline-block;
}
.link-text-outside::after {
  content: "";
  width: 1em;
  height: 1lh;
  background: url(../images/outside-link.svg) no-repeat center/contain;
  position: absolute;
  right: 0;
  top: 0;
}

.btn {
  position: relative;
  display: grid;
  place-items: center;
  width: max(80 / 16 * 1rem, 120 / 1920 * 100vw);
  aspect-ratio: 1;
  border-radius: 50%;
  background: transparent;
  color: #fff;
  cursor: pointer;
}
.btn::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  padding: 1px;
  background: linear-gradient(-45deg, var(--white), #5e5e5e, var(--white));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  transition: transform 0.5s ease-out;
}
.btn:hover span {
  transform: translateX(8%);
}
.btn:hover::before {
  transform: rotate(90deg);
}
.btn span {
  display: block;
  width: 40%;
  aspect-ratio: 1;
  -webkit-mask: url(../images/icon/arrow.svg) no-repeat center/contain;
          mask: url(../images/icon/arrow.svg) no-repeat center/contain;
  background: var(--white);
  transition: transform 0.3s ease-out;
}
.btn.blk {
  background: var(--white);
}
.btn.blk::before {
  background: linear-gradient(-45deg, #5e5e5e, #ccc, #5e5e5e);
}
.btn.blk span {
  background: var(--primary);
}
.btn.outer {
  background: var(--white);
}
.btn.outer span {
  -webkit-mask: url(../images/icon/outer-arrow.svg) no-repeat center/contain;
          mask: url(../images/icon/outer-arrow.svg) no-repeat center/contain;
  background: var(--primary);
}
.btn.outer:hover span {
  transform: translate(10%, -10%);
}
.btn.cta {
  width: max(120 / 16 * 1rem, 240 / 1920 * 100vw);
  padding-top: 2%;
  background: var(--primary);
  display: flex;
  flex-direction: column;
  gap: max(4 / 16 * 1rem, 8 / 1920 * 100vw);
  justify-content: center;
  align-items: center;
  position: fixed;
  top: max(200 / 16 * 1rem, 632 / 1920 * 100vw);
  right: max(8 / 16 * 1rem, 24 / 1920 * 100vw);
  text-align: center;
  box-shadow: 20px 20px 20px rgba(0, 0, 0, 0.2);
  z-index: 80;
}
.btn.cta::before {
  padding: 2px;
}
@media (max-width: 767px) {
  .btn.cta {
    top: initial;
    top: 60vw;
    padding-top: 3%;
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.2);
  }
}
.btn.cta .name {
  font-size: max(14 / 16 * 1rem, 28 / 1920 * 100vw);
  font-family: "Aboreto", cursive;
}
.btn.cta .sub-name {
  font-size: max(12 / 16 * 1rem, 15 / 1920 * 100vw);
  line-height: 1.3;
  font-family: "Shippori Mincho", serif;
  letter-spacing: 0;
}
.btn.cta span {
  width: 18%;
  transform: rotate(90deg);
}
.btn.cta:hover span {
  transform: rotate(90deg) translateX(10%);
}
.btn.cta.hidden {
  opacity: 0;
  pointer-events: none;
}
.btn.back span {
  transform: scaleX(-1);
}
.btn.back:hover span {
  transform: scaleX(-1) translateX(8%);
}
.btn.showmore span {
  transform: rotate(90deg);
}
.btn.showmore:hover span {
  transform: rotate(90deg) translateX(8%);
}
@media (max-width: 767px) {
  .btn.lower {
    top: 373px;
  }
}

.box-btn {
  background: url(../images/bg-box-btn-hover.webp) no-repeat center/cover;
  padding: max(24 / 16 * 1rem, 80 / 1920 * 100vw);
  display: grid;
  grid-template-columns: 1fr -webkit-max-content;
  grid-template-columns: 1fr max-content;
  position: relative;
  transition: all 0.3s ease-out;
}
.box-btn::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, #f5f5f5, #e5e5e5);
  transition: all 0.3s ease-out;
}
.box-btn > div {
  position: relative;
}
.box-btn > div .label {
  font-size: max(32 / 16 * 1rem, 64 / 1920 * 100vw);
  color: var(--primary);
}
.box-btn:hover::before {
  opacity: 0;
}
.box-btn:hover .text-l {
  color: var(--white);
}
.box-btn:hover .label {
  color: var(--white);
}
.box-btn:hover .btn span {
  transform: translateX(8%);
}

.btn-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
}

.sec {
  container-type: inline-size;
  padding: clamp(64px, 8.3333333333vw, 120px) 0;
}

.container {
  width: min(1440px, 88%);
  margin-inline: auto;
}

.container-vw {
  width: max(640 / 16 * 1rem, 1440 / 1920 * 100vw);
  margin-inline: auto;
}
@media (max-width: 767px) {
  .container-vw {
    width: 88%;
  }
}

.container-vw1680 {
  width: max(640 / 16 * 1rem, 1680 / 1920 * 100vw);
  margin-inline: auto;
}
@media (max-width: 767px) {
  .container-vw1680 {
    width: 88%;
  }
}

.container-vw1200 {
  width: max(640 / 16 * 1rem, 1200 / 1920 * 100vw);
  margin-inline: auto;
}
@media (max-width: 767px) {
  .container-vw1200 {
    width: 100%;
  }
}

.fullwide {
  margin-inline: calc(50% - 50cqi);
  width: 100cqi;
}

.left-content {
  margin-left: calc(50% - 50cqi);
}

.right-content {
  margin-right: calc(50% - 50cqi);
}

.w960 {
  width: min(960px, 100%);
  margin-inline: auto;
}

.w800 {
  width: min(800px, 100%);
  margin-inline: auto;
}

.w640 {
  width: min(640px, 100%);
  margin-inline: auto;
}

.bg-light-gray {
  background: var(--gray-light);
}

.bg-white {
  background: var(--white);
}

.grid {
  display: grid;
}
.grid.grid21 {
  grid-template-columns: 1fr 1fr;
}
@media (max-width: 767px) {
  .grid.grid21 {
    grid-template-columns: 1fr;
  }
}
.grid.grid31 {
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 767px) {
  .grid.grid31 {
    grid-template-columns: 1fr;
  }
}
.grid.grid32 {
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 767px) {
  .grid.grid32 {
    grid-template-columns: 1fr 1fr;
  }
}
.grid.grid41 {
  grid-template-columns: repeat(4, 1fr);
}
@media (max-width: 767px) {
  .grid.grid41 {
    grid-template-columns: 1fr;
  }
}
.grid.grid42 {
  grid-template-columns: repeat(4, 1fr);
}
@media (max-width: 767px) {
  .grid.grid42 {
    grid-template-columns: 1fr 1fr;
  }
}
.grid.grid12fr {
  grid-template-columns: 1fr 2fr;
}
@media (max-width: 767px) {
  .grid.grid12fr {
    grid-template-columns: 1fr;
  }
}
.grid.grid13fr {
  grid-template-columns: 1fr 3fr;
}
@media (max-width: 767px) {
  .grid.grid13fr {
    grid-template-columns: 1fr;
  }
}
.grid.grid21fr {
  grid-template-columns: 2fr 1fr;
}
@media (max-width: 767px) {
  .grid.grid21fr {
    grid-template-columns: 1fr;
  }
}
.grid.grid31fr {
  grid-template-columns: 3fr 1fr;
}
@media (max-width: 767px) {
  .grid.grid31fr {
    grid-template-columns: 1fr;
  }
}
.grid.grid64fr {
  grid-template-columns: 6fr 4fr;
}
@media (max-width: 767px) {
  .grid.grid64fr {
    grid-template-columns: 1fr;
  }
}

.flex {
  display: flex;
}

.jc-center {
  justify-content: center;
}

.al-center {
  align-items: center;
}

.fd-column {
  flex-direction: column;
}

.flex1 {
  flex: 1;
}

.gap80 {
  gap: clamp(16px, 5.5555555556vw, 80px);
}

.gap48 {
  gap: clamp(16px, 3.3333333333vw, 48px);
}

.gap40 {
  gap: clamp(16px, 2.7777777778vw, 40px);
}

.gap32 {
  gap: clamp(16px, 2.2222222222vw, 32px);
}

.gap24 {
  gap: clamp(16px, 1.6666666667vw, 24px);
}

.gap16 {
  gap: clamp(8px, 1.1111111111vw, 16px);
}

.gap8 {
  gap: 8px;
}

.mt120 {
  margin-top: clamp(64px, 8.3333333333vw, 120px);
}

.mt96 {
  margin-top: clamp(64px, 6.6666666667vw, 96px);
}

.mt80 {
  margin-top: clamp(56px, 5.5555555556vw, 80px);
}

.mt64 {
  margin-top: clamp(40px, 4.4444444444vw, 64px);
}

.mt48 {
  margin-top: clamp(36px, 3.3333333333vw, 48px);
}

.mt40 {
  margin-top: clamp(32px, 2.7777777778vw, 40px);
}

.mt32 {
  margin-top: clamp(24px, 2.2222222222vw, 32px);
}

.mt24 {
  margin-top: clamp(16px, 1.6666666667vw, 24px);
}

.mt16 {
  margin-top: clamp(12px, 1.1111111111vw, 16px);
}

.mt8 {
  margin-top: 8px;
}

.mt4 {
  margin-top: 4px;
}

.tab-primary {
  display: flex;
  justify-content: center;
  gap: 8px;
  border-bottom: 1px solid var(--text);
}
.tab-primary > li {
  flex: 1 1 auto;
  cursor: pointer;
}

.tab-primary-content > li {
  display: none;
}
.tab-primary-content > li.is-active {
  display: initial;
}

.js-accordion {
  cursor: pointer;
}

.accordion-content {
  display: grid;
  grid-template-rows: 0fr;
  transition: all 0.3s ease-out;
}
.accordion-content.open {
  grid-template-rows: 1fr;
}
.accordion-content > div {
  overflow: hidden;
}

.aioseo-breadcrumbs {
  width: 100%;
  padding-inline: 6%;
  display: flex;
  justify-content: flex-end;
  gap: 1em;
  color: var(--gray-dark);
  font-size: clamp(0.75rem, 0.65rem + 0.25vw, 0.875rem);
  padding-bottom: clamp(32px, 4.1666666667vw, 60px);
}
@media (max-width: 767px) {
  .aioseo-breadcrumbs {
    position: relative;
    top: -0.5em;
  }
}
.aioseo-breadcrumbs a {
  color: var(--white);
}

html {
  scroll-behavior: smooth;
}
html.lock {
  overflow: hidden;
}

body {
  font-feature-settings: "palt";
  font-size: clamp(0.875rem, 0.775rem + 0.25vw, 1rem);
  letter-spacing: 0.1em;
  line-height: 1.15;
  font-optical-sizing: auto;
  color: var(--text);
  font-family: "Noto Sans JP", "Yu Gothic", "YuGothic", sans-serif;
  font-weight: normal;
  background: var(--primary);
  padding-top: clamp(60px, 8.6111111111vw, 124px);
}

.mv-section {
  padding-top: max(20 / 16 * 1rem, 80 / 1920 * 100vw);
  padding-bottom: max(60 / 16 * 1rem, 120 / 1920 * 100vw);
  background: linear-gradient(to bottom, var(--primary) 10vw, transparent 10vw);
  position: relative;
  overflow: hidden;
}
.mv-section::before {
  content: "";
  position: absolute;
  top: 0%;
  left: 0;
  width: 200%;
  height: 100%;
  background: url(../images/bg-img.webp) no-repeat top center/cover;
  z-index: -1;
  -webkit-animation: bgMove 10s ease-in-out infinite;
          animation: bgMove 10s ease-in-out infinite;
}
.mv-section > .inner {
  width: 100%;
  aspect-ratio: 1920/914;
  position: relative;
  margin-bottom: 2vw;
}
@media (max-width: 767px) {
  .mv-section > .inner {
    aspect-ratio: initial;
    height: calc(100dvh - 80px);
  }
}

.maincatch {
  width: max(64 / 16 * 1rem, 128 / 1920 * 100vw);
  height: auto;
  display: block;
  position: absolute;
  top: 3%;
  left: 50%;
  transform: translateX(-50%);
}
@media (max-width: 767px) {
  .maincatch {
    width: 218px;
    top: 39dvh;
    transform: translateX(-25%);
    z-index: 10;
  }
}

.hero-area1,
.hero-area2 {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: all 0.5s ease-out;
}
.hero-area1.is-visible,
.hero-area2.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.hero-area1 figure,
.hero-area2 figure {
  position: absolute;
}
.hero-area1 figure img,
.hero-area2 figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-mask-image: linear-gradient(to right, #000, #000);
          mask-image: linear-gradient(to right, #000, #000);
  -webkit-mask-size: 0% 100%;
          mask-size: 0% 100%;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center center;
          mask-position: center center;
  opacity: 0;
}
.hero-area1 figure.is-visible img,
.hero-area2 figure.is-visible img {
  -webkit-animation: photoAnim 1s ease-out forwards;
          animation: photoAnim 1s ease-out forwards;
}
.hero-area1 figure.photo1,
.hero-area2 figure.photo1 {
  bottom: 10%;
  left: 0;
  width: 17.7%;
  z-index: 5;
}
@media (max-width: 767px) {
  .hero-area1 figure.photo1,
.hero-area2 figure.photo1 {
    bottom: initial;
    top: 22%;
    width: 30%;
  }
}
.hero-area1 figure.photo2,
.hero-area2 figure.photo2 {
  top: 0;
  left: 15.625%;
  width: 26%;
  z-index: 4;
}
@media (max-width: 767px) {
  .hero-area1 figure.photo2,
.hero-area2 figure.photo2 {
    left: 26.9%;
    width: 47%;
  }
}
.hero-area1 figure.photo3,
.hero-area2 figure.photo3 {
  top: 10.41%;
  right: 23.54%;
  width: 18%;
  z-index: 2;
}
@media (max-width: 767px) {
  .hero-area1 figure.photo3,
.hero-area2 figure.photo3 {
    width: 32.8%;
    top: 60%;
    right: initial;
    left: 15%;
  }
}
.hero-area1 figure.photo4,
.hero-area2 figure.photo4 {
  bottom: 0;
  right: 10.2%;
  width: 16.66%;
  z-index: 3;
}
@media (max-width: 767px) {
  .hero-area1 figure.photo4,
.hero-area2 figure.photo4 {
    width: 27%;
    right: 28.9%;
  }
}
.hero-area1 figure.photo5,
.hero-area2 figure.photo5 {
  top: 0;
  right: 0;
  width: 20.83%;
  z-index: 1;
}
@media (max-width: 767px) {
  .hero-area1 figure.photo5,
.hero-area2 figure.photo5 {
    width: 34.3%;
    right: 12.3%;
    top: 55%;
  }
}

.hero-area1 .photo1.is-visible {
  -webkit-animation: fadePhoto1 0.5s ease-out forwards;
          animation: fadePhoto1 0.5s ease-out forwards;
}

.hero-area1 .photo2.is-visible {
  -webkit-animation: fadePhoto2 0.5s ease-out forwards;
          animation: fadePhoto2 0.5s ease-out forwards;
}

.hero-area1 .photo3.is-visible {
  -webkit-animation: fadePhoto3 0.5s ease-out forwards;
          animation: fadePhoto3 0.5s ease-out forwards;
}

.hero-area1 .photo4.is-visible {
  -webkit-animation: fadePhoto4 0.5s ease-out forwards;
          animation: fadePhoto4 0.5s ease-out forwards;
}

.hero-area1 .photo5.is-visible {
  -webkit-animation: fadePhoto5 0.5s ease-out forwards;
          animation: fadePhoto5 0.5s ease-out forwards;
}

.hero-area2 .photo1.is-visible {
  -webkit-animation: fadePhoto1 0.5s ease-out forwards;
          animation: fadePhoto1 0.5s ease-out forwards;
}

.hero-area2 .photo2.is-visible {
  -webkit-animation: fadePhoto2 0.5s ease-out forwards;
          animation: fadePhoto2 0.5s ease-out forwards;
}

.hero-area2 .photo3.is-visible {
  -webkit-animation: fadePhoto3 0.5s ease-out forwards;
          animation: fadePhoto3 0.5s ease-out forwards;
}

.hero-area2 .photo4.is-visible {
  -webkit-animation: fadePhoto4 0.5s ease-out forwards;
          animation: fadePhoto4 0.5s ease-out forwards;
}

.hero-area2 .photo5.is-visible {
  -webkit-animation: fadePhoto5 0.5s ease-out forwards;
          animation: fadePhoto5 0.5s ease-out forwards;
}

.big-text {
  position: absolute;
  bottom: -6vw;
  left: 0;
  z-index: 10;
  width: 100%;
  overflow: hidden;
}
@media (max-width: 767px) {
  .big-text {
    bottom: 40.5%;
  }
}
.big-text .inner {
  width: 286%;
  -webkit-animation: bigTextMove 36s linear infinite;
          animation: bigTextMove 36s linear infinite;
}
@media (max-width: 767px) {
  .big-text .inner {
    width: 600%;
  }
}
.big-text .inner img {
  width: 100%;
}

.image-area {
  overflow: hidden;
  background: linear-gradient(to top, var(--white) 10vw, transparent 10vw);
  padding-top: max(180 / 16 * 1rem, 360 / 1920 * 100vw);
  position: relative;
}
.image-area .bg-feature {
  position: absolute;
  width: 100%;
  height: 150%;
  inset: 0;
  z-index: -1;
}
.image-area .bg-feature img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.feature-img-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.feature-wrap {
  padding-top: max(40 / 16 * 1rem, 80 / 1920 * 100vw);
  padding-bottom: max(60 / 16 * 1rem, 120 / 1920 * 100vw);
  display: grid;
  grid-template-columns: 1fr -webkit-max-content;
  grid-template-columns: 1fr max-content;
  align-items: center;
}
@media (max-width: 767px) {
  .feature-wrap {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .feature-wrap .btn {
    margin-inline: auto;
  }
}
.feature-wrap .text-box {
  display: flex;
  flex-direction: column;
  gap: max(12 / 16 * 1rem, 24 / 1920 * 100vw);
}
.feature-wrap .sub-text {
  font-size: max(20 / 16 * 1rem, 40 / 1920 * 100vw);
  line-height: 1.2;
  font-family: "Shippori Mincho", serif;
}
.feature-wrap .menu-name {
  font-size: max(40 / 16 * 1rem, 120 / 1920 * 100vw);
  line-height: 1.2;
  font-family: "Aboreto", cursive;
}
.feature-wrap .menu-name span {
  font-size: 0.66em;
}
.feature-wrap .menu-name sub {
  font-size: clamp(0.75rem, 0.55rem + 0.5vw, 1rem);
  color: var(--gray-dark);
}

.distance-wrap {
  position: relative;
  overflow: hidden;
}

.dressing-section {
  padding-bottom: max(60 / 16 * 1rem, 120 / 1920 * 100vw);
}

.dressing-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: max(60 / 16 * 1rem, 120 / 1920 * 100vw);
}
@media (max-width: 767px) {
  .dressing-wrap {
    grid-template-columns: 1fr;
  }
}

.service-section {
  container-type: inline-size;
}
.service-section .service-list a {
  display: block;
  background: linear-gradient(to bottom, #DFDFDF, #fff);
  position: relative;
}
.service-section .service-list a:hover::before {
  opacity: 1;
}
.service-section .service-list a:hover .btn span {
  transform: translateX(8%);
}
.service-section .service-list a:hover .text-box {
  color: var(--white);
}
.service-section .service-list a::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url(../images/bg-menu.webp) no-repeat center/cover;
  opacity: 0;
  transition: all 0.3s ease-out;
  z-index: 1;
}
.service-section .service-list a .service-item {
  display: flex;
  align-items: center;
  margin-left: calc(50% - 50cqi);
}
.service-section .service-list a figure {
  width: max(80 / 16 * 1rem, 540 / 1920 * 100vw);
  position: relative;
  z-index: 2;
  overflow: hidden;
}
@media (max-width: 767px) {
  .service-section .service-list a figure {
    width: 100px;
    aspect-ratio: 1;
  }
}
.service-section .service-list a figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.service-section .service-list a .text-box {
  display: flex;
  flex-direction: column;
  gap: max(8 / 16 * 1rem, 16 / 1920 * 100vw);
  padding-left: max(16 / 16 * 1rem, 120 / 1920 * 100vw);
  flex: 1;
  position: relative;
  z-index: 2;
  color: var(--text);
  transition: all 0.3s ease-out;
}
@media (max-width: 767px) {
  .service-section .service-list a .text-box {
    padding-left: 1rem;
  }
}
.service-section .service-list a .text-box .sub-text {
  font-size: max(14 / 16 * 1rem, 28 / 1920 * 100vw);
  line-height: 1.2;
  font-family: "Shippori Mincho", serif;
}
.service-section .service-list a .text-box .menu-name {
  font-size: max(32 / 16 * 1rem, 80 / 1920 * 100vw);
  line-height: 1.2;
  font-family: "Aboreto", cursive;
  letter-spacing: 0;
}
.service-section .service-list a .text-box .menu-name span {
  font-size: 0.66em;
}
.service-section .service-list a .btn {
  position: relative;
  z-index: 2;
}
@media (max-width: 767px) {
  .service-section .service-list a .btn {
    width: 40px;
  }
}
.service-section .service-list.column2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
@media (max-width: 767px) {
  .service-section .service-list.column2 {
    grid-template-columns: 1fr;
  }
}
.service-section .service-list.column2 .service-item {
  margin-left: 0;
  padding-right: max(24 / 16 * 1rem, 60 / 1920 * 100vw);
}
.service-section .service-list.column2 .service-item figure {
  width: max(100 / 16 * 1rem, 260 / 1920 * 100vw);
}
.service-section .service-list.column2 .service-item .text-box {
  padding-left: max(16 / 16 * 1rem, 80 / 1920 * 100vw);
}
.service-section .service-list.column2 .service-item .text-box .menu-name {
  font-size: max(20 / 16 * 1rem, 64 / 1920 * 100vw);
}
.service-section .service-list.column2 .service-item .text-box .sub-text {
  font-size: max(12 / 16 * 1rem, 28 / 1920 * 100vw);
}

.case-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: max(4 / 16 * 1rem, 40 / 1920 * 100vw);
}
@media (max-width: 767px) {
  .case-list {
    grid-template-columns: repeat(2, 1fr);
  }
}
.case-list li {
  aspect-ratio: 1;
  overflow: hidden;
}
.case-list li img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.instagram-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: max(4 / 16 * 1rem, 40 / 1920 * 100vw);
}
@media (max-width: 767px) {
  .instagram-list {
    grid-template-columns: repeat(2, 1fr);
  }
}
.instagram-list li {
  aspect-ratio: 1;
  overflow: hidden;
}
.instagram-list li img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.news-list {
  display: flex;
  flex-direction: column;
  gap: max(4 / 16 * 1rem, 8 / 1920 * 100vw);
}
.news-list.lower {
  width: max(640 / 16 * 1rem, 1200 / 1920 * 100vw);
  margin-inline: auto;
}
@media (max-width: 767px) {
  .news-list.lower {
    width: 100%;
  }
}
.news-list.lower a {
  background: var(--white);
}
.news-list a {
  display: flex;
  align-items: center;
  gap: 1em;
  color: var(--text);
  padding: 1.5em;
  background: var(--gray-light);
  position: relative;
  padding-right: 4em;
  border-bottom: 1px solid transparent;
}
@media (max-width: 767px) {
  .news-list a {
    flex-direction: column;
    align-items: flex-start;
  }
}
.news-list a::before {
  content: "";
  width: 1.5em;
  aspect-ratio: 1;
  -webkit-mask: url(../images/icon/arrow.svg) no-repeat center/contain;
          mask: url(../images/icon/arrow.svg) no-repeat center/contain;
  background: var(--text);
  position: absolute;
  right: 2em;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.3s ease-out;
}
.news-list a:hover {
  border-bottom-color: var(--text);
}
.news-list a:hover::before {
  right: 1.5em;
}
.news-list a .post-title {
  line-height: 1.4;
}

.date-cate {
  display: flex;
  align-items: center;
  gap: 1em;
  width: 165px;
}
.date-cate time {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  font-variant-numeric: tabular-nums;
}
.date-cate .category {
  background: var(--accent);
  color: var(--white);
  padding: 0.25em 0.5em;
}

.f-image {
  width: 100%;
  aspect-ratio: 192/80;
  overflow: hidden;
}

.access-map {
  width: 100%;
  aspect-ratio: 144/64;
}
@media (max-width: 767px) {
  .access-map {
    aspect-ratio: 1;
  }
}
.access-map iframe {
  width: 100%;
  height: 100%;
  border: 0;
  filter: grayscale(100%);
}

.info-list {
  display: flex;
  flex-direction: column;
  gap: max(40 / 16 * 1rem, 40 / 1920 * 100vw);
}
.info-list dl {
  display: grid;
  grid-template-columns: 200px 1fr;
}
@media (max-width: 767px) {
  .info-list dl {
    grid-template-columns: 1fr;
  }
}
.info-list dl dt {
  color: var(--accent);
  display: flex;
  gap: clamp(8px, 1.1111111111vw, 16px);
  align-items: center;
  border-right: 1px solid var(--accent);
  padding-right: clamp(16px, 1.6666666667vw, 24px);
}
@media (max-width: 767px) {
  .info-list dl dt {
    border-right: none;
    padding-right: 0;
    border-bottom: 1px solid var(--accent);
    padding-bottom: 0.25em;
    margin-bottom: 1em;
  }
}
.info-list dl dd {
  padding-left: max(16 / 16 * 1rem, 40 / 1920 * 100vw);
}
.info-list dl dd .phone-number {
  font-family: "Aboreto", cursive;
  font-size: max(32 / 16 * 1rem, 48 / 1920 * 100vw);
  line-height: 1.2;
  color: var(--text);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
@media (max-width: 767px) {
  .info-list dl dd .phone-number {
    -webkit-user-select: auto;
       -moz-user-select: auto;
            user-select: auto;
  }
}

.contact-section {
  background: url(../images/bg-contact.webp) no-repeat center/cover;
  padding-bottom: max(60 / 16 * 1rem, 120 / 1920 * 100vw);
}

.f-link-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: max(24 / 16 * 1rem, 40 / 1920 * 100vw);
}
@media (max-width: 767px) {
  .f-link-list {
    grid-template-columns: 1fr;
  }
}
.f-link-list a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  background: var(--primary);
  padding: clamp(34px, 2.7777777778vw, 40px);
  color: var(--white);
  font-size: max(18 / 16 * 1rem, 24 / 1920 * 100vw);
}
@media (max-width: 767px) {
  .f-link-list a {
    flex-direction: row;
    justify-content: space-between;
  }
}
.f-link-list a .btn.outer {
  width: 40px;
}
.f-link-list a .insta {
  padding-left: 2em;
  position: relative;
}
.f-link-list a .insta::before {
  content: "";
  width: 1.5em;
  aspect-ratio: 1;
  -webkit-mask: url(../images/icon/instagram.svg) no-repeat center/contain;
          mask: url(../images/icon/instagram.svg) no-repeat center/contain;
  background: var(--white);
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.f-link-list a:hover .btn.outer span {
  transform: translate(20%, -20%);
}

.f-info-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: max(24 / 16 * 1rem, 80 / 1920 * 100vw);
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  padding-top: max(40 / 16 * 1rem, 80 / 1920 * 100vw);
}
@media (max-width: 767px) {
  .f-info-wrap {
    flex-direction: column;
  }
}

.phone-number {
  font-family: "Aboreto", cursive;
  font-size: max(32 / 16 * 1rem, 64 / 1920 * 100vw);
  line-height: 1.2;
  color: var(--white);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
@media (max-width: 767px) {
  .phone-number {
    -webkit-user-select: auto;
       -moz-user-select: auto;
            user-select: auto;
  }
}
.phone-number a {
  color: var(--white);
  padding-left: 1.75em;
  white-space: nowrap;
  position: relative;
}
.phone-number a::before {
  content: "";
  width: 1.4em;
  aspect-ratio: 1;
  -webkit-mask: url(../images/icon/phone.svg) no-repeat center/50%;
          mask: url(../images/icon/phone.svg) no-repeat center/50%;
  background: var(--white);
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
}
.phone-number a::after {
  content: "";
  width: 1.4em;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--primary);
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
}
.phone-number.icon-white a::before {
  background: var(--primary);
}
.phone-number.icon-white a::after {
  background: var(--white);
}

.lower-title-section {
  background: url(../images/bg-img.webp) no-repeat center/cover;
  padding-top: max(40 / 16 * 1rem, 80 / 1920 * 100vw);
  padding-bottom: max(150 / 16 * 1rem, 255 / 1920 * 100vw);
}

.about-top-img {
  display: flex;
}
.about-top-img img {
  width: 50%;
}

.about-slide {
  padding-bottom: max(64 / 16 * 1rem, 120 / 1920 * 100vw);
}

.stuff-sec {
  padding-bottom: 0;
}

.manager-profile {
  display: grid;
  grid-template-columns: 9fr 20fr;
  align-items: flex-end;
  gap: max(40 / 16 * 1rem, 80 / 1920 * 100vw);
  position: relative;
}
@media (max-width: 1024px) {
  .manager-profile {
    grid-template-columns: 1fr;
    text-align: center;
  }
}
.manager-profile::before {
  content: "";
  width: 100cqi;
  height: 100%;
  top: 0;
  left: calc(50% - 50cqi);
  background: linear-gradient(to top, #F3F3F3, #fff 50%);
  position: absolute;
  z-index: 0;
  border-bottom: 1px solid var(--gray);
}
.manager-profile .big-text {
  width: 100%;
  position: absolute;
  top: -4vw;
  left: 0;
  z-index: 0;
}
.manager-profile .image {
  position: relative;
  z-index: 1;
}
@media (max-width: 767px) {
  .manager-profile .image {
    width: 55%;
    margin-inline: auto;
  }
}
.manager-profile .text-box {
  display: flex;
  flex-direction: column;
  gap: clamp(16px, 2.2222222222vw, 32px);
  position: relative;
  padding-bottom: 3vw;
}
.manager-profile .text-box .text {
  font-size: max(14 / 16 * 1rem, 16 / 1920 * 100vw);
  text-align: left;
}
.manager-profile .text-box .name {
  font-size: max(20 / 16 * 1rem, 28 / 1920 * 100vw);
  font-family: "Shippori Mincho", serif;
  line-height: 1.6;
}
.manager-profile .text-box .name span {
  font-size: 0.71em;
  padding-right: 1em;
}
.manager-profile .text-box .info-wrap {
  display: flex;
  gap: 3.5rem;
}
@media (max-width: 1024px) {
  .manager-profile .text-box .info-wrap {
    flex-direction: column;
    gap: 1em;
  }
}

.prof-meta-info {
  border-left: 1px solid var(--accent);
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 1em;
  padding: 0.4em;
  padding-left: 1em;
}
.prof-meta-info dt {
  color: var(--accent);
}
.prof-meta-info dd {
  text-align: left;
}
.prof-meta-info.text {
  line-height: 1.5;
}

.stuff-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  position: relative;
}
.stuff-list::before {
  content: "";
  width: 0;
  height: 100%;
  border-left: 1px solid var(--gray);
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}
@media (max-width: 1024px) {
  .stuff-list::before {
    display: none;
  }
}
@media (max-width: 1024px) {
  .stuff-list {
    grid-template-columns: 1fr;
  }
}

.stuff-card {
  display: grid;
  grid-template-columns: 408fr 240fr;
  align-items: center;
  gap: 1rem;
  padding-top: 3vw;
  position: relative;
  border-bottom: 1px solid var(--gray);
  margin-left: calc(100% - 50cqi);
  padding-left: calc(50cqi - 100%);
  background: linear-gradient(to top, #F3F3F3, #fff 50%);
}
@media (max-width: 1024px) {
  .stuff-card {
    margin-left: calc(50% - 50cqi);
    width: 100cqi;
    padding-left: calc(50cqi - 100%);
    grid-template-columns: 1fr 1fr;
    align-items: center;
  }
  .stuff-card .text {
    font-size: 0.75rem;
    line-height: 1.6;
  }
}
.stuff-card:nth-of-type(even) {
  margin-left: initial;
  padding-left: initial;
  margin-right: calc(100% - 50cqi);
  padding-right: calc(50cqi - 100%);
}
@media (max-width: 1024px) {
  .stuff-card:nth-of-type(even) {
    margin-left: calc(50% - 50cqi);
    width: 100cqi;
  }
}
.stuff-card .image {
  position: relative;
  display: flex;
  align-items: flex-end;
  height: 100%;
}
.stuff-card .image .bg-text {
  writing-mode: sideways-lr;
  line-height: 1;
  color: rgba(0, 0, 0, 0.2);
  font-size: max(48 / 16 * 1rem, 100 / 1920 * 100vw);
  font-family: "Aboreto", cursive;
  position: absolute;
  top: 0;
  left: 1vw;
  z-index: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.stuff-card .image img {
  position: relative;
}
.stuff-card .text-box {
  display: flex;
  flex-direction: column;
  gap: clamp(16px, 2.2222222222vw, 32px);
  min-height: 270px;
  position: relative;
}
@media (max-width: 1024px) {
  .stuff-card .text-box {
    min-height: auto;
  }
}
.stuff-card .text-box .name-wrap {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  font-family: "Shippori Mincho", serif;
}
.stuff-card .text-box .name-wrap .job {
  font-size: clamp(1rem, 0.8rem + 0.5vw, 1.25rem);
}
.stuff-card .text-box .name-wrap .name {
  font-size: clamp(1.25rem, 0.85rem + 1vw, 1.75rem);
}

.about-story-wrap {
  position: relative;
}
.about-story-wrap picture {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.about-story-wrap .story-card {
  overflow: hidden;
  position: -webkit-sticky;
  position: sticky;
  top: 8vw;
}
.about-story-wrap .story-card .text-box {
  position: absolute;
  left: 50%;
  top: 0;
  height: 100%;
  padding: 0 clamp(16px, 6.9444444444vw, 100px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: clamp(32px, 5.5555555556vw, 80px);
}
@media (max-width: 767px) {
  .about-story-wrap .story-card .text-box {
    left: 0;
    justify-content: flex-end;
    padding-bottom: 2rem;
  }
  .about-story-wrap .story-card .text-box.sp-white {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
    color: var(--white);
    --text: #fff;
  }
}
.about-story-wrap .story-card .text-box h3 {
  font-size: max(20 / 16 * 1rem, 28 / 1920 * 100vw);
  font-family: "Shippori Mincho", serif;
  line-height: 1.2;
}
.about-story-wrap .story-card .text-box p {
  letter-spacing: 0.15em;
}

.case-card {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 2;
  gap: 0;
}
.case-card p {
  background: var(--primary);
  text-align: center;
  color: var(--white);
  padding: 0 0.25em;
  height: 40px;
  font-size: max(12 / 16 * 1rem, 16 / 1920 * 100vw);
  display: grid;
  place-items: center;
  line-height: 1.3;
}

.about-case-wrap {
  display: grid;
  grid-template-columns: 4fr 5fr;
  gap: max(24 / 16 * 1rem, 80 / 1920 * 100vw);
}
@media (max-width: 767px) {
  .about-case-wrap {
    display: flex;
    flex-direction: column-reverse;
  }
}
.about-case-wrap figure {
  position: relative;
  aspect-ratio: 620/794;
}
@media (max-width: 767px) {
  .about-case-wrap figure {
    aspect-ratio: 6/5;
  }
}
.about-case-wrap figure .image2 {
  width: 70%;
  position: absolute;
  left: 90%;
  bottom: 0;
}
@media (max-width: 767px) {
  .about-case-wrap figure .image1 {
    width: 70%;
  }
  .about-case-wrap figure .image2 {
    left: initial;
    right: 0;
    width: 40%;
  }
}
.about-case-wrap .text-box {
  padding-top: 3vw;
}
@media (max-width: 767px) {
  .about-case-wrap .text-box {
    padding-top: 0;
  }
}
.about-case-wrap .text-box .about-case-list {
  display: flex;
  flex-direction: column;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  gap: 0.5em;
}
@media (max-width: 767px) {
  .about-case-wrap .text-box .about-case-list {
    width: 100%;
  }
}
.about-case-wrap .text-box .about-case-list li {
  padding: 0.5em 0;
  padding-left: 1.75em;
  position: relative;
  color: var(--accent);
  border-bottom: 1px solid var(--gray);
}
.about-case-wrap .text-box .about-case-list li::before {
  content: "";
  width: 1.5em;
  aspect-ratio: 1;
  border-radius: 50%;
  -webkit-mask: url(../images/icon/check.svg) no-repeat center/contain;
          mask: url(../images/icon/check.svg) no-repeat center/contain;
  background: var(--accent);
  position: absolute;
  left: 0;
  top: 0.4lh;
}

.media-text64 {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
.media-text64 .item {
  display: grid;
  grid-template-columns: 55fr 45fr;
  gap: clamp(8px, 3.3333333333vw, 48px);
  align-items: center;
}
@media (max-width: 767px) {
  .media-text64 .item {
    grid-template-columns: 1fr;
  }
}
.media-text64 .item .text-box {
  display: flex;
  flex-direction: column;
  gap: clamp(8px, 2.2222222222vw, 32px);
}

.heading40 {
  font-size: max(28 / 16 * 1rem, 40 / 1920 * 100vw);
  line-height: 1.6;
}

.note-box {
  border: 1px solid var(--white);
  padding: 1.5em;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  margin-inline: auto;
}

.pb120 {
  padding-bottom: max(60 / 16 * 1rem, 120 / 1920 * 100vw);
}

.list-check li {
  padding: 0.5em 0;
  padding-left: 1.75em;
  position: relative;
  color: var(--accent);
  border-bottom: 1px solid var(--gray);
}
.list-check li::before {
  content: "";
  width: 1.5em;
  aspect-ratio: 1;
  border-radius: 50%;
  -webkit-mask: url(../images/icon/check.svg) no-repeat center/contain;
          mask: url(../images/icon/check.svg) no-repeat center/contain;
  background: var(--accent);
  position: absolute;
  left: 0;
  top: 0.4lh;
}

.bg-gray {
  background: var(--gray-light);
  padding: max(16 / 16 * 1rem, 80 / 1920 * 100vw);
}

.price-box {
  border: 3px solid var(--text);
  padding: 40px 32px;
}
.price-box.white {
  --text: #fff;
}

.hr {
  border: 1px solid var(--gray-dark);
  margin-block: max(16 / 16 * 1rem, 40 / 1920 * 100vw);
}

.menu-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: max(32 / 16 * 1rem, 120 / 1920 * 100vw) max(16 / 16 * 1rem, 80 / 1920 * 100vw);
}
@media (max-width: 767px) {
  .menu-list {
    grid-template-columns: 1fr;
  }
}

.menu-card {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.menu-card .menu-price-wrap {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.menu-card .menu-price {
  display: flex;
  gap: 1em;
  justify-content: space-between;
  align-items: baseline;
}
.menu-card .menu-price .price {
  font-size: clamp(1.25rem, 0.85rem + 1vw, 1.75rem);
  font-family: "Shippori Mincho", serif;
}

.post-wrap {
  margin-top: max(24 / 16 * 1rem, 40 / 1920 * 100vw);
  background: var(--white);
  padding: max(40 / 16 * 1rem, 80 / 1920 * 100vw) max(16 / 16 * 1rem, 48 / 1920 * 100vw);
}
.post-wrap .container {
  width: min(1200px, 100%);
}
.post-wrap h1 {
  font-size: clamp(1.75rem, 1.15rem + 1.5vw, 2.5rem);
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 0.5em;
}
.post-wrap h2 {
  font-size: clamp(1.5rem, 1.1rem + 1vw, 2rem);
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 0.5em;
}
.post-wrap h3 {
  font-size: clamp(1.25rem, 0.85rem + 1vw, 1.75rem);
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 0.5em;
}
.post-wrap h4 {
  font-size: clamp(1.125rem, 0.825rem + 0.75vw, 1.5rem);
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 0.5em;
}
.post-wrap h5 {
  font-size: clamp(1rem, 0.8rem + 0.5vw, 1.25rem);
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 0.5em;
}
.post-wrap h6 {
  font-size: clamp(0.875rem, 0.775rem + 0.25vw, 1rem);
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 0.5em;
}
.post-wrap p {
  font-size: clamp(0.875rem, 0.775rem + 0.25vw, 1rem);
  line-height: 2.4;
}
.post-wrap p + p {
  margin-top: 1rem;
}
.post-wrap p + h1,
.post-wrap p + h2,
.post-wrap p + h3,
.post-wrap p + h4,
.post-wrap p + h5,
.post-wrap p + h6 {
  margin-top: 3rem;
}

.post-data-cate {
  display: flex;
}

.gallery-muuri {
  margin-top: max(24 / 16 * 1rem, 120 / 1920 * 100vw);
}

.gallery-switch {
  border-bottom: 8px solid var(--primary);
  display: flex;
  justify-content: center;
  gap: max(8 / 16 * 1rem, 36 / 1920 * 100vw);
}
@media (max-width: 767px) {
  .gallery-switch {
    gap: 0;
    border-bottom-width: 4px;
  }
}
.gallery-switch input {
  display: none;
}
.gallery-switch li {
  border: 1px solid var(--primary);
  border-bottom: 0;
}
.gallery-switch li label {
  background: var(--white);
  height: max(40 / 16 * 1rem, 85 / 1920 * 100vw);
  width: max(78 / 16 * 1rem, 295 / 1920 * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: max(13 / 16 * 1rem, 20 / 1920 * 100vw);
}
.gallery-switch li label:has(:checked) {
  background: var(--primary);
  color: var(--white);
}
@media (max-width: 767px) {
  .gallery-switch li:not(:first-of-type) {
    border-left: 0;
  }
}

.gallery-muuri {
  position: relative;
  margin-inline: -20px;
}
@media (max-width: 767px) {
  .gallery-muuri {
    margin-inline: -8px;
  }
}
.gallery-muuri .item {
  display: block;
  position: absolute;
  width: calc((100% - 120px) / 3);
  margin: 20px;
  z-index: 1;
}
@media (max-width: 767px) {
  .gallery-muuri .item {
    margin: 8px;
    width: calc((100% - 32px) / 2);
  }
}
.gallery-muuri .item2 {
  display: block;
  position: absolute;
  width: 100%;
  margin: 20px;
  z-index: 1;
}
@media (max-width: 767px) {
  .gallery-muuri .item2 {
    margin: 8px;
  }
}
.gallery-muuri .item.muuri-item-dragging {
  z-index: 3;
}
.gallery-muuri .item.muuri-item-releasing {
  z-index: 2;
}
.gallery-muuri .item.muuri-item-hidden {
  z-index: 0;
}
.gallery-muuri .item-content {
  position: relative;
  width: 100%;
  height: 100%;
}

.ba-card {
  background: var(--white);
  width: calc(100% - 40px);
  padding-block: max(16 / 16 * 1rem, 80 / 1920 * 100vw);
  padding-inline: max(16 / 16 * 1rem, 40 / 1920 * 100vw);
}
@media (max-width: 767px) {
  .ba-card {
    width: calc(100% - 16px);
  }
}
.ba-card .inner {
  width: min(1026px, 100%);
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1fr -webkit-max-content 1fr;
  grid-template-columns: 1fr max-content 1fr;
  gap: max(16 / 16 * 1rem, 40 / 1920 * 100vw);
}
@media (max-width: 767px) {
  .ba-card .inner {
    grid-template-columns: 1fr 1fr;
    gap: 1px;
  }
}
.ba-card .inner .arrow {
  display: block;
  width: max(20 / 16 * 1rem, 40 / 1920 * 100vw);
  height: 100%;
  aspect-ratio: 1;
  -webkit-mask: url(../images/icon/arrow.svg) no-repeat center/contain;
          mask: url(../images/icon/arrow.svg) no-repeat center/contain;
  background: var(--text);
}
@media (max-width: 767px) {
  .ba-card .inner .arrow {
    display: none;
  }
}
.ba-card .detail {
  display: grid;
  grid-template-columns: 6em 1fr;
  margin-top: 1em;
  font-size: clamp(0.75rem, 0.55rem + 0.5vw, 1rem);
}
@media (max-width: 767px) {
  .ba-card .detail {
    display: flex;
    flex-direction: column;
    gap: 0.5em;
  }
}
.ba-card .detail dt {
  color: var(--accent);
  position: relative;
}
@media (max-width: 767px) {
  .ba-card .detail dt {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    padding-right: 1.5em;
  }
}
.ba-card .detail dt::before {
  content: "：";
  position: absolute;
  right: 0.5em;
}

.g-card figure figcaption {
  min-height: 2.5lh;
  display: grid;
  place-items: center;
  background: var(--primary);
  color: var(--white);
  text-align: center;
  padding: 0.25em;
  font-size: max(12 / 16 * 1rem, 16 / 1920 * 100vw);
  line-height: 1.4;
}

.showMore {
  position: relative;
}
.showMore p {
  position: absolute;
  top: -3em;
  left: 50%;
  transform: translateX(-50%);
}
.showMore .btn {
  transform: rotate(90deg);
}
/*# sourceMappingURL=style.css.map */