/*
Theme Name: Deaie 2025
Theme URI: https://e-deaie.jp
Author: Your Name
Author URI: https://e-deaie.jp
Description: A minimal WordPress theme for e-deaie.jp.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: deaie2025
*/

/* 
    Break points
    for SP max-width: 768px
    for PC min-width: 769px
*/

@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');
/* @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;700&display=swap'); */

/* ********************************************
Vriables
******************************************** */
:root{
    /* Base Font Size 1.0rem = 10px */
    font-size: 10px;

    --h1: clamp(2.8rem, calc(100vw / (460 / 32)), 3.8rem);
    --h2: clamp(2.0rem, calc(100vw / (460 / 28)), 3.0rem);
    --h3: clamp(1.8rem, calc(100vw / (460 / 20)), 2.4rem);
    --h4: clamp(1.4rem, calc(100vw / (460 / 16)), 1.8rem);
    --h5: clamp(1.0rem, calc(100vw / (460 / 12)), 1.4rem);
    --h6: clamp(0.8rem, calc(100vw / (460 / 10)), 1.2rem);

    --fsz-p-l : clamp(2.8rem, calc(100vw / (460 / 32)), 3.8rem);
    --fsz-p-m : clamp(2.2rem, calc(100vw / (460 / 26)), 3.0rem);
    --fsz-p-r : clamp(1.6rem, calc(100vw / (460 / 28)), 2.0rem);
    --fsz-p   : clamp(1.4rem, calc(100vw / (460 / 16)), 1.8rem);
    --fsz-p-s : clamp(1.0rem, calc(100vw / (460 / 12)), 1.4rem);
    --fsz-p-ss: clamp(0.8rem, calc(100vw / (460 / 10)), 1.2rem);

    /* Base color */
    /* --bg-color: #ffefaa; */
    /* --bg-color-base: #e8e1d9;
    --bg-color-main: #fff; */
    --bg-color-base: #D3DEF1;
    --bg-color-main: #D3DEF1;
    --bg-color-white: #fff;
    --bg-color-a: #cfc;
    --bg-color-b: #fdc;
    --base-font-color: #333;
    --test-link-color: #00f;
    --accent-color: #f80;

    --btn-detail-link: #F4434A;
    --btn-contact: #F4434A;
    --property-icon: #5daf15;


    /* font-family */
    --font-sans: 'Noto Sans JP', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Apple SD Gothic Neo", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
    --font-serif: 'Noto Serif JP', "Yu Mincho", "Hiragino Mincho ProN", "MS PMincho", serif;

    /* font-weight */
    --fw-Thin      :100;
    --fw-ExtraLight:200;
    --fw-Light     :300;
    --fw-Regular   :400;
    --fw-Medium    :500;
    --fw-SemiBold  :600;
    --fw-Bold      :700;
    --fw-ExtraBold :800;
    --fw-Black     :900;

    --title-icon : clamp(2.8rem, calc(100vw / 12 ), 6.5rem);

}

