@charset "UTF-8";
/* ==========================================================================
   1. BASE & UTILITIES (共通設定・レイアウト)
   ========================================================================== */
html { scroll-behavior: smooth; }
body, .main-content-wrapper, #concept, #access, #exhibition, #news {
  display: block;
  visibility: visible;
  opacity: 1;
  background-color: #E0E0E0;
}

.text-dark {
  color: #191919;
}
.text-gray {
  color: #3A3A40;
}
.text-white {
  color: #FFFFFF;
}
.bg-red-carpet {
  background-color: #9D1C1F;
}
.bg-screen-black {
  background-color: #252526;
}
.border-t {
  border-top: none;
}
.border-b {
  border-bottom: none;
}
.relative {
  position: relative;
}
.block {
  display: block;
}
.text-center {
  text-align: center;
}
.text-justify {
  text-align: justify;
}
.select-none {
  user-select: none;
  -webkit-user-select: none;
}
/* 独自のヘッダー非表示設定（要件に基づき現状を維持） */
.site-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  z-index: 50 !important;
  background: transparent !important;
  mix-blend-difference: difference !important;
  pointer-events: none !important;
  display: none;
}
/* ==========================================================================
   2. TYPOGRAPHY (フォント・縦書き設定)
   ========================================================================== */
.font-modern-gothic {
  font-family: 'Inter', -apple-system, sans-serif;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.font-modern-gothic-ja {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  letter-spacing: 0.15em;
}
.font-modern-gothic-thin {
  font-family: 'Inter', -apple-system, sans-serif;
  font-weight: 300;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.font-sans-clean {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 300;
  letter-spacing: 0.12em;
}
.forced-vertical-normal {
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  text-orientation: mixed;
}
.selection-red::selection {
  background-color: #9D1C1F;
  color: #FFFFFF;
}
.selection-red *::selection {
  background-color: #9D1C1F;
  color: #FFFFFF;
}
/* ==========================================================================
   3. HERO / KV (キービジュアル)
   ========================================================================== */
.kv-section {
  position: relative;
  height: 100vh;
  min-height: 600px;
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}
.kv-cinematic-stage {
  position: absolute;
  top: 44%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  max-width: 450px;
  height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.kv-stage-text {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: introTextAnimation 3.2s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}
.kv-intro-vertical-text {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 300;
  font-size: clamp(2.1rem, 6vw, 2.8rem);
  line-height: 2.1;
  letter-spacing: 0.25em;
  color: #FFFFFF;
  white-space: nowrap;
}
.kv-stage-logo {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  animation: mainLogoRevealAnimation 1.5s cubic-bezier(0.25, 1, 0.5, 1) 2.7s forwards;
}
.kv-logo-img {
  width: 320px;
  max-width: 85vw;
  height: auto;
  object-fit: contain;
}
@media (min-width: 768px) {
  .kv-logo-img {
    width: 450px;
  }
}
/* スクロールダウンアニメーション */
.scroll-down-container {
  position: absolute;
  bottom: 4.5rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 20;
}
.scroll-text {
  font-size: 8px;
  color: rgba(255, 255, 255, 0.6);
  letter-spacing: 0.35em;
  margin-bottom: 0.75rem;
}
.scroll-line {
  width: 1px;
  height: 3rem;
  background-color: rgba(255, 255, 255, 0.3);
  position: relative;
  overflow: hidden;
}
.scroll-animation-bar {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 50%;
  background-color: #FFFFFF;
  animation: bounce 2s infinite;
}
@media (min-width: 1024px) {
  .kv-section {
    height: 100vh;
  }
}
@keyframes introTextAnimation {
  0% {
    opacity: 0;
    transform: translateY(10px);
    filter: blur(4px);
  }
  20% {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
  80% {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
  100% {
    opacity: 0;
    transform: translateY(-10px);
    filter: blur(2px);
    visibility: hidden;
  }
}
@keyframes mainLogoRevealAnimation {
  0% {
    opacity: 0;
    transform: scale(0.97);
    filter: blur(4px);
  }
  100% {
    opacity: 0.95;
    transform: scale(1);
    filter: blur(0);
  }
}
/* ==========================================================================
   4. GRID & STRUCTURE (セクション共通レイアウト)
   ========================================================================== */
.content-section {
  padding: 4rem 1rem;
  max-width: 1900px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}
.two-col-grid, .two-col-equal-grid, .three-col-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: start;
}
.story-block {
  padding-right: 0;
}
@media (min-width: 1024px) {
  .content-section {
    padding: 9rem 2rem;
  }
  .two-col-grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 4rem;
  }
  .story-block {
    grid-column: span 6 / span 6;
    padding-right: 1.5rem;
  }
  .image-block, .map-block {
    grid-column: span 6 / span 6;
  }
  .pt-lg-offset {
    margin-top: 360px;
  }
  .two-col-equal-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4rem;
  }
}
@media (min-width: 768px) {
  .three-col-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4rem;
  }
}
/* 画像・カード基本 */
.aspect-4-3 {
  aspect-ratio: 16 / 11;
}
.aspect-16-10 {
  aspect-ratio: 16 / 10;
}
.border-card {
  border: 1px solid #CCCCCC;
  overflow: hidden;
}
.hero-zoom {
  position: relative;
  overflow: hidden;
}
.hero-zoom img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.grayscale-img {
  filter: none;
}
/* セクションタイトル設定 */
.section-title-area-fixed {
  display: block;
  text-align: left;
  width: auto;
  max-width: max-content;
  margin: 0;
  padding: 0;
}
.main-section-heading, .sub-section-heading {
  font-family: 'Inter', -apple-system, sans-serif;
  font-weight: 800;
  color: #191919;
  text-transform: uppercase;
  margin: 0;
  padding: 0;
  display: block;
}
.main-section-heading {
  font-size: 3rem;
  line-height: 1;
  letter-spacing: -0.02em;
}
@media (min-width: 640px) {
  .main-section-heading {
    font-size: 4rem;
  }
}
@media (min-width: 768px) {
  .main-section-heading {
    font-size: 4.5rem;
  }
}
@media (min-width: 1024px) {
  .main-section-heading {
    font-size: 5rem;
  }
}
.sub-section-heading {
  font-size: 2.25rem;
  line-height: 1;
  letter-spacing: -0.01em;
}
@media (min-width: 768px) {
  .sub-section-heading {
    font-size: 3rem;
  }
}
@media (min-width: 1024px) {
  .sub-section-heading {
    font-size: 3.5rem;
  }
}
/* アクセントライン */
.accent-bar-fixed {
  height: 3px;
  width: 48px;
  background-color: #9D1C1F;
  margin-top: 14px;
  margin-bottom: 0;
}
.accent-bar-short-fixed {
  height: 3px;
  width: 32px;
  background-color: #9D1C1F;
  margin-top: 12px;
  margin-bottom: 0;
}
.accent-bar-mini-fixed {
  height: 3px;
  width: 24px;
  background-color: #9D1C1F;
  margin-top: 12px;
  margin-bottom: 0;
}
/* 余白・スペーサーコントロール */
.pt-6-spacer {
  padding-top: 1.5rem;
}
.mb-16-spacer {
  margin-bottom: 4rem;
}
.mb-6rem {
  margin-bottom: 6rem;
}
/* ==========================================================================
   5. CONCEPT & ACCESS (各個別セクション設定)
   ========================================================================== */
/* 映画風キャッチコピー（縦書きエリア） */
.vertical-catch-container {
  height: 480px;
  padding: 1rem 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}
.vertical-catch-align-wrapper {
  width: fit-content;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}
.cinematic-vertical-catch {
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  font-weight: 400;
  line-height: 2.2;
  height: 440px;
  display: inline-block;
  white-space: nowrap;
  margin: 0;
  font-size: clamp(1.8rem, 4.5vw, 2.2rem);
}
.concept-story-gap, .access-story-gap {
  display: flex;
  flex-direction: column;
  gap: 3rem;
}
.concept-p-gap, .access-p-gap {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  font-size: 1.0rem;
  line-height: 2.0;
  letter-spacing: 0.15em;
  margin-top: 1em;
}
.concept-p-gap p, .access-p-gap p {
  margin: 0;
}
@media (max-width: 1023px) {
  .concept-story-gap, .access-story-gap {
    gap: 2.5rem;
  }
  .vertical-catch-container {
    height: 320px;
  }
  .cinematic-vertical-catch {
    height: 280px;
  }
  .py-6-spacer {
    display: none;
  }
}
/* Google Map設定 */
.monotone-map iframe {
  width: 100%;
  height: 100%;
  border: 0;
  filter: grayscale(1) contrast(1.15) brightness(0.9);
  transition: filter 0.8s ease;
}
.monotone-map:hover iframe {
  filter: grayscale(0.6) contrast(1) brightness(1);
}
.font-weight-700 {
  font-weight: 700;
}
.cinematic-info-row-clean {
  width: 100%;
  display: block;
}
.cinematic-info-row-clean p {
  margin: 0;
  white-space: nowrap;
  letter-spacing: 0.12em;
  line-height: 1.8;
}
@media (max-width: 767px) {
  .cinematic-info-row-clean p {
    white-space: normal;
    text-align: justify;
  }
}
/* ==========================================================================
   6. EXHIBITION & CAFE
   ========================================================================== */
.exhibition-container {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.exhibition-layout-grid {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  width: 100%;
}
.exhibition-text-block {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
.exhibition-text-block .content-text-area p {
  font-size: 1.0rem;
  line-height: 2.0;
  letter-spacing: 0.06em;
}
.exhibition-image-block .hero-zoom {
  aspect-ratio: 3 / 2;
}
@media (min-width: 768px) {
  .exhibition-text-block .content-text-area p {
    letter-spacing: 0.15em;
  }
}
/* ★PC（1024px以上）時のフレックス設定をグリッド表示（左右2カラム）に修正 */
@media (min-width: 1024px) {
  .exhibition-layout-grid {
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 4rem !important;
    align-items: center !important;
  }
  .exhibition-image-block {
    grid-column: span 6 / span 6 !important;
  }
  .exhibition-text-block {
    grid-column: span 6 / span 6 !important;
    gap: 3rem !important;
  }
}
.content-sub-heading {
  margin: 0;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.12em;
  font-size: 1.8rem;
}
@media (min-width: 1024px) {
  .content-sub-heading {
    font-size: 2.2rem;
  }
}
.leading-double {
  line-height: 2;
}
/* CAFEスケジュールセクション */
.nowon-section {
  display: flex;
  flex-direction: column;
  gap: 4rem;
}
.nowon-row-fixed {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
  align-items: center;
  width: 100%;
}
@media (min-width: 1024px) {
  .nowon-row-fixed {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 5rem;
  }
  .nowon-img-col-fixed {
    grid-column: span 7 / span 7;
    width: 100%;
  }
  .nowon-text-col-fixed {
    grid-column: span 5 / span 5;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    width: 100%;
  }
}
.nowon-meta {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding-bottom: 1rem;
}
.nowon-title {
  font-size: 1.25rem;
  letter-spacing: 0.05em;
  line-height: 1.4;
  margin: 0;
}
@media (min-width: 1024px) {
  .nowon-title {
    font-size: 1.5rem;
  }
}
/* ARCHIVES設定 */
.archives-section {
  display: flex;
  flex-direction: column;
  gap: 4rem;
}
.archive-item {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.archive-text-meta {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.archive-vol {
  font-size: 9px;
  display: block;
}
.archive-heading {
  font-size: 1.125rem;
  letter-spacing: 0.1em;
  margin: 0;
  transition: color 0.3s;
}
.archive-date {
  font-size: 0.75rem;
  letter-spacing: 0.05em;
  display: block;
}
/* CAFEエリア一括画像比率ガード */
.nowon-img-col-fixed.hero-zoom, .archive-item .hero-zoom {
  aspect-ratio: 2 / 1;
}
/* ==========================================================================
   7. BUTTONS & LINK EFFECT (ボタン・リンク)
   ========================================================================== */
.archive-btn-wrapper {
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-top: 1.25rem;
  box-sizing: border-box;
}
.btn-archive-more {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: 0.75rem;
  font-weight: 400;
  color: #191919;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  box-sizing: border-box;
  transition: opacity 0.3s ease;
}
.btn-archive-more::before {
  content: "";
  display: block;
  width: 24px;
  height: 1px;
  background-color: #191919;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  transform-origin: right center;
}
.btn-archive-more::after {
  content: "";
  display: block;
  width: 5px;
  height: 5px;
  border-top: 1px solid #191919;
  border-right: 1px solid #191919;
  transform: rotate(45deg);
  margin-left: -5px;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
.group:hover .btn-archive-more::before {
  transform: translateX(5px);
}
.group:hover .btn-archive-more::after {
  transform: translateX(5px);
}
.btn-archive-more:hover {
  opacity: 0.6;
}
/* CAFE 2連インタラクティブボタン */
.nowon-btn-flex-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 2rem;
  width: 100%;
}
.nowon-btn-flex-container .btn-collision {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 1.25rem 0;
  text-align: center;
  font-size: 0.9rem;
  letter-spacing: 0.2em;
  text-decoration: none;
  border: 1px solid #191919;
  color: #191919;
  background-color: transparent;
  box-sizing: border-box;
  cursor: pointer;
  z-index: 1;
  overflow: hidden;
  transition: color 0.4s cubic-bezier(0.25, 1, 0.5, 1), border-color 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
.nowon-btn-flex-container .btn-collision::before, .nowon-btn-flex-container .btn-collision::after {
  content: "";
  position: absolute;
  top: 0;
  width: 50%;
  height: 100%;
  background-color: #191919;
  z-index: -1;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
.nowon-btn-flex-container .btn-collision::before {
  left: 0;
  transform: translateX(-102%);
}
.nowon-btn-flex-container .btn-collision::after {
  right: 0;
  transform: translateX(102%);
}
.nowon-btn-flex-container .btn-collision:hover {
  color: #FFFFFF;
  border-color: #191919;
}
.nowon-btn-flex-container .btn-collision:hover::before {
  transform: translateX(0);
}
.nowon-btn-flex-container .btn-collision:hover::after {
  transform: translateX(0);
}
@media (min-width: 1024px) {
  .nowon-btn-flex-container {
    flex-direction: row;
    gap: 20px;
    justify-content: flex-start;
  }
  .nowon-btn-flex-container .btn-collision {
    flex: none;
    width: calc(50% - 10px);
    max-width: 24rem;
  }
}
/* ==========================================================================
   8. NEWS (お知らせリスト設定)
   ========================================================================== */
.mb-news-spacer {
  margin-bottom: 3rem;
}
@media (min-width: 1024px) {
  .mb-news-spacer {
    margin-bottom: 4.5rem;
  }
}
.news-list-container {
  width: 100%;
}
.news-row {
  padding: 2rem 1rem;
  background-color: transparent;
  transition: all 0.3s;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  position: relative;
}
.news-row:hover {
  background-color: rgba(0, 0, 0, 0.04);
}
.news-main-content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: calc(100% - 40px);
}
.news-meta-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
}
.news-date {
  font-size: 12px;
  color: #3A3A40;
  font-weight: 300;
  letter-spacing: 0.12em;
  line-height: 1;
  display: inline-block;
}
.news-badge {
  font-size: 9px;
  border: 1px solid #191919;
  padding: 0.2rem 0.6rem;
  text-transform: uppercase;
  display: inline-block;
  width: max-content;
  white-space: nowrap;
  line-height: 1;
}
.news-body-wrapper {
  width: 100%;
  display: block;
}
.news-text {
  font-size: 0.95rem;
  line-height: 1.8;
  letter-spacing: 0.05em;
  margin: 0;
  color: #191919;
  text-align: justify;
}
.news-row:hover .news-text {
  text-decoration: underline;
}
/* 矢印アニメーションスタック */
.news-arrow-container-css {
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease;
}
.news-arrow-container-css::before {
  content: "";
  position: absolute;
  width: 16px;
  height: 1.3px;
  background-color: #191919;
  right: 2px;
}
.news-arrow-container-css::after {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  border-top: 1.3px solid #191919;
  border-right: 1.3px solid #191919;
  transform: rotate(45deg);
  right: 2px;
}
@media (min-width: 1024px) {
  .news-row {
    padding: 1.75rem 1.5rem;
  }
  .news-main-content {
    flex-direction: row;
    align-items: flex-start;
    gap: 4rem;
    width: calc(100% - 40px);
  }
  .news-meta-block {
    flex-direction: row;
    align-items: center;
    gap: 2rem;
    flex-shrink: 0;
  }
  .news-date {
    width: 6rem;
    flex-shrink: 0;
  }
  .news-arrow-container-css {
    position: relative;
    right: auto;
    top: auto;
    transform: none;
    margin-top: -4px;
  }
  .group:hover .news-arrow-container-css {
    transform: translateX(6px);
  }
}
/* ==========================================================================
   9. BANNER SECTION (バナーコンポーネント)
   ========================================================================== */
.ex-banner-section {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding-top: 3rem;
  padding-bottom: 3.5rem;
  box-sizing: border-box;
}
.ex-banner-container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 100%;
}
.ex-banner-anchor {
  display: block;
  width: 88%;
  max-width: 88%;
  text-decoration: none;
  border: none;
  outline: none;
  box-shadow: none;
  transition: opacity 0.3s ease;
}
.ex-banner-anchor, .ex-banner-anchor::before, .ex-banner-anchor::after {
  text-decoration: none;
  border-bottom: none;
  box-shadow: none;
  content: none;
  color: transparent;
}
.ex-banner-img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto;
  border: none;
  box-shadow: none;
}
.ex-banner-anchor:hover {
  opacity: 0.8;
}
@media (min-width: 1024px) {
  .ex-banner-section {
    padding-top: 5rem;
    padding-bottom: 6rem;
  }
  .ex-banner-anchor {
    width: 100%;
    max-width: 800px;
  }
}
/* ==========================================================================
   10. FOOTER (フッター)
   ========================================================================== */
.site-footer {
  padding: 4rem 1rem 2rem 1rem;
}
@media (min-width: 640px) {
  .site-footer {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
@media (min-width: 768px) {
  .site-footer {
    padding: 6rem 3rem;
  }
}
.site-footer .footer-inner-container {
  max-width: 1900px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.5rem;
}

/* ロゴ全体のグループ */
.site-footer .footer-logo-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
  width: 100%;
  max-width: 240px;
  margin: 0 auto;
}

.site-footer .footer-logo-placeholder,
.site-footer .footer-logo-sub {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.site-footer .footer-logo-placeholder img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

/* 追加ロゴ（LTRロゴ）：SP時はもう一回り小さく（50%）＆中央寄せ */
.site-footer .footer-logo-sub img {
  display: block;
  width: 50%;
  height: auto;
  margin: 0 auto;
  object-fit: contain;
}

/* フッター中央バナー */
.site-footer .footer-center-banner-block {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.site-footer .footer-center-banner-anchor {
  display: block;
  width: 88%;
  max-width: 88%;
  transition: opacity 0.3s ease;
}
.site-footer .footer-center-banner-anchor, .site-footer .footer-center-banner-anchor::before, .site-footer .footer-center-banner-anchor::after {
  text-decoration: none;
  border-bottom: none;
  box-shadow: none;
  content: none;
}
.site-footer .footer-center-banner-img {
  display: block;
  width: 100%;
  height: auto;
  border: none;
}
.site-footer .footer-center-banner-anchor:hover {
  opacity: 0.8;
}

/* フッターナビゲーション */
.site-footer .footer-nav-wrapper {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.5rem;
  max-width: 280px;
  margin: 0 auto;
}
.footer-column {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  font-size: 11px;
  text-transform: uppercase;
  line-height: 1.625;
  text-align: left;
  flex-shrink: 0;
}
@media (min-width: 768px) {
  .footer-column {
    font-size: 12px;
  }
}
.footer-nav-link {
  color: #D4D4D4;
  text-decoration: none;
  display: block;
  transition: color 0.3s;
}
.footer-nav-link:hover {
  color: #FFFFFF;
}
.footer-sub-links {
  padding-left: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 0.5rem;
}
.footer-sns-block-item {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.footer-sns-title {
  font-weight: 300;
  color: #D4D4D4;
  letter-spacing: 0.12em;
  display: block;
}
.footer-sns-icons {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  margin-top: 0.25rem;
}
.sns-icon-img {
  width: 1.5rem;
  height: 1.5rem;
  object-fit: contain;
}
.footer-links-block-item {
  margin-top: 0;
  display: flex;
  flex-direction: column;
}
.footer-contact-heading {
  font-family: 'Inter', -apple-system, sans-serif;
  font-weight: 300;
  color: #D4D4D4;
  letter-spacing: 0.12em;
  text-decoration: none;
  display: block;
  transition: color 0.3s;
}
.footer-contact-heading:hover {
  color: #FFFFFF;
}
.footer-sub-links-custom {
  padding-left: 0.75rem;
  margin-top: 0.5rem;
  display: flex;
  flex-direction: column;
}
.footer-copyright {
  max-width: 1900px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  margin-top: 4rem;
  text-align: left;
  font-size: 10px;
  letter-spacing: 0.15em;
}
@media (min-width: 768px) {
  .footer-inner-container {
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
    gap: 2rem;
  }
  .footer-copyright {
    margin-top: 4rem;
    text-align: right;
  }
}
@media (min-width: 1024px) {
  .site-footer .footer-inner-container {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
  }
  
  /* PC時にロゴ2つを横並びにする設定 */
  .site-footer .footer-logo-group {
    flex: 2;
    flex-direction: row;
    max-width: 420px;
    margin: 0;
    justify-content: flex-start;
    gap: 3rem;
  }
  .site-footer .footer-logo-placeholder,
  .site-footer .footer-logo-sub {
    flex: 1;
    max-width: 180px;
  }

  /* PC時は追加ロゴを元の70%サイズに戻す */
  .site-footer .footer-logo-sub img {
    width: 70%;
    margin: 0;
  }

  .site-footer .footer-center-banner-block {
    flex: 2;
    max-width: 400px;
    margin: 0 auto;
  }
  .site-footer .footer-center-banner-anchor {
    width: 100%;
    max-width: 100%;
  }
  .site-footer .footer-nav-wrapper {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    flex: 2;
    max-width: fit-content;
    margin: 0 0 0 auto;
    gap: 8rem;
    padding-right: 2rem;
  }
}
/* ==========================================================================
   11. FLOATING BACK TO TOP & ANIMATIONS (追従UI・アニメーション)
   ========================================================================== */
@keyframes bounce {
  0% {
    transform: translateY(-100%);
  }
  50% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(100%);
  }
}
.floating-back-to-top {
  position: fixed;
  bottom: 1rem;
  right: 1rem;
  z-index: 99999;
}
.back-to-top-anchor {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background-color: #252526;
  border: none;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
  transition: opacity 0.3s ease;
}
.back-to-top-anchor:hover {
  opacity: 0.85;
}
.back-to-top-anchor::before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-top: 1.8px solid #E0E0E0;
  border-right: 1.8px solid #E0E0E0;
  transform: rotate(-45deg);
  margin-bottom: 2px;
}
.back-to-top-text {
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: 9px;
  font-weight: 600;
  color: #E0E0E0;
  letter-spacing: 0.05em;
  line-height: 1;
}
/* CONCEPT内シネマティックスライダー */
.slider-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  z-index: 1;
  animation: cinematicFade 12s infinite ease-in-out;
}
.layer-1 {
  animation-delay: 0s;
}
.layer-2 {
  animation-delay: 4s;
}
.layer-3 {
  animation-delay: 8s;
}
@keyframes cinematicFade {
  0% {
    opacity: 0;
    transform: scale(1);
  }
  8% {
    opacity: 1;
  }
  33% {
    opacity: 1;
  }
  41% {
    opacity: 0;
    transform: scale(1.03);
  }
  100% {
    opacity: 0;
  }
}
/* ==========================================================================
   12. RESPONSIVE UTILITIES (ブレイクポイント制御)
   ========================================================================== */
.sp-only {
  display: none;
}
.pc-only {
  display: inline;
}
@media (max-width: 1023px) {
  .sp-only {
    display: inline;
  }
  .pc-only {
    display: none;
  }
  .nowon-btn-flex-container .btn-collision {
    width: 100%;
  }
}