/* ========================================
   organichouse.jp フッタースタイル (最適化版)
   ======================================== */

/* === グローバルスタイル（フッターに影響する部分） === */

/* セクション共通 */
section.base {
  width: 100%;
  height: auto;
  margin: 0 auto;
  padding: 60px 0;
  clear: both;
  overflow: hidden;
}

/* === 1. CTAバナーセクション（cmn_ban） === */
section.cmn_ban {
  background: #e66d3c;
  padding: 80px 0;
}

.banner {
  width: 75%;
  max-width: 650px;
  height: auto;
  margin: 0 auto;
}

.banner li {
  width: 100%;
  height: 170px;
  margin: 0 auto;
}

.banner li a {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  color: #8d480e;
  padding: 70px 30px 30px;
  position: relative;
}

.banner li a::after {
  content: "";
  display: block;
  clear: both;
}

.banner li h3 {
  margin: 0;
  font-size: 22px;
  letter-spacing: 0;
  font-family: 'EB Garamond', YuMincho, "游明朝", "yu-mincho-pr6",
               "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN",
               "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  text-transform: uppercase;
  font-weight: normal;
}

.banner li a:hover {
  color: #e66d3c;
}

/* 背景画像（パンフレットバナー） */
.banner li.cmn a {
  background: #fff5ef url(./common/img/ban-pamph.png) no-repeat center;
}

.banner li.cmn a:hover {
  color: #e66d3c;
  background: #fff url(./common/img/ban-pamph_on.png) no-repeat center;
}

/* === 2. フッター本体 === */
footer,
.l-footer,
#footer {
  background-color: #fff7e7 !important;
  color: #745f43 !important;
  width: 100%;
  height: auto;
  margin: 0 auto;
  padding: 0 0 20px;
  font-size: 12px !important;
  margin-bottom: 0 !important;
}

footer .inner,
.l-footer .inner {
  position: relative;
  border-top: 1px solid #745f43;
  padding: 60px 0 0;
  max-width: 990px !important;
  margin: 0 auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  gap: 40px !important;
}

/* --- item（2カラム flexbox） --- */
footer .item {
  display: inline-block !important;
  vertical-align: top !important;
  margin: 0 !important;
  flex: 0 1 auto !important;
}