/* ********************************************
    reset
******************************************** */
*,
*::before,
*::after {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

/* ~~~~~~~~~~~~~ Base font size  ~~~~~~~~~~~~~ */
@media screen and (min-width: 768px){
    :root{
        /* Base Font Size 1.0rem = 12px */ 
        font-size: 12px;
    }
}
/* SE対応（375未満） */
@media screen and (max-width: 374px){
    :root{
        /* Base Font Size 1.0rem = 8px */
        font-size: 8px;
    }
}

/* ********************************************
    default
******************************************** */

body{
    font-family: var(--font-sans);
    font-weight: var(--fw-Regular);
    font-size: var(--fsz-p);
    color: var(--base-font-color);
    background-color: var(--bg-color-base);
    line-height: 1.6;
    margin-top: 12rem;
}
body.home,
body.zero-fee{
    margin-top: 0;
}

a{
    color: var(--test-link-color);
    text-decoration: none;
    transition: color .5s ease, opacity .5s ease;
}
a:hover{ opacity: .85; }


body{
    /* background: #e8e1d9; */
    font-size: 1.6rem;
    line-height: 1.5;
    position: relative;
}

/* メディアはみ出し防止＋縦横比保持 */
img, svg, video, canvas, iframe {
    display: block;
    max-width: 100%;
    width: auto;
    height: auto;
}
/* iframe比率固定ユーティリティ（必要に応じて） */
.embed {
    position: relative;
    aspect-ratio: 16 / 9;
}
.embed > iframe {
    position: absolute; inset: 0; width: 100%; height: 100%;
}

section {
    /* width: 100%; */
    /* background-position: center top;
    background-repeat: no-repeat;
    background-size: cover; */
}

.inner {
    width: 100%;
    margin: 0 auto;
    padding: 1em;
    /* background: #fff; */
    background: var(--bg-color-base);
    background-size: cover;
    background-position: top left;
    max-width: 480px;
    padding: 1em;
    /* max-width: clamp(320px, 92vw, 1200px); */
    max-width: clamp(320px, 100vw, 1200px);

}
@media screen and (min-width: 768px){
    .inner{ 
        padding: 2em;

    }
}
.archive-property .inner,
.single-property .inner{
    max-width: 960px;
}






/* ********************************************
    header
******************************************** */

.header{
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 10;
    background: rgba(255, 255, 255, .85);
    box-shadow: 1px 1px 1px 2px rgba( 0, 0, 0, .2);
}
.header .header-inner{
    margin: 0 auto;
    background: transparent;
    /* background: rgba(255, 255, 255, .85); */
    /* max-width: 480px; */
    padding: 1em;
}
@media screen and (min-width: 769px) {
    .header .header-inner{
        max-width: 1200px;
        padding: 1em 2em;
    }
}

.header-nav{
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
    align-items: center;
}

.header-logo {
    width: 65%;
    max-width: 200px;
    /* background: #000; */
}
@media screen and (min-width: 769px) {
    .header-logo {
        width: 30%;
        max-width: 400px;
    }
}
.header-logo a{
    display: block;
}
.menu-button{
    cursor: pointer;
    padding: .5em .3em;
    border: 1px solid rgba(0, 0, 0, .5);
}

.menu-button span{
    display: block;
    width: 2em;
    height: .3em;
    background: rgba(0, 0, 0, .5);
    margin-bottom: .3em;
}
.menu-button span:nth-child(1){
    
}
.menu-button span:nth-child(2){

}
.menu-button span:nth-child(3){
    margin-bottom: 0;
}



/* ********************************************
    footer
******************************************** */
.footer{
    background: #fff;
    text-align: center;
    padding: 1em 0 6em;
    color: #000;
    border-top: 1px solid var(--bg-color-base);
}
@media screen and (min-width: 769px) {
    .footer{
        padding-bottom: 2em;
    }
}

/* .footer::after{
    display: block;
    margin-bottom: ;
} */
.footer-inner{

}
.footer-nav-outer{
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 100;
}
@media screen and (min-width: 769px){
    .footer-nav-outer{
        display: none;
    }
}
.footer-nav{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-evenly;
    align-items: flex-end;
    padding: 1.5em .5em .5em .5em;
    padding: 0.8em .5em .5em .5em;
    list-style: none;
    background: #ad1931;
    opacity: .9;
    border-radius: 1em 1em 0 0;
    max-width: 480px;
    margin: 0 auto;
    font-size: 1.4rem;
}
.footer-nav li{
    width: 25%;
    border-right: .2em solid rgba(128, 128, 128, .6);
    text-align: center;
}
.footer-nav li:last-child{
    border-right: none;
}

.footer-nav a{
    display: inline-block;
    text-decoration: none;
    color: #fff;
}
.footer-nav img{
    height: 1.8em;
    width: auto;
    margin: 0 auto .3em;
}
/* .footer-nav li:nth-child(2) img{
    width: 40%;
}
.footer-nav li:nth-child(3) img{
    width: 40%;
} */
.footer-nav li:nth-child(4) img{
    width: 55%;
    height: auto;
    margin-bottom: .6em;
}

.footer .sns-links{
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 1em;
    margin: 1em auto;
    width: 90%;
    position: relative;
    z-index: 1;
    padding: 0;
    list-style: none;
}
.footer .sns-links a{
    display: block;
    max-width: 2em;
}

/* ======================================
    drawer.js   css上書き
====================================== */
.drawer--right .drawer-hamburger{
    right: 1.4em;
    top: 1.6rem;
}
.drawer--right.drawer-open .drawer-nav,
.drawer--right.drawer-open .drawer-navbar .drawer-hamburger {
    right: 0;
    top: 0;
}


.drawer-hamburger {
    z-index: 100;
    top: 0;
    font-size: 1.6rem;
    width: 1.6em;
    /* padding: 18px .75rem 30px; */
    padding: .5em .3em 1.1em;
    border: 1px solid #666;
}
.drawer-hamburger-icon,
.drawer-hamburger-icon:after,
.drawer-hamburger-icon:before {
    background-color: #333;
}

.drawer-hamburger-icon {
    position: relative;
    display: block;
    margin-top: 1rem;
}
.drawer-hamburger-icon:after,
.drawer-hamburger-icon:before {
    position: absolute;
    top: -.8rem;
    left: 0;
    content: " ";
}
.drawer-hamburger-icon:after {
    top: .8rem;
}

.drawer-brand {
    font-size: 2.0rem;
    color: #222;
    text-align: center;
    border-bottom: 2px solid #333;
    padding-block: 0 1em;

}

.drawer-menu-item {
    font-size: 1.6rem;
    color: #333;
    border-bottom: 1px solid #aaa;
    padding-block: .8em;
}
.drawer-nav {
    color: #333;
    background-color: #fff;
    width: 16em;
    padding: 2em 1em;
}
.drawer--right.drawer-open .drawer-hamburger {
    right: 16em;
    background-color: #fff;
    top: 0;
    opacity: .8;
}
.drawer--right .drawer-nav {
    right: -16em;
}


/* ********************************************
    main common
******************************************** */

.title-icon{
    display: block;
    width: var(--title-icon);
    margin: 1em auto 0;
}

h2{
    text-align: center;
    margin-top: 1em;
}

a:hover{
    transition: all .5s ease;
    opacity: .7;
}

/* table */
table{
    border-collapse: collapse;
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
}
th,td{
    padding: .3em .5em;
    border: 1px solid #555;
    font-size: 1.2rem;
    width: 33%;
    word-break: break-all;
    /* overflow-wrap: break-word; */
}
td:first-child{
    font-weight: bold;
}
thead tr{
    background: #afa;
}
tr:nth-child(2n){
    background: #eff;
}



/* home-secX  btn-viewall */

.section-content{
    position: relative;
    /* border: 2px solid #000; */
}
.btn-viewall{
    position: relative;
    width: 35%;
    margin: 0 0 0 auto;
    z-index: 1;
}

/* sec01〜03: 画像表示 + 縦横比固定 */
.home-sec01 .inner,
.home-sec02 .inner,
.home-sec03 .inner {
    position: relative;
    aspect-ratio: 750 / 1335;
    padding: 0;
}

@media screen and (min-width: 769px) {
    .home-sec01 .inner,
    .home-sec02 .inner,
    .home-sec03 .inner {
        max-width: 1200px;
        aspect-ratio: 1200 / 1024;
        margin: 0 auto;
        padding: 0;
    }
    }

@media screen and (min-width: 1201px) {
    .home-sec01 .inner,
    .home-sec02 .inner,
    .home-sec03 .inner {
        aspect-ratio: auto;
        height: 1024px;
    }
}


.home-sec01 picture,
.home-sec02 picture,
.home-sec03 picture {
    /* position: absolute;
    inset: 0;
    width: 100%;
    max-height: 1024px; */
}

.home-sec01 picture img,
.home-sec02 picture img,
.home-sec03 picture img {
    /* width: 100%;
    object-fit: cover; */
}

.home-sec01 .section-content,
.home-sec02 .section-content,
.home-sec03 .section-content{
    width: 100%;
}


.home-sec02 .btn-viewall,
.home-sec03 .btn-viewall{
    width: 20%;
    margin: 0 1em 0 auto;
    box-shadow: 3px 5px 3px 3px #333;
}
.home-sec02 .btn-viewall,
.home-sec03 .btn-viewall{
    margin: -3em 2em 2em auto;
}
@media screen and (min-width: 769px){
    .btn-viewall{
        width: 15%;
        margin-right: 40px;
    }
    .home-sec02 .btn-viewall,
    .home-sec03 .btn-viewall{
        width: 15%;
        margin: -4em 2em 4em auto;
    }

}



/* home-sec04 */
.home-sec04 .inner{
    padding-bottom: 0;
}
.home-sec04 .section-content{
        width: 90%;
        margin: 0 auto;
}


.home-sec04 .property-search-form {
    position: relative;
    margin-top: 1em;
}

.home-sec04 .form-block {
    padding: 1.5em;
    border-radius: 1em;
    margin-bottom: 1.5em;
    background: rgba(255, 255, 255, .8);
}

.home-sec04 .form-block > label {
    display: block;
    font-weight: bold;
    font-size: 1em;
    line-height: 1;
    padding-bottom: 1em;
    margin-bottom: 1em;
    border-bottom: 1px solid #000;
}

.home-sec04 .range-select {
    display: flex;
    align-items: center;
    gap: 0.5em;
}

.home-sec04 select {
    padding: 0.4em 0.6em;
    /* font-size: 1em; */
    border-radius: 0.5em;
    border: 1px solid #ccc;
}

.home-sec04 .checkbox-group {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5em 1em;
}

.home-sec04 .checkbox-group label {
    display: flex;
    align-items: flex-start;
    gap: 0.4em;
    /* font-size: 0.95em; */
    font-weight: normal;
}

.home-sec04 input[type="checkbox"] {
    width: 1em;
    height: 1em;
    margin-top: 0.25em;
}
@media screen and (max-width: 500px){
    .home-sec04 input[type="checkbox"] {
        margin-top: 0.4em;
    }
    
}

.home-sec04 .form-buttons {
    display: flex;
    flex-direction: column;
    gap: 1em;
    margin-top: 2em;
    max-width: 500px;
    margin-inline: auto;
}

.home-sec04 .btn-search,
.home-sec04 .btn-search-detail {
    position: relative;
    background: rgba(214, 59, 143, .9);
    color: #fff;
    font-weight: bold;
    font-size: 1.1em;
    letter-spacing: .18em;
    border: none;
    border-radius: .5em;
    padding: 0.8em;
    text-align: center;
    cursor: pointer;
    box-shadow: 3px 3px 3px 2px rgba( 0, 0, 0, .5);
}
.home-sec04 .btn-search-detail {
    background: rgba(247, 148, 30, .9);
}
.home-sec04 .btn-search:hover {
    background: #c02678;
}
.home-sec04 .btn-search-detail:hover {
    background: #e4810d;
}


.home-sec04 .btn-viewall{
    position: relative;
    width: 30%;
    margin: -1em 2em 0 auto;
    box-shadow: none;
    right: initial;
    bottom: initial;

} 


/* ============ home-sec04 Area UI ============ */
.home-sec04 .area-groups { display: block; }
.home-sec04 .area-group { margin-bottom: 1.25rem; }

/* 見出し行（地域名） */
.home-sec04 .area-group__header {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    font-weight: 700;
    margin: 0;
}
.home-sec04 .area-group__title { display: inline-block; }

/* アコーディオンヘッダ */
.home-sec04 .acc__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .25rem 0;
}

