@charset "UTF-8";
/*
Theme Name: RINOSUPE
Description: リノスペ 公式サイト リニューアルテーマ（2026）
Version: 0.1.0
*/
@font-face {
  font-family: "RnsNum";
  src: url("fonts/open-sans-latin.woff2") format("woff2");
  unicode-range: U+0030-0039;
  font-weight: 300 800;
  font-display: swap;
  size-adjust: 100%; }
/* 全要素を border-box に統一（padding/border を幅に含める） */
*,
*::before,
*::after {
  box-sizing: border-box; }

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,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  -webkit-padding-start: 0;
  line-height: 1;
  -webkit-text-size-adjust: none;
  -webkit-margin-before: 0;
  -webkit-margin-after: 0;
  -webkit-margin-start: 0;
  -webkit-margin-end: 0; }

ol,
ul {
  list-style: none; }

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

:where(input[type="password"],
input[type="text"],
input[type="submit"],
input[type="email"],
input[type="tel"],
input[type="date"],
input[type="button"],
button,
textarea,
select) {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none; }

input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: 96px; }

body,
html {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.8;
  font-family: "RnsNum", "Noto Sans JP", "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
  color: #0e0e0e;
  background: #ffffff;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility; }

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

figure {
  margin: 0; }
  figure img {
    width: 100%; }

a {
  font-size: inherit;
  color: inherit;
  text-decoration: inherit;
  transition: color 0.3s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }

em {
  font-style: normal; }

::selection {
  background: #ff7f11;
  color: #ffffff; }

.skip-link {
  position: absolute;
  top: -100px;
  left: 0;
  z-index: 1000;
  padding: 12px 20px;
  background: #0e0e0e;
  color: #ffffff; }
  .skip-link:focus {
    top: 0; }

.inner {
  width: 100%;
  max-width: 1248px;
  margin-inline: auto;
  padding-inline: 24px; }
  .inner--narrow {
    max-width: 888px; }

.main {
  display: block; }

.ph {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  background: #f6f6f5; }
  .ph::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(to right, rgba(14, 14, 14, 0.05) 1px, transparent 1px), linear-gradient(to bottom, rgba(14, 14, 14, 0.05) 1px, transparent 1px);
    background-size: 32px 32px; }
  .ph__mark {
    position: relative;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.24em;
    color: rgba(14, 14, 14, 0.22); }
  .ph--1 {
    background: #f6f6f5; }
  .ph--2 {
    background: #efefed; }
  .ph--3 {
    background: #e8e8e5; }
  .ph--4 {
    background: #fff4e8; }
  .ph--5 {
    background: #dededa; }

.empty {
  padding: 80px 0;
  text-align: center;
  color: #5a5a58; }

/* ==========================================================
   ロゴ（ヘッダー・フッター共通）
   288x43 の画像を高さ基準で表示（実寸の半分＝2x相当）
   ========================================================== */
.header__logo img,
.footer__logo img {
  display: block;
  width: auto;
  height: 22px; }
  @media (max-width: 640px) {
    .header__logo img,
    .footer__logo img {
      height: 19px; } }

/* ==========================================================
   ヘッダー
   ========================================================== */
.header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid #e4e4e2; }
  .header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    width: 100%;
    max-width: 1248px;
    height: 76px;
    margin-inline: auto;
    padding-inline: 24px; }
    @media (max-width: 980px) {
      .header__inner {
        height: 60px; } }
    @media (min-width: 981px) and (max-width: 1079px) {
      .header__inner {
        gap: 16px; } }
  .header__logo {
    flex-shrink: 0;
    margin: 0;
    padding-bottom: 6px; }
    .header__logo .header__catch {
      display: block;
      margin-bottom: 4px;
      font-size: 0.6875rem;
      font-weight: 500;
      line-height: 1.2;
      letter-spacing: 0.04em;
      color: #0e0e0e; }
      @media (max-width: 640px) {
        .header__logo .header__catch {
          margin-bottom: 2px;
          font-size: 0.6875rem; } }
    .header__logo a {
      display: block; }
      .header__logo a:hover {
        opacity: 0.7; }
    @media (min-width: 981px) and (max-width: 1039px) {
      .header__logo img {
        height: 20px; } }
  .header__actions {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-left: auto; }
    @media (max-width: 980px) {
      .header__actions .header__cta {
        display: none; } }
  .header__member {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 0.8125rem;
    font-weight: 700;
    white-space: nowrap; }
    .header__member::before {
      content: "";
      width: 15px;
      height: 15px;
      background: #0e0e0e;
      clip-path: path("M7.5 7.5a3.75 3.75 0 100-7.5 3.75 3.75 0 000 7.5zM7.5 9.4c-3 0-7.5 1.5-7.5 4.5V15h15v-1.1c0-3-4.5-4.5-7.5-4.5z");
      transition: background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
    .header__member:hover {
      color: #ff7f11; }
      .header__member:hover::before {
        background: #ff7f11; }
    @media (max-width: 980px) {
      .header__member {
        display: none; } }
  .header__member-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding-inline: 5px;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 0.6875rem;
    font-weight: 700;
    color: #ffffff;
    background: #ff7f11;
    border-radius: 9px; }

/* ==========================================================
   グローバルナビ
   ========================================================== */
@media (max-width: 980px) {
  .gnav {
    position: fixed;
    top: 60px;
    left: 0;
    width: 100%;
    height: calc(100vh - 60px);
    padding: 32px 24px 60px;
    background: #ffffff;
    overflow-y: auto;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity 0.35s cubic-bezier(0.22, 1, 0.36, 1), transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), visibility 0.35s; } }
@media (max-width: 980px) {
  .gnav.is-open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0); } }
.gnav__list {
  display: flex;
  align-items: center;
  gap: 28px;
  margin: 0;
  padding: 0;
  list-style: none; }
  @media (min-width: 981px) and (max-width: 1180px) {
    .gnav__list {
      gap: 16px; } }
  @media (min-width: 981px) and (max-width: 1040px) {
    .gnav__list {
      gap: 10px; } }
  @media (min-width: 981px) and (max-width: 1079px) {
    .gnav__list > .gnav__item > a {
      letter-spacing: 0; } }
  @media (max-width: 980px) {
    .gnav__list {
      display: block;
      border-top: 1px solid #e4e4e2; } }
@media (max-width: 980px) {
  .gnav__item {
    border-bottom: 1px solid #e4e4e2; } }
.gnav__item > a {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  line-height: 1.4;
  white-space: nowrap; }
  .gnav__item > a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -6px;
    width: 0;
    height: 2px;
    background: #ff7f11;
    transition: width 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
  .gnav__item > a:hover::after {
    width: 100%; }
  @media (max-width: 980px) {
    .gnav__item > a {
      flex-direction: row;
      align-items: baseline;
      gap: 12px;
      padding: 18px 4px;
      font-size: 1rem; }
      .gnav__item > a::after {
        display: none; } }
.gnav__foot {
  display: none; }
  @media (max-width: 980px) {
    .gnav__foot {
      display: block;
      margin-top: 32px; } }

/* ==========================================================
   ハンバーガー
   ========================================================== */
.hamburger {
  display: none;
  position: relative;
  width: 44px;
  height: 44px;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none; }
  @media (max-width: 980px) {
    .hamburger {
      display: block; } }
  .hamburger span:not(.hamburger__label) {
    position: absolute;
    left: 50%;
    display: block;
    width: 22px;
    height: 2px;
    background: #0e0e0e;
    pointer-events: none;
    transform: translateX(-50%);
    transition: top 0.35s cubic-bezier(0.22, 1, 0.36, 1), transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.2s cubic-bezier(0.22, 1, 0.36, 1); }
    .hamburger span:not(.hamburger__label):nth-of-type(1) {
      top: 11px; }
    .hamburger span:not(.hamburger__label):nth-of-type(2) {
      top: 19px; }
    .hamburger span:not(.hamburger__label):nth-of-type(3) {
      top: 27px; }
  .hamburger__label {
    position: absolute;
    left: 50%;
    bottom: 2px;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 0.5rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: #5a5a58;
    pointer-events: none;
    transform: translateX(-50%); }
  .hamburger[aria-expanded="true"] span:not(.hamburger__label):nth-of-type(1) {
    top: 19px;
    transform: translateX(-50%) rotate(45deg); }
  .hamburger[aria-expanded="true"] span:not(.hamburger__label):nth-of-type(2) {
    opacity: 0;
    transform: translateX(-50%) scaleX(0); }
  .hamburger[aria-expanded="true"] span:not(.hamburger__label):nth-of-type(3) {
    top: 19px;
    transform: translateX(-50%) rotate(-45deg); }

@media (max-width: 980px) {
  body.is-nav-open {
    overflow: hidden; } }

/* ==========================================================
   セクション共通
   ========================================================== */
.sec {
  padding-block: 120px; }
  @media (max-width: 980px) {
    .sec {
      padding-block: 80px; } }
  @media (max-width: 640px) {
    .sec {
      padding-block: 60px; } }
  .sec--business, .sec--stats, .sec--usecase {
    background: #f6f6f5; }
  .sec--termlead {
    padding-block: 16px; }
  .sec--filter {
    padding-block: 56px;
    border-bottom: 1px solid #e4e4e2; }
    @media (max-width: 640px) {
      .sec--filter {
        padding-block: 36px; } }
  .sec--list {
    padding-top: 72px; }
    @media (max-width: 640px) {
      .sec--list {
        padding-top: 48px; } }
  .sec--other, .sec--related {
    border-top: 1px solid #e4e4e2; }
  .sec--related .sec-head__title {
    font-size: clamp(1.5rem, 2.3vw, 2rem); }
  .sec--404 {
    padding-block: 160px;
    text-align: center; }
    @media (max-width: 640px) {
      .sec--404 {
        padding-block: 100px; } }

/* ==========================================================
   ヒーロー（TOP）
   ========================================================== */
.hero {
  position: relative;
  display: flex;
  align-items: center;
  min-height: calc(100vh - 76px);
  padding-block: 120px 140px;
  overflow: hidden;
  background: #0e0e0e;
  /* 背景スライダー */ }
  .hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(95deg, rgba(14, 14, 14, 0.5) 0%, rgba(14, 14, 14, 0.3) 34%, rgba(14, 14, 14, 0.09) 58%, rgba(14, 14, 14, 0.02) 100%), linear-gradient(to bottom, rgba(14, 14, 14, 0.14) 0%, transparent 22%, transparent 76%, rgba(14, 14, 14, 0.22) 100%);
    pointer-events: none; }
    @media (max-width: 980px) {
      .hero::after {
        background: linear-gradient(to bottom, rgba(14, 14, 14, 0.5) 0%, rgba(14, 14, 14, 0.36) 45%, rgba(14, 14, 14, 0.52) 100%); } }
  @media (max-width: 980px) {
    .hero {
      min-height: 0;
      padding-block: 80px 96px; } }
  .hero__slider {
    position: absolute;
    inset: 0;
    z-index: 0;
    background: #1a1a1a; }
  .hero__slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 1.6s cubic-bezier(0.22, 1, 0.36, 1); }
    .hero__slide.is-active {
      opacity: 1; }
      .hero__slide.is-active img {
        animation: kv-zoom 7.5s linear forwards; }
    .hero__slide img {
      width: 100%;
      height: 100%;
      object-fit: cover; }
  @media (prefers-reduced-motion: reduce) {
    .hero__slide {
      transition-duration: 0.6s; }
      .hero__slide.is-active img {
        animation: kv-zoom-soft 14s linear forwards; } }
  .hero__inner {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1248px;
    margin-inline: auto;
    padding-inline: 24px;
    color: #ffffff; }
    .hero__inner::before {
      content: "";
      position: absolute;
      left: -10%;
      top: -35%;
      width: 82%;
      height: 170%;
      z-index: -1;
      background: radial-gradient(ellipse at 34% 50%, rgba(14, 14, 14, 0.5) 0%, rgba(14, 14, 14, 0.28) 42%, transparent 72%);
      pointer-events: none; }
      @media (max-width: 980px) {
        .hero__inner::before {
          display: none; } }
  .hero__title {
    margin: 0 0 32px;
    font-size: clamp(2.5rem, 6.4vw, 5rem);
    font-weight: 800;
    line-height: 1.16;
    letter-spacing: -0.02em;
    text-shadow: 0 1px 3px rgba(14, 14, 14, 0.3), 0 4px 32px rgba(14, 14, 14, 0.5); }
  .hero__line {
    display: block; }
    .hero__line em {
      color: #ff7f11; }
  .hero__lead {
    max-width: 40em;
    margin: 0 0 44px;
    font-size: 1rem;
    line-height: 2;
    color: rgba(255, 255, 255, 0.86);
    text-shadow: 0 1px 2px rgba(14, 14, 14, 0.45), 0 2px 20px rgba(14, 14, 14, 0.55); }
    @media (max-width: 640px) {
      .hero__lead {
        font-size: 1rem;
        line-height: 1.9; } }
  .hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px; }
    .hero__actions .btn--line {
      color: #ffffff;
      background: rgba(14, 14, 14, 0.22);
      border-color: rgba(255, 255, 255, 0.7);
      backdrop-filter: blur(6px); }
      .hero__actions .btn--line:hover {
        color: #0e0e0e;
        background: #ffffff;
        border-color: #ffffff; }
  .hero__scroll {
    position: absolute;
    left: 50%;
    bottom: 28px;
    z-index: 2;
    margin: 0;
    padding-bottom: 56px;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.22em;
    color: rgba(255, 255, 255, 0.6);
    transform: translateX(-50%); }
    .hero__scroll::after {
      content: "";
      position: absolute;
      left: 50%;
      bottom: 0;
      width: 1px;
      height: 44px;
      background: linear-gradient(to bottom, rgba(255, 255, 255, 0.7), transparent);
      transform: translateX(-50%);
      animation: scroll-line 2.2s cubic-bezier(0.22, 1, 0.36, 1) infinite; }
    @media (max-width: 980px) {
      .hero__scroll {
        display: none; } }

@keyframes kv-zoom {
  from {
    transform: scale(1); }
  to {
    transform: scale(1.08); } }
@keyframes kv-zoom-soft {
  from {
    transform: scale(1); }
  to {
    transform: scale(1.03); } }
@keyframes scroll-line {
  0% {
    transform: translateX(-50%) scaleY(0);
    transform-origin: top; }
  45% {
    transform: translateX(-50%) scaleY(1);
    transform-origin: top; }
  55% {
    transform: translateX(-50%) scaleY(1);
    transform-origin: bottom; }
  100% {
    transform: translateX(-50%) scaleY(0);
    transform-origin: bottom; } }
/* ==========================================================
   ページヘッド（下層）
   ========================================================== */
.page-head {
  --ph-w: 38vw;
  --ph-cut: 0.3;
  position: relative;
  padding-block: 96px 80px;
  color: #ffffff;
  background-color: #1a1a1a;
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.09) 1px, transparent 1px), linear-gradient(to bottom, rgba(255, 255, 255, 0.09) 1px, transparent 1px);
  background-size: 64px 64px;
  overflow: hidden; }
  @media (max-width: 980px) {
    .page-head {
      --ph-w: 36vw; } }
  @media (max-width: 980px) {
    .page-head {
      padding-block: 64px 56px; } }
  @media (max-width: 640px) {
    .page-head {
      padding-block: 48px 40px; } }
  .page-head--sm {
    padding-block: 72px 60px; }
    @media (max-width: 640px) {
      .page-head--sm {
        padding-block: 44px 36px; } }
  .page-head .inner {
    position: relative;
    padding-right: calc(var(--ph-w) * (1 - var(--ph-cut) * 0.65) - (100vw - 100%) / 2 + 32px); }
    @media (max-width: 640px) {
      .page-head .inner {
        padding-right: 0; } }
  .page-head__ph {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: var(--ph-w);
    margin: 0;
    clip-path: polygon(calc(var(--ph-cut) * 100%) 0, 100% 0, 100% 100%, 0 100%); }
    .page-head__ph img {
      width: 100%;
      height: 100%;
      object-fit: cover; }
    @media (max-width: 640px) {
      .page-head__ph {
        display: none; } }
  .page-head__title {
    margin: 0;
    font-size: clamp(1.75rem, 3.2vw, 2.75rem);
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.01em;
    word-break: auto-phrase;
    text-wrap: balance; }
  .page-head__sub {
    font-size: 1.25rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.6); }
  .page-head__lead {
    max-width: 46em;
    margin: 20px 0 0;
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.86);
    white-space: pre-line; }
    @media (max-width: 640px) {
      .page-head__lead {
        font-size: 1rem; } }

/* ==========================================================
   セクション見出し
   ========================================================== */
.sec-head {
  margin-bottom: 56px; }
  @media (max-width: 640px) {
    .sec-head {
      margin-bottom: 36px; } }
  .sec-head--row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px; }
    @media (max-width: 640px) {
      .sec-head--row {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px; } }
  .sec-head--lg {
    max-width: 880px;
    margin-bottom: 64px; }
    @media (max-width: 640px) {
      .sec-head--lg {
        margin-bottom: 40px; } }
    .sec-head--lg .sec-head__title {
      font-size: clamp(1.75rem, 4.4vw, 3.5rem);
      line-height: 1.3;
      letter-spacing: -0.03em; }
    .sec-head--lg .sec-head__lead {
      margin-top: 24px;
      font-size: 1rem;
      line-height: 1.9; }
  .sec-head--center {
    text-align: center; }
    .sec-head--center .sec-head__lead {
      max-width: 42em;
      margin-inline: auto; }
    .sec-head--center::after {
      content: "";
      display: block;
      width: 2px;
      height: 32px;
      margin: 28px auto 0;
      background: #ff7f11; }
      @media (max-width: 640px) {
        .sec-head--center::after {
          height: 24px;
          margin-top: 20px; } }
  .sec-head__body {
    min-width: 0; }
  .sec-head__title {
    margin: 0;
    font-size: clamp(1.75rem, 3.2vw, 2.75rem);
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: -0.01em; }
  .sec-head__lead {
    margin: 16px 0 0;
    line-height: 1.7;
    color: #333333; }
    @media (max-width: 640px) {
      .sec-head__lead {
        font-size: 1rem; } }

/* ==========================================================
   TOP の余白
   下層より一段詰めて、1画面に入る情報量を増やす
   ========================================================== */
.home .sec {
  padding-block: 64px; }
  @media (max-width: 980px) {
    .home .sec {
      padding-block: 52px; } }
  @media (max-width: 640px) {
    .home .sec {
      padding-block: 40px; } }
.home .sec-head {
  margin-bottom: 28px; }
  @media (max-width: 640px) {
    .home .sec-head {
      margin-bottom: 20px; } }
  .home .sec-head__title {
    font-size: clamp(1.5rem, 2.3vw, 2rem); }
.home .sec--area .sec-head__title,
.home .sec--capacity .sec-head__title,
.home .sec--feature .sec-head__title {
  display: inline-flex;
  align-items: center;
  gap: 10px; }
  .home .sec--area .sec-head__title::before,
  .home .sec--capacity .sec-head__title::before,
  .home .sec--feature .sec-head__title::before {
    content: "";
    flex-shrink: 0;
    width: 1em;
    height: 1em;
    background: #ff7f11;
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain; }
.home .sec--area .sec-head__title::before {
  mask-image: url("../assets/img/icons/location-dot-solid-full.svg");
  -webkit-mask-image: url("../assets/img/icons/location-dot-solid-full.svg"); }
.home .sec--capacity .sec-head__title::before {
  mask-image: url("../assets/img/icons/users-solid-full.svg");
  -webkit-mask-image: url("../assets/img/icons/users-solid-full.svg"); }
.home .sec--feature .sec-head__title::before {
  mask-image: url("../assets/img/icons/kitchen-set-solid-full.svg");
  -webkit-mask-image: url("../assets/img/icons/kitchen-set-solid-full.svg"); }

/* ==========================================================
   CTA 帯
   ========================================================== */
.cta-band {
  position: relative;
  padding-block: 100px;
  overflow: hidden;
  color: #ffffff;
  background: #0e0e0e;
  text-align: center; }
  .cta-band__bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.32;
    pointer-events: none; }
  .cta-band::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0.045) 1px, transparent 1px), linear-gradient(to bottom, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
    background-size: 64px 64px;
    pointer-events: none; }
  @media (max-width: 640px) {
    .cta-band {
      padding-block: 64px; } }
  .cta-band .inner {
    position: relative;
    z-index: 2; }
  .cta-band__title {
    margin: 0 0 20px;
    font-size: clamp(1.75rem, 3.2vw, 2.75rem);
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: -0.01em;
    text-shadow: 0 1px 3px rgba(14, 14, 14, 0.45), 0 4px 28px rgba(14, 14, 14, 0.45); }
  .cta-band__lead {
    max-width: 46em;
    margin: 0 auto 40px;
    font-size: 1rem;
    line-height: 1.9;
    color: rgba(255, 255, 255, 0.86);
    text-shadow: 0 1px 3px rgba(14, 14, 14, 0.55); }
    @media (max-width: 640px) {
      .cta-band__lead {
        margin-bottom: 32px;
        font-size: 0.8125rem; } }

/* ==========================================================
   フッター
   ========================================================== */
.footer {
  padding-block: 72px 32px;
  background: #1a1a1a;
  color: rgba(255, 255, 255, 0.86); }
  @media (max-width: 640px) {
    .footer {
      padding-block: 48px 24px; } }
  .footer__top {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 64px;
    padding-bottom: 56px; }
    @media (max-width: 980px) {
      .footer__top {
        grid-template-columns: 1fr;
        gap: 40px;
        padding-bottom: 40px; } }
  .footer__logo {
    margin: 0 0 16px; }
  .footer__tagline {
    margin: 0;
    font-size: 0.8125rem;
    color: rgba(255, 255, 255, 0.6); }
  .footer__nav {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px; }
    @media (max-width: 640px) {
      .footer__nav {
        grid-template-columns: 1fr;
        gap: 28px; } }
  .footer__head {
    margin: 0 0 16px;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: #ffffff; }
  .footer__list {
    margin: 0;
    padding: 0;
    list-style: none; }
    .footer__list li {
      margin-bottom: 10px; }
    .footer__list a {
      font-size: 0.8125rem; }
      .footer__list a:hover {
        color: #ff7f11; }
  .footer__bottom {
    padding-top: 28px;
    border-top: 1px solid rgba(255, 255, 255, 0.12); }
  .footer__copy {
    margin: 0;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 0.6875rem;
    letter-spacing: 0.06em;
    color: rgba(255, 255, 255, 0.6); }

/* ==========================================================
   パンくず
   ========================================================== */
.pan {
  padding-block: 20px; }
  .pan__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none; }
  .pan__item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.6875rem;
    color: #5a5a58; }
    .pan__item + .pan__item::before {
      content: "/";
      font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
      color: #e4e4e2; }
    .pan__item a:hover {
      color: #bf5900; }
    .pan__item [aria-current="page"] {
      color: #0e0e0e; }

/* ==========================================================
   スペースカード
   ========================================================== */
.card-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px 32px; }
  @media (max-width: 980px) {
    .card-grid {
      grid-template-columns: repeat(2, 1fr);
      gap: 32px 24px; } }
  @media (max-width: 640px) {
    .card-grid {
      grid-template-columns: 1fr;
      gap: 32px; } }

/* ==========================================================
   お気に入りボタン
   ハートは Font Awesome ではなく CSS の clip-path で描く
   ========================================================== */
.fav {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0;
  font-size: 0.8125rem;
  color: #0e0e0e;
  border: 1px solid #e4e4e2;
  background: rgba(255, 255, 255, 0.92);
  cursor: pointer;
  transition: color 0.3s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.3s cubic-bezier(0.22, 1, 0.36, 1);
  -webkit-appearance: none;
  appearance: none; }
  .fav::before {
    content: "";
    flex-shrink: 0;
    width: 17px;
    height: 15px;
    background: #9a9a97;
    clip-path: path("M8.5 15C8.5 15 0 9.7 0 4.6 0 1.9 2 0 4.4 0 6.2 0 7.8 1 8.5 2.5 9.2 1 10.8 0 12.6 0 15 0 17 1.9 17 4.6c0 5.1-8.5 10.4-8.5 10.4z");
    transition: background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1), transform 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
  .fav:hover::before {
    background: #ff7f11; }
  .fav.is-active {
    border-color: #ff7f11; }
    .fav.is-active::before {
      background: #ff7f11; }
  .fav.is-bump::before {
    animation: fav-bump 0.4s cubic-bezier(0.22, 1, 0.36, 1); }
  .fav[disabled] {
    opacity: 0.5;
    cursor: wait; }
  .fav--card {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 2;
    width: 38px;
    height: 38px;
    backdrop-filter: blur(6px); }
    .fav--card .fav__text {
      position: absolute;
      width: 1px;
      height: 1px;
      margin: -1px;
      overflow: hidden;
      clip-path: inset(50%);
      white-space: nowrap; }
  .fav--detail {
    height: 38px;
    padding-inline: 16px;
    font-size: 0.8125rem;
    font-weight: 700; }
    .fav--detail.is-active {
      color: #bf5900; }

@keyframes fav-bump {
  0% {
    transform: scale(1); }
  40% {
    transform: scale(1.35); }
  100% {
    transform: scale(1); } }
.card {
  position: relative; }
  .card__link {
    display: block;
    height: 100%; }
    .card__link:hover .figure {
      opacity: 0.82; }
  .card__media {
    position: relative;
    margin-bottom: 20px;
    overflow: hidden;
    background: #f6f6f5; }
    .card__media .figure {
      display: block;
      transition: opacity 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
    .card__media img {
      display: block;
      width: 100%;
      aspect-ratio: 3 / 2;
      object-fit: cover; }
  .card__badge {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    padding: 6px 12px;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1;
    color: #0e0e0e;
    background: #ff7f11; }
  .card__area {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 1;
    padding: 7px 14px;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: #ffffff;
    background: rgba(14, 14, 14, 0.86);
    backdrop-filter: blur(6px); }
  .card__title {
    margin: 0 0 8px;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.6;
    transition: color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
  .card__station {
    margin: 0 0 14px;
    font-size: 0.8125rem;
    color: #5a5a58; }
  .card__spec {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 14px; }
  .card__spec-row {
    display: flex;
    align-items: baseline;
    gap: 6px;
    padding: 4px 10px;
    font-size: 0.8125rem;
    background: #f6f6f5; }
    .card__spec-row dt {
      font-weight: 500;
      color: #5a5a58; }
    .card__spec-row dd {
      margin: 0;
      font-weight: 700; }
  .card__price {
    margin: 0;
    padding-top: 14px;
    border-top: 1px solid #e4e4e2;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    white-space: nowrap; }
  .card__yen {
    margin-right: 0.08em;
    font-size: 0.75em; }
  .card__unit {
    font-size: 0.75em;
    font-weight: 600;
    color: #5a5a58; }

/* ==========================================================
   事業カード
   ========================================================== */
.biz-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px; }
  @media (max-width: 980px) {
    .biz-cards {
      grid-template-columns: 1fr;
      gap: 16px; } }

.biz-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 40px 32px 36px;
  background: #ffffff;
  border: 1px solid #e4e4e2;
  overflow: hidden; }
  .biz-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 3px;
    background: #ff7f11;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1); }
  .biz-card[href]:hover {
    border-color: #0e0e0e; }
    .biz-card[href]:hover::before {
      transform: scaleX(1); }
    .biz-card[href]:hover .biz-card__more {
      color: #bf5900; }
      .biz-card[href]:hover .biz-card__more::after {
        transform: translateX(6px); }
  @media (max-width: 640px) {
    .biz-card {
      padding: 28px 24px 26px; } }
  .biz-card__title {
    margin: 0 0 14px;
    font-size: clamp(1.5rem, 2.3vw, 2rem);
    font-weight: 600;
    line-height: 1.4; }
  .biz-card__lead {
    flex-grow: 1;
    margin: 0 0 28px;
    font-size: 1rem;
    line-height: 1.9;
    color: #333333;
    white-space: pre-line; }
    .biz-card__lead:last-child {
      margin-bottom: 0; }
  .biz-card__more {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    transition: color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
    .biz-card__more::after {
      content: "";
      width: 1.4em;
      height: 1.4em;
      flex-shrink: 0;
      background: currentColor;
      mask-image: url("../assets/img/icons/caret-right-solid-full.svg");
      mask-position: center;
      mask-repeat: no-repeat;
      mask-size: contain;
      -webkit-mask-image: url("../assets/img/icons/caret-right-solid-full.svg");
      -webkit-mask-position: center;
      -webkit-mask-repeat: no-repeat;
      -webkit-mask-size: contain;
      transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1); }

/* ==========================================================
   figure 共通
   ========================================================== */
.figure--about img {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover; }
.figure--hero {
  margin-bottom: 64px; }
  .figure--hero img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover; }
  .figure--hero .ph {
    aspect-ratio: 16 / 9; }
  @media (max-width: 640px) {
    .figure--hero {
      margin-bottom: 40px; } }
.figure--lead .ph {
  aspect-ratio: 4 / 3; }
.figure--lead img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover; }
.figure--about .ph {
  aspect-ratio: 4 / 5; }
.figure--about img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover; }

/* ==========================================================
   ギャラリー（詳細ページ）
   ========================================================== */
.gallery {
  margin-bottom: 72px; }
  @media (max-width: 640px) {
    .gallery {
      margin-bottom: 48px; } }
  .gallery__main {
    position: relative;
    background: #f6f6f5;
    overflow: hidden; }
  .gallery__figure {
    display: none;
    margin: 0; }
    .gallery__figure.is-active {
      display: block; }
    .gallery__figure img {
      width: 100%;
      aspect-ratio: 16 / 9;
      object-fit: cover; }
    .gallery__figure .ph {
      aspect-ratio: 16 / 9; }
    @media (max-width: 640px) {
      .gallery__figure img,
      .gallery__figure .ph {
        aspect-ratio: 4 / 3; } }
  .gallery__thumbs-wrap {
    position: relative;
    margin-top: 12px; }
    .gallery__thumbs-wrap.is-scrollable {
      padding-inline: 40px; }
      @media (max-width: 640px) {
        .gallery__thumbs-wrap.is-scrollable {
          padding-inline: 0; } }
  .gallery__thumbs {
    display: flex;
    flex-wrap: nowrap;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch; }
    .gallery__thumbs::-webkit-scrollbar {
      display: none; }
    @media (max-width: 640px) {
      .gallery__thumbs {
        gap: 8px; } }
  .gallery__thumb {
    flex: 0 0 calc((100% - 12px * 5) / 6);
    min-width: 0; }
    @media (max-width: 640px) {
      .gallery__thumb {
        flex-basis: calc((100% - 8px * 3) / 4); } }
  .gallery__nav {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    padding: 0;
    border: none;
    background: #f6f6f5;
    cursor: pointer;
    transition: background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
    .gallery__nav::after {
      content: "";
      width: 20px;
      height: 20px;
      background: #0e0e0e;
      mask-position: center;
      mask-repeat: no-repeat;
      mask-size: contain;
      -webkit-mask-position: center;
      -webkit-mask-repeat: no-repeat;
      -webkit-mask-size: contain;
      transition: background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
    .gallery__nav--prev {
      left: 0; }
      .gallery__nav--prev::after {
        mask-image: url("../assets/img/icons/caret-left-solid-full.svg");
        -webkit-mask-image: url("../assets/img/icons/caret-left-solid-full.svg"); }
    .gallery__nav--next {
      right: 0; }
      .gallery__nav--next::after {
        mask-image: url("../assets/img/icons/caret-right-solid-full.svg");
        -webkit-mask-image: url("../assets/img/icons/caret-right-solid-full.svg"); }
    .gallery__nav:hover {
      background: #e4e4e2; }
    .gallery__nav[disabled] {
      opacity: 0.35;
      cursor: default; }
      .gallery__nav[disabled]:hover {
        background: #f6f6f5; }
    @media (max-width: 640px) {
      .gallery__nav {
        display: none; } }
  .gallery__btn {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    border: none;
    background: #f6f6f5;
    cursor: pointer;
    overflow: hidden;
    -webkit-appearance: none;
    appearance: none; }
    .gallery__btn::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      height: 3px;
      background: #ff7f11;
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
    .gallery__btn:hover img, .gallery__btn:hover .ph {
      opacity: 0.75; }
    .gallery__btn.is-active::after {
      transform: scaleX(1); }
    .gallery__btn img {
      display: block;
      width: 100%;
      aspect-ratio: 4 / 3;
      object-fit: cover;
      transition: opacity 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
    .gallery__btn .ph {
      aspect-ratio: 4 / 3;
      transition: opacity 0.3s cubic-bezier(0.22, 1, 0.36, 1); }

/* ==========================================================
   スペース詳細
   ========================================================== */
.space {
  padding-block: 48px 120px; }
  @media (max-width: 640px) {
    .space {
      padding-block: 24px 72px; } }
  .space__head {
    margin-bottom: 40px; }
    @media (max-width: 640px) {
      .space__head {
        margin-bottom: 28px; } }
  .space__head-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px; }
  .space__biz {
    display: inline-block;
    margin: 0;
    padding: 5px 12px;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: #ffffff;
    background: #0e0e0e; }
  .space__title {
    margin: 0 0 14px;
    font-size: clamp(1.75rem, 3.2vw, 2.75rem);
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: -0.01em;
    word-break: auto-phrase;
    text-wrap: balance; }
  .space__no {
    display: inline-block;
    margin-left: 10px;
    padding: 4px 10px;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: clamp(1.5rem, 2.3vw, 2rem);
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.4;
    white-space: nowrap;
    vertical-align: middle;
    color: #ffffff;
    background: #0e0e0e; }
  .space__station {
    margin: 0 0 20px;
    font-size: 1rem;
    color: #5a5a58; }
  .space__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none; }
  .space__cols {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 72px;
    align-items: start; }
    @media (max-width: 980px) {
      .space__cols {
        grid-template-columns: 1fr;
        gap: 48px; } }
  .space__main {
    min-width: 0; }
  .space__side {
    min-width: 0; }
    @media (max-width: 980px) {
      .space__side {
        order: -1; } }
  .space__sticky {
    position: static; }
  .space__sec + .space__sec {
    margin-top: 64px; }
    @media (max-width: 640px) {
      .space__sec + .space__sec {
        margin-top: 48px; } }
  .space__sec-ttl {
    margin: 0 0 24px;
    padding-bottom: 14px;
    font-size: 1.25rem;
    font-weight: 600;
    border-bottom: 2px solid #0e0e0e; }
  .space__sec-sub {
    margin: 0 0 18px;
    font-size: 1rem;
    font-weight: 600; }
  .space__sec-note {
    margin: 16px 0 0;
    font-size: 0.6875rem;
    color: #5a5a58; }

/* ==========================================================
   お知らせ・注意事項・周辺情報のリスト
   ========================================================== */
.noticelist {
  margin: 0;
  padding: 0;
  list-style: none; }
  .noticelist__item {
    position: relative;
    padding-left: 1.15em;
    font-size: 1rem;
    line-height: 1.9; }
    .noticelist__item::before {
      content: "";
      position: absolute;
      top: 0.8em;
      left: 0;
      width: 5px;
      height: 5px;
      background: #9a9a97; }
    .noticelist__item + .noticelist__item {
      margin-top: 10px; }

.space__sec--alert .noticelist {
  padding: 24px 28px;
  background: #f6f6f5; }
  @media (max-width: 640px) {
    .space__sec--alert .noticelist {
      padding: 20px; } }
.space__sec--alert .noticelist__item {
  font-size: 0.8125rem;
  line-height: 1.85;
  color: #333333; }
  .space__sec--alert .noticelist__item::before {
    top: 0.78em;
    background: #5a5a58; }

/* ==========================================================
   スペースからのお知らせ（日付＋本文）
   ========================================================== */
.newslist {
  margin: 0; }
  .newslist__row {
    display: grid;
    grid-template-columns: 7.5em 1fr;
    gap: 0 20px;
    padding: 14px 0;
    border-bottom: 1px solid #e4e4e2; }
    .newslist__row:first-child {
      padding-top: 0; }
    @media (max-width: 480px) {
      .newslist__row {
        grid-template-columns: 1fr;
        gap: 4px; } }
  .newslist__date {
    margin: 0;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.9;
    font-variant-numeric: tabular-nums;
    color: #5a5a58; }
  .newslist__body {
    margin: 0;
    font-size: 1rem;
    line-height: 1.8; }
  .newslist--nodate .newslist__row {
    grid-template-columns: 1fr;
    gap: 0; }
  .newslist--nodate .newslist__date {
    display: none; }

/* ==========================================================
   お知らせ一覧（/news/：WPのお知らせ＋noteの記事）
   ========================================================== */
.newsindex {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid #e4e4e2; }
  .newsindex__item {
    border-bottom: 1px solid #e4e4e2; }
  .newsindex__link {
    display: grid;
    grid-template-columns: 9em 1fr 120px;
    grid-template-areas: "meta title thumb";
    gap: 0 24px;
    align-items: center;
    padding: 20px 0;
    transition: opacity 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
    .newsindex__link:hover {
      opacity: 0.7; }
    .newsindex__link--nothumb {
      grid-template-columns: 9em 1fr;
      grid-template-areas: "meta title"; }
    @media (max-width: 480px) {
      .newsindex__link {
        grid-template-columns: 1fr 96px;
        grid-template-areas: "meta thumb" "title thumb";
        gap: 6px 16px; }
        .newsindex__link.newsindex__link--nothumb {
          grid-template-columns: 1fr;
          grid-template-areas: "meta" "title"; } }
  .newsindex__meta {
    grid-area: meta;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px; }
    @media (max-width: 480px) {
      .newsindex__meta {
        flex-direction: row;
        align-items: center;
        gap: 10px; } }
  .newsindex__date {
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 0.8125rem;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    color: #5a5a58; }
  .newsindex__label {
    display: inline-block;
    padding: 2px 10px;
    font-size: 0.6875rem;
    line-height: 1.6;
    border: 1px solid #e4e4e2; }
    .newsindex__label--note {
      color: #bf5900;
      border-color: #ff7f11; }
    .newsindex__label--interview {
      color: #bf5900;
      background: #fff4e8;
      border-color: #fff4e8; }
  .newsindex__title {
    grid-area: title;
    font-size: 1rem;
    line-height: 1.8; }
  .newsindex__thumb {
    grid-area: thumb; }
    .newsindex__thumb img {
      display: block;
      width: 100%;
      aspect-ratio: 16 / 9;
      object-fit: cover; }
  .newsindex__empty {
    margin: 0;
    font-size: 0.8125rem;
    color: #5a5a58; }
  .newsindex__more, .newsindex__back {
    margin-top: 48px;
    text-align: center; }
    .newsindex__more a, .newsindex__back a {
      color: #bf5900;
      text-decoration: underline;
      text-underline-offset: 3px; }

.page-head__date {
  margin: 0 0 8px;
  font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 0.8125rem; }

/* ==========================================================
   お知らせの編集（編集権限のある人だけに出る）
   ========================================================== */
.space__sec--news .space__sec-head {
  position: relative; }

.newslist__empty {
  margin: 0;
  font-size: 0.8125rem;
  color: #5a5a58; }

.newsedit__toggle {
  position: absolute;
  top: 0;
  right: 0;
  padding: 4px 12px;
  font-size: 0.8125rem;
  font-family: inherit;
  color: #5a5a58;
  background: #f6f6f5;
  border: 1px solid #e4e4e2;
  cursor: pointer;
  transition: background 0.2s cubic-bezier(0.22, 1, 0.36, 1); }
  .newsedit__toggle:hover {
    background: #e8e8e5; }
.newsedit__row {
  display: grid;
  grid-template-columns: 9.5em 1fr auto auto;
  gap: 8px;
  align-items: center;
  margin-bottom: 8px; }
  @media (max-width: 640px) {
    .newsedit__row {
      grid-template-columns: 1fr auto auto;
      gap: 6px; }
      .newsedit__row .newsedit__date {
        grid-column: 1 / -1; } }
  .newsedit__row.is-draft {
    opacity: 0.5; }
.newsedit__date, .newsedit__body {
  padding: 7px 10px;
  font-size: 0.8125rem;
  font-family: inherit;
  color: #0e0e0e;
  background: #ffffff;
  border: 1px solid #e4e4e2; }
  .newsedit__date:focus, .newsedit__body:focus {
    outline: 2px solid #0e0e0e;
    outline-offset: -1px; }
.newsedit__body {
  min-width: 0; }
.newsedit__draft {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.6875rem;
  white-space: nowrap;
  color: #5a5a58;
  cursor: pointer; }
.newsedit__del {
  width: 32px;
  height: 32px;
  padding: 0;
  font-size: 1.125rem;
  line-height: 1;
  color: #5a5a58;
  background: #f6f6f5;
  border: 1px solid #e4e4e2;
  cursor: pointer;
  transition: color 0.2s cubic-bezier(0.22, 1, 0.36, 1), background 0.2s cubic-bezier(0.22, 1, 0.36, 1); }
  .newsedit__del:hover {
    color: #ffffff;
    background: #c0392b;
    border-color: #c0392b; }
.newsedit__none {
  margin: 0 0 12px;
  font-size: 0.8125rem;
  color: #5a5a58; }
.newsedit__bar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #e4e4e2; }
.newsedit__spacer {
  flex: 1; }
.newsedit__add, .newsedit__cancel, .newsedit__save {
  padding: 8px 16px;
  font-size: 0.8125rem;
  font-family: inherit;
  border: 1px solid #e4e4e2;
  cursor: pointer;
  transition: background 0.2s cubic-bezier(0.22, 1, 0.36, 1); }
.newsedit__add, .newsedit__cancel {
  color: #0e0e0e;
  background: #f6f6f5; }
  .newsedit__add:hover, .newsedit__cancel:hover {
    background: #e8e8e5; }
.newsedit__save {
  font-weight: 600;
  color: #ffffff;
  background: #0e0e0e;
  border-color: #0e0e0e; }
  .newsedit__save:hover {
    background: #1a1a1a; }
  .newsedit__save:disabled {
    opacity: 0.5;
    cursor: default; }
.newsedit__msg {
  margin: 10px 0 0;
  font-size: 0.8125rem;
  color: #5a5a58; }
  .newsedit__msg.is-error {
    color: #c0392b; }

/* ==========================================================
   リード（画像つき2カラム・左右振り分け）
   ========================================================== */
.leadrow {
  display: grid;
  grid-template-columns: 1fr 440px;
  align-items: center;
  gap: 64px; }
  .leadrow + .leadrow {
    margin-top: 88px; }
  @media (max-width: 980px) {
    .leadrow {
      grid-template-columns: 1fr;
      gap: 28px; }
      .leadrow + .leadrow {
        margin-top: 56px; } }
  .leadrow__body {
    min-width: 0; }
  .leadrow__title {
    margin: 0 0 24px;
    font-size: clamp(1.5rem, 2.3vw, 2rem);
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.01em; }
  .leadrow__text {
    margin: 0;
    font-size: 1rem;
    line-height: 2.1;
    color: #333333; }
    .leadrow__text + .leadrow__text {
      margin-top: 20px; }
    .leadrow__text strong {
      font-weight: 600;
      color: #0e0e0e; }
    @media (max-width: 640px) {
      .leadrow__text {
        font-size: 1rem;
        line-height: 1.95; } }
  .leadrow__desc {
    font-size: 1.25rem;
    line-height: 2.1;
    color: #333333; }
    .leadrow__desc p {
      margin: 0;
      line-height: 2; }
      .leadrow__desc p + p {
        margin-top: 20px; }
    @media (max-width: 640px) {
      .leadrow__desc {
        font-size: 1rem;
        line-height: 1.95; } }
  .leadrow--textonly {
    grid-template-columns: 1fr; }
  .leadrow--rev {
    grid-template-columns: 440px 1fr; }
    .leadrow--rev .figure {
      order: -1; }
    @media (max-width: 980px) {
      .leadrow--rev {
        grid-template-columns: 1fr; }
        .leadrow--rev .figure {
          order: 0; } }

/* ==========================================================
   レンタルキッチンの使い方（page-kitchen）
   ========================================================== */
.usecase {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px; }
  @media (max-width: 768px) {
    .usecase {
      grid-template-columns: 1fr;
      gap: 24px; } }
  .usecase__item {
    padding: 28px 32px 32px;
    background: #ffffff;
    overflow: hidden; }
    @media (max-width: 640px) {
      .usecase__item {
        padding: 24px 20px; } }
  .usecase__ph {
    margin: -28px -32px 24px;
    aspect-ratio: 3 / 2; }
    @media (max-width: 640px) {
      .usecase__ph {
        margin: -24px -20px 20px; } }
    .usecase__ph img {
      width: 100%;
      height: 100%;
      object-fit: cover; }
  .usecase__title {
    margin: 0 0 14px;
    font-size: clamp(1.5rem, 2.3vw, 2rem);
    font-weight: 600;
    line-height: 1.3; }
  .usecase__text {
    margin: 0 0 20px;
    font-size: 1rem;
    line-height: 1.9;
    color: #333333; }
  .usecase__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none; }
    .usecase__tags li {
      padding: 6px 12px;
      font-size: 0.8125rem;
      font-weight: 500;
      line-height: 1.5;
      background: #f6f6f5; }
      .usecase__tags li::before {
        content: "#";
        margin-right: 3px;
        color: #9a9a97; }

/* ==========================================================
   3つの利用法（page-kitchen「例えばこんな使い方」の上）

   about と同じく文字の大小で強弱をつける。見出しは .sec-head--lg。
   塗りの演出は使わず、パーツごとに下からスライドアップ（.js-up）。プランは縦に積み、
   左に番号と名前、右に本文。最後に3つを1行ずつで言い直す早見を置く。
   ========================================================== */
.useplan {
  margin: 0;
  padding: 0;
  list-style: none;
  border-bottom: 1px solid #e4e4e2;
  counter-reset: useplan; }
  .useplan__item {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    grid-template-areas: "ph head" "ph body";
    grid-template-rows: auto 1fr;
    gap: 24px 56px;
    padding-block: 56px;
    border-top: 1px solid #e4e4e2; }
    @media (max-width: 980px) {
      .useplan__item {
        grid-template-columns: 1fr;
        grid-template-areas: "ph" "head" "body";
        grid-template-rows: auto;
        gap: 20px;
        padding-block: 40px; } }
  .useplan__head {
    grid-area: head; }
  .useplan__body {
    grid-area: body; }
  .useplan__item {
    counter-increment: useplan; }
  .useplan__ph {
    grid-area: ph;
    position: relative;
    margin: 0;
    aspect-ratio: 4 / 3;
    overflow: hidden; }
    @media (max-width: 980px) {
      .useplan__ph {
        aspect-ratio: 3 / 2; } }
    .useplan__ph img {
      width: 100%;
      height: 100%;
      object-fit: cover; }
    .useplan__ph::before {
      content: "";
      position: absolute;
      inset: 0 0 55%;
      background: linear-gradient(to top, rgba(14, 14, 14, 0), rgba(14, 14, 14, 0.55));
      pointer-events: none; }
    .useplan__ph::after {
      content: counter(useplan,decimal-leading-zero);
      position: absolute;
      top: 16px;
      left: 24px;
      font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
      font-size: clamp(2.5rem, 6.4vw, 5rem);
      font-weight: 600;
      line-height: 1;
      letter-spacing: -0.02em;
      color: #ffffff; }
      @media (max-width: 640px) {
        .useplan__ph::after {
          top: 12px;
          left: 16px; } }
  .useplan__title {
    margin: 0 0 20px;
    font-weight: 600; }
  .useplan__term {
    display: block;
    margin: 0 0 6px;
    font-size: 1rem;
    line-height: 1.5;
    color: #5a5a58; }
  .useplan__name {
    display: block;
    margin-left: -0.5em;
    font-size: clamp(1.75rem, 3.2vw, 2.75rem);
    line-height: 1.3;
    letter-spacing: -0.02em;
    word-break: auto-phrase;
    text-wrap: balance; }
  .useplan__catch {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.6;
    word-break: auto-phrase;
    text-wrap: balance; }
  .useplan__keep {
    display: inline-block; }
  .useplan__text {
    margin: 0 0 14px;
    font-size: 1rem;
    line-height: 1.9;
    color: #333333; }
    .useplan__text:last-child {
      margin-bottom: 0; }
  .useplan__em {
    white-space: nowrap;
    font-size: 1.25rem;
    font-weight: 600;
    color: #0e0e0e; }
  .useplan__voices {
    display: grid;
    gap: 8px;
    margin: 20px 0;
    padding: 0;
    list-style: none; }
    .useplan__voices:first-child {
      margin-top: 0; }
    .useplan__voices li {
      display: flex;
      align-items: baseline;
      gap: 10px;
      font-size: 1rem;
      font-weight: 600;
      line-height: 1.7;
      word-break: auto-phrase; }
      .useplan__voices li::before {
        content: "";
        flex-shrink: 0;
        width: 5px;
        height: 5px;
        background: #ff7f11;
        transform: translateY(-0.25em); }
  .useplan__note {
    margin: 20px 0 0;
    font-size: 0.8125rem;
    line-height: 1.8;
    color: #5a5a58; }

.useplan-sum {
  margin: 80px 0 0;
  text-align: center; }
  @media (max-width: 640px) {
    .useplan-sum {
      margin-top: 56px; } }
  .useplan-sum__title {
    margin: 0 0 40px;
    font-size: clamp(1.75rem, 3.2vw, 2.75rem);
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: -0.01em;
    word-break: auto-phrase;
    text-wrap: balance; }
    @media (max-width: 640px) {
      .useplan-sum__title {
        margin-bottom: 28px; } }
  .useplan-sum__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    margin: 0 0 32px;
    padding: 0;
    list-style: none;
    background: #e4e4e2; }
    @media (max-width: 768px) {
      .useplan-sum__list {
        grid-template-columns: 1fr; } }
    .useplan-sum__list li {
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 8px;
      padding: 32px 16px;
      background: #f6f6f5; }
      @media (max-width: 640px) {
        .useplan-sum__list li {
          padding: 24px 16px; } }
  .useplan-sum__when {
    font-size: 0.8125rem;
    line-height: 1.6;
    color: #5a5a58; }
  .useplan-sum__plan {
    font-size: clamp(1.5rem, 2.3vw, 2rem);
    font-weight: 600;
    line-height: 1.4;
    word-break: auto-phrase; }
  .useplan-sum__text {
    margin: 0;
    font-size: 1rem;
    line-height: 1.9;
    color: #333333; }
  .useplan-sum__actions {
    display: flex;
    justify-content: center;
    margin-top: 32px; }

/* ==========================================================
   スペースを探す（page-kitchen の締め）
   ========================================================== */
.findbox {
  padding: 48px 40px;
  text-align: center;
  background: #f6f6f5; }
  @media (max-width: 640px) {
    .findbox {
      padding: 32px 20px; } }
  .findbox__title {
    margin: 0 0 12px;
    font-size: clamp(1.5rem, 2.3vw, 2rem);
    font-weight: 600; }
  .findbox__title {
    word-break: auto-phrase;
    text-wrap: balance; }
  .findbox__text {
    margin: 0 0 28px;
    font-size: 1rem;
    line-height: 1.9;
    color: #333333; }
  .findbox__num {
    margin-inline: 4px;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: clamp(1.5rem, 2.3vw, 2rem);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: #0e0e0e; }

/* ==========================================================
   塗りのあいだ画面を止めるセクション（リード）

   セクション自体を画面より高くしておき、中身を sticky で貼り付ける。
   この区間を通過するスクロールは「塗り」に使われ、画面は動かない。
   ========================================================== */
.sec--pin {
  --ink-bg: #ffffff;
  height: 220vh;
  padding-block: 0; }
  @media (max-width: 980px) {
    .sec--pin {
      height: 200vh; } }
  @media (max-width: 640px) {
    .sec--pin {
      height: auto;
      padding-block: 60px; } }
  .sec--pin .statement__title.js-ink,
  .sec--pin .sec-head__title.js-ink {
    font-size: clamp(2.25rem, 7.2vw, 5.75rem);
    line-height: 1.2;
    letter-spacing: -0.03em; }
    .sec--pin .statement__title.js-ink.is-lines,
    .sec--pin .sec-head__title.js-ink.is-lines {
      font-size: min(clamp(2.25rem, 7.2vw, 5.75rem), calc((min(100vw, 888px) - 48px) / 10.6));
      white-space: pre; }
  @supports (-webkit-text-stroke: 1px currentColor) {
    .sec--pin .ink {
      -webkit-text-stroke-width: 2px; }
      @media (max-width: 640px) {
        .sec--pin .ink {
          -webkit-text-stroke-width: 1px; } } }

.sec__pin {
  position: sticky;
  top: 76px;
  display: flex;
  align-items: safe center;
  min-height: calc(100vh - 76px);
  padding-top: 40px; }
  @media (max-width: 980px) {
    .sec__pin {
      top: 60px;
      min-height: calc(100vh - 60px); } }
  @media (max-width: 640px) {
    .sec__pin {
      position: static;
      min-height: 0;
      padding-top: 0; } }

/* ----------------------------------------------------------
   見出しだけ止めて、本文は止めない（about「こだわり」）

   本文ごと止めると、低い画面で見出しの上と本文の下が切れる。
   見出しは画面の下寄り（下から30vh）に止め、本文は止める区間の
   最後の20vhに食い込ませて置く。止まっているあいだに本文が
   下から上がってきて、解除の時点で見出しの10vh下にそろう。
   見出しの行数が変わってもこの位置関係は崩れない。
   ---------------------------------------------------------- */
.sec--pin-split {
  padding-top: 0; }

.sec--pin-head {
  height: 180vh; }
  @media (max-width: 980px) {
    .sec--pin-head {
      height: 170vh; } }
  .sec--pin-head .sec__pin {
    align-items: flex-end;
    padding-bottom: 30vh; }
  @media (max-width: 640px) {
    .sec--pin-head {
      height: auto;
      padding-bottom: 0; }
      .sec--pin-head .sec__pin {
        padding-bottom: 0; } }

.pin-follow {
  position: relative;
  margin-top: -20vh; }
  @media (max-width: 640px) {
    .pin-follow {
      margin-top: 0; } }

/* ==========================================================
   塗り終わってから下から出てくる文（立ち止まるセクションの本文）
   ========================================================== */
.fadein {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1); }
  .fadein.is-in {
    opacity: 1;
    transform: none; }
  .fadein + .fadein {
    transition-delay: 0.12s; }
  @media (prefers-reduced-motion: reduce) {
    .fadein {
      transform: translateY(8px);
      transition: opacity 0.4s ease, transform 0.4s ease; }
      .fadein.is-in {
        transform: none; }
      .fadein + .fadein {
        transition-delay: 0.1s; } }

/* ==========================================================
   スクロールで文字に色が入る（新興製作所 shinko の FV 演出を見出しに転用）
   ========================================================== */
.ink {
  color: rgba(14, 14, 14, 0.16);
  transition: color 0.5s ease; }
  @supports (-webkit-text-stroke: 1px currentColor) {
    .ink {
      color: var(--ink-bg, #ffffff);
      -webkit-text-stroke: 1px rgba(14, 14, 14, 0.45);
      paint-order: stroke fill;
      transition: color 0.5s ease, -webkit-text-stroke-color 0.5s ease; } }
  .ink.is-on {
    color: inherit; }
    @supports (-webkit-text-stroke: 1px currentColor) {
      .ink.is-on {
        color: inherit;
        -webkit-text-stroke-color: transparent; } }
  @media (prefers-reduced-motion: reduce) {
    .ink {
      transition-duration: 0.2s; } }

/* ==========================================================
   よくある質問（page-about）
   ========================================================== */
.faq {
  border-top: 1px solid #e4e4e2; }
  .faq__item {
    border-bottom: 1px solid #e4e4e2; }
  .faq__q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 24px 0;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.7;
    cursor: pointer;
    list-style: none; }
    .faq__q::-webkit-details-marker {
      display: none; }
    .faq__q::after {
      content: "";
      flex-shrink: 0;
      width: 0.8rem;
      height: 0.8rem;
      background: #9a9a97;
      mask-image: url("../assets/img/icons/chevron-right-solid-full.svg");
      mask-position: center;
      mask-repeat: no-repeat;
      mask-size: contain;
      -webkit-mask-image: url("../assets/img/icons/chevron-right-solid-full.svg");
      -webkit-mask-position: center;
      -webkit-mask-repeat: no-repeat;
      -webkit-mask-size: contain;
      transform: rotate(90deg);
      transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
    @media (max-width: 640px) {
      .faq__q {
        padding: 20px 0;
        font-size: 1rem; } }
  .faq__item[open] > .faq__q::after {
    transform: rotate(-90deg); }
  .faq__a {
    padding: 0 0 28px;
    font-size: 1rem;
    line-height: 2;
    color: #333333; }
    .faq__a p {
      margin: 0;
      line-height: inherit; }
    @media (max-width: 640px) {
      .faq__a {
        padding-bottom: 20px;
        font-size: 1rem;
        line-height: 1.95; } }

.faq-group {
  margin: 48px 0 8px;
  font-size: 1.25rem;
  font-weight: 700;
  color: #0e0e0e; }
  .faq-group:first-of-type {
    margin-top: 0; }
  @media (max-width: 640px) {
    .faq-group {
      margin-top: 36px; } }

/* ==========================================================
   料金ボックス
   ========================================================== */
.pricebox {
  margin-bottom: 24px;
  padding: 28px;
  background: #f6f6f5;
  border-top: 3px solid #ff7f11;
  box-shadow: 0 4px 12px rgba(14, 14, 14, 0.14); }
  @media (max-width: 640px) {
    .pricebox {
      padding: 24px 20px; } }
  .pricebox__label {
    margin: 0 0 6px;
    font-size: 0.6875rem;
    font-weight: 700;
    color: #5a5a58; }
  .pricebox__price {
    margin: 0 0 20px;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.01em;
    white-space: nowrap; }
  .pricebox__yen {
    margin-right: 0.08em;
    font-size: 0.7em; }
  .pricebox__unit {
    font-size: 0.6em;
    font-weight: 600;
    letter-spacing: normal;
    color: #5a5a58; }
  .pricebox__sub {
    margin: -12px 0 20px;
    padding-top: 12px;
    font-size: 0.8125rem;
    color: #5a5a58;
    border-top: 1px solid #e4e4e2; }
    .pricebox__sub strong {
      font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
      font-size: 1.25rem;
      font-weight: 600;
      color: #bf5900; }
  .pricebox__note {
    margin: 12px 0 4px;
    font-size: 0.6875rem;
    text-align: center;
    color: #5a5a58; }
  .pricebox__pick {
    margin: 0 0 16px;
    font-size: 0.8125rem;
    font-weight: 600;
    text-align: center;
    color: #0e0e0e; }

/* ----------------------------------------------------------
   定期利用・サテライトの窓口（時間貸しの詳細ページ、料金ボックスの下）
   予約（料金ボックス）とは別の相談窓口なので、面を変えて線で囲む
   ---------------------------------------------------------- */
.planbox {
  margin-bottom: 24px;
  padding: 24px 28px 28px;
  background: #ffffff;
  border: 1px solid #e4e4e2; }
  @media (max-width: 640px) {
    .planbox {
      padding: 20px; } }
  .planbox__list {
    display: grid;
    gap: 6px;
    margin: 0 0 8px;
    padding: 0;
    list-style: none; }
    .planbox__list li {
      display: flex;
      align-items: baseline;
      gap: 8px;
      font-size: 0.8125rem;
      line-height: 1.6;
      color: #333333; }
      .planbox__list li::before {
        content: "";
        flex-shrink: 0;
        width: 5px;
        height: 5px;
        background: #ff7f11;
        transform: translateY(-0.2em); }
    .planbox__list strong {
      font-size: 1rem;
      font-weight: 700;
      color: #0e0e0e; }
  .planbox__text {
    margin: 0 0 16px;
    font-size: 0.8125rem;
    line-height: 1.6;
    color: #333333; }

/* ==========================================================
   主要スペック（定員・着席人数・広さ）横3ボックス
   ========================================================== */
.specgrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 0 0 24px;
  padding: 0;
  list-style: none; }
  @media (max-width: 480px) {
    .specgrid {
      gap: 8px; } }
  .specgrid__item {
    padding: 16px 12px;
    background: #f6f6f5;
    text-align: center; }
    @media (max-width: 480px) {
      .specgrid__item {
        padding: 12px 8px; } }
  .specgrid__label {
    margin: 0 0 4px;
    font-size: 0.8125rem;
    line-height: 1.5;
    color: #5a5a58; }
  .specgrid__value {
    margin: 0;
    font-size: clamp(1.5rem, 2.3vw, 2rem);
    font-weight: 600;
    line-height: 1.2;
    font-variant-numeric: tabular-nums; }
    @media (max-width: 480px) {
      .specgrid__value {
        font-size: clamp(1.5rem, 2.3vw, 2rem); } }
  .specgrid__unit {
    margin-left: 3px;
    font-size: 0.6875rem;
    font-weight: 500;
    letter-spacing: 0;
    color: #0e0e0e; }

/* ==========================================================
   空き状況カレンダー（よやクル・閲覧専用／別オリジンのため中身には触れない）
   ========================================================== */
.calbox {
  margin-top: 24px;
  padding: 24px 20px 20px;
  background: #f6f6f5; }
  @media (max-width: 640px) {
    .calbox {
      padding: 20px 16px 16px; } }
  .calbox__head {
    margin: 0 0 12px;
    font-size: 1rem;
    font-weight: 600; }

.calendar-embed iframe {
  display: block;
  width: 100%;
  max-width: 100%;
  min-height: 700px;
  border: 0; }

/* ==========================================================
   スペック
   ========================================================== */
.specbox {
  padding: 24px 28px 28px;
  background: #f6f6f5; }
  @media (max-width: 640px) {
    .specbox {
      padding: 20px; } }
  .specbox__head {
    margin: 0 0 4px;
    font-size: 1rem;
    font-weight: 600; }
  .specbox .spec-list {
    margin-bottom: 0;
    border-top: none; }
    .specbox .spec-list__row:last-child {
      border-bottom: none;
      padding-bottom: 0; }

/* ==========================================================
   料金プラン（サテライトオフィス）
   ========================================================== */
.plans {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px; }
  @media (max-width: 640px) {
    .plans {
      grid-template-columns: 1fr; } }

.plan {
  padding: 24px 22px;
  background: #f6f6f5; }
  .plan--main {
    border-top: 3px solid #ff7f11;
    background: #ffffff; }
    .plan--main .plan__price {
      color: #bf5900; }
  .plan__name {
    margin: 0 0 10px;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #5a5a58; }
  .plan__price {
    margin: 0 0 12px;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.01em; }
  .plan__note {
    margin: 0;
    font-size: 0.6875rem;
    line-height: 1.8;
    color: #5a5a58; }
    .plan__note a {
      color: #bf5900;
      text-decoration: underline;
      text-underline-offset: 3px; }

/* ==========================================================
   価格・収益サマリー（再販事業）
   ========================================================== */
.figures {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1px;
  margin: 0;
  background: #e4e4e2; }
  @media (max-width: 640px) {
    .figures {
      grid-template-columns: 1fr; } }
  .figures__item {
    padding: 22px 24px;
    background: #ffffff; }
    .figures__item:nth-child(-n + 2) {
      background: #f6f6f5; }
      .figures__item:nth-child(-n + 2) .figures__value {
        color: #bf5900; }
    @media (max-width: 640px) {
      .figures__item {
        padding: 18px 20px; } }
  .figures__label {
    margin-bottom: 8px;
    font-size: 0.6875rem;
    font-weight: 700;
    color: #5a5a58; }
  .figures__value {
    margin: 0;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: clamp(1.5rem, 2.3vw, 2rem);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -0.01em; }
    @media (max-width: 640px) {
      .figures__value {
        font-size: clamp(1.5rem, 2.3vw, 2rem); } }

/* ==========================================================
   会員限定のロック表示
   数値はサーバー側でダミーに置換済み。ここでは見た目だけ隠す
   ========================================================== */
.figures__item.is-locked .figures__value,
.pl.is-locked .pl__row dd,
.pricebox__sub.is-locked strong,
.card__spec-row.is-locked dd, .pl.is-locked .pl__row dt.has-number {
  filter: blur(6px);
  user-select: none;
  pointer-events: none; }

.card__spec-row.is-locked dd {
  filter: blur(4px); }

.locked {
  margin-top: 24px;
  padding: 24px 28px 26px;
  background: #f6f6f5;
  border-top: 3px solid #ff7f11; }
  @media (max-width: 640px) {
    .locked {
      padding: 20px; } }
  .locked__title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 10px;
    font-size: 1rem;
    font-weight: 600; }
    .locked__title::before {
      content: "";
      flex-shrink: 0;
      width: 15px;
      height: 17px;
      background: #0e0e0e;
      clip-path: polygon(0% 45%, 100% 45%, 100% 100%, 0% 100%, 0% 45%, 22% 45%, 22% 28%, 30% 14%, 44% 6%, 56% 6%, 70% 14%, 78% 28%, 78% 45%, 64% 45%, 64% 30%, 58% 21%, 50% 18%, 42% 21%, 36% 30%, 36% 45%); }
  .locked__text {
    margin: 0 0 18px;
    font-size: 0.8125rem;
    line-height: 1.9;
    color: #333333; }
  .locked__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px; }
    .locked__actions .btn {
      min-height: 44px;
      padding-inline: 22px;
      font-size: 0.8125rem; }

/* ==========================================================
   収支の内訳（再販事業）
   ========================================================== */
.pl {
  margin: 0; }
  .pl__row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    padding: 13px 0;
    border-bottom: 1px solid #e4e4e2; }
    .pl__row dt {
      font-size: 0.8125rem;
      color: #5a5a58; }
    .pl__row dd {
      margin: 0;
      font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
      font-size: 1rem;
      font-weight: 700;
      white-space: nowrap; }
    .pl__row--minus dd {
      color: #5a5a58; }
    .pl__row--total {
      margin-top: 4px;
      padding: 18px 0 0;
      border-bottom: none;
      border-top: 2px solid #0e0e0e; }
      .pl__row--total dt {
        font-size: 1rem;
        font-weight: 600;
        color: #0e0e0e; }
      .pl__row--total dd {
        font-size: 1.25rem;
        font-weight: 600;
        color: #bf5900; }

/* ==========================================================
   ご購入の流れ（再販事業）
   ========================================================== */
.flow {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: flow; }
  .flow__item {
    position: relative;
    counter-increment: flow;
    padding: 0 0 28px 52px;
    font-size: 1rem;
    font-weight: 700; }
    .flow__item::before {
      content: counter(flow,decimal-leading-zero);
      position: absolute;
      left: 0;
      top: -2px;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 34px;
      height: 34px;
      font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
      font-size: 0.8125rem;
      font-weight: 600;
      color: #ffffff;
      background: #0e0e0e;
      border-radius: 50%; }
    .flow__item::after {
      content: "";
      position: absolute;
      left: 17px;
      top: 36px;
      width: 1px;
      height: calc(100% - 40px);
      background: #e4e4e2; }
    .flow__item:last-child {
      padding-bottom: 0; }
      .flow__item:last-child::after {
        display: none; }

/* ==========================================================
   契約条件
   ========================================================== */
.terms-list {
  margin: 0; }
  .terms-list__row {
    display: grid;
    grid-template-columns: 12em 1fr;
    gap: 24px;
    padding: 16px 0;
    border-bottom: 1px solid #e4e4e2; }
    @media (max-width: 640px) {
      .terms-list__row {
        grid-template-columns: 1fr;
        gap: 4px;
        padding: 14px 0; } }
    .terms-list__row dt {
      font-size: 0.8125rem;
      font-weight: 700;
      color: #5a5a58; }
    .terms-list__row dd {
      margin: 0;
      font-size: 1rem;
      font-weight: 700; }

/* ==========================================================
   SNSリンク
   アイコンは Font Awesome 6 Brands のグリフを疑似要素で出す
   ========================================================== */
.snsbox {
  margin-top: 24px;
  padding: 20px 24px 22px;
  background: #f6f6f5; }
  @media (max-width: 640px) {
    .snsbox {
      padding: 18px 20px 20px; } }
  .snsbox__head {
    margin: 0 0 14px;
    font-size: 0.8125rem;
    font-weight: 600; }

.sns {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none; }
  .sns__item {
    min-width: 0; }
  .sns__name {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap; }
  .sns__link {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    color: #0e0e0e;
    border: 1px solid #e4e4e2;
    transition: color 0.3s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
    .sns__link::before {
      font-family: "Font Awesome 6 Brands";
      font-weight: 400;
      font-size: 1.0625rem;
      line-height: 1; }
    .sns__link:hover {
      color: #ffffff;
      border-color: transparent; }
    .sns__link--facebook::before {
      content: "\f09a"; }
    .sns__link--facebook:hover {
      background: #1877f2; }
    .sns__link--instagram::before {
      content: "\f16d"; }
    .sns__link--instagram:hover {
      background: linear-gradient(45deg, #f09433 0%, #dc2743 50%, #bc1888 100%); }
    .sns__link--x-twitter::before {
      content: "\e61b";
      font-size: 0.9375rem; }
    .sns__link--x-twitter:hover {
      background: #0e0e0e; }
    .sns__link--line::before {
      content: "\f3c0";
      font-size: 1.1875rem; }
    .sns__link--line:hover {
      background: #06c755; }

/* ==========================================================
   別プランへの導線
   ========================================================== */
.crosslink {
  margin-top: 24px;
  padding: 20px 24px;
  background: #fff4e8; }
  @media (max-width: 640px) {
    .crosslink {
      padding: 18px 20px; } }
  .crosslink__label {
    margin: 0 0 10px;
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1.7;
    color: #5a5a58; }
  .crosslink--alike {
    margin-top: 28px; }
  .crosslink--alike .crosslink__label {
    margin-bottom: 14px;
    font-size: 1rem; }
  .crosslink__list {
    margin: 0;
    padding: 0;
    list-style: none; }
    .crosslink__list li {
      padding: 14px 0;
      border-top: 1px solid #e4e4e2; }
      .crosslink__list li:first-child {
        border-top: 0;
        padding-top: 0; }
    .crosslink__list a {
      font-size: 1rem;
      font-weight: 700;
      text-decoration: underline;
      text-underline-offset: 3px; }
  .crosslink__note {
    display: block;
    margin-top: 8px;
    font-size: 0.8125rem;
    color: #5a5a58; }

/* ==========================================================
   設備・アメニティ
   ========================================================== */
.amenity {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px 24px;
  margin: 0 0 40px;
  padding: 0;
  list-style: none; }
  @media (max-width: 640px) {
    .amenity {
      grid-template-columns: repeat(2, 1fr);
      gap: 10px 16px;
      margin-bottom: 32px; } }
  .amenity__item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.5; }
    .amenity__item::before {
      content: "";
      flex-shrink: 0;
      width: 18px;
      height: 18px;
      background: #ff7f11;
      clip-path: polygon(41% 76%, 12% 47%, 20% 39%, 41% 60%, 80% 21%, 88% 29%); }

.amenity--common {
  margin-bottom: 0; }
  @media (max-width: 640px) {
    .amenity--common {
      margin-bottom: 0; } }

.amenity--tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px; }
  @media (max-width: 640px) {
    .amenity--tags {
      gap: 8px; } }
  .amenity--tags .amenity__item {
    gap: 8px;
    padding: 12px 18px 12px 14px;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4;
    background: #f6f6f5; }
    @media (max-width: 640px) {
      .amenity--tags .amenity__item {
        padding: 10px 14px 10px 12px;
        font-size: 0.8125rem; } }
    .amenity--tags .amenity__item::before {
      width: 20px;
      height: 20px; }

/* ----------------------------------------------------------
   こんな設備・特徴があります（page-kitchen）
   feature のカードを横に流す。スクロールは scroll-snap、ボタンは main.js の .js-rail
   ---------------------------------------------------------- */
.featrail {
  margin-top: 80px; }
  @media (max-width: 640px) {
    .featrail {
      margin-top: 56px; } }
  .featrail__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px; }
  .featrail__title {
    margin: 0;
    font-size: clamp(1.5rem, 2.3vw, 2rem);
    font-weight: 600;
    line-height: 1.4; }
  .featrail__nav {
    display: flex;
    flex-shrink: 0;
    gap: 8px; }
    @media (max-width: 640px) {
      .featrail__nav {
        display: none; } }
  .featrail__btn {
    position: relative;
    width: 48px;
    height: 48px;
    background: #ffffff;
    border: 1px solid #0e0e0e;
    cursor: pointer;
    transition: opacity 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
    .featrail__btn::before {
      content: "";
      position: absolute;
      top: 50%;
      left: 50%;
      width: 10px;
      height: 10px;
      border-top: 2px solid #0e0e0e;
      border-right: 2px solid #0e0e0e; }
    .featrail__btn--prev::before {
      transform: translate(-30%, -50%) rotate(-135deg); }
    .featrail__btn--next::before {
      transform: translate(-70%, -50%) rotate(45deg); }
    .featrail__btn:disabled {
      opacity: 0.25;
      cursor: default; }
  .featrail__list {
    display: flex;
    gap: 20px;
    margin: 0;
    padding: 0 0 12px;
    list-style: none;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    scrollbar-width: thin; }
    @media (max-width: 640px) {
      .featrail__list {
        gap: 14px;
        margin-inline: calc(24px * -1);
        padding-inline: 24px;
        scroll-padding-inline: 24px; } }
  .featrail__item {
    flex: 0 0 calc((100% - 60px) / 4);
    scroll-snap-align: start; }
    @media (max-width: 980px) {
      .featrail__item {
        flex-basis: calc((100% - 40px) / 3); } }
    @media (max-width: 640px) {
      .featrail__item {
        flex-basis: 72%; } }
    .featrail__item .term-card__title {
      font-size: 1rem;
      word-break: auto-phrase;
      overflow-wrap: anywhere; }
    .featrail__item .term-card__count {
      flex-shrink: 0;
      white-space: nowrap; }
  .featrail__foot {
    display: flex;
    justify-content: center;
    margin-top: 40px; }

.amenity-common {
  padding: 24px 28px;
  background: #f6f6f5; }
  @media (max-width: 640px) {
    .amenity-common {
      padding: 20px; } }
  .amenity-common__head {
    margin: 0 0 12px;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #5a5a58; }
  .amenity-common__list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 0;
    margin: 0;
    padding: 0;
    list-style: none; }
    .amenity-common__list li {
      display: flex;
      align-items: center;
      font-size: 0.8125rem;
      color: #5a5a58; }
      .amenity-common__list li + li::before {
        content: "";
        width: 3px;
        height: 3px;
        margin-inline: 10px;
        border-radius: 50%;
        background: #9a9a97; }

/* ==========================================================
   アクセス
   ========================================================== */
.access__map {
  position: relative;
  margin-bottom: 28px;
  background: #f6f6f5;
  overflow: hidden; }
  .access__map iframe {
    display: block !important;
    width: 100% !important;
    height: 380px;
    max-width: 100%;
    border: 0; }
    @media (max-width: 640px) {
      .access__map iframe {
        height: 260px; } }
  .access__map--empty {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 16 / 7; }
    .access__map--empty::before {
      content: "";
      position: absolute;
      inset: 0;
      background-image: linear-gradient(to right, rgba(14, 14, 14, 0.05) 1px, transparent 1px), linear-gradient(to bottom, rgba(14, 14, 14, 0.05) 1px, transparent 1px);
      background-size: 32px 32px; }
.access__map-note {
  position: relative;
  margin: 0;
  font-size: 0.8125rem;
  color: #5a5a58; }
.access__list {
  margin: 0;
  border-top: 1px solid #e4e4e2; }
.access__row {
  display: grid;
  grid-template-columns: 6em 1fr;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid #e4e4e2; }
  @media (max-width: 640px) {
    .access__row {
      grid-template-columns: 1fr;
      gap: 4px; } }
  .access__row dt {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #5a5a58; }
  .access__row dd {
    margin: 0;
    font-size: 1rem;
    line-height: 1.6; }

/* ==========================================================
   About：ステートメント
   ========================================================== */
.statement__title {
  margin: 0 0 40px;
  font-size: clamp(1.75rem, 3.2vw, 2.75rem);
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: -0.01em; }
.statement__sub {
  margin: 0 0 28px;
  font-size: clamp(1.5rem, 2.3vw, 2rem);
  font-weight: 600;
  line-height: 1.6; }
  @media (max-width: 640px) {
    .statement__sub {
      margin-bottom: 20px;
      font-size: 1.25rem; } }
.statement__body p {
  margin: 0 0 1.8em;
  font-size: 1rem;
  line-height: 2.1;
  color: #333333; }
  .statement__body p:last-child {
    margin-bottom: 0; }
  @media (max-width: 640px) {
    .statement__body p {
      font-size: 1rem;
      line-height: 1.95; } }
.statement__sign {
  margin: 40px 0 0;
  font-size: 0.8125rem;
  line-height: 2;
  text-align: right;
  white-space: pre-line; }

/* ==========================================================
   About 抜粋（TOP）
   ========================================================== */
.about-flex {
  display: grid;
  grid-template-columns: 1fr 380px;
  align-items: center;
  gap: 72px; }
  @media (max-width: 980px) {
    .about-flex {
      grid-template-columns: 1fr;
      gap: 40px; } }
  .about-flex__body {
    min-width: 0; }
  .about-flex__text {
    margin: 28px 0 36px;
    line-height: 2.1;
    color: #333333; }
    @media (max-width: 640px) {
      .about-flex__text {
        font-size: 1rem;
        line-height: 1.95; } }

/* ==========================================================
   WYSIWYG（本文）
   ========================================================== */
.wysiwyg--mt {
  margin-top: 48px; }
.wysiwyg h2 {
  margin: 2.4em 0 0.9em;
  padding-bottom: 12px;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.5;
  border-bottom: 1px solid #e4e4e2; }
  .wysiwyg h2:first-child {
    margin-top: 0; }
.wysiwyg h3 {
  margin: 2em 0 0.8em;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.6; }
.wysiwyg p {
  margin: 0 0 1.6em;
  line-height: 2;
  color: #333333; }
.wysiwyg ul,
.wysiwyg ol {
  margin: 0 0 1.6em;
  padding-left: 1.4em;
  line-height: 2;
  color: #333333; }
.wysiwyg ul {
  list-style: disc; }
.wysiwyg ol {
  list-style: decimal; }
.wysiwyg li {
  margin-bottom: 0.4em;
  line-height: 2; }
.wysiwyg a {
  color: #bf5900;
  text-decoration: underline;
  text-underline-offset: 3px; }
  .wysiwyg a:hover {
    color: #e56a00; }
.wysiwyg figure,
.wysiwyg img {
  margin-bottom: 1.6em; }
.wysiwyg blockquote {
  margin: 0 0 1.6em;
  padding: 20px 24px;
  background: #f6f6f5;
  border-left: 3px solid #ff7f11; }
  .wysiwyg blockquote p:last-child {
    margin-bottom: 0; }
.wysiwyg .interview_heading {
  padding-bottom: 8px;
  border-bottom: 2px solid #0e0e0e; }
.wysiwyg .interview_txt {
  margin-bottom: 2.4em; }
  .wysiwyg .interview_txt.pd16 {
    margin-bottom: 1em; }
.wysiwyg > *:last-child {
  margin-bottom: 0; }

/* ==========================================================
   404
   ========================================================== */
.notfound__code {
  margin: 0 0 20px;
  font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: clamp(2.5rem, 6.4vw, 5rem);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.03em;
  color: #bf5900; }
.notfound__title {
  margin: 0 0 20px;
  font-size: clamp(1.5rem, 2.3vw, 2rem);
  font-weight: 600; }
.notfound__text {
  margin: 0 0 40px;
  line-height: 1.8;
  color: #333333; }
  @media (max-width: 640px) {
    .notfound__text {
      font-size: 1rem; } }
.notfound__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px; }

/* ----------------------------------------------------------
   ご予約の流れ（rns_booking_flow）
   compact = 店舗ページの料金ボックス内（開閉式）／ full = はじめての方へ
   ---------------------------------------------------------- */
.bookflow__steps {
  display: grid;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none; }
.bookflow__step {
  display: flex;
  align-items: flex-start;
  gap: 12px; }
.bookflow__num {
  flex-shrink: 0;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 0.8125rem;
  font-weight: 700;
  color: #ffffff;
  background: #ff7f11;
  border-radius: 50%; }
.bookflow__title {
  margin: 0 0 2px;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.6;
  color: #0e0e0e; }
.bookflow__text {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.7;
  color: #333333; }
.bookflow__note {
  margin: 16px 0 0;
  font-size: 0.6875rem;
  line-height: 1.7;
  color: #5a5a58; }
.bookflow--compact {
  margin: 0 0 16px;
  text-align: left;
  border-top: 1px solid #e4e4e2; }
.bookflow__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 0 0;
  font-size: 0.8125rem;
  font-weight: 700;
  color: #0e0e0e;
  cursor: pointer;
  list-style: none; }
  .bookflow__summary::-webkit-details-marker {
    display: none; }
  .bookflow__summary::after {
    content: "+";
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1;
    color: #ff7f11; }
  .bookflow[open] .bookflow__summary::after {
    content: "−"; }
.bookflow__label {
  display: inline-flex;
  align-items: center;
  gap: 8px; }
  .bookflow__label::before {
    content: "";
    width: 1.25em;
    height: 1.25em;
    flex-shrink: 0;
    background: #ff7f11;
    mask-image: url("../assets/img/icons/circle-question-solid-full.svg");
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
    -webkit-mask-image: url("../assets/img/icons/circle-question-solid-full.svg");
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain; }
.bookflow__inner {
  padding-top: 16px; }
.bookflow--full {
  margin-top: 40px; }
.bookflow__sets {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px; }
  @media (max-width: 768px) {
    .bookflow__sets {
      grid-template-columns: 1fr; } }
.bookflow--full .bookflow__set {
  padding: 28px;
  background: #ffffff;
  border: 1px solid #e4e4e2; }
  @media (max-width: 640px) {
    .bookflow--full .bookflow__set {
      padding: 20px; } }
.bookflow__device {
  margin: 0 0 20px;
  font-size: 1.25rem;
  font-weight: 700;
  color: #0e0e0e; }

/* ==========================================================
   見出しの基本設定
   セクション固有の見出しは各パーシャル側で定義
   ========================================================== */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: -0.005em; }

/* ==========================================================
   ボタン
   ========================================================== */
.btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 48px;
  padding: 12px 28px;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1.5;
  text-align: center;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1), color 0.3s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
  .btn--arrow::after {
    content: "";
    width: 1.4em;
    height: 1.4em;
    flex-shrink: 0;
    background: currentColor;
    mask-image: url("../assets/img/icons/caret-right-solid-full.svg");
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
    -webkit-mask-image: url("../assets/img/icons/caret-right-solid-full.svg");
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
  .btn--arrow:hover::after {
    transform: translateX(5px); }
  .btn--ext::after {
    content: "";
    width: 0.9em;
    height: 0.9em;
    flex-shrink: 0;
    background: currentColor;
    mask-image: url("../assets/img/icons/up-right-from-square-solid-full.svg");
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
    -webkit-mask-image: url("../assets/img/icons/up-right-from-square-solid-full.svg");
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
  .btn--ext:hover::after {
    transform: translate(3px, -3px); }
  .btn--accent {
    color: #ffffff;
    background: #ff7f11; }
    .btn--accent:hover {
      background: #e56a00; }
  .btn--dark {
    color: #ffffff;
    background: #0e0e0e; }
    .btn--dark:hover {
      background: #ff7f11; }
  .btn--line {
    color: #0e0e0e;
    background: transparent;
    border-color: #0e0e0e; }
    .btn--line:hover {
      color: #ffffff;
      background: #0e0e0e; }
  .btn--ghost {
    color: #0e0e0e;
    background: transparent;
    border-color: #e4e4e2; }
    .btn--ghost:hover {
      border-color: #0e0e0e; }
  .btn--lg {
    min-height: 60px;
    padding: 16px 40px;
    font-size: 1rem; }
    @media (max-width: 640px) {
      .btn--lg {
        min-height: 54px;
        padding: 14px 28px; } }
  .btn--block {
    display: flex;
    width: 100%; }
  .btn + .btn--block {
    margin-top: 12px; }

/* ==========================================================
   CTAのPC / スマホ出し分け
   PC = よやクルのWeb予約 / スマホ = 公式LINE。
   wp_is_mobile() のサーバー判定はキャッシュに乗ると逆が出るため、
   2本とも出力してCSSで切り替える。
   ========================================================== */
.cta--sp {
  display: none; }

@media (max-width: 768px) {
  .cta--pc {
    display: none; }

  .cta--sp {
    display: inline-flex; }
    .cta--sp.btn--block {
      display: flex; }

  .cta--pc + .cta--sp {
    margin-top: 0; } }
/* ==========================================================
   チップ（タクソノミー）
   ========================================================== */
.chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.4;
  background: #ffffff;
  border: 1px solid #e4e4e2;
  transition: color 0.3s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
  .chip:hover {
    color: #ffffff;
    background: #0e0e0e;
    border-color: #0e0e0e; }
    .chip:hover .chip__count {
      color: rgba(255, 255, 255, 0.6); }
  .chip.is-current {
    color: #ffffff;
    background: #ff7f11;
    border-color: #ff7f11; }
    .chip.is-current .chip__count {
      color: rgba(255, 255, 255, 0.6); }
  .chip.is-disabled {
    opacity: 0.3;
    pointer-events: none; }
  .chip--sm {
    padding: 6px 12px;
    font-size: 0.6875rem; }
  .chip__count {
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 0.6875rem;
    font-weight: 700;
    color: #5a5a58;
    transition: color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }

/* ==========================================================
   テキストリンク（もっと見る）
   ========================================================== */
.link-more {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  white-space: nowrap; }
  .link-more::after {
    content: "";
    width: 1.4em;
    height: 1.4em;
    flex-shrink: 0;
    background: currentColor;
    mask-image: url("../assets/img/icons/caret-right-solid-full.svg");
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
    -webkit-mask-image: url("../assets/img/icons/caret-right-solid-full.svg");
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
  .link-more:hover::after {
    transform: translateX(5px); }

/* ==========================================================
   ページトップ
   ========================================================== */
.pagetop {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 90;
  width: 48px;
  height: 48px;
  padding: 0;
  border: none;
  background: #0e0e0e;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity 0.35s cubic-bezier(0.22, 1, 0.36, 1), transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), visibility 0.35s, background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
  .pagetop::after {
    content: "↑";
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 1rem;
    color: #ffffff; }
  .pagetop:hover {
    background: #ff7f11; }
  .pagetop.is-show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0); }
  @media (max-width: 640px) {
    .pagetop {
      right: 16px;
      bottom: 16px;
      width: 44px;
      height: 44px; } }

/* ==========================================================
   固定CTAバー（スクロールでフェードイン）
   ========================================================== */
.bookingbar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 95;
  padding: 12px 24px;
  background: rgba(255, 255, 255, 0.96);
  border-top: 1px solid #e4e4e2;
  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.08);
  opacity: 0;
  visibility: hidden;
  transform: translateY(100%);
  transition: opacity 0.35s cubic-bezier(0.22, 1, 0.36, 1), transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), visibility 0.35s; }
  .bookingbar.is-show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0); }
  @media (max-width: 640px) {
    .bookingbar {
      padding: 10px 16px; } }
  .bookingbar__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
    max-width: 1200px;
    margin-inline: auto; }
    @media (max-width: 640px) {
      .bookingbar__inner {
        gap: 8px; } }
  .bookingbar__sub {
    min-width: 240px;
    min-height: 68px;
    font-size: 1rem; }
    @media (max-width: 640px) {
      .bookingbar__sub {
        flex-shrink: 0;
        min-width: 0;
        min-height: 58px;
        padding-inline: 14px;
        font-size: 0.8125rem; } }
  .bookingbar__btn {
    min-width: 420px;
    min-height: 68px;
    font-size: 1rem; }
    @media (max-width: 640px) {
      .bookingbar__btn {
        flex: 1 1 auto;
        min-width: 0;
        width: auto;
        min-height: 58px;
        font-size: 1rem; } }

body.is-bookingbar-show .pagetop {
  bottom: 96px; }
  @media (max-width: 640px) {
    body.is-bookingbar-show .pagetop {
      bottom: 80px; } }

/* ==========================================================
   ページャー
   ========================================================== */
.pager {
  margin-top: 64px; }
  .pager__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none; }
  .pager .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: 44px;
    padding-inline: 12px;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 0.8125rem;
    font-weight: 600;
    border: 1px solid #e4e4e2;
    transition: color 0.3s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
    .pager .page-numbers:hover {
      color: #ffffff;
      background: #0e0e0e;
      border-color: #0e0e0e; }
    .pager .page-numbers.current {
      color: #ffffff;
      background: #ff7f11;
      border-color: #ff7f11; }
    .pager .page-numbers.dots {
      border-color: transparent; }
      .pager .page-numbers.dots:hover {
        color: inherit;
        background: none; }
  .pager__prev, .pager__next {
    font-family: "RnsNum", "Noto Sans JP", "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
    font-size: 0.8125rem; }

/* ==========================================================
   絞り込みの開閉（details / summary）
   JSを使わないので、読み込み中に開いた状態が一瞬見えることがない
   ========================================================== */
.filterbar {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  column-gap: 12px; }
  .filterbar__clear {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 46px;
    padding: 10px 18px;
    font-size: 0.8125rem;
    font-weight: 700;
    white-space: nowrap;
    color: #5a5a58;
    background: #ffffff;
    border: 1px solid #e4e4e2;
    transition: color 0.3s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
    .filterbar__clear::before {
      content: "×";
      font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
      font-size: 1rem;
      line-height: 1; }
    .filterbar__clear:hover {
      color: #ffffff;
      background: #0e0e0e;
      border-color: #0e0e0e; }
    @media (max-width: 640px) {
      .filterbar__clear {
        gap: 6px;
        padding: 10px 12px;
        font-size: 0.8125rem; } }

.filterbox {
  grid-column: 1 / -1;
  grid-row: 1;
  min-width: 0; }
  .filterbox__toggle {
    color: #0e0e0e;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-height: 46px;
    padding: 10px 20px;
    font-size: 1rem;
    font-weight: 700;
    background: #ffffff;
    border: 1px solid #e4e4e2;
    cursor: pointer;
    transition: color 0.3s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.3s cubic-bezier(0.22, 1, 0.36, 1);
    list-style: none; }
    .filterbox__toggle::-webkit-details-marker {
      display: none; }
    .filterbox__toggle::after {
      content: "＋";
      font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
      font-size: 0.875rem;
      color: #bf5900;
      transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
    .filterbox__toggle:hover {
      color: #ffffff;
      background: #0e0e0e;
      border-color: #0e0e0e; }
    @media (max-width: 640px) {
      .filterbox__toggle {
        gap: 8px;
        padding: 10px 14px;
        font-size: 0.8125rem; } }
  .filterbox__label {
    display: inline-flex;
    align-items: center;
    gap: 10px; }
    .filterbox__label::before {
      content: "";
      flex-shrink: 0;
      width: 16px;
      height: 16px;
      background: #ff7f11;
      mask-image: url("../assets/img/icons/magnifying-glass-solid-full.svg");
      mask-position: center;
      mask-repeat: no-repeat;
      mask-size: contain;
      -webkit-mask-image: url("../assets/img/icons/magnifying-glass-solid-full.svg");
      -webkit-mask-position: center;
      -webkit-mask-repeat: no-repeat;
      -webkit-mask-size: contain; }
  .filterbox__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding-inline: 6px;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 0.6875rem;
    font-weight: 700;
    color: #ffffff;
    background: #ff7f11;
    border-radius: 11px; }
  .filterbox__body {
    margin-top: 32px; }
  .filterbox[open] .filterbox__toggle {
    color: #ffffff;
    background: #0e0e0e;
    border-color: #0e0e0e; }
    .filterbox[open] .filterbox__toggle::after {
      content: "－"; }

/* ==========================================================
   絞り込み（アーカイブ上部）
   ========================================================== */
.filter + .filter {
  margin-top: 32px;
  padding-top: 32px;
  border-top: 1px solid #e4e4e2; }
.filter__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 16px;
  font-size: 1rem;
  font-weight: 700; }
.filter__label {
  display: inline-flex;
  align-items: center;
  gap: 10px; }
.filter--area .filter__label::before, .filter--capacity .filter__label::before, .filter--feature .filter__label::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: #ff7f11;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain; }
.filter--area .filter__label::before {
  mask-image: url("../assets/img/icons/location-dot-solid-full.svg");
  -webkit-mask-image: url("../assets/img/icons/location-dot-solid-full.svg"); }
.filter--capacity .filter__label::before {
  mask-image: url("../assets/img/icons/users-solid-full.svg");
  -webkit-mask-image: url("../assets/img/icons/users-solid-full.svg"); }
.filter--feature .filter__label::before {
  mask-image: url("../assets/img/icons/kitchen-set-solid-full.svg");
  -webkit-mask-image: url("../assets/img/icons/kitchen-set-solid-full.svg"); }
.filter__group {
  margin: 20px 0 12px;
  font-size: 0.8125rem;
  font-weight: 700;
  color: #5a5a58; }
  .filter__group:first-of-type {
    margin-top: 0; }
.filter__list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none; }

/* ==========================================================
   一覧ヘッダー・適用中の条件
   ========================================================== */
.list-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 28px; }
  @media (max-width: 980px) {
    .list-head {
      flex-direction: column;
      gap: 16px; } }

.list-count {
  flex-shrink: 0;
  margin: 0 0 24px;
  font-size: 0.8125rem;
  color: #5a5a58; }
  .list-count__num {
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    color: #0e0e0e; }

.applied {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 12px; }
  .applied__label {
    margin: 0;
    font-size: 0.6875rem;
    font-weight: 700;
    color: #5a5a58; }
  .applied__list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none; }
  .applied__tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    font-size: 0.6875rem;
    font-weight: 700;
    color: #ffffff;
    background: #ff7f11; }
    .applied__tag::after {
      content: "";
      width: 10px;
      height: 10px;
      background: #ffffff;
      clip-path: polygon(20% 26%, 26% 20%, 50% 44%, 74% 20%, 80% 26%, 56% 50%, 80% 74%, 74% 80%, 50% 56%, 26% 80%, 20% 74%, 44% 50%); }
    .applied__tag:hover {
      background: #e56a00; }
  .applied__clear {
    font-size: 0.6875rem;
    color: #5a5a58;
    text-decoration: underline;
    text-underline-offset: 3px; }
    .applied__clear:hover {
      color: #bf5900; }

.empty-box {
  padding: 64px 0;
  text-align: center; }
  .empty-box .empty {
    padding: 0 0 24px; }

/* ==========================================================
   「〜から探す」ページのタームカード
   ========================================================== */
.term-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px 24px; }
  @media (max-width: 980px) {
    .term-grid {
      grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 640px) {
    .term-grid {
      grid-template-columns: 1fr;
      gap: 24px; } }

.term-card__link {
  display: block; }
  .term-card__link:hover .figure--term {
    opacity: 0.82; }
.term-card__media {
  position: relative;
  margin-bottom: 16px;
  overflow: hidden;
  background: #f6f6f5; }
  .term-card__media .figure--term {
    display: block;
    transition: opacity 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
  .term-card__media img {
    display: block;
    width: 100%;
    aspect-ratio: 3 / 2;
    object-fit: cover; }
.term-card__body {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid #e4e4e2; }
.term-card__title {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 600;
  transition: color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
.term-card__count {
  margin: 0;
  font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1;
  color: #0e0e0e; }
.term-card__unit {
  margin-left: 3px;
  font-family: "RnsNum", "Noto Sans JP", "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
  font-size: 0.6875rem;
  font-weight: 700;
  color: #5a5a58; }

.browse__foot {
  margin-top: 56px;
  text-align: center; }

/* ==========================================================
   エリア一覧（TOP）
   ========================================================== */
.area-group + .area-group {
  margin-top: 24px; }
  @media (max-width: 640px) {
    .area-group + .area-group {
      margin-top: 20px; } }
.area-group__title {
  margin: 0 0 10px;
  padding-bottom: 8px;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  border-bottom: 1px solid #e4e4e2; }

.area-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none; }
  @media (max-width: 980px) {
    .area-list {
      grid-template-columns: repeat(3, 1fr); } }
  @media (max-width: 640px) {
    .area-list {
      grid-template-columns: repeat(2, 1fr); } }
  .area-list__item {
    background: #f6f6f5; }
    .area-list__item > a {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      min-height: 48px;
      padding: 16px;
      height: 100%; }
      .area-list__item > a::after {
        content: "";
        flex-shrink: 0;
        width: 0.8rem;
        height: 0.8rem;
        background: #9a9a97;
        mask-image: url("../assets/img/icons/chevron-right-solid-full.svg");
        mask-position: center;
        mask-repeat: no-repeat;
        mask-size: contain;
        -webkit-mask-image: url("../assets/img/icons/chevron-right-solid-full.svg");
        -webkit-mask-position: center;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
        transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
      .area-list__item > a:hover::after {
        transform: translateX(4px); }
  .area-list__name {
    font-size: 0.8125rem;
    font-weight: 700;
    line-height: 1.5;
    word-break: auto-phrase;
    overflow-wrap: anywhere; }

/* ==========================================================
   数字（TOP）
   ========================================================== */
.stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
  margin: 0; }
  @media (max-width: 980px) {
    .stats {
      grid-template-columns: repeat(2, 1fr);
      gap: 40px 24px; } }
  .stats__item {
    padding-top: 24px;
    border-top: 2px solid #0e0e0e; }
  .stats__label {
    margin-bottom: 10px;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #5a5a58; }
  .stats__value {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin: 0; }
  .stats__num {
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: clamp(1.75rem, 3.2vw, 2.75rem);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -0.02em;
    color: #bf5900;
    font-variant-numeric: tabular-nums; }
  .stats__unit {
    font-size: 0.8125rem;
    font-weight: 700; }
  .stats__approx {
    font-size: 0.8125rem;
    font-weight: 700; }
  .stats--3 {
    grid-template-columns: repeat(3, 1fr);
    gap: 40px; }
    @media (max-width: 980px) {
      .stats--3 {
        grid-template-columns: repeat(3, 1fr);
        gap: 24px; } }
    @media (max-width: 640px) {
      .stats--3 {
        grid-template-columns: 1fr;
        gap: 28px; } }
    .stats--3 .stats__num {
      font-size: clamp(2.5rem, 6.4vw, 5rem); }
    .stats--3 .stats__unit,
    .stats--3 .stats__approx {
      font-size: 1rem; }
  .stats__note {
    margin: 20px 0 0;
    font-size: 0.8125rem;
    line-height: 1.9;
    color: #5a5a58; }
    .stats__note + .stats__note {
      margin-top: 6px; }

/* ==========================================================
   スペック定義リスト（詳細ページ）
   ========================================================== */
.spec-list {
  margin: 0 0 28px;
  border-top: 1px solid #e4e4e2; }
  .spec-list__row {
    display: grid;
    grid-template-columns: 6em 1fr;
    gap: 16px;
    padding: 14px 0;
    border-bottom: 1px solid #e4e4e2; }
    .spec-list__row dt {
      font-size: 0.8125rem;
      font-weight: 700;
      color: #5a5a58; }
    .spec-list__row dd {
      margin: 0;
      font-size: 1rem; }

/* ==========================================================
   会社概要
   ========================================================== */
.company-list {
  margin: 0;
  border-top: 1px solid #e4e4e2; }
  .company-list__row {
    display: grid;
    grid-template-columns: 10em 1fr;
    gap: 24px;
    align-items: baseline;
    padding: 20px 0;
    border-bottom: 1px solid #e4e4e2; }
    @media (max-width: 640px) {
      .company-list__row {
        grid-template-columns: 1fr;
        gap: 6px;
        padding: 16px 0; } }
    .company-list__row dt {
      font-size: 0.8125rem;
      font-weight: 700;
      color: #5a5a58; }
    .company-list__row dd {
      margin: 0;
      font-size: 1rem;
      line-height: 2; }

/* ==========================================================
   特徴（Aboutページ）
   ========================================================== */
.features {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: none; }
  @media (max-width: 980px) {
    .features {
      grid-template-columns: 1fr;
      gap: 32px; } }
  .features__item {
    padding-top: 28px;
    border-top: 2px solid #0e0e0e; }
  .features__num {
    display: block;
    margin-bottom: 16px;
    font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: clamp(1.5rem, 2.3vw, 2rem);
    font-weight: 600;
    line-height: 1;
    color: #bf5900; }
  .features__title {
    margin: 0 0 14px;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.5; }
  .features__text {
    margin: 0;
    font-size: 1rem;
    line-height: 1.9;
    color: #333333; }

.features--2col {
  grid-template-columns: repeat(2, 1fr);
  gap: 40px 48px; }
  @media (max-width: 980px) {
    .features--2col {
      grid-template-columns: 1fr;
      gap: 32px; } }
  .features--2col .features__title {
    font-size: 1.25rem; }
  .features--2col .features__text {
    font-size: 1rem; }
    .features--2col .features__text strong {
      font-weight: 600;
      color: #0e0e0e; }

/* ==========================================================
   絞り込みモーダル（filter-modal.php）
   条件をためて「この条件で見る」で1回だけ遷移する版。
   .filter / .chip はパネル版と共用し、ここは器と入力まわりだけ持つ
   ========================================================== */
.sheet {
  width: min(680px, calc(100% - 32px));
  max-height: min(80vh, 720px);
  max-width: none;
  margin: auto;
  padding: 0;
  color: #0e0e0e;
  background: #ffffff;
  border: 1px solid #e4e4e2;
  box-shadow: 0 24px 60px rgba(14, 14, 14, 0.28);
  overflow: hidden; }
  .sheet[open] {
    display: flex;
    flex-direction: column; }
  .sheet::backdrop {
    background: rgba(14, 14, 14, 0.5); }
  html:not(.has-dialog) .sheet {
    display: block;
    max-height: none;
    margin-top: 24px;
    overflow: visible;
    box-shadow: none; }
  .sheet__form {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0; }
  .sheet__head {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 24px;
    border-bottom: 1px solid #e4e4e2; }
  .sheet__title {
    margin: 0;
    font-size: 1rem;
    font-weight: 600; }
  .sheet__close {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    padding: 0;
    background: #ffffff;
    border: 1px solid #e4e4e2;
    cursor: pointer;
    transition: color 0.3s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
    .sheet__close::before {
      content: "×";
      font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
      font-size: 1.125rem;
      line-height: 1; }
    .sheet__close:hover {
      color: #ffffff;
      background: #0e0e0e;
      border-color: #0e0e0e; }
  .sheet__body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 24px; }
    @media (max-width: 640px) {
      .sheet__body {
        padding: 20px 16px; } }
  .sheet__foot {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 24px;
    background: #f6f6f5;
    border-top: 1px solid #e4e4e2; }
    @media (max-width: 640px) {
      .sheet__foot {
        padding: 14px 16px; } }
  .sheet__reset {
    flex-shrink: 0;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #5a5a58;
    text-decoration: underline;
    text-underline-offset: 3px; }
    .sheet__reset:hover {
      color: #ff7f11; }
  .sheet__apply {
    min-width: 200px; }
    @media (max-width: 640px) {
      .sheet__apply {
        min-width: 0;
        flex: 1 1 auto; } }

/* モーダルを開いているあいだ背面を止める
   （dialog の ::backdrop は覆うだけでスクロールは止めてくれない） */
html.is-sheet-open,
body.is-sheet-open {
  overflow: hidden; }

/* チェックボックス本体は隠し、label(.chip) の見た目で状態を出す */
/* 隠した input の位置の基準を li にする。
   これが無いと position:absolute の基準が <dialog> になり、本文をスクロールしても
   input だけ取り残される（実測で510pxのズレ）。その状態でチップを押すと
   フォーカスが遠くの input へ移り、ブラウザがそこまで戻して画面が上にジャンプする。 */
.sheet .filter__list li {
  position: relative; }

.chip__input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0; }
  .chip__input + .chip {
    cursor: pointer; }
  .chip__input:checked + .chip {
    color: #ffffff;
    background: #ff7f11;
    border-color: #ff7f11; }
  .chip__input:disabled + .chip {
    opacity: 0.3;
    pointer-events: none; }
  .chip__input:focus-visible + .chip {
    outline: 2px solid #ff7f11;
    outline-offset: 2px; }

/* ==========================================================
   フォーム共通
   ========================================================== */
.form .field + .field {
  margin-top: 20px; }
.form .checkbox {
  margin-top: 20px; }
.form .btn {
  margin-top: 28px; }

.field__label {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
  font-size: 0.8125rem;
  font-weight: 700; }
.field__req {
  padding: 3px 8px;
  font-size: 0.6875rem;
  font-weight: 700;
  color: #ffffff;
  background: #ff7f11; }
.field__note {
  font-size: 0.6875rem;
  font-weight: 500;
  color: #5a5a58; }
.field__input {
  width: 100%;
  min-height: 52px;
  padding: 12px 16px;
  font-family: inherit;
  font-size: 1rem;
  color: #0e0e0e;
  background: #ffffff;
  border: 1px solid #e4e4e2;
  border-radius: 0;
  transition: border-color 0.3s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s cubic-bezier(0.22, 1, 0.36, 1);
  -webkit-appearance: none;
  appearance: none; }
  .field__input:focus {
    outline: none;
    border-color: #ff7f11;
    box-shadow: 0 0 0 3px rgba(255, 127, 17, 0.15); }
  .field__input::placeholder {
    color: #9a9a97; }
.field__help {
  margin: 8px 0 0;
  font-size: 0.6875rem;
  color: #5a5a58; }

.checkbox {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 0.8125rem;
  line-height: 1.7;
  cursor: pointer; }
  .checkbox input {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin-top: 2px;
    accent-color: #ff7f11;
    cursor: pointer; }
  .checkbox a {
    text-decoration: underline;
    text-underline-offset: 3px; }
    .checkbox a:hover {
      color: #bf5900; }

/* ==========================================================
   通知
   ========================================================== */
.form-notice {
  margin-bottom: 24px;
  padding: 16px 20px;
  font-size: 0.8125rem;
  line-height: 1.8;
  border-left: 3px solid; }
  .form-notice a {
    text-decoration: underline;
    text-underline-offset: 3px; }
  .form-notice--error {
    color: #a4262c;
    background: #fdf3f4;
    border-color: #d63638; }
  .form-notice--success {
    color: #0a6640;
    background: #eff9f4;
    border-color: #00a32a; }

/* ==========================================================
   ログイン・新規登録
   ========================================================== */
.sec--auth {
  padding-block: 72px 120px; }
  @media (max-width: 640px) {
    .sec--auth {
      padding-block: 48px 72px; } }

.auth {
  width: 100%;
  max-width: 460px;
  margin-inline: auto;
  padding-inline: 24px; }
  .auth__foot {
    margin-top: 32px; }
  .auth__link {
    margin: 0;
    font-size: 0.8125rem;
    text-align: center; }
    .auth__link a {
      text-decoration: underline;
      text-underline-offset: 3px; }
      .auth__link a:hover {
        color: #bf5900; }
  .auth__switch {
    margin-top: 32px;
    padding-top: 28px;
    border-top: 1px solid #e4e4e2; }
  .auth__switch-text {
    margin: 0 0 14px;
    font-size: 0.8125rem;
    text-align: center;
    color: #5a5a58; }

.benefits {
  margin: 0 0 32px;
  padding: 20px 24px;
  list-style: none;
  background: #f6f6f5; }
  .benefits__item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 0.8125rem;
    line-height: 1.8; }
    .benefits__item + .benefits__item {
      margin-top: 10px; }
    .benefits__item::before {
      content: "";
      flex-shrink: 0;
      width: 16px;
      height: 16px;
      margin-top: 4px;
      background: #ff7f11;
      clip-path: polygon(41% 76%, 12% 47%, 20% 39%, 41% 60%, 80% 21%, 88% 29%); }

/* ==========================================================
   利用シーン（ユーザー投稿写真）
   ========================================================== */
.scenes {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px 24px;
  margin: 0 0 40px;
  padding: 0;
  list-style: none; }
  @media (max-width: 980px) {
    .scenes {
      grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 640px) {
    .scenes {
      gap: 24px 16px; } }
  .scenes__figure {
    position: relative;
    margin: 0 0 12px;
    overflow: hidden;
    background: #f6f6f5; }
    .scenes__figure img {
      display: block;
      width: 100%;
      aspect-ratio: 4 / 3;
      object-fit: cover; }
  .scenes__tag {
    position: absolute;
    left: 0;
    bottom: 0;
    padding: 6px 12px;
    font-size: 0.6875rem;
    font-weight: 700;
    color: #ffffff;
    background: rgba(14, 14, 14, 0.82);
    backdrop-filter: blur(6px); }
  .scenes__comment {
    margin: 0 0 10px;
    font-size: 0.8125rem;
    line-height: 1.8;
    color: #333333; }
  .scenes__meta {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    font-size: 0.6875rem;
    color: #5a5a58; }
  .scenes__author {
    font-weight: 700;
    color: #5a5a58; }
  .scenes__empty {
    margin: 0 0 32px;
    padding: 32px;
    font-size: 0.8125rem;
    text-align: center;
    color: #5a5a58;
    background: #f6f6f5; }

/* 投稿フォーム */
.photo-post__guest {
  padding: 24px 28px 26px;
  background: #f6f6f5;
  border-top: 3px solid #ff7f11; }
  @media (max-width: 640px) {
    .photo-post__guest {
      padding: 20px; } }
.photo-post__guest-text {
  margin: 0 0 16px;
  font-size: 0.8125rem;
  font-weight: 700; }
.photo-post__guest-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px; }
  .photo-post__guest-actions .btn {
    min-height: 44px;
    padding-inline: 22px;
    font-size: 0.8125rem; }
.photo-post__box {
  background: #f6f6f5; }
.photo-post__toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 20px;
  font-size: 0.8125rem;
  font-weight: 700;
  cursor: pointer;
  list-style: none;
  transition: background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
  .photo-post__toggle::-webkit-details-marker {
    display: none; }
  .photo-post__toggle::before {
    content: "";
    flex-shrink: 0;
    width: 14px;
    height: 14px;
    background: #ff7f11;
    clip-path: polygon(43% 0, 57% 0, 57% 43%, 100% 43%, 100% 57%, 57% 57%, 57% 100%, 43% 100%, 43% 57%, 0 57%, 0 43%, 43% 43%);
    transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
  .photo-post__toggle:hover {
    background: #f6f6f5; }
.photo-post__box[open] .photo-post__toggle::before {
  transform: rotate(135deg); }
.photo-post__form {
  padding: 4px 20px 24px;
  border-top: 1px solid #e4e4e2; }
  @media (max-width: 640px) {
    .photo-post__form {
      padding-inline: 16px; } }
.photo-post__note {
  margin: 16px 0 0;
  font-size: 0.6875rem;
  line-height: 1.8;
  color: #5a5a58; }

.field__input--file {
  padding: 10px 12px;
  font-size: 0.8125rem;
  cursor: pointer; }
  .field__input--file::file-selector-button {
    margin-right: 12px;
    padding: 7px 14px;
    font-family: inherit;
    font-size: 0.6875rem;
    font-weight: 700;
    color: #0e0e0e;
    background: #f6f6f5;
    border: 1px solid #e4e4e2;
    cursor: pointer;
    transition: background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
  .field__input--file::file-selector-button:hover {
    background: #e4e4e2; }

/* ==========================================================
   マイページ
   ========================================================== */
.sec--mypage {
  padding-block: 64px 120px; }
  @media (max-width: 640px) {
    .sec--mypage {
      padding-block: 40px 72px; } }

.mypage__block + .mypage__block {
  margin-top: 88px;
  padding-top: 72px;
  border-top: 1px solid #e4e4e2; }
  @media (max-width: 640px) {
    .mypage__block + .mypage__block {
      margin-top: 56px;
      padding-top: 48px; } }
.mypage__count {
  flex-shrink: 0;
  margin: 0;
  font-size: 0.8125rem;
  color: #5a5a58; }
.mypage__count-num {
  font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 1.25rem;
  font-weight: 600;
  color: #0e0e0e; }
.mypage__group + .mypage__group {
  margin-top: 56px; }
.mypage__group-ttl {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 24px;
  padding-bottom: 12px;
  font-size: 1.25rem;
  font-weight: 600;
  border-bottom: 1px solid #e4e4e2; }
.mypage__group-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  padding-inline: 6px;
  font-family: "RnsNum", "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 0.6875rem;
  font-weight: 700;
  color: #ffffff;
  background: #0e0e0e;
  border-radius: 11px; }
.mypage__cols {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 64px;
  align-items: start; }
  @media (max-width: 980px) {
    .mypage__cols {
      grid-template-columns: 1fr;
      gap: 40px; } }
.mypage__side .btn {
  margin-top: 12px; }

/* ==========================================================
   お問い合わせ（contact.php）入力 → 確認 → 完了
   ========================================================== */
.sec--contact {
  padding-top: 56px; }
  @media (max-width: 640px) {
    .sec--contact {
      padding-top: 36px; } }

.contact-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 0 0 40px;
  padding: 0;
  list-style: none;
  counter-reset: contact-step; }
  .contact-steps__item {
    padding: 0 0 12px;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.5;
    color: #5a5a58;
    text-align: center;
    border-bottom: 2px solid #e4e4e2;
    counter-increment: contact-step; }
    .contact-steps__item::before {
      content: counter(contact-step) ". "; }
    .contact-steps__item.is-current {
      color: #0e0e0e;
      border-color: #ff7f11; }

.contact-intro {
  margin: 0 0 32px;
  font-size: 1rem;
  line-height: 1.9;
  color: #333333; }

.contact-form .field + .field {
  margin-top: 28px; }
.contact-form__hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden; }
.contact-form__switch {
  margin-top: 12px; }
.contact-form__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin-top: 40px; }
  .contact-form__actions .btn {
    margin-top: 0; }
  @media (max-width: 640px) {
    .contact-form__actions--confirm {
      flex-direction: column-reverse;
      align-items: stretch; } }

.field__set {
  margin: 0;
  padding: 0;
  border: 0; }
.field__choices {
  display: flex;
  flex-wrap: wrap;
  gap: 8px; }
.field__input--select {
  padding-right: 44px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%230e0e0e' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 12px 8px;
  cursor: pointer; }
.field__input--textarea {
  min-height: 180px;
  line-height: 1.8;
  resize: vertical; }
.field__error {
  margin: 8px 0 0;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.6;
  color: #a4262c; }
.field.is-error .field__input {
  border-color: #d63638;
  background: #fdf3f4; }

.choice {
  position: relative;
  cursor: pointer; }
  .choice input {
    position: absolute;
    opacity: 0; }
  .choice span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 52px;
    min-height: 44px;
    padding: 0 14px;
    font-size: 1rem;
    font-weight: 600;
    background: #ffffff;
    border: 1px solid #e4e4e2;
    transition: border-color 0.3s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.3s cubic-bezier(0.22, 1, 0.36, 1), color 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
  .choice input:checked + span {
    color: #ffffff;
    background: #0e0e0e;
    border-color: #0e0e0e; }
  .choice input:focus-visible + span {
    box-shadow: 0 0 0 3px rgba(255, 127, 17, 0.35); }

.contact-confirm {
  margin: 0;
  border-top: 1px solid #e4e4e2; }
  .contact-confirm__row {
    display: grid;
    grid-template-columns: 14em 1fr;
    gap: 24px;
    padding: 20px 0;
    border-bottom: 1px solid #e4e4e2; }
    @media (max-width: 640px) {
      .contact-confirm__row {
        grid-template-columns: 1fr;
        gap: 6px;
        padding: 16px 0; } }
    .contact-confirm__row dt {
      font-size: 0.8125rem;
      font-weight: 700;
      line-height: 1.7;
      color: #5a5a58; }
    .contact-confirm__row dd {
      margin: 0;
      font-size: 1rem;
      line-height: 1.8;
      color: #333333;
      white-space: pre-line;
      overflow-wrap: anywhere; }

.contact-thanks {
  font-size: 1rem;
  line-height: 1.9;
  color: #333333; }
  .contact-thanks p {
    margin: 0 0 16px;
    line-height: inherit; }
  .contact-thanks__lead {
    font-size: clamp(1.5rem, 2.3vw, 2rem);
    font-weight: 600;
    line-height: 1.5;
    color: #0e0e0e; }
  .contact-thanks__note {
    font-size: 0.8125rem;
    color: #5a5a58; }