@charset "UTF-8";

/* ============================================================
   _common_parts/css/map.css
   /map/ ページ専用スタイル（共通テンプレ _contents_map.php 用）
   prefix: .c-map-*
   note: Swiper 関連の .p-location__* / .p-swiper__arrow は
         tenjiku_tcd091-child/files/css/original.css に既出のため
         本ファイルでは再定義しない（location ページと共用）。
============================================================ */

/* --------------------------------------------
   フッター調整: コンテンツとフッターの余白を詰めて
   フッター上端に薄グレーの境界線を引く（フッター色味と同調）
   page-id-108 = /map/ ページの post ID（全物件で共通）
-------------------------------------------- */
body.page-id-108 #footer {
    margin-top: 0;
    border-top: 1px solid #a8a098;
}

/* --------------------------------------------
   c-map-nav: アンカーリンクメニュー（4 ボタン）
-------------------------------------------- */
.c-map-nav {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.c-map-nav__link {
  display: block;
  width: calc(25% - 9px);
}
.c-map-nav__link img {
  max-width: 100%;
  margin-top: 0px !important;
}
.c-map-nav__img-off {
  display: inline-block !important;
}
.c-map-nav__img-on {
  display: none !important;
}
.c-map-nav__link:hover .c-map-nav__img-off {
  display: none !important;
}
.c-map-nav__link:hover .c-map-nav__img-on {
  display: inline-block !important;
}
@media screen and (max-width: 767px) {
  .c-map-nav__link {
    width: calc(50% - 12px);
  }
}

/* --------------------------------------------
   c-map-slider-btn-area: ナビボタン (swiper-button-next) の位置を
   メイン画像 (.c-map-slider__img) の上下中央に合わせる
   = ロゴ高さ + (画像高さ / 2)
   画像 aspect: 16/9 / slidesPerView: PC=1.1 / SP=1.2
-------------------------------------------- */
.c-map-slider-btn-area {
  position: absolute;
  top: 40px;
  left: 0;
  right: 0;
  height: 0;
  padding-top: calc(9 / 16 / 1.2 * 100%);
  pointer-events: none;
  z-index: 10;
}
.c-map-slider-btn-area .swiper-button-next {
  pointer-events: auto;
}
@media screen and (min-width: 768px) {
  .c-map-slider-btn-area {
    top: 60px;
    right: 2px;
    padding-top: calc(9 / 16 / 1.1 * 100%);
  }
}

/* --------------------------------------------
   c-map-slider: 4 ギャラリースライダー (swiper3)
   名称画像 → メイン画像 → テキスト
-------------------------------------------- */
.c-map-slider__logo {
  text-align: center;
}
.c-map-slider__logo img {
  width: auto;
  height: 60px;
  display: inline-block;
}
.c-map-slider__img img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center;
  display: block;
  margin-top: 0 !important;
}
.c-map-slider__detail {
  padding-top: 0;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  .c-map-slider__detail {
    justify-content: flex-start;
  }
  .c-map-slider__logo img {
    width: auto;
    height: 40px;
  }
}

/* --------------------------------------------
   c-map-stance: STANCE 詳細 3 画像レイアウト
   PC: 左[stance_01 単独、広め (flex:3)] 右[stance_02 + stance_03 上下 (flex:2)]
   SP: 縦並び (stance_01 フル幅 → stance_02 / stance_03 を 2 カラム)
-------------------------------------------- */
.c-map-stance {
  display: flex;
  gap: 40px;
  align-items: stretch;
}
.c-map-stance__left {
  flex: 3;
  display: flex;
  flex-direction: column;
}
.c-map-stance__left figure {
  flex: 1;
  overflow: hidden;
}
.c-map-stance__right {
  flex: 2;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.c-map-stance__right figure {
  flex: 1;
}
.c-map-stance img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  margin-top: 0 !important;
}
@media screen and (max-width: 768px) {
  .c-map-stance {
    flex-direction: column;
    gap: 24px;
  }
  .c-map-stance__left img {
    height: auto;
    aspect-ratio: 2200 / 1599;
  }
  .c-map-stance__right {
    flex-direction: row;
    gap: 12px;
  }
  .c-map-stance__right figure {
    flex: 1;
  }
  .c-map-stance__right img {
    height: auto;
    aspect-ratio: 1100 / 761;
  }
}

/* --------------------------------------------
   c-map-central: LANDIC CENTRAL GALLERY 詳細 2 画像 横並び（PC・SP 共通）
   2 枚共通の横長アスペクト比 (2200/1423) で揃え
-------------------------------------------- */
.c-map-central {
  display: flex;
  gap: 40px;
}
.c-map-central figure {
  flex: 1;
}
.c-map-central img {
  width: 100%;
  aspect-ratio: 2200 / 1423;
  object-fit: cover;
  object-position: center;
  display: block;
  margin-top: 0 !important;
}
@media screen and (max-width: 768px) {
  .c-map-central {
    gap: 24px;
  }
}

/* --------------------------------------------
   c-map-lplus-hirao: L+ HIRAO 詳細 2 画像 横並び（PC・SP 共通）
   2 枚共通の横長アスペクト比 (1100/772) で揃え
-------------------------------------------- */
.c-map-lplus-hirao {
  display: flex;
  gap: 40px;
}
.c-map-lplus-hirao figure {
  flex: 1;
}
.c-map-lplus-hirao img {
  width: 100%;
  aspect-ratio: 1100 / 772;
  object-fit: cover;
  object-position: center;
  display: block;
  margin-top: 0 !important;
}
@media screen and (max-width: 768px) {
  .c-map-lplus-hirao {
    gap: 24px;
  }
}
.c-map-lplus-hirao__types {
  display: flex;
  justify-content: flex-end;
  gap: 24px;
}
@media screen and (max-width: 768px) {
  .c-map-lplus-hirao__types {
    flex-direction: column;
    align-items: flex-end;
    gap: 12px;
  }
}

/* --------------------------------------------
   c-map-lplus: L+ DESIGN STUDIO 詳細 2 画像 横並び（PC・SP 共通）
   2 枚共通の横長アスペクト比 (1100/788) で揃え
-------------------------------------------- */
.c-map-lplus {
  display: flex;
  gap: 40px;
}
.c-map-lplus figure {
  flex: 1;
}
.c-map-lplus img {
  width: 100%;
  aspect-ratio: 1100 / 788;
  object-fit: cover;
  object-position: center;
  display: block;
  margin-top: 0 !important;
}
@media screen and (max-width: 768px) {
  .c-map-lplus {
    gap: 24px;
  }
}