/* 開閉ボタン */
/* 開閉ボタン：○＋/○− を ::before/::after で描画し、縦棒をアニメーションで消す */
.home-sec04 .acc__toggle {
    position: relative;
    display: inline-block; /* サイズ確保 */
    width: 2.2rem;         /* em→rem に変更 */
    height: 2.2rem;        /* em→rem に変更 */
    border-radius: 50%;
    border: 1px solid #aaa;
    background: #fff;
    cursor: pointer;
    padding: 0;
    line-height: 0;   /* テキストを視覚的に隠す */
    font-size: 0;     /* テキストを視覚的に隠す */
}
.home-sec04 .acc__toggle::before,
.home-sec04 .acc__toggle::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 60%;
    height: 2px;
    background: #333;
    transform: translate(-50%, -50%);
    transition: transform .18s ease, opacity .18s ease;
}
/* 横棒（常に表示） */
.home-sec04 .acc__toggle::before { /* no extra transform */ }
/* 縦棒（閉時のみ表示→開時にスケールで消す） */
.home-sec04 .acc__toggle::after { transform: translate(-50%, -50%) rotate(90deg); }
/* 開状態では縦棒を消して「−」に */
.home-sec04 .acc__toggle[aria-expanded="true"]::after {
    transform: translate(-50%, -50%) rotate(90deg) scaleX(0);
    opacity: 0;
}
.home-sec04 .acc__toggle:hover { background: #f5f5f5; }

/* 市町はインライン表示、項目間は1.5em */
select,
input,
textarea{
    font-size: 1.8rem;
    line-height: 1.3;
    padding: .3em;
}
.home-sec04 .area-group__items .area-chip input{
    font-size: 1.5rem;
}
.home-sec04 .area-group__items .area-chip {
    display: inline-block;
    margin-right: 1.5em;
    margin-bottom: .25rem;
    white-space: nowrap;
    font-weight: normal;
    font-size: 1.5rem;
}
.home-sec04 .area-chip input[type="checkbox"] {
    /* margin-right: .35em;  */
    margin-right: 0;
    width: 1.1em;
    height: 1.1em;
    vertical-align: -.2em; 
}


@media screen and (min-width: 769px){
    .home-sec04 .section-content{
        width: 70%;
    }
    .home-sec04 .btn-viewall{
        width: 30%;
        margin: 0em auto 0;
    } 
}

/* こだわり検索フォームは初期非表示（高さ0） */
#kodawari {
    overflow: hidden;
    max-height: 0;
    padding-block: 0;
    transition: max-height 0.8s ease,
        padding-block 0.8s ease, 
        background 0.8s ease;
    background: rgba(247, 148, 30, .9);
}

/* 開いた状態 */
#kodawari.open {
    max-height: 1000px;   /* 十分大きな値を指定しておけばOK */
    padding-block: 1.5em;
    background: rgba(255, 255, 255, .8);
}
.input-outer{
    margin-top: 1em;
}
.input-outer .tikunen{
    width: 4em;
    max-width: 40%;
    text-align: center;
}



/* home-sec05 */
.home-sec05 .inner{
    padding-inline: 0;
    background-position-y: -30px;
}

.home-sec05 .inner img{
    margin: 1em auto 0;
    width: calc( 100% - 4em );
}
.home-sec05 .h2-title img{
    width: 100%;
    margin: 1em auto 2em;
}

.home-sec05 .pc-h2-title{
    display: none;
}

.home-sec05 .buttons{
    margin-top: 2.5em;
    padding: 0 1em 0 1.5em;
}
.home-sec05 .buttons img{
    width: 100%;
    margin: -1em auto 0;
}

@media screen and (min-width: 769px){

    .home-sec05 .pc-h2-title{
        display: block;
    }
    .home-sec05 .sp-h2-title{
        display: none;
    }
    .home-sec05 .inner .details,
    .home-sec05 .buttons {
        width: 60%;
        margin-inline: auto;
    }
    .home-sec05 .inner .details.wp-block-group{
        flex-direction: column-reverse;
    }
    .home-sec05 .inner .details.wp-block-group :last-child{
        width: 80%;    
    }

    .home-sec05 .buttons img{
        width: 93%;
        margin: -1em auto 0;
    }

}



/* home-sec06 */
.home-sec06 .inner{
    /* padding-bottom: 7em; */
}
.home-sec06 .section-content{
    width: 90%;
    margin: 0 auto;
}
.home-sec06 .youtube,
.home-sec06 .line{
    margin: 1em auto;
    background: rgba(255, 2555, 255, .8);
    padding: 1em 2em 2em;
    border-radius: 1em;
    text-align: center;
    max-width: 1000px;
    width: 100%;
}
.home-sec06 h2{
    margin-top: 0;
}
.home-sec06 .youtube .wp-block-embed{
    margin-top: 1em;
}
.home-sec06 .youtube iframe{
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    margin-block: 1em;
}


.home-sec06 .line{
    text-align: left;
}
.home-sec06 .line h2{
    margin-bottom: 1em;
}
.home-sec06 .line p{
    margin-top: .5em;
}
.home-sec06 .line .parson{
    width: 35%;
    margin-inline: auto;
}
.home-sec06 .line img{
    width: 100%;
}

@media screen and (min-width: 769px){

}



/* home-sec07 */
.home-sec07 .inner{
    padding-bottom: 7em;
}
.home-sec07 .voice-list{
    margin-top: 1em;
}

.home-sec07 .voice-item {
    display: block;
    padding: 1em;
    border-radius: 1em;
    margin-bottom: 3em;
    background: rgba(255, 2555, 255, .8);
    color: var(--base-font-color);
    line-height: 1.8;
}
.home-sec07 .voice-item:last-child{
    margin-bottom: 0;
}

.home-sec07 .voice-title {
    margin-bottom: .5em;
    margin-top: -1.5em;
    font-weight: normal;
}
.home-sec07 .voice-icon{
    width: 3em;
    display: inline-block;
    vertical-align: -.5em;
    margin-right: .3em;
}
.home-sec07 .btn-viewall{
    position: absolute;
    bottom: -7em;
    right: -1em;
}
@media screen and (min-width: 769px){
    .home-sec07 .inner{
        padding-bottom: 3em;
    }
    .home-sec07 .voice-list{
        width: 65%;
        margin-inline: auto;
    }
    .home-sec07 .voice-item {
        padding-inline: 2em;
    }
    .home-sec07 .btn-viewall{
        bottom: -3em;
        right: 1em;
    }
}


/* home-sec08 */
.home-sec08 .inner{
    padding-bottom: 0;
}
.home-sec08 .feature-list{
    margin-top: 1em;
}
.home-sec08 .feature-item {
    display: block;
    padding: 1em;
    border-radius: 1em;
    margin-bottom: 1.5em;
    background: rgba(255, 2555, 255, .8);
    color: var(--base-font-color);
}

.home-sec08 .feature-title {
    text-align: left;
    margin-bottom: .5em;
}
.home-sec08 .readmore{
    display: none;
    text-align: right;
    margin-top: 0.5em;
}
.home-sec08 .btn-viewall{
    position: relative;
}
@media screen and (min-width: 769px){

    .home-sec08 .feature-list{
        display: flex;
        flex-wrap: wrap;
        gap: 1em 1.5em;
        flex-direction: row;
        justify-content: space-between;
    }
    .home-sec08 .feature-item{
        flex: 1 1 calc((100%  - 1.5em) / 2);
        margin-bottom: 0;
    }
    .home-sec08 .btn-viewall{
        margin-top: 1em;
    }
}

