﻿@charset "UTF-8";

.shop_brand {
  display: none !important;
}

/* --- 全体レイアウト --- */
.shop_wrap {
  padding: 0 0 4rem;
  font-size: 1.3rem;
}

/* --- 検索・セレクトエリア --- */
.search-area {
  margin-bottom: 3rem;
  text-align: center;
}

#search-text {
  width: 90rem;
  max-width: 100%;
  margin: auto;
  padding: 2rem 2.5rem;
  font-size: 1.6rem;
  border: none;
  border-radius: 0.4rem;
  background-color: #f5f5f5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 2.2rem center;
  background-size: 2.2rem;
  box-sizing: border-box;
  outline: none;
}

.shop_select_wrap {
  text-align: center;
}

.shop_wrap .select {
  width: 82rem;
  max-width: 100%;
  margin: auto;
  padding: 1.8rem 2.5rem;
  font-size: 1.6rem;
  border: 0.1rem solid #ccc;
  border-radius: 0.4rem;
  background-color: #fff;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 2.5rem center;
  background-size: 2rem;
  cursor: pointer;
  margin-bottom: 2.5rem;
  color: var(--color-basic);
  -webkit-text-fill-color: var(--color-basic);
  opacity: 1;
}

/* --- エリアナビ（ボタン） --- */
.area_list__inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.2rem;
  list-style: none;
  padding: 0;
  margin: 0 0 4rem;
}

.area_list__item {
  padding: 1rem 2.4rem;
  background: #f0f0f0;
  color: #333;
  cursor: pointer;
  border-radius: 5rem;
  font-size: 1.4rem;
  font-weight: 500;
  transition: all 0.2s ease;
}

.area_list__item.is-active {
  background: #212121;
  color: #fff;
}

/* --- 件数表示 --- */
.search-result__hit-num {
  text-align: center;
  font-size: 1.5rem;
  color: #666;
  margin-bottom: 3rem;
  letter-spacing: 0.05em;
}

/* --- ショップリスト構造 --- */
.shop_list {
  display: block;
  padding: 3rem 0 0;
  margin: 0;
  list-style: none;
}

/* JS読み込み完了まで店舗リストを隠す */
.shop_list {
  opacity: 0;
  transition: opacity 0.3s ease; /* ふわっと表示させたい場合 */
}

/* JS側でこのクラスを付与して表示させる */
.shop_list.is-loaded {
  opacity: 1;
}

.area-group {
  margin-bottom: 6rem;
}

.area-group-title {
  font-size: 2.2rem;
  font-weight: 600;
  text-align: center;
  position: relative;
  margin: 0 0 2rem;
  letter-spacing: 0.1em;
}

.area-item-list {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  padding: 0;
  margin: 0;
  list-style: none;
}

/* 店舗カード本体 */
.area-item-list > li {
  position: relative;
  width: calc(50% - 1.5rem);
  background: #fff;
  border: 0.1rem solid #eee;
  padding: 3rem;
  box-sizing: border-box;
  box-shadow: 0 0.4rem 1.2rem rgba(0,0,0,0.05);
  border-radius: 0.4rem;
  display: flex; /* info-blkとlink-blkの横並び用 */
  flex-direction: column; /* デフォルトは縦積み、必要に応じて調整 */
}

/* 店舗カード内テキストスタイル */
.shop_list .shop_name {
  width: calc(100% - 12rem);
  font-size: 1.6rem;
  font-weight: 500;
}

.shop_list .shop_addres {
  margin-top: 1.5rem;
}

.shop_list .ttl {
  width: 7rem;
  flex-shrink: 0;
}

.shop_list .text {
}

.shop_list .shop_tel { margin-top: 0.8rem; }
.shop_list .shop_hours { margin-top: 0.6rem; }
.shop_list .shop_note { margin-top: 2rem; }

.shop_list li ul li {
  display: flex;
  font-size: 1.3rem;
  margin-bottom: 0.5rem;
}

/* --- アイコンリスト --- */
.shop_list .shop_brand,
.shop_list .shop_service {
  display: flex;
  flex-wrap: wrap;
  margin-top: 0.8rem;
}

