@charset "utf-8";

#estate-list .inner-sct {}
#estate-list .ctn { width: 88%; max-width: 1160px; margin: 0 auto;}
#estate-list .ctn ul { display: flex; flex-wrap: wrap; font-size: 14px;}
#estate-list .ctn ul li { width: 33.33334%; padding: 30px 0px; font-size: 16px;}
#estate-list .ctn ul li a { display: block; width: 94%; max-width: 300px; margin: 0 auto; color: #000; text-decoration: none; transition: 0.3s linear; position:relative;}
#estate-list .ctn ul li a dl dt { position: relative; width: 100%; padding-top: 72%; margin-bottom: 10px; overflow: hidden;}
#estate-list .ctn ul li a dl dt img { position: absolute; left: 50%; top: 50%; z-index: 1; width: 100%; height: 100%; object-fit: cover;
transform: translate(-50%,-50%); transition: 0.4s ease;}
#estate-list .ctn ul li a dl dd { letter-spacing: 0.1rem;}
#estate-list .ctn ul li a dl dd.tit { font-size: 18px; font-weight: 700; margin-bottom:8px;}
#estate-list .ctn ul li a dl dd.status { position: absolute; top:0; left:0; z-index:1;}
#estate-list .ctn ul li a dl dd .badge_saled{ background: #000; color:#fff; padding:2px 5px; font-size:15px; font-weight:700;} 
#estate-list .ctn ul li a dl dd .badge_pricedown { background: var(--dark-gray1); color:#fff; padding:2px 5px; font-size:90%; font-weight:700;}

#estate-list .ctn ul li a:hover { opacity: 0.8;}
#estate-list .ctn ul li a:hover dl dt img { transform: translate(-50%,-50%) scale(1.05);}

@media (max-width: 1025px) {
	#estate-list .inner-sct { padding: 80px 0 100px;}
	#estate-list .ctn ul { flex-wrap: wrap;}
	#estate-list .ctn ul li { width: 33%; padding: 18px 10px;}
}
@media (max-width: 801px) {
	#estate-list .ctn ul { justify-content: space-between;}
	#estate-list .ctn ul li { width: 48%;}
}
@media (max-width: 481px) {
	#estate-list .inner-sct { }
	#estate-list .ctn ul { display: block;}
	#estate-list .ctn ul li { width: 100%; padding: 18px 0px;}
	#estate-list .ctn ul li a { width: 96%;}
	#estate-list .ctn ul li a dl dt { margin-bottom: 8px;}
	#estate-list .ctn ul li a dl dd { font-size: 12px; letter-spacing: 0.05rem;}
	#estate-list .ctn ul li a dl dd.tit { margin-bottom: 5px;}
	#estate-list .ctn ul li a dl dd time { margin-right: 8px; font-size: 10px;}
	#estate-list .ctn ul li a dl dd span.tag { padding: 1px 6px 2px; font-size: 10px;}
}



#estate { background: var(--light-gray1);}
#estate .inner-sct {}
#estate .bloc { padding: 40px 0 0;}
#estate .bloc .tips { position: relative; z-index: 10; width: 90%; max-width: 680px; margin: 0 auto -20px;}
#estate .bloc .tips p { display: inline-block; padding: 4px 10px 6px; background: #000; color: #fff; font-size: 20px; font-weight: 700; letter-spacing: 0.1rem; text-align: center;}

#estate .estate-slider a { position: relative; display: block; width: 680px; background: #fff; margin: 0 10px;}
#estate .estate-slider a img { width: 100%; height: auto;}
#estate .estate-slider a .image_text{position:absolute; bottom:0; background-color: rgba(255, 255, 255, 0.8); padding:5px 10px;}

#estate .slick-arrow { display: block; width: 40px; height: 64px; padding: 0; background: transparent; border: none; outline: none;
 position: absolute; top: 50%; z-index: 1; transform: translate(0, -50%);
 cursor: pointer; color: transparent; font-size: 0; line-height: 0;
}
#estate .slick-prev { left: 0px;}
#estate .slick-next { right: 0px;}
#estate .slick-dots { max-width: 680px; margin: 0 auto; top: -20px; bottom: auto; left: 0; right: 0; z-index: 10; text-align: right;}