/* home-sec09 */
.home-sec09 .coordinate-list{
    margin-top: 1em;
}
.home-sec09 .coordinate-item {
    color: var(--base-font-color);
    padding: 1em;
    border-radius: 1em;
    margin-bottom: 1.5em;
    background: rgba(255, 2555, 255, .8);
}
.home-sec09 .coordinate-content {
    display: flex;
    flex-direction: row-reverse;
    column-gap: 1em;
}
.home-sec09 .coordinate-title {
    text-align: left;
}
.home-sec09 .coordinate-thumb img{
    width: 100%;
    height: 100%;
}
.home-sec09 .readmore{
    display: block;
    text-align: right;
    /* margin-top: 0.5em; */
    margin-top: -1.5em;

    /* 一時的に非表示（詳細ページがないので） */
    display: none;
}

.home-sec09 .readmore img{
    display: inline-block;
    width: 25%;
    box-shadow: 3px 3px 3px 2px rgba( 0, 0, 0, .5);

}
@media screen and (min-width: 769px){
    .home-sec09 .coordinate-list{
        display: flex;
        flex-wrap: wrap;
        gap: 1em 1.5em;
        flex-direction: row;
        justify-content: space-between;
    }
    .home-sec09 .coordinate-item{
        flex: 1 1 calc((100%  - 1.5em) / 2);
        margin-bottom: 0;
    }
    .home-sec09 .coordinate-content {
        flex-direction: column;
    }
    .home-sec09 .coordinate-title {
        text-align: center;
        border-bottom: 1px solid #000;
        padding-bottom: .5em;
        margin-bottom: .5em;
    }
    .home-sec09 .coordinate-thumb{
        width: 75%;
        margin: 0 auto;
    }
    .home-sec09 .readmore {
        margin-right: 1em;
        margin-top: -.6em;
    }
    .home-sec09 .readmore img{
        width: max( 22%, 100px );
    }

}

/* home-sec10 */
.home-sec10 .section-content{
    width: 95%;
    margin: 0 auto;
}
.home-sec10 .basic-info{
    width: 70%;
    max-width: 400px;
    margin: 2em auto;
    line-height: 1.5;
    margin-bottom: 2em;
}
.home-sec10 .basic-info table{
    margin: 1em 0;
    border-collapse: collapse;
}
/* .home-sec10 .basic-info th, */
.home-sec10 .basic-info td{
    padding: 0;
    border: none;

}
.home-sec10 .basic-info tr td:first-child{
    width: 5.5em;
}
.home-sec10 .maps{
    max-width: 800px;
    margin-inline: auto;
}

.home-sec10 .maps .kakomi{
    padding: 1em;
    border-radius: 1em;
    margin-bottom: 1.5em;
    background: rgba(255, 2555, 255, .8);
    color: var(--base-font-color);
    gap: 1em;
}
.home-sec10 .maps .wp-block-column iframe{
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
}
.home-sec10 .maps .wp-block-column h2,
.home-sec10 .maps .wp-block-column p{
    margin-top: 0;
    margin-bottom: 1em;
    text-align: left;
    font-size: var(--fsz-p-s);
}
@media screen and (min-width: 769px){
    .home-sec10 .maps .wp-block-column iframe{
        /* width: 100%;
        height: initial;
        max-height: 100%; */
    }
}


/* home-sec11 */

.home-sec11 .section-content{
    margin: 2em auto;
    width: 100%;
    min-height: 100vh;
}

.home-sec11 .property-info,
.home-sec11 h2{
    display: none;
}

.home-sec11 form{
    background: rgba(255, 2555, 255, .8);
    padding: 2em;
    font-size: 1.8rem;
    line-height: 1.5;
    max-width: 800px;
    margin-inline: auto;
    border-radius: 1em;
}
@media screen and (max-width: 500px){
    .home-sec11 form{
        padding-inline: 1em;
    }
}


/* ==================================
    .home-sec11 & contact共通
================================== */
form p{
    margin-top: 1.3em;
}
form label,
form span.label{
    font-weight: bold;
}
.wpcf7-list-item-label,
input[type="date"]{
    font-weight: normal;
}
select,
input,
textarea{
    font-size: 1.8rem;
    line-height: 1.3;
    padding: .3em;
}
input:focus,
textarea:focus{
    background: rgb(229, 248, 229);
    border: 1px solid #f80;
}
input[type="text"],
input[type="email"],
textarea{
    width: 100%;
}
textarea{
    resize: vertical; /* 縦方向だけ */
    overflow: auto;
    min-height: 8em;
}
select{
    margin-top: .5em;
}
input[type="submit"]{
    width: 50%;
    max-width: 300px;
    margin: 1em auto;
    display: block;
}

@media screen and (max-width: 500px){
    select,
    input,
    textarea{
        font-size: 1.4rem;
        line-height: 1.3;
        padding: .3em;
    }
}

/* ====================================================================  */
/*                  home以外
/* ====================================================================  */

/* ======================================
    single共通
 ====================================== */

.single h1{
    text-align: center;
    margin: 4rem auto 2rem;
}


/* ======================================
    archive共通
 ====================================== */
.archive h1{
    text-align: center;
    line-height: 1;
    margin: 1em auto 0em;
    font-size: clamp(2.0rem , 5vw, 3.6rem);
}



