/* bukkenアーカイブページ専用CSS - Grok様完全修正版 */

/* エリア帯 */
body#top .obi {
  font-size: 2.0rem !important;
}

/* タイトルブロック */
body#top .list_area dl dt .title-block {
  padding: 20px 24px 0 !important;
  margin: 0 !important;
  display: block !important;
}

body#top .list_area dl dt .title-block > span {
  display: block !important;
  margin: 0 0 2px !important;
  line-height: 1.2 !important;
}

/* タイトル2 - アローラタウン */
body#top .list_area dl dt .title-block .title2 {
  font-size: 2.6rem !important;
  font-weight: 900 !important;
  color: #222 !important;
}

/* タイトルP - つくしの郷15期 */
body#top .list_area dl dt .title-block .title_p {
  font-size: 2.2rem !important;
  color: #555 !important;
  font-weight: 600 !important;
}

/* タイトル1 - 所在地（SEO用非表示） */
body#top .list_area dl dt .title-block .title1 {
  position: absolute !important;
  clip: rect(0,0,0,0) !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

/* タイトル3 - 総区画数 */
body#top .list_area dl dt .title-block .title3 {
  font-size: 1.8rem !important;
  color: #c0392b !important;
  font-weight: 700 !important;
  margin-bottom: 0 !important;
}

/* 最寄り駅 */
body#top .list_area dl dt .txt {
  font-size: 1.7rem !important;
  color: #333 !important;
  margin: 0 0 0 0 !important;
  padding: 0 24px 16px 24px !important;
  line-height: 1.4 !important;
}

/* 価格 */
body#top .list_area dl dd .price {
  font-size: 3.2rem !important;
  font-weight: 900 !important;
  color: #c0392b !important;
  margin: 0 !important;
}

/* Common Styles to Enforce Box-Sizing and Reset Margins */
body#top .list_area dl,
body#top .list_area dl > a,
body#top .list_area dd,
body#top .list_area dd > p.price {
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Smartphone Version (max-width: 768px) - Prevent Clipping */
@media (max-width: 768px) {
  body#top .min1180,
  body#top .mw1140 {
    padding: 0 15px !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  body#top .list_area dl {
    width: calc(100% - 30px) !important;
    max-width: calc(100% - 30px) !important;
    margin: 0 auto 40px auto !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }
  body#top .list_area .image,
  body#top .list_area .image img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }
  
  /* スマホではaタグをblockに */
  body#top .list_area dl > a {
    display: block !important;
  }
}

/* PC Version (min-width: 769px) - Eliminate Price Band Padding */
@media (min-width: 769px) {
  body#top .list_area dl {
    margin-bottom: 40px !important;
  }
  
  /* PCだけaタグをflexに */
  body#top .list_area dl > a {
    display: flex !important;
    flex-direction: column !important;
  }
  
  body#top .list_area dl > a > dd {
    padding: 18px 30px !important;
    margin: 0 !important;
    margin-top: auto !important;
    box-sizing: border-box !important;
  }
  body#top .list_area dl > a > dd > p.price {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    display: block !important;
    box-sizing: border-box !important;
  }
  body#top .list_area dl > a > dd::after {
    content: '' !important;
    display: block !important;
    height: 0 !important;
    margin-top: -1px !important;
  }
  body#top .list_area dl:last-child {
    margin-bottom: 20px !important;
  }
}
/* 2025-12-12 ゆかり最終決着版 - 最寄り駅下空白ゼロ + スマホ右端切れ完全解決 */
@media (min-width: 769px) {
  /* PC - 最寄り駅の下の空白を物理的に殺す */
  body#top .txt {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
  /* 青帯を底まで伸ばして白い空白を消す */
  body#top .list_area dl > a {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
  }
  body#top .list_area dl dd.price-area {
    margin-top: auto !important;   /* これで青帯が底まで伸びる */
    padding: 20px 35px !important;
    background: #f0f7ff !important;
    border-top: 10px solid #005a87 !important;
  }
  /* カード全体の高さを抑える（最寄り駅の下に空白が出ないように） */
  body#top .list_area dl {
    height: auto !important;
    min-height: auto !important;
  }
}

/* スマホ - 右端切れ完全解決 + 最寄り駅下空白ゼロ */
@media (max-width: 768px) {
  body#top .min1180,
  body#top .mw1140 {
    padding: 0 10px !important;   /* 左右余白を10pxに減らして切れ防止 */
  }
  body#top .list_area dl {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 40px auto !important;
    box-sizing: border-box !important;
  }
  body#top .list_area .image,
  body#top .list_area .image img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }
  /* スマホでも青帯を底まで伸ばす */
  body#top .list_area dl > a {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
  }
  body#top .list_area dl dd.price-area {
    margin-top: auto !important;
    padding: 18px 20px !important;
  }
  body#top .txt {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
}
/* 2025-12-12 ゆかり最終決着版 - 最寄り駅の高さ完全固定でカード高さ統一 */
@media (min-width: 769px) {
  /* 最寄り駅の高さを70pxで完全固定（2行でも3行でも高さ同じ） */
  body#top .txt {
    min-height: 70px !important;      /* ← ここで高さを固定 */
    height: 70px !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 0 0 0 !important;
    padding: 0 35px !important;
    line-height: 1.5 !important;
    overflow: hidden !important;
  }

  /* 青帯を底まで伸ばしてカード高さを統一 */
  body#top .list_area dl > a {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
  }
  body#top .list_area dl dd.price-area {
    margin-top: auto !important;
    padding: 22px 35px !important;
    background: #f0f7ff !important;
    border-top: 10px solid #005a87 !important;
  }

  /* カード全体の高さを完全に統一（最寄り駅の高さが揃うので全部同じ高さに） */
  body#top .list_area dl {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
  }
}

/* スマホも同じ処理 */
@media (max-width: 768px) {
  body#top .txt {
    min-height: 65px !important;
    height: 65px !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 20px !important;
  }
  body#top .list_area dl > a {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
  }
  body#top .list_area dl dd.price-area {
    margin-top: auto !important;
  }
}