/* ============================================= */
/* 重複セレクタを整理・統合したCSS */
/* ============================================= */

/* ギャラリー周り */
.estate-gallery {
    /* 2箇所で定義されていたものを統合。後方の定義が優先されます */
    max-width: 1100px;
    margin: 3em auto;
    padding: 0 16px;
}

/* スライダー */
.estate-slider {
    --slide-h: clamp(320px, 56vw, 560px);
    width: 100%;
    border-radius: 10px;
    overflow: hidden;
}

.estate-slider .swiper,
.estate-slider .swiper-wrapper,
.estate-slider .swiper-slide {
    height: var(--slide-h);
}

.estate-slider .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5f5f5;
}

/* WordPressの既存imgルールを上書き */
.estate-slider .swiper-slide>img,
.estate-slider .swiper-slide picture>img,
.estate-slider img {
    width: auto !important;
    height: 100% !important;
    max-width: 100% !important;
    object-fit: contain !important;
    background: #f5f5f5 !important;
    display: block !important;
}

/* スライダーの矢印 */
.estate-slider .swiper-button-prev,
.estate-slider .swiper-button-next {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .95);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .18);
}

.estate-slider .swiper-button-prev::after,
.estate-slider .swiper-button-next::after {
    color: #222;
    font-size: 18px;
    font-weight: 700;
}

/* ---- サムネイル ---- */
.estate-thumbs {
    --th-gap: 12px;
    /* お好みで */
    margin-top: 12px;
}

.estate-thumbs .swiper-slide {
    width: auto;
    /* ← 固定幅をやめる */
    height: auto;
    aspect-ratio: 1 / 1;
    /* ← 常に正方形 */
    overflow: hidden;
    opacity: .6;
    cursor: pointer;
    border-radius: 0;
}

.estate-thumbs img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 0;
}

/* 選択中のサムネイル */
.estate-thumbs .swiper-slide-thumb-active {
    opacity: 1;
    box-shadow: none;
    outline: none;
}

/* ---- hero card (full-bleed背景付き) ---- */
:root {
    --hero-top-gap: clamp(12px, 2.5vw, 28px);
    /* 好きな量に */
}

/* 余白は“ヒーローの外側”にだけ発生 */
body.single-estate .tt-heroGap {
    height: var(--hero-top-gap);
}

/* 参考：ヒーロー本体は現状維持（高さは変えない） */
.single-estate .tt-heroWrap {
    position: relative;
    width: 100vw;
    max-width: none;
    left: 50%;
    transform: translateX(-50%);
    margin: 0;
    /* 念のため */
    padding: 0;
    /* 念のため */
}

body.single-estate .tt-heroWrap__bg {
    position: absolute;
    inset: 0;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 0;
}

body.single-estate .tt-heroWrap__bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: inherit;
    filter: blur(8px) brightness(.95);
    transform: scale(1.06);
    z-index: 0;
}

body.single-estate .tt-hero {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    z-index: 1;
}


/* ① ラッパーは固定高さ + 上余白（外側の余白＝背景の高さは増えない） */
.tt-heroWrap {
    position: relative;
    height: var(--hero-h, 480px);
    /* ← fallback あり */
    overflow: hidden;
}

body.single-estate .tt-heroWrap__bg,
.tt-heroWrap__bg {
    background-image: var(--hero-bg);
}

/* ② 背景はラッパーの全面を埋めるだけ（余白に依存させない） */
.tt-heroWrap__bg {
    position: absolute;
    inset: 0;
    /* ← top/bottom 固定に戻す（calc は使わない） */
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 0;
}

/* ③ ぼかしは擬似要素で複製（親の背景をそのままコピー） */
.tt-heroWrap__bg::after {
    content: "";
    position: absolute;
    inset: 0;
    /* 親の background を丸ごとコピー（画像が inline/CSS いずれでもOK） */
    background: inherit;
    filter: blur(8px) brightness(.95);
    transform: scale(1.06);
    /* ぼけ端隠し */
    z-index: 0;
}

/* ④ コンテンツは高さに影響しないよう重ねるだけ */
.tt-hero {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    z-index: 1;
}

.tt-hero__inner {
    width: min(600px, calc(100% - 32px));
    margin: 0 auto;
    padding: 24px 28px;
    background: rgba(255, 255, 255, .94);
    text-align: center;
    box-shadow: 0 8px 28px rgba(0, 0, 0, .08);
    backdrop-filter: blur(2px);
}

.tt-hero__title {
    margin: 0 0 10px;
    font-weight: 700;
    font-size: clamp(22px, 2.4vw, 28px);
    line-height: 1.35;
}