/* ======================================
    archive-property.php
====================================== */
.archive-property .property-item{
    display: block;
    color: #000;
    border: 1px solid #91a8d0;
    background: var(--bg-color-white);
    padding: 2em 2em;
    margin-bottom: 2em;
    /* border-radius: 3em; */
    /* box-shadow: 1px 1px 1px 1px rgba( 0, 0, 0, .1); */
    cursor: pointer;
    transition: opacity .3s ease;
}
.archive-property .property-item:hover{
    opacity: .7;
}

.property-card-grid{
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    grid-template-areas: 
        "header header"
        "image  info";
    gap: 3em;
}

@media screen and (max-width:960px){
    .property-card-grid{
        gap: 2em;

    }  
}
@media screen and (max-width:600px){
    .property-card-grid{
        grid-template-columns: 1fr 1fr;
        gap: 0 .3em;

    }  
}

.property-card-grid .card-header{
    grid-area: header;
}
.property-card-grid .card-image{
    grid-area: image;
    width: calc( 100% - .5em );
}
.property-card-grid .card-info{
    grid-area: info;
    width: calc( 100% - .5em );

}


/* 画像配置 */
.image-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: repeat(2, 1fr);
    gap: 10px;
    max-width: 960px;
    margin: 0 auto 1em;
    }

.image-grid .image {
    background-color: #f1f1f1;
    width: 100%;
    height: 100%;
    aspect-ratio: 4/3;
}
.image-grid .image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: 1px solid #ddd;
    background: #eee;
}

/* 左側の大きな画像 */
.image-grid .large {
    grid-row: 1 / span 2;
    grid-column: 1 / 2;
}

/* 小さい2枚は自動で右側に配置される */

@media screen and (max-width: 768px) {
    .image-grid {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto;
    }

    .image-grid .large {
        grid-column: 1 / -1;
        grid-row: 1;
    }

    .image-grid .small:nth-child(2) {
        grid-column: 1;
        grid-row: 2;
    }

    .image-grid .small:nth-child(3) {
        grid-column: 2;
        grid-row: 2;
    }
}

@media screen and (max-width: 900px) {
    .archive-property .property-item{
        padding: 1em 1em;
        /* border-radius: 2em; */
    }

}