#estate .txt-fullscreen { width: 88%; max-width: 680px; margin: 0 auto; padding: 20px 0;}
#estate .txt-fullscreen p { position: relative; padding-left: 30px;}
#estate .txt-fullscreen p:before { content: ''; display: block; width: 20px; height: 20px; background: url('../img/icn-fullscreen.svg') no-repeat 50% 50% / 100% auto;
 position: absolute; left: 0; top: 50%; transform: translateY(-50%);
}

#estate .descript { width: 90%; max-width: 680px; margin: 0 auto; padding: 30px 0 60px;}
#estate .descript h2 { margin-bottom: 20px; font-size: 24px; font-weight: 700;}
#estate .descript h2 span { display: inline-block; margin-bottom: 6px; padding: 2px 8px 4px; background: #000; color: #fff; font-size: 20px; margin-right:5px;}
#estate .descript h2 span.badge_saled, #estate .descript h2 span.badge_pricedown { background: var(--dark-gray1);}
#estate .descript p.area { margin-bottom: 20px;}

#estate .estate-data { background: var(--dark-gray1); padding:3em 0 4em;}
#estate .estate-data h2 { color:#fff; font-size: 24px; font-weight: 700; 
    max-width: 800px;
    margin: 0 auto 0.5em;
}
#estate .estate-data .flex { display: flex; width: 90%; max-width: 680px; align-items:center; margin: 0 auto;}
#estate .estate-data .creator { position: relative; width: 36%; padding: 30px 0; background: #000;}
#estate .estate-data .detail { width:64%; padding: 30px 20px;}
#estate .estate-data .creator ul { font-size: 0; }
#estate .estate-data .creator ul li { padding: 4px;}
#estate .estate-data .creator ul li dl { display: table; }
#estate .estate-data .creator ul li dl dt,
#estate .estate-data .creator ul li dl dd { display: table-cell; vertical-align: middle; color: #fff;}
#estate .estate-data .creator ul li dl dt { width: 60px; font-size: 12px; letter-spacing: 0.05rem;}
#estate .estate-data .creator ul li dl dt img { width: 100%; border-radius: 50%;}
#estate .estate-data .creator ul li dl dd { padding-left: 20px; color: #fff; font-size: 16px; font-weight: 700; line-height: 1.4;}
#estate .estate-data .creator ul li dl dd span { display: block; font-size: 14px; font-weight: 400; letter-spacing: 0.1rem;}
#estate .estate-data .detail p { color: #fff; font-size: 16px;}
#estate .point { padding-bottom: 80px; background: #fff;}
#estate .point .ttl { padding: 40px 0 20px;}
#estate .point .ttl h2 { font-size: 18px; font-weight: 400; letter-spacing: 0.1rem; line-height: 1.4; text-align: center;}
#estate .point .ttl h2 span { display: block; font-size: 46px; letter-spacing: 0.3rem;}
#estate .point .bloc { width: 88%; max-width: 1080px; margin: 0 auto;}
#estate .point .flex { display: flex; justify-content: space-between; }
#estate .point .pht { width: 45%;}
#estate .point .txt { width: 50%;}
#estate .point .pht figure { text-align: center;}
#estate .point .pht figure img { width: auto; max-width: 100%; height: auto; max-height: 350px;}
#estate .point .txt h3 { margin-bottom: 12px; font-size: 28px; font-weight: 700;}
#estate .map iframe { width:100%;}
#estate .estate-headinfo th{
    width:100px;
    padding:3px 0;
    text-align:left;
    font-weight:normal;
    vertical-align: middle;
    line-height:1;
}
#estate .estate-headinfo td{
    padding:3px 0;
    text-align:left;
    font-size:130%;
    font-weight:700;
    line-height: 25px;
    vertical-align: middle;
}
#estate .estate-headinfo td.itd{
    text-align:center;
    width:35px;
    color:var(--dark-gray1);
    vertical-align: middle;
}
#estate-list .estate-headinfo tr{
    border-bottom: 4px solid #fff;
}
#estate-list .estate-headinfo th{
    width:72px;
    padding:1px 0;
    text-align:left;
    font-weight:normal;
    vertical-align: middle;
    background:#000;
    color:#fff;
}
#estate-list .estate-headinfo td{
    padding:1px 0 1px 10px;
    text-align:left;
    line-height: 20px;
    vertical-align: middle;
}
#estate-list .estate-headinfo td.itd{
    padding:1px 0 ;
    text-align:center;
    width:24px;
    vertical-align: middle;
    background:#000;
    color:#fff;
}
@media (max-width: 1000px) {
	#estate .bloc { padding: 20px 0;}
}
@media (max-width: 800px) {
	#estate .bloc .tips p { padding: 2px 10px 4px; font-size: 16px;}
	#estate .estate-slider a { width: 100%; margin: 0;}

	#estate .descript h2 { font-size: 20px;}
	#estate .descript h2 span { font-size: 14px; font-weight: 400;}

	#estate .estate-data { width: 100%; padding-top: 0.5em;}
	#estate .estate-data h2 { margin: 0 0 0.5em 10vw; font-size: 20px;}
	#estate .estate-data .flex { width: 100%; max-width: 100%;}
	#estate .estate-data .creator {}
	#estate .estate-data .creator dl dt { font-size: 10px;}
	#estate .estate-data .creator dl dd { font-size: 14px;}
	#estate .estate-data h3 { margin-bottom: 8px; font-size: 20px;}
	
	#estate .point .flex { display: block;}
	#estate .point .pht { width: 100%;}
	#estate .point .txt { width: 100%; padding: 40px;}
	#estate .point .txt h3 { font-size: 24px;}
}
@media (max-width: 480px) {
	#estate .txt-fullscreen { padding: 12px 0;}
	#estate .txt-fullscreen p { padding-left: 24px; font-size: 12px;}
	#estate .txt-fullscreen p:before { width: 16px; height: 16px;}

	
	#estate .descript { padding: 12px 0 40px;}
	#estate .descript h2 { font-size: 18px;}
	#estate .descript h2 span { font-size: 12px;}
	#estate .descript p { font-size: 13px;}
	
	#estate .estate-data h2 { font-size: 18px;}
	#estate .estate-data .creator { width: 50%;}
	#estate .estate-data .detail { width: 50%; padding: 20px 12px;}
	#estate .estate-data .creator ul { padding-left: 12px;}
	#estate .estate-data .creator ul li dl dt { width: 40px;}
	#estate .estate-data .creator ul li dl dd { padding-left: 10px; font-size: 13px;}
	#estate .estate-data .creator ul li dl dd span { font-size: 12px;}
	#estate .estate-data .detail p { font-size: 12px;}

	#estate .point .ttl h2 { font-size: 16px; letter-spacing: 0.06rem;}
	#estate .point .ttl h2 span { font-size: 30px; letter-spacing: 0.2rem;}
	#estate .point .txt { padding: 24px 0;}
	#estate .point .txt h3 { font-size: 18px;}
	#estate .point .txt p { font-size: 13px;}
}