footer .item:first-child {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

footer .item:last-child {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 250px !important;
  margin: 0 !important;
}

/* --- ロゴ --- */
footer .logo {
  max-width: 350px;
  margin: 0 0 15px;
  width: 100%;
  max-height: 24px;
  height: auto;
}

footer .logo a {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0 auto;
}

footer .logo img {
  max-width: 100%;
  height: auto;
  margin: 0 auto;
}

footer .logo a:hover {
  opacity: .7;
}

/* --- 会社情報 --- */
footer .add {
  margin: 0 0 20px;
}

footer .add h5 {
  font-size: 14px !important;
  margin: 0 0 10px;
}

footer .add address {
  font-style: normal;
  font-size: 11px !important;
  line-height: 1.8;
}

/* --- サイトマップリンク --- */
.sitemap,
footer .sitemap {
  font-size: 11px !important;
  width: 100% !important;
  margin: 0 auto 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.sitemap li,
footer .sitemap li {
  font-size: 11px !important;
  margin: 0 5px 10px 0;
  padding: 0 10px 0 0;
  border-right: 1px solid #745f43;
  display: inline-block;
  height: auto !important;
  line-height: 1 !important;
}

.sitemap li:last-child {
  border-right: none;
}

.sitemap li a {
  word-break: break-all;
  word-wrap: break-word;
}

/* --- ボタンナビ（セカンダリリンク） --- */
footer .btnNav {
  max-width: 250px;
  font-size: 12px !important;
  text-align: left !important;
}

footer .btnNav li {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 0 10px 0 !important;
  text-align: left !important;
}

footer .btnNav li a {
  border-radius: 30px;
  display: inline-block !important;
  width: auto !important;
  color: #fff;
  background: #745f43;
  padding: 8px 25px;
  text-align: left !important;
  transition: background-color 0.3s ease !important;
}

footer .btnNav li a:hover {
  background: #e66d3c;
}

/* --- コピーライト --- */
.copy,
footer .copy {
  font-size: 11px !important;
  width: 100%;
  max-width: 990px;
  margin: 0 auto;
  padding: 20px 0 0 !important;
  text-align: left !important;
}

.copy span {
  display: inline !important;
  margin: 0 !important;
}

/* コピーライトの区切り文字（全角スペース）を削除 */
.organichouse-footer__copyright span:first-child::after,
.copy span:first-child::after {
  content: "" !important;
}

/* === 3. モバイル固定フッター（fix_contact） === */
.fix_contact {
  width: 100%;
  margin: 0 auto;
  background: #e66d3c;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 9998;
  display: none;
}

/* トップページ用アニメーション */
.top .fix_contact {
  -webkit-transition: .5s;
  transition: .5s;
  transform: translateY(100%);
}

.top .fix_contact.is-fixed {
  transform: translateY(0);
}

.fixNav {
  width: 100%;
  margin: 0 auto;
  display: table;
}

.fixNav li {
  width: calc(100% / 3);
  display: table-cell;
  vertical-align: middle;
  margin: 0 auto;
  border-right: 1px solid #fff;
}

.fixNav li:last-child {
  border-right: none;
}

.fixNav li a {
  width: 100%;
  display: block;
  color: #fff;
  text-align: center;
  padding: 8px 5px 8px 20px;
  font-size: 12px;
}

/* アイコン背景 */
.fixNav li a.icon.house {
  background: url(./common/img/icon/icon-house-wht.svg) no-repeat left 1.5em center / 12px 13px;
}

.fixNav li a.icon.map {
  background: url(./common/img/icon/icon-map-wht.svg) no-repeat left 1.5em center / 13px 16px;
}

.fixNav li a.icon.book {
  background: url(./common/img/icon/icon-book-wht.svg) no-repeat left 1.5em center / 18px 15px;
}

/* === clearfixユーティリティ === */
.clearfix::after {
  content: "";
  clear: both;
  display: block;
}

/* ============================================
   === レスポンシブCSS ===
   ============================================ */

/* @media (max-width: 1023px) – タブレット */
@media (max-width: 1023px) {
  .pc { display: none; }
  .sp { display: block; }

  footer { padding: 0 0 40px; }
  footer .inner { padding: 30px 0 0; max-width: 95%; }
  footer .item { margin: 0 2em 0 0; width: 60%; }
  footer .item:last-child { margin: 0; width: 35%; }
  footer .logo { max-width: 350px; width: 60%; }
  footer .btnNav { width: 100%; max-width: 100%; }
  .copy { max-width: 95%; }

  section.cmn_ban { padding: 40px 0 10px; }

  /* モバイル固定フッター表示 */
  .fix_contact.sp { display: block; }
}

/* @media (max-width: 767px) – スマートフォン */
@media (max-width: 767px) {
  /* フッター全体 */
  footer,
  .l-footer,
  #footer {
    padding: 40px 0 0 !important;
    font-size: 13px !important;
  }

  /* フッター内側を縦並びに変更 */
  footer .inner,
  .l-footer .inner {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 20px !important;
    padding: 30px 5% 0 !important;
    border-top: none !important;
  }

  /* 疑似要素でボーダーを作成（左右5%余白） */
  footer .inner::before,
  .l-footer .inner::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 5% !important;
    right: 5% !important;
    width: 90% !important;
    height: 0.5px !important;
    background-color: #745f43 !important;
  }

  /* アイテムを縦並び、左揃え */
  footer .item {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    text-align: left !important;
  }

  /* flexboxでアイテムの順序を制御（ボタンを上、ロゴ・会社情報を下） */
  footer .item:nth-child(1) {
    order: 2 !important;
  }

  footer .item:nth-child(2) {
    order: 1 !important;
  }

  footer .item:last-child {
    min-width: 0 !important;
    width: 100% !important;
  }

  /* ロゴを左揃え */
  footer .logo {
    margin: 0 0 15px 0 !important;
    width: 280px !important;
    max-width: 280px !important;
  }

  footer .logo img {
    width: 100% !important;
    height: auto !important;
  }

  /* 会社情報を左揃え */
  footer .add {
    text-align: left !important;
    margin: 0 0 20px !important;
  }

  /* サイトマップを左揃え */
  footer .sitemap,
  .sitemap {
    text-align: left !important;
    margin: 0 auto 0 !important;
  }

  footer .sitemap li,
  .sitemap li {
    font-size: 11px !important;
    margin-bottom: 10px !important;
    margin-right: 5px !important;
  }

  /* ボタンナビを100%幅、左揃え */
  footer .btnNav {
    width: 100% !important;
    max-width: 100% !important;
    text-align: left !important;
  }

  footer .btnNav li {
    display: inline-block !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 0 10px 0 !important;
  }

  footer .btnNav li a {
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    padding: 0 25px !important;
    font-size: 12px !important;
    line-height: 34px !important;
    box-sizing: border-box !important;
    text-align: left !important;
  }

  /* コピーライト */
  .copy,
  footer .copy {
    font-size: 10px !important;
    text-align: left !important;
    padding: 0 !important;
    max-width: 90%;
  }

  .copy span {
    display: block !important;
    margin: 0 0 5px !important;
  }

  .copy span:last-child,
  footer .copy span:last-child {
    display: block !important;
    margin-top: 5px !important;
  }

  /* モバイル固定フッターの余白確保 */
  body {
    padding-bottom: 60px !important;
  }

  /* pagetopボタンを固定フッターの上に配置 */
  .p-pagetop,
  .c-pagetop,
  #pagetop,
  [class*=pagetop],
  [id*=pagetop] {
    bottom: 70px !important;
  }

  /* p-fixBtnWrap の位置調整 */
  .p-fixBtnWrap,
  [class*=fixBtn] {
    bottom: 40px !important;
  }
}

/* @media (max-width: 479px) – 小型スマートフォン */
@media (max-width: 479px) {
  footer { padding: 0 0 40px; font-size: 1em; }
  footer .inner {
    max-width: 90%;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    align-content: center;
    flex-wrap: wrap;
    flex-direction: column-reverse;
  }
  footer .item {
    margin: 0 auto 20px !important;
    width: 100% !important;
    display: block;
  }
  .sitemap { margin: 0 auto; }
  .copy { max-width: 90%; }

  /* fixNav アイコン位置調整 */
  .fixNav li a.icon.house {
    background: url(./common/img/icon/icon-house-wht.svg) no-repeat left 8px center / 12px 13px;
  }
  .fixNav li a.icon.map {
    background: url(./common/img/icon/icon-map-wht.svg) no-repeat left 8px center / 13px 16px;
  }
  .fixNav li a.icon.book {
    background: url(./common/img/icon/icon-book-wht.svg) no-repeat left 8px center / 18px 15px;
  }
}

/* @media (max-width: 360px) – 極小 */
@media (max-width: 360px) {
  .fixNav li a { font-size: 11px; }
}