/* 物件一覧の詳細 */
.archive-property .memo{
    font-size: 1rem;
    color: #888;
    display: none;
}
.archive-property .property-title{
    margin-block: 0;
    font-size: 1.6rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.archive-property .property-note{
    margin-block: 0;
    font-size: 1.6rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.archive-property .property-info p:not(.property-school){
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}





.archive-property .property-price{
    font-weight: bold;
    font-size: 2.6rem;
    color: #900;
    /* text-align: center; */
    /* border-top: 1px solid #aaa; */
    /* margin-top: .5em; */
}

.archive-property .madori{
    /* text-align: center; */
    font-size: 2.2rem;
    font-weight: bold;
    line-height: 1;
    margin-bottom: .5em;
}
.property-info p,
.property-info .label{
    font-size: 1.4rem;
}
.property-name,
.property-code,
.property-address,
.property-area-land,
.property--area-building,
.property-balcony,
.property-age,
.property-school,
.property-icon{
    font-size: 1.4rem;
}

.archive-property .property-icon {
    display: flex;
    flex-wrap: wrap;
    gap: .3em;
    list-style: none;
    margin: .5em 0 0.1em;
    padding: 0;
}
.archive-property .property-icon li {
    border: 2px solid var(--property-icon);
    color: var(--property-icon);
    padding: 0 .5em .1em;
    font-size: 1.0rem;
    /* font-weight: bold; */
    line-height: 1.6;
    border-radius: 4px;
    background: #fff;
}

.archive-property  .label{
    color: #aaa;
}

.archive-property .image-grid{
    margin-block: .5em;
}

.detail-link{
    display: block;
    margin: .5em auto;
    padding: 1em;
    text-align: center;
    font-size: 1.8rem;
    line-height: 1;
    background: var(--btn-detail-link);
    color: #fff;
    font-weight: bold;
    border-radius: 3rem;
}




@media screen and (max-width: 600px) {
    body{
        margin-top: 7rem;
    }
    .header .header-inner{
        padding: .5em  1em 
    }
    .drawer--right .drawer-hamburger{
        top: 1rem
    }



    .archive-property .inner,
    .single-property .inner {
        padding: 1px;
        margin-bottom: 0.5em;
    }
    .archive-property .property-item {
        padding: 0.5em;
        margin-bottom: .5em;
    }
    .archive-property main h1{
        margin-block: 0 .3em;
    }
    
    .archive-property .property-title{
        font-size: 1.5rem;
        -webkit-line-clamp: 2;
    }
    .archive-property .property-note{
        font-size: 1.3rem;
        -webkit-line-clamp: 1;
        line-height: 1.2;
    }
    .archive-property .property-info p{
        font-size: 1.2rem
    }
    /* .archive-property .property-icon{
        height: 3.4rem;
        margin-block: .3em
    } */
    
    .archive-property .detail-link{
        margin: 0 auto;
        padding: 0.3em 1em .4em;
        font-size: 1.4rem;
        font-weight: normal;
    }

    .archive-property .property-price{
        font-size: 2.4rem;
        line-height: 1.4;
    }
    .archive-property .madori{
        margin-bottom: .3em;
    }
    .property-info p,
    .property-info .label{
        font-size: 1.2rem;
    }
    .property-card-grid{

    }
    
}





/* --------------------------------
検索結果：該当無し
-------------------------------- */
.no-results {
    text-align: center;
    padding: 5em 1em;
    background: #fff;
    border-radius: 1em;
    box-shadow: 0 2px 5px rgba(0,0,0,.1);
    margin: 3em auto;
    width: 90%;
}
.no-results h2 {
    font-size: clamp(1.7rem, 4.5vw, 2.4rem);
    margin-block: 0 2em;
    color: #900;
}
.no-results p {
    margin-bottom: 4em;
}
.no-results-buttons a {
    display: inline-block;
    margin: 0 .5em;
    padding: .8em 1.2em;
    border-radius: .5em;
    font-weight: bold;
    color: #fff;
    text-decoration: none;
}
.no-results-buttons .btn-reset { background: #888; }
.no-results-buttons .btn-back { background: #080; }
.no-results-buttons a:hover { opacity: .8; }




/* ======================================
    single-property.php
    物件詳細
====================================== */
body.single-property{
    margin-top: 6rem;
}
@media screen and (max-width: 600px) {
    /* body.single-property{
        margin-top: 4rem;
    } */
}
.single-property .table{
    border-collapse: collapse;
}
.single-property .property-nav{
    /* margin-top: 80px; */
    text-align: center;
    /* border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc; */
    font-size: 16px;
    padding: .5em;

}
.single-property .property-nav p{
    display: flex;
    justify-content: space-between;
}
.single-property .property-nav a{
    display: block;
    width: 6em;
    text-align: center;
    padding: .5em;
    text-decoration: none;
    color: #333;
}
.single-property .property-nav a:hover{
    background: #99f;
}


/* 物件詳細データ部分 */


.single-property .sec{
    background: #fff;
    padding: 2em;
    margin-bottom: .2rem;
    box-shadow: 0 2px 1px rgba(0,0,0,.1);
}
@media screen and (max-width: 900px) {
    .single-property .sec{
        padding: 1em;
    }
}
@media screen and (max-width: 600px) {
    .single-property .sec{
        background: #fff;
        padding: 0.5em;
    }
}




.single-property h1{
    text-align: left;
    border-left: 5px solid #2d4ce7;
    padding: .3rem .3rem .3rem 1rem;
    font-size: 2rem;
    line-height: 1.2;
    margin: 0 0 .5em;
}
.single-property .property-features{
    font-size: 1.6rem;
    margin-bottom: 1em;
}
.single-property .property-note{
    font-size: 1.4rem;
}

.single-property .property-price{
    font-size: 2.0rem;
    text-align: left;
    color: #900;
    font-weight: bold;
}

.single-property .property-menseki,
.single-property .property-madori{
    font-size: 1.8rem;
    font-weight: bold;
    margin-bottom: .5em;
}
.single-property .sec .property-data{
    font-size: 1.8rem;
    line-height: 1.6;
    margin-bottom: .5em;
    display: flex;
    align-items: flex-start;
}
.single-property .sec .label{
    display: inline-block;
    width: 5em;
    margin-right: 1em;
    flex: 0 0 6em;
    background: #ddd;
    color: #666;
    padding: .2rem .2rem;
    margin-top: calc(1.8rem * 0.6 / 2);
    text-align: center;
    font-size: 1.4rem;
    line-height: 1.2;
    border-radius: .5rem;
}
.single-property .sec .value{
    align-self: center;
    color: #555;
    flex: 1 1 auto;
}
@media screen and (max-width: 600px) {
    .single-property h1{
        text-align: left;
        border-left: 3px solid #2d4ce7;
        padding-left: .5rem;
        font-size: 1.4rem;
    }
    .single-property .property-features{
        font-size: 1.4rem;
        margin-bottom: 1em;
    }
    .single-property .property-note{
        font-size: 1.2rem;
    }
    .single-property .sec .property-data{
        font-size: 1.4rem;
    }
    .single-property .sec .label{
        font-size: 1.1rem;
        padding: .3rem .5em;
        margin-top: calc(1.2rem * 0.6 / 2);
        border-radius: .3rem;
    }
}

.single-property .return-to-serch{
    text-align: center;
    margin: 0;
}
.single-property .return-to-serch a{
    display: inline-block;
    /* padding: .2em 2em;
    border: 1px solid #ccc;
    background: #fff; */
    margin-bottom: .5em;

}

@media screen and (max-width: 600px) {

}







/* ======================================
    デバッグ用強調（任意）
====================================== */

body.debug.property dt::before {
    content: attr(data-field);
    display: inline-block;
    margin-right: 0.5em;
    color: #c00; /* 任意の色 */
    font-weight: bold; /* 任意のスタイル */
}
body.debug.property dd::after {
    content: attr(data-value);
    display: inline-block;
    margin-left: 0.5em;
    color: #c00; /* 任意の色 */
    font-weight: bold; /* 任意のスタイル */
}

hr{
    margin-block: 4em 2em;
}

sup{
    font-size: 60%;
}

.edit-link a{
    display: block;
    padding: 1em;
    margin: 1em 0;
    border: 1px solid #ccc;
    width: 100%;
    text-align: center;
    background: #eef;

}

.nav-links{
    display: block;
    padding: 1em;
    width: 100%;
    text-align: center;
}

.nav-links .page-numbers{
    padding: .5em 1em .7em;
    text-align: center;
    display: inline-block;
    margin-block: .5em 1em;
    border: 1px solid #aaa;
    line-height: 1;
    background: #fff;
    color: #333;
}
.nav-links .current{
    background: #ddd;
    color: #333;
}

/* pagination
navigation pagination
nav-links
prev page-numbers
page-numbers current
page-numbers
next page-numbers */



.contact-btn-wrap{

}
.contact-btn{
    display: block;
    width: 80%;
    max-width: 40rem;
    margin: 1.5em auto 1em;
    padding: 1em;
    line-height: 1;
    text-align: center;
    background: var(--btn-contact);
    color: #fff;
    border-radius: 1rem;
    box-shadow: 3px 3px 3px 1px #aaa;
}




/* ======================================
    archive-voice.php
 ====================================== */

.archive .voice-item{
    max-width: 800px;
    width: 90%;
    margin: 0 auto;
    border: 1px solid #aaa;
    border-radius: 1em;
    padding: 2em;
    margin-bottom: 4em;
    background: var(--bg-color-white);
}
.archive .voice-icon{
    display: block;
    width: 80px;
    margin-top: calc( -40px - 1em );
}

.archive .voice-title{
    padding-left: 100px;
    margin-top: -1.5em;
    margin-bottom: .5em;
}
.archive .voice-content{
    line-height: 1.8;
}
@media screen and (min-width: 769px){
}


/* ======================================
    single-voice.php
 ====================================== */
.single .voice-item{
    max-width: 800px;
    width: 90%;
    margin: 0 auto;
    border: 1px solid #aaa;
    border-radius: 1em;
    padding: 2em;
    margin-bottom: 4em;
    margin-top: 6em;
}
.single .voice-icon{
    display: block;
    width: 80px;
    margin-top: calc( -40px - 1em );
}

.single .voice-title{
    padding-left: 100px;
    margin-top: -1.5em;
    margin-bottom: .5em;
}
.single .voice-content{
    line-height: 1.8;
}
@media screen and (min-width: 769px){
}

/* ======================================
    archive-feature.php
 ====================================== */
.archive .feature-item{
    max-width: 800px;
    width: 90%;
    margin: 0 auto;
    border: 1px solid #aaa;
    border-radius: 1em;
    padding: 2em;
    margin-bottom: 2em;
    color: var(--base-font-color);
    text-decoration: none;
    display: block;
}
.archive .feature-title{
    margin-block: 0 .5em;
}
.archive .feature-excerpt{
    line-height: 1.8;
}
@media screen and (min-width: 769px){
}

/* ======================================
    single-feature.php
 ====================================== */
.single .feature-item{
    max-width: 800px;
    width: 90%;
    margin: 0 auto;
    border: 1px solid #aaa;
    border-radius: 1em;
    padding: 2em;
    margin-bottom: 4em;
    margin-top: 6em;
    background: var(--bg-color-white);
}
.single .feature-title{
    margin-block: 0 .5em;
}
.single .feature-content{
    line-height: 1.8;
}
.single.feature h3{
    margin-block: 1em .5em;
}

/* QAのアコーディオン */

.qa_item {
    border-bottom: 1px solid #ccc;
    margin-bottom: 1em;
    padding-bottom: 1em;
}
.qa_q {
    cursor: pointer;
    position: relative;
    font-weight: bold;
    padding-right: 3em; /* アイコン分の余白を確保 */
}
.qa_q::after {
    content: "+";
    position: absolute;
    right: 0.5em;
    top: .1em;
    font-weight: bold;
    font-size: 1.4em;
    transition: transform 0.2s ease;
    border-radius: 1em;
    border: 1px solid #000;
    width: 1.2em;
    height: 1.2em;
    text-align: center;
    line-height: 1;
}
.qa_item.open .qa_q::after {
    content: "−";
}
.qa_a {
    display: none;
    padding-left: 1em;
    margin-top: 0.5em;
    text-indent: -.9em;
}
.qa_item.open .qa_a {
    display: block;
}

@media screen and (min-width: 769px){
}
/* ======================================
    page-zero-fee.php
====================================== */
.zero-fee .inner{
    max-width: 768px;
    padding-top: 120px;
    padding-inline: 2em;
    overflow-x: hidden;
    background: var(--bg-color-white);
}

.zero-fee h1{
    display: none;
}
.zero-fee .sec2{
    margin-top: 2em;
}
.zero-fee .row{
    display: flex;
    flex-direction: row;
    gap: 0;
}
.zero-fee .row .col-text{
    flex: 1 1 70%;
}
.zero-fee .row .col-img{
    flex: 1 0 30%;
}
.zero-fee .sec1 img{
    width: 100%;
    margin-inline: auto;
}
.zero-fee .sec2 img{
    width: 80%;
    margin-inline: auto;
    margin-top: -3em;
}
.zero-fee .wp-block-separator{
    margin-block: 2em 0;
    /* width: 100%;
    margin-inline: auto; */
    border-top: 1px solid #aaa;
}
.zero-fee h2{
    margin-block: 1em 2em;
    margin-inline: -3em;
    padding: .5em;
    text-align: center;
    font-size: clamp(1.8rem, 5vw, 2.4rem);
    background: linear-gradient(to right, #4b0000, #9c1d1d, #e64522);
    color: #fff;
    transform: rotate(-5deg);
}
.zero-fee p{
    line-height: 1.8;
}
@media screen and (max-width: 600px){
    .zero-fee .row .col-text,
    .zero-fee .row .col-img{
        flex: 1 0 50%;
    }
    .zero-fee .row .col-img img{
        width: 100%;
    }
    .zero-fee .sec2 img{
        margin-top: -1em;
    }
}
/* ======================================
    page-contact.php
====================================== */

.page.contact .contact-content{
    padding: 0;
}
.page.contact form{
    background: rgba(255, 2555, 255, .8);
    padding: 2em;
    font-size: 1.8rem;
    line-height: 1.5;
    max-width: 800px;
    width: 100%;
    margin: 2em auto;
    border: 1px solid #aaa;
    border-radius: 1em;
    padding: 2em 3em;
    margin-bottom: 4em;
}
@media screen and (max-width: 500px){
    .page.contact form{
        padding-inline: 1em;
    }
}
.page.contact h1{
    margin-block: 2em .5em;
    text-align: center;
}
.page.contact h2{
    margin-top: 0;
}

.page.contact .property-info label{
    display: block;
    margin-top: 1.3em;
}
.page.contact .property-info br{
    display: none;
}
@media screen and (min-width: 769px){
}