#estate-list .ctn { width: 100%; margin: 0 auto;}
#estate-list .ctn .creator { position: relative; margin: 10px 0 0 40px;}
#estate-list .ctn .creator ul { display: inline-block; width: 100px; font-size: 0; vertical-align: middle;}
#estate-list .ctn .creator ul li { display: inline-block; width: 40px; margin-bottom: 0px; margin-right: 8px; padding: 0;}
#estate-list .ctn .creator ul li:last-child { margin-right: 0px;}
#estate-list .ctn .creator ul li img { width: 100%; border-radius: 50%;}
#estate-list .ctn .creator dl { display: inline-block; vertical-align: middle;}
#estate-list .ctn .creator dl dt { font-size: 11px; font-weight: 700; letter-spacing: 0.05rem;}
#estate-list .ctn .creator dl dd { font-size: 13px; font-weight: 700; letter-spacing: 0.1rem;}

/* 基本スタイル */
.estate-summary {
  width: 100%;
  max-width:800px;
  margin:0 auto;
  background:#eee;
  border-collapse: collapse;
}
.estate-summary th,
.estate-summary td {
  border: 1px solid #ccc;
  padding: 0.5em 1.5em;
}
.estate-summary th{
    background: #dcdcdc;
}

/* 480px 以下：各行をブロック表示 */
@media (max-width: 479px) {
  .estate-summary,
  .estate-summary thead,
  .estate-summary tbody,
  .estate-summary th,
  .estate-summary td,
  .estate-summary tr {
    display: block;
  }
  .estate-summary thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
  .estate-summary tr {
    margin-bottom: 1em;
  }
  .estate-summary td {
    display: flex;
    padding: 0.5em 1em;
    border: none;
    border-bottom: 1px solid #ddd;
  }
  .estate-summary td::before {
    content: attr(data-label);
    font-weight: bold;
  }
}