.shop_list .shop_brand span,
.shop_list .shop_service span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  height: 2rem;
  font-size: 1.2rem;
  padding: 0.2rem 1rem;
  color: #bebebe;
  margin: 0 0.8rem 0.5rem 0;
  border: 1px solid #bebebe;
  border-radius: 0.2rem;
}

.shop_list .shop_service {
  margin-top: 2rem;
  gap: 0.2rem 0;
}

.shop_list .shop_service span {
  color: #fff;
  background: #bebebe;
}

/* --- リンク・ボタン --- */
.shop_list .link-blk {
  position: absolute;
  top: 0.8rem;
  right: 2rem;
  display: flex;
  gap: 1.4rem;
  align-items: center;
  margin-top: auto; /* カードの下部に配置 */
  padding-top: 2rem;
}

.shop_list .link-blk img {
  vertical-align: middle;
}

.shop_list .link-blk .icon-insta img {
  width: 1.9rem;
  vertical-align: -0.3rem;
}

.shop_list .btn-map {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  gap: 0.6rem;
  border: 1px solid #212121;
  border-radius: 2rem;
  padding: 0.3rem 1.5rem 0.3rem 3rem;
  background-size: 1.3rem;
  background-repeat: no-repeat;
  background-position: 0.8rem center;
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218%22%20height%3D%2221.728%22%20viewBox%3D%220%200%2018%2021.728%22%3E%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_4725%22%20data-name%3D%22%E3%83%91%E3%82%B9%204725%22%20d%3D%22M12%2C20.9l4.95-4.95a7%2C7%2C0%2C1%2C0-9.9%2C0Zm0%2C2.828L5.636%2C17.364a9%2C9%2C0%2C1%2C1%2C12.728%2C0ZM12%2C13a2%2C2%2C0%2C1%2C0-2-2A2%2C2%2C0%2C0%2C0%2C12%2C13Zm0%2C2a4%2C4%2C0%2C1%2C1%2C4-4A4%2C4%2C0%2C0%2C1%2C12%2C15Z%22%20transform%3D%22translate(-3%20-2)%22%20fill%3D%22%23212121%22%2F%3E%3C%2Fsvg%3E');
  font-weight: 500;
}

.shop_list .btn-map img {
  width: 1.5rem;
}

.info-blk .txt_sm {
  display: inline-block;
  font-size: 0.85em;
  line-height: 1.5;
}

.info-blk br + .txt_sm {
  padding: 0.5rem 0 0;
}

.shop_list .shop_caption {
  padding-top: 0.5rem;
  font-size: 1.3rem;
}

.no-result {
  width: 100%;
  text-align: center;
  padding: 8rem 0;
  color: #999;
  font-size: 1.5rem;
}


/* PC用*/
@media (min-width: 769px) {

  #Wrap,
  .wrapTop {
    width: 110rem;
    max-width: 100%;
  }


}

/* SP用*/
@media (max-width: 768px) {
  html {
    font-size: calc(10 * (100vw / 430));
  }

  /* --- 全体レイアウト --- */
  .shop_wrap {
    padding: 0 1.5rem 4rem;
  }

  .shop_wrap .select {
    padding: 1.5rem 2rem;
    border-radius: 0.4rem;
    background-position: right 2rem center;
    background-size: 1.8rem;
    margin-bottom: 2rem;
  }

  .area_list__inner {
    gap: 1rem;
  }

  .area-group-title {
    font-size: 1.8rem;
  }

  .area_list__item {
    padding: 0.6rem 1.6rem;
    font-size: 1.4rem;
  }

  .area-item-list > li {
    width: 100%;
    padding: 2rem;
  }

  .shop_list .shop_name {
    width: 100%;
    font-size: 1.6rem;
  }

  .shop_list .shop_addres {
    margin-top: 1.2rem;
  }

  .shop_list .ttl {
  }

  .shop_list .text {
    width: calc(100% - 8rem);
  }

  .shop_list .link-blk {
    position: inherit;
    justify-content: flex-end;
  }

  .shop_list .btn-map {
    font-size: 1.5rem;
  }

  .info-blk .txt_sm {
    display: block;
    padding: 1rem 0 0;
  }

}
