/* 物件一覧。共通部分は site.css。 */
.num {
  font-family:Georgia,'Times New Roman',serif;
  font-size:18px;
  color:var(--brand);
}
.contact-copy h2 {
  font-size:30px;
}
.contact-copy>p {
  margin:24px 0;
  color:var(--muted);
  font-size:14px;
}
.contact-copy .line {
  margin-top:5px;
  min-width:260px;
}
@media (max-width:1000px) {
  .contact-copy h2 {
    font-size:25px;
  }
}
@media (max-width:760px) {
  .contact-copy h2 {
    font-size:25px;
  }
  .contact-copy .line {
    width:100%;
  }
}
.visually-hidden {
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  border:0;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}

.search-layout {
  padding:24px 0 72px;
}

.search-panel {
  margin-bottom:26px;
}
.filters {
  padding:22px 24px;
  display:flex;
  flex-direction:column;
  gap:22px;
}
.filters-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.filters-head h2 {
  font-size:17px;
  letter-spacing:.06em;
}
.filters-apply {
  display:none;
  border:0;
  background:var(--brand);
  color:#fff;
  font:inherit;
  font-size:15px;
  font-weight:600;
  cursor:pointer;
}
.filter-block {
  margin:0;
  padding:0;
  border:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.filter-label {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  padding:0;
  font-size:13px;
  font-weight:600;
  letter-spacing:.06em;
}
.filter-label output {
  font-weight:500;
  color:var(--brand-dark);
}
.filter-note {
  font-size:11px;
  color:var(--muted);
  line-height:1.7;
}
.filters input[type="search"]::placeholder {
  color:#747a75;
  font-size:13px;
}
.filters input[type="search"] {
  width:100%;
  min-height:46px;
  padding:10px 14px;
  border:1px solid var(--line);
  border-radius:5px;
  background:var(--page);
  font:inherit;
  font-size:14px;
}
/* 下限・上限のつまみを同じ目盛りへ重ねる。 */
.range-pair {
  position:relative;
  height:34px;
}
.range-pair::before,.range-pair::after {
  content:'';
  position:absolute;
  top:15px;
  height:4px;
  border-radius:100px;
}
.range-pair::before {
  left:0;
  right:0;
  background:var(--line);
}
.range-pair::after {
  left:var(--from,0%);
  right:var(--to,0%);
  background:var(--brand);
}
.range-pair input[type="range"] {
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:34px;
  margin:0;
  background:none;
  -webkit-appearance:none;
  appearance:none;
  /* 重なった入力全体ではなく、つまみだけを掴めるようにする。 */
  pointer-events:none;
}
.range-pair input[type="range"]:focus-visible {
  outline-offset:0;
}
.range-pair input[type="range"]::-webkit-slider-runnable-track {
  height:34px;
  background:none;
}
.range-pair input[type="range"]::-moz-range-track {
  height:34px;
  background:none;
}
.range-pair input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance:none;
  pointer-events:auto;
  width:22px;
  height:22px;
  margin-top:6px;
  border:2px solid #fff;
  border-radius:50%;
  background:var(--brand);
  box-shadow:0 1px 5px rgba(13,58,54,.35);
  cursor:pointer;
}
.range-pair input[type="range"]::-moz-range-thumb {
  pointer-events:auto;
  width:18px;
  height:18px;
  border:2px solid #fff;
  border-radius:50%;
  background:var(--brand);
  box-shadow:0 1px 5px rgba(13,58,54,.35);
  cursor:pointer;
}
.chips {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.chip {
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:38px;
  padding:6px 13px;
  border:1px solid var(--line);
  border-radius:100px;
  background:#fff;
  color:var(--ink);
  font:inherit;
  font-size:13px;
  cursor:pointer;
  transition:border-color .2s,background .2s,color .2s;
}
.chip small {
  color:var(--muted);
  font-size:11px;
}
.chip:hover:not(:disabled) {
  border-color:var(--brand);
}
.chip[aria-pressed="true"] {
  background:var(--brand);
  border-color:var(--brand);
  color:#fff;
}
.chip[aria-pressed="true"] small {
  color:#ffffffc0;
}
.chip:disabled {
  opacity:.4;
  cursor:default;
}
.filters-reset {
  border:0;
  background:none;
  font:inherit;
  font-size:12px;
  color:var(--muted);
  text-decoration:underline;
  text-underline-offset:4px;
  cursor:pointer;
  padding:8px 0;
  text-align:left;
}
.search-ask .contact-copy {
  max-width:640px;
}

.results-bar {
  display:flex;
  align-items:center;
  gap:16px;
}
.result-count {
  font-size:15px;
  font-weight:600;
  margin-right:auto;
}
.sort {
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  color:var(--muted);
  white-space:nowrap;
}
.sort select {
  min-height:40px;
  padding:6px 10px;
  border:1px solid var(--line);
  border-radius:5px;
  background:#fff;
  color:var(--ink);
  font:inherit;
  font-size:13px;
}
.filters-open {
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:42px;
  padding:8px 16px;
  border:1px solid var(--brand);
  border-radius:100px;
  background:#fff;
  color:var(--brand-dark);
  font:inherit;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
}
.filters-open-count {
  display:inline-grid;
  place-items:center;
  min-width:20px;
  height:20px;
  padding:0 5px;
  border-radius:100px;
  background:var(--brand);
  color:#fff;
  font-size:11px;
}
.applied {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.applied-chip {
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:4px 12px;
  border:1px solid var(--brand);
  border-radius:100px;
  background:var(--tint);
  color:var(--brand-dark);
  font:inherit;
  font-size:12px;
  cursor:pointer;
}
.applied-chip:hover {
  background:#fff;
}

.rooms-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(232px,1fr));
  gap:34px 26px;
  padding-top:26px;
}
.skeleton {
  aspect-ratio:3/4;
  border-radius:4px;
  background:linear-gradient(100deg,var(--tint) 30%,#ffffff 50%,var(--tint) 70%) 0 0/300% 100%;
  animation:sheen 1.4s linear infinite;
}
/* ページ送り */
.pager {
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  gap:8px;
  padding-top:40px;
}
.pager button {
  min-width:42px;
  min-height:42px;
  padding:6px 12px;
  border:1px solid var(--line);
  border-radius:100px;
  background:#fff;
  color:var(--ink);
  font:inherit;
  font-size:13px;
  cursor:pointer;
  transition:border-color .2s,background .2s,color .2s;
}
.pager button:hover:not(:disabled) {
  border-color:var(--brand);
}
.pager button[aria-current="page"] {
  background:var(--brand);
  border-color:var(--brand);
  color:#fff;
  font-weight:600;
}
.pager button:disabled {
  opacity:.35;
  cursor:default;
}
.pager-gap {
  color:var(--muted);
  font-size:13px;
}
.empty-actions {
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:8px;
}
@media (min-width:1001px) {
  .search-panel {
    background:#fff;
    border:1px solid var(--line);
    border-radius:12px;
  }
  .results-bar {
    padding:14px 18px;
  }
  .applied:not([hidden]) {
    padding:14px 18px;
    border-top:1px solid var(--line);
  }
  .filters {
    padding:20px 22px 22px;
    border-top:1px solid var(--line);
    flex-direction:row;
    flex-wrap:wrap;
    align-items:flex-start;
    gap:22px 30px;
  }
  .filters:not(.open) {
    display:none;
  }
  .filters-head {
    display:contents;
  }
  .filters-head h2 {
    display:none;
  }
  .filter-block {
    flex:1 1 200px;
    min-width:0;
  }
  .filter-block:nth-of-type(1) {
    flex:1 1 260px;
  }
  .filter-block:nth-of-type(2) {
    flex:1 1 230px;
  }
  #tag-block {
    flex:1 1 100%;
  }
  .filters-reset {
    order:50;
    align-self:center;
  }
  .filters-apply {
    display:inline-flex;
    order:51;
    align-items:center;
    justify-content:center;
    margin-left:auto;
    min-height:48px;
    padding:12px 44px;
    border-radius:5px;
    font-size:15px;
    letter-spacing:.06em;
    transition:background .2s;
  }
  .filters-apply:hover {
    background:var(--brand-dark);
  }
}
@media (max-width:1000px) {
  .search-layout {
    grid-template-columns:1fr;
    gap:0;
  }
  /* スマホの絞り込みシート */
  .filters {
    position:fixed;
    inset:auto 0 0;
    z-index:60;
    max-height:84vh;
    /* シートのスクロールを背後の結果へ伝えない。 */
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    background:#fff;
    border:0;
    border-radius:16px 16px 0 0;
    /* 固定した見出しの上に本文が見えないよう、余白は見出し側で持つ。 */
    padding:0 20px;
    margin:0;
    box-shadow:0 -14px 40px rgba(13,58,54,.24);
    transform:translateY(100%);
    visibility:hidden;
    transition:transform .28s cubic-bezier(.22,.61,.36,1),visibility .28s;
  }
  .filters-head {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    position:sticky;
    top:0;
    z-index:3;
    margin:0 -20px;
    padding:26px 20px 12px;
    background:#fff;
    box-shadow:0 1px 0 var(--line);
  }
  .filters-head::before {
    content:'';
    position:absolute;
    top:10px;
    left:50%;
    width:38px;
    height:4px;
    margin-left:-19px;
    border-radius:100px;
    background:var(--line);
  }
  .filters-reset {
    padding:8px 0;
    white-space:nowrap;
  }
  .filters-head h2 {
    font-size:16px;
  }
  body.sheet-open::before {
    content:'';
    position:fixed;
    inset:0;
    z-index:59;
    background:rgba(13,58,54,.42);
  }
  .filters.open {
    transform:none;
    visibility:visible;
  }
  .filters-apply {
    display:block;
    order:99;
    position:sticky;
    bottom:calc(14px + env(safe-area-inset-bottom));
    z-index:2;
    align-self:center;
    min-width:220px;
    min-height:54px;
    margin-bottom:calc(14px + env(safe-area-inset-bottom));
    padding:14px 44px;
    border-radius:100px;
    background:var(--brand-dark);
    box-shadow:0 12px 26px rgba(13,58,54,.32);
    letter-spacing:.06em;
  }
  .result-count {
    display:none;
  }
  .results-bar {
    position:fixed;
    left:16px;
    right:16px;
    bottom:calc(14px + env(safe-area-inset-bottom));
    z-index:30;
    gap:8px;
    transition:opacity .2s,visibility .2s,transform .2s;
  }
  .filters-open {
    flex:1 1 auto;
    justify-content:center;
    min-height:48px;
    padding:8px 20px;
    border-color:var(--brand);
    background:var(--brand);
    color:#fff;
    font-size:14px;
    box-shadow:0 10px 26px rgba(13,58,54,.3);
  }
  .filters-open-count {
    background:#fff;
    color:var(--brand-dark);
  }
  .sort {
    flex:0 0 auto;
  }
  .sort span {
    display:none;
  }
  .sort select {
    min-height:48px;
    padding:8px 16px;
    border-color:var(--brand);
    border-radius:100px;
    color:var(--brand-dark);
    font-weight:600;
    box-shadow:0 10px 26px rgba(13,58,54,.3);
  }
  /* 絞り込み中と最後の案内が見える位置では、下部の操作を隠す。 */
  body.sheet-open .results-bar,
  body.near-end .results-bar {
    opacity:0;
    visibility:hidden;
    transform:translateY(12px);
  }
  /* 浮いた操作で最後の物件が隠れないよう、下に余白を置く。 */
  .search-layout {
    padding-bottom:96px;
  }
  body.sheet-open {
    overflow:hidden;
  }
  .search-layout {
    padding-top:20px;
  }
}
@media (max-width:760px) {
  .search-layout {
    padding-top:12px;
  }
  .filters input[type="search"] {
    min-height:50px;
    font-size:16px;
  }
  .filters input[type="search"]::placeholder {
    font-size:14px;
  }
  .chip {
    min-height:42px;
    padding:8px 15px;
    font-size:14px;
  }
  .applied-chip {
    min-height:38px;
    font-size:13px;
  }
  .filters-apply {
    min-height:56px;
    font-size:16px;
  }
  .rooms-grid {
    grid-template-columns:1fr;
    gap:34px;
  }
}