.tt-hero__meta {
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: left;
}

.tt-hero__line {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #333;
    font-size: 14px;
    line-height: 1.6;
}

.tt-hero__line+.tt-hero__line {
    margin-top: 6px;
}

.tt-hero__line svg {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    fill: currentColor;
}

.tt-hero__date {
    position: absolute;
    right: 20px;
    bottom: 6px;
    font-size: 12px;
    color: #666;
}

/* ---- コンテンツエリア ---- */
.p-entry__body {
    margin-top: 2em;
}

.p-entry__body p {
    line-height: 1.9;
}

/* セクション見出し */
.renovation h4,
.overview h4 {
    text-align: center;
    font-weight: 600;
    margin: 3em 0 20px;
    letter-spacing: .02em;
    font-size: clamp(18px, 2.2vw, 22px);
}

.renovation {
    margin: 3em 0;
}

.renovation .renovation_txt {
    margin: 0 auto;
    line-height: 1.9;
}

/* 要約（ヒーローに統合されたため非表示） */
.estate-summary {
    display: none !important;
}

.estate-summary p {
    margin: 6px 0;
}

/* ---- 物件概要テーブル ---- */
.overview .overview-wrap,
table.estate-spec {
    max-width: 980px;
    margin: 0 auto;
    width: 100%;
}

table.estate-spec {
    border-collapse: collapse;
    font-size: 14px;
}

table.estate-spec th,
table.estate-spec td {
    border: 1px solid #eee;
    padding: 12px 14px;
    vertical-align: top;
    font-size: 14px;
}

table.estate-spec th {
    background: #fafafa;
    width: 22%;
    font-weight: 600;
}

.overview-long {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 0;
    border-top: 1px solid #eee;
    border-left: 1px solid #eee;
}

.overview-long dt,
.overview-long dd {
    padding: 12px 14px;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
}

.overview-long dt {
    background: #fafafa;
    font-weight: 600;
}

/* ---- 物件概要カード (Specs Card) ---- */
.specsCard {
    margin: 48px auto 0;
    padding: 0 16px;
}

.specsCard__title {
    margin: 0 0 18px;
    text-align: center;
    font-weight: 700;
    letter-spacing: .02em;
    font-size: clamp(18px, 2.2vw, 22px);
}

.specsCard__frame {
    margin: 0 auto;
    background: #f3f3f3;
    padding: 50px;
    max-width: 1000px;
}

.specsCard__panel {
    background: #fff;
    padding: 50px;
}

.specsGrid {
    display: grid;
    grid-template-columns: 120px 1fr 120px 1fr;
    column-gap: clamp(12px, 2vw, 20px);
    row-gap: 0;
    font-size: 14px;
    grid-auto-flow: row;
}

.specsGrid dt,
.specsGrid dd {
    padding: 12px 0;
    border-bottom: 1px solid #e9e9e9;
    line-height: 1.9;
}

.specsGrid dt {
    white-space: nowrap;
    border-bottom: 1px solid #333;
}

.specsGrid dd {
    color: #111;
}

.specsGrid dt.full {
    grid-column: 1;
}

.specsGrid dd.full {
    grid-column: 2 / -1;
}

.specsGrid .empty {
    color: transparent;
}

.specsGrid .spacer {
    visibility: hidden;
    border-bottom: 1px solid #e9e9e9;
}

.specsGrid dt:nth-last-child(4),
.specsGrid dd:nth-last-child(3),
.specsGrid dt:nth-last-child(2),
.specsGrid dd:nth-last-child(1) {
    border-bottom: none;
}


/* ---- 物件概要グリッド (dl) ---- */
.estate-specs__grid {
    --full-row-gap: 1em;
    display: grid;
    grid-template-columns: 140px 1fr 36px 140px 1fr;
    column-gap: 0;
    row-gap: 0;
    max-width: 1000px;
    margin: 0 auto 100px;
    padding: 8px;
    border: 4px solid #f9f9f9;
    background: #fff;
    box-sizing: border-box;
}

.estate-specs__grid dt,
.estate-specs__grid dd {
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;

    /* ↓ 中央寄せ用に上下をそろえて、最低高さを与える */
    display: flex;
    align-items: center;
    /* ← 縦中央 */
    padding: 12px 0 12px 10px;
    /* 上下同量に */
    min-height: 48px;
    line-height: 1.6;
    color: #111;
}

.estate-specs__grid dt {
    font-weight: 600;
    border-bottom: 2px solid #a7a7a7;
    white-space: normal;
}

.estate-specs__grid dd {
    /* 以前の align-items:flex-end を廃止 */
    border-bottom: 1px solid #ebebeb;
}