/* 480px〜799px：ヘッダ非表示、２列レイアウト */
@media (min-width: 480px) and (max-width: 799px) {
  .estate-summary thead {
    display: none;
  }
  .estate-summary tr {
    display: table-row;
  }
  .estate-summary th,
  .estate-summary td {
    display: table-cell;
  }
  .estate-summary td[data-label]::before {
    display: none;
  }
  .estate-summary td:nth-child(odd) {
    width: 35%;
    font-weight: bold;
  }
  .estate-summary td:nth-child(even) {
    width: 65%;
  }
}

/* 800px〜999px：通常テーブル表示（固定レイアウト） */
@media (min-width: 800px) {
  .estate-summary {
    table-layout: fixed;
  }
  .estate-summary th {
    width:25%;
  }

}


#estate .wp-block-contact-form-7-contact-form-selector { width: 100%; max-width: 1080px; margin: 0 auto; background:var(--dark-gray1);}
#estate .formArea_bk { width: 88%; max-width: 800px; margin: 0 auto; padding: 80px 0 0; background:var(--dark-gray1);}
#estate .formArea_bk h2{ color:#fff; font-size:1.8em; font-weight:700; margin-bottom:0.5em;}
#estate .formArea_bk p.top { color: #fff; font-size: 18px; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 3px solid #fff;}
#estate .formArea_bk ul li dl dt { color: #fff;}
#estate .formArea_bk ul li dl dt { width: 270px; padding-right: 30px; font-weight: 700;}
#estate .formArea_bk ul li dl dd { width: auto; color: #fff;}
#estate .formArea_bk ul li dl dt span.note { display: block; font-size: 14px;}
#estate .formArea_bk ul li dl dd label { color: #fff;}
#estate .formArea_bk ul li dl dd input[type="text"],
#estate .formArea_bk ul li dl dd input[type="tel"],
#estate .formArea_bk ul li dl dd input[type="date"],
#estate .formArea_bk ul li dl dd input[type="email"] { background: #fff; border:none;}
#estate .formArea_bk ul li dl dd textarea { height: 160px; background: #fff; border: none; color: #000;}
#estate .formArea_bk ul li dl dd span.note { color: #fff; font-size: 14px;}
#estate .formArea_bk ul li dl dd select { background: #fff; color:#000; border:none; -webkit-appearance: listbox; appearance: revert; width: 100%; padding: 5px; margin-top: 5px; font-size:14px;}
#estate .formArea_bk ul li.confirm { color: #fff; font-size: 18px; font-weight: 700;}
#estate .formArea_bk .btn-submt { width: 100%; margin: 0 auto;}
#estate .formArea_bk .btn-submt input[type="submit"] { display: block; width: 100%; padding: 8px; background: #fff; border: none; color: #000; font-size: 18px; font-weight: 700;}
#estate .formArea_bk .attBox { margin-bottom: 30px; padding: 30px; background: #000; }
#estate .formArea_bk .attBox p { color: #fff; font-size: 12px;}
#estate .formArea_bk .attBox p.att { font-size: 15px; font-weight: 700;}
#estate .formArea_bk .message { display: none;}
#estate .formArea_bk .message p { color: #fff; font-size: 14px; }
@media (max-width: 481px) {
	#estate .formArea_bk { padding: 40px 0;}
	#estate .formArea_bk p.top { margin-bottom: 12px; font-size: 14px;}
	#estate .formArea_bk ul li dl dt { width: 100%; padding: 0;}
	#estate .formArea_bk ul li dl dd span.note { font-size: 11px;}
	#estate .formArea_bk ul li.confirm { font-size: 13px;}
	#estate .formArea_bk .attBox { margin-bottom: 20px; padding: 15px;}
	#estate .formArea_bk .attBox p { font-size: 11px;}
	#estate .formArea_bk .attBox p.att { font-size: 13px;}
}

#estate .wpcf7-response-output{background:#fff;}
#estate .notive-require {color:#ffffff; padding-bottom:1em;}
#estate .required {color:#ffb6b6; font-weight:700;}

#estate .formBloc ul li dl dd .wpcf7-list-item {
    display: block;
}