.estate-specs__grid dt:nth-of-type(odd) {
    grid-column: 1;
}

.estate-specs__grid dd:nth-of-type(odd) {
    grid-column: 2;
}

.estate-specs__grid dt:nth-of-type(even) {
    grid-column: 4;
}

.estate-specs__grid dd:nth-of-type(even) {
    grid-column: 5;
}

.estate-specs__grid dt.full {
    grid-column: 1;
    position: relative;
}

.estate-specs__grid dd.full {
    grid-column: 2 / -1;
}

.estate-specs__grid dt.full,
.estate-specs__grid dd.full {
    margin-bottom: var(--full-row-gap);
    /* full 行も中央寄せ */
	margin-right: 36px;
    align-items: center;
}

@media (max-width: 768px){
    .estate-specs__grid dt.full {
	    margin-right: 0;
    }
}
.estate-specs__grid dd.full {
    border-bottom: 1px solid #ebebeb;
}

.estate-specs__grid dd.full::after {
    content: none;
    height: 0;
}

.estate-specs__grid dt.full::after {
    content: "";
    position: absolute;
    bottom: -2px;
    right: -36px;
    width: 36px;
    height: 2px;
    background: #a7a7a7;
    pointer-events: none;
}

/* ============================================= */
/* メディアクエリ (768px以下) */
/* ============================================= */

@media (max-width: 768px) {
    .tt-heroWrap__bg::after {
        -webkit-mask-image: radial-gradient(ellipse 45% 55% at center, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 55%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0) 100%);
        mask-image: radial-gradient(ellipse 45% 55% at center, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 55%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0) 100%);
    }

    .specsCard__frame {
        padding: 12px;
    }

    .specsCard__panel {
        padding: 8px 14px;
    }

    .specsGrid {
        grid-template-columns: 120px 1fr;
    }

    .specsGrid dt.full {
        grid-column: 1;
    }

    .specsGrid dd.full {
        grid-column: 2;
    }

    .estate-specs__grid {
        grid-template-columns: 40% 60%;
        padding: 24px 16px;
        border-width: 24px;
    }

    .estate-specs__grid dt,
    .estate-specs__grid dd {
        grid-column: auto !important;
    }

    .estate-specs__grid dt.full::after {
        display: none;
    }
}

/* カード本体（箱） */
.estate-contact {
    position: relative;
    /* 子の absolute の基準にする */
    background: #f6f6f6;
    border-radius: 10px;

    /* ↓ ここがポイント */
    width: 100vw;
    /* ビューポート幅いっぱい */
    margin-left: -50vw;
    /* 中央寄せしてから半分戻す */
    left: 50%;
    position: relative;
    box-sizing: border-box;
}

/* ラベル（タイトル）を箱の上に“浮かせる” */
.estate-contact__title {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, -50%);
    margin: 0;
    padding: 6px 14px;
    line-height: 1;
    background: transparent;
    /* ← 背景を透明に */
    border-radius: 0;
    /* ← 角丸を消したければ */
    box-shadow: none;
    /* ← 影も消したければ */
    font-size: clamp(16px, 3vw, 28px);
    letter-spacing: .08em;
    z-index: 1;
}

/* 置き換え：横並びのまま中央寄せ */
.estate-contact__row {
    display: flex;
    margin-top: 6px;
    gap: 20px;
    align-items: center;
    justify-content: center;
    /* ← ここを space-between から center に */
    flex-wrap: wrap;
}

.estate-contact__tel {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: clamp(28px, 3vw, 42px);
    /* ← フォント大きめ */
    text-decoration: none;
    color: inherit;
    padding: 48px 0;
    /* ← 上下余白を広げる */
    line-height: 1.4;
    /* ← 行間もちょっとゆったり */
}

.estate-contact__mail {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 2px 80px;
    background: #222;
    color: #fff !important;
    text-decoration: none;
    border-radius: 4px;
    font-size: clamp(22px, 3vw, 28px);
}

.estate-contact__icon {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
}

.estate-contact__number {
    line-height: 1;
}

@media (max-width: 640px) {
    .estate-contact {
        padding: 0;
    }

    .estate-contact__title {
        padding: 0;
    }

    .estate-contact__row {
        flex-direction: column;
        align-items: center;
        /* ← 中央寄せ */
        gap: 12px;
    }

    .estate-contact__tel,
    .estate-contact__mail {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .estate-contact__tel {
        padding: 20px 0 0;
    }

    .estate-contact__mail {
        margin-bottom: 20px;
    }

    /* ボタンが横いっぱいになってしまう場合の保険 */
    .estate-contact__mail a {
        width: auto;
        /* ← 自動幅に */
        align-self: center;
        /* ← 親が center のとき明示しておくと安全 */
    }
}

.estate-info {
    margin-top: .5rem;
    font-size: .9rem;
    line-height: 1.6;
}

.estate-info p {
    margin: 0;
}

.estate-address {
    font-weight: 600;
}

/* 家アイコン（SVG）を他アイコンと揃える */
.tt-hero__line.tt--info>svg {
    width: 1.2em;
    height: 1.2em;
    flex: 0 0 1.25em;
    vertical-align: -0.125em;
    /* FontAwesome と高さを揃える調整 */
    fill: currentColor;
}

h1.tt-hero__title {
    font-size: 1.5em !important;
}

.tt-hero .tt-hero__meta .tt--info {
    gap: 0 !important;
}

/* 中央寄せ→左寄せ。複数行は上（アイコンの頭）で揃える */
.tt-hero .tt-hero__meta .tt-hero__line {
    justify-content: flex-start;
    /* center -> left */
    text-align: left;
    /* center -> left */
    align-items: flex-start;
    /* 2行目以降の頭を上揃え */
    flex-wrap: nowrap !important;
    /* そのままでOK */
    gap: 0 4px !important;
    /* アイコンと文字の間隔 */
}

/* 2行目以降がアイコン下に潜らないよう固定幅を与える */
.tt-hero .tt-hero__meta .tt-hero__line::before,
.tt-hero .tt-hero__meta .tt-hero__line>svg {
    flex: 0 0 1.4em;
    /* ← ここが決め手：アイコン幅を固定 */
    width: 1.4em;
    height: 1.4em;
    /* ← 家アイコンが小さい問題も同時に解消 */
    line-height: 1;
    /* 必要なら微調整
  vertical-align: -0.125em;
  */
}

/* テキストが折り返せるよう保険（Flexアイテムのはみ出し防止） */
.tt-hero .tt-hero__meta .tt-hero__line>* {
    min-width: 0;
}

/* 画像上の旧更新日を消す（ヒーロー内に残っていれば） */
.tt-hero__date {
    display: none !important;
}

/* 旧ヒーロー内バッジを消す（ヒーローに入れていた場合のみ） */
.estate-meta-status {
    display: none !important;
}

.estate-headbar__inner {
    max-width: var(--container, 1200px);
    /* テーマの器に合わせて */
    margin: 0 auto;
    padding: 10px 16px;
    display: flex;
    gap: 16px;
    align-items: center;
    justify-content: flex-end;
    /* 右寄せ */
}

/* 成約バッジ */
.estate-status {
    display: inline-flex;
    align-items: center;
    gap: .4em;
    font-weight: 700;
    white-space: nowrap;
}

.est--sold {
    color: #8b0000;
}

/* 赤系。必要なら #b30000 等に */
.estate-status .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
}

/* 更新日 */
.estate-updated {
    color: #666;
    font-size: .92rem;
    white-space: nowrap;
}

/* スマホで詰まりすぎないように並び替えたい場合（任意） */
@media (max-width: 480px) {
    .estate-headbar__inner {
        flex-wrap: wrap;
        justify-content: space-between;
        /* 左右に振り分け */
    }
}

/* 祖先の“はみ出しクリップ”を解除（このページだけ） */
.single-estate #all_wrap,
.single-estate #content,
.single-estate .l-content,
.single-estate .l-container {
    overflow: visible !important;
    /* もし横だけで十分なら overflow-x: visible !important; でもOK */
}


/* モバイルのスクロールバー幅を除外できるブラウザ向け */
@supports (width: 100svw) {
    .single-estate .tt-heroWrap {
        width: 100svw;
    }
}

/* （念のため）横スクロールが出る場合の最後の一押し */
html,
body {
    overflow-x: clip;
}
/* ===== Floorplan (間取り図) formatting add-on ===== */

/* セクション余白 */
.estate-floorplan { 
  margin: 3em 0; 
}

/* 見出し：リノベーション内容などの書式に合わせる */
.estate-floorplan .section-title {
  display: block;
  text-align: center;
  font-weight: 600;
  margin: 3em 0 20px;
  letter-spacing: .02em;
  font-size: clamp(18px, 2.2vw, 22px);
}

/* 図版を中央寄せ */
.estate-floorplan__figure {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
}

/* 画像：スライドショーのサムネ程度に縮小＆中央揃え */
.estate-floorplan__img {
  width: clamp(140px, 22vw, 260px);
  max-width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
}

/* リンクで囲まれている場合の体裁 */
.estate-floorplan a {
  display: inline-block;
}