/* ===== page-nav ===== */
.pg-nav{max-width:1200px;width: 90%;margin:0 auto 3rem}

.pg-nav__inner {
  display: flex;
  gap: 1.5%;
  width: 100%;
}

.pg-nav__item {
  width: 32%;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 1rem 0.5rem;
  font-size: clamp(0.8rem, 0.8vw + 0.4rem, 0.95rem);font-weight: bold;
  line-height: 1.6;
  text-decoration: none;
  color: #333;
  border: 1px solid #ccc;
  box-sizing: border-box;
  transition: background 0.6s ease;
}

/* 左：背景固定 */
.pg-nav__item--active {
  background: #9fa0a0;
  color: #fff;
  border-color: #9fa0a0;
}

/* 2番目・3番目：ホバー */
.pg-nav__item:not(.pg-nav__item--active):hover {
  background: #dbe7ed;
}

/* ===== ゾーン説明 ===== */
.zone-sec {
  background: #fff;
  width: 100%;
}

.zone-wrap {
  width: 92%;
  margin: 0 auto;
  padding: 1rem 1rem 0.2rem;
}

/* ----- リスト初期化 ----- */
.zone-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* ----- 各アイテム ----- */
.zone-item {
  padding: 1.5rem;
}

/* ----- 見出し ----- */
.zone-ttl {
  display: flex;
  align-items: left;
  gap: 0.5rem;
  font-size: clamp(0.9rem, 1.2vw + 0.3rem, 1rem);
  font-weight: bold;
  color: #000;
  margin: 0 0 0.5rem;
  line-height: 1.4;font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}

/* ----- カラーアイコン ----- */
.zone-icon {
  display: inline-block;
  width: 1.5rem;
  height: 1.1rem;
  flex-shrink: 0;
}

/* 上段左：商業集積ゾーン */
.zone-icon--shogyosekiseki {
  background-color: #f8c5ac;
}

/* 上段中：沿道商業ゾーン */
.zone-icon--endo-shogyou {
  background-color: #f7c9dd;
}

/* 上段右：低層住宅ゾーン */
.zone-icon--teiso-jutaku {
  background-color: #a5d4ad;
}

/* 下段左：沿道利用ゾーン */
.zone-icon--endo-riyo {
  background-color: #f1e88f;
}

/* 下段中：住宅・商業共存ゾーン */
.zone-icon--jutaku-shogyou {
  background-color: #fcd7a1;
}

/* 下段右：鉄道施設・拠点機能創出ゾーン（斜線ハッチング） */
.zone-icon--tetsudo-kyoten {
  background-color: #c9caca;
  background-image: repeating-linear-gradient(
    45deg,
    #000 0,
    #000 1px,
    transparent 1px,
    transparent 5px
  );
}

/* ----- 説明文 ----- */
.zone-desc {
  font-size: clamp(0.75rem, 1vw + 0.2rem, 0.875rem);
  line-height: 1.8;
  color: #000;
  margin: 0;text-align: left;
}

/* ----- 出典 ----- */
.zone-source {
  text-align: right;
  margin: 0.5rem 0 3rem;
}

.zone-source small {
  font-size: clamp(0.625rem, 0.7vw + 0.2rem, 0.75rem);
  color: #000;
}

/* ===== ゾーン説明 ===== */
.zone-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: auto auto;
  align-items: start;
}
/* ===== location-list ===== */
.loc-list{
  margin: 3rem auto;
}

/* ===== location-list ===== */
.loc-list__inner {
  width: 90%;
  margin: 0 auto;
}
.loc-item__detail{text-align: left;margin-left: 1.5rem
}

.loc-item__detail2{text-align: left;
}

.loc-row {
  display: flex;
  align-items: flex-start;
  margin-bottom: 2rem;
}

/* 上段 2列：49% + gap2% + 49% */
.loc-row--2col {
  gap: 2%;
}
.loc-row--2col .loc-item {
  width: 49%;
}

/* 下段 3列：32% + gap2% + 32% + gap2% + 32% */
.loc-row--3col {
  gap: 2%;
}
.loc-row--3col .loc-item {
  width: 32%;
}

/* ※ 各行の画像は同一アスペクト比で用意すること（height: auto で高さ自動統一） */
.loc-item__img img {
  width: 100%;
  height: auto;
  display: block;
}

.loc-item__lead {
  font-size: clamp(0.8rem, 0.8vw + 0.4rem, 0.9rem);
  line-height: 1.8;
  margin-top: 0.75rem;
  margin-bottom: 0.5rem;text-align: left;
}

.loc-item__name {
  font-size: clamp(0.85rem, 0.9vw + 0.4rem, 1rem);
  font-weight: bold;
  margin-top: 0.75rem;
  margin-bottom: 1.25rem;
  line-height: 1.6;
}

.loc-num {
  margin-right: 0.25rem;
}

.loc-dist {
  font-weight: normal;
}

.loc-item__addr,
.loc-item__hours {
  font-size: clamp(0.75rem, 0.7vw + 0.35rem, 0.85rem);
  line-height: 1.7;
  margin: 2rem 0 0;
}
.loc-school{
;margin: 3rem auto;
}

/* ===== location-school ===== */
.loc-school__inner {
  width: 90%;
  margin: 0 auto;
}

/* 上段：画像34% テキスト13% gap3% 画像34% テキスト13% */
.loc-row--school {
  display: flex;
  align-items: flex-start;
  gap: 0;
  margin-bottom: 2rem;
}

.loc-school__img {
  width: 34%;
  flex-shrink: 0;
}

.loc-school__img img {
  width: 100%;
  height: auto;
  display: block;
}

.loc-school__txt {
  width: 18%;
  flex-shrink: 0;
  padding-left: 1rem; padding-top: 2rem;
  box-sizing: border-box;text-align: left;
}

/* 左テキストブロックに右マージンで3%gap確保 */
.loc-school__txt--gap {
  margin-right: 3%;
}

/* ===== location-park ===== */
.loc-park {
margin: 3rem auto 6rem;
}



.loc-park__inner {
  width: 90%;
  margin: 0 auto;
}

/* 共通：--w で各アイテムの幅を個別制御 */
.loc-row--park2,
.loc-row--park3 {
  display: flex;
  align-items: flex-start;
  margin-bottom: 2rem;
}

/* 上段 gap = 100% - 49% - 49% = 2% */
.loc-row--park2 {
  gap: 2%;
}

/* 下段 gap = (100% - 32%×3) ÷ 2 = 2% */
.loc-row--park3 {
  gap: 2%;
}

/* 幅はインラインの --w を参照 */
.loc-row--park2 .loc-item,
.loc-row--park3 .loc-item {
  width: var(--w);
  flex-shrink: 0;
}

.loc-item__img img {
  width: 100%;
  height: auto;
  display: block;
}

.loc-item__name {
  font-size: clamp(0.85rem, 0.9vw + 0.4rem, 1rem);
  font-weight: bold;
  margin-top: 0.75rem;
  margin-bottom: 0.25rem;
  line-height: 1.6;
}

.loc-item__addr,
.loc-item__hours {
  font-size: clamp(0.75rem, 0.7vw + 0.35rem, 0.85rem);
  line-height: 1.7;
  margin: 0;
}
    /* ===== 周辺施設 共通 ===== */
    .nearby {
      width: 100%; margin-top: 5rem;margin-bottom: 5rem;
    }

    .nearby__grid {
      display: flex;
      width: 100%;
      align-items: flex-start;
      flex-direction: row;gap: 1.5rem;
    }

    .nearby__col {
      width: 48%;
    }


    /* ===== 施設ブロック ===== */
    .fac {
      width: 100%;
    }
.fac__dist {
  white-space: nowrap;
  flex-shrink: 0;
  font-size: clamp(0.6rem, 0.9vw + 0.25rem, 0.78rem);
  width: 10.5em;        /* ← 追加：固定幅で「約」を面一に */
  text-align: left;     /* ← 追加 */
}
    .fac__hd {
      font-size: clamp(0.75rem, 1.2vw + 0.3rem, 0.9rem);
      font-weight: bold;
      color: #fff;
      background-color: #b8b19a;
      padding: 0.35rem 0.75rem;
      letter-spacing: 0.1em;text-align: left
    }

    .fac__list {
      list-style: none;
      padding: 0.3rem 0rem;
    }

    .fac__item {
      display: flex;
      align-items: baseline;
      gap: 0.2rem;
      padding: 0.18rem 0;
      font-size: clamp(0.6rem, 0.9vw + 0.25rem, 0.78rem);
      color: #000;
      line-height: 1.5;
    }

    .fac__name {
      white-space: nowrap;
      flex-shrink: 0;
    }

    .fac__name small {
      font-size: 0.85em;
    }

    .fac__name sup {
      font-size: 0.7em;
      vertical-align: super;
      line-height: 1;
    }

    .fac__ld {
      flex: 1;
      min-width: 0.5rem;
      border-bottom: 1px dotted #999;
      margin-bottom: 0.25rem;
    }

    .fac__dist {
      white-space: nowrap;
      flex-shrink: 0;
      font-size: clamp(0.6rem, 0.9vw + 0.25rem, 0.78rem);
    }

    .nearby__note {
      font-size: clamp(0.55rem, 0.8vw + 0.2rem, 0.7rem);
      color: #555;
      text-align: center;
      padding: 0.6rem 1rem;
      line-height: 1.8;
    }

/* ===== 周辺施設 PC ===== */

.nearby__grid {
  flex-direction: row;
}

.nearby__col {
  width: 48%;
}


.fac__list {
  padding: 0.3rem 0rem;
}

.fac__item {
  padding: 0.18rem 0;
}


/*スマホ*/
@media screen and (max-width:768px){
	/* ===== page-nav ===== */
.pg-nav__inner {
  flex-direction: column;
  align-items: center;
  gap: 0;
}

.pg-nav__item {
  width: 100%;
  margin-top: 0;
  margin-bottom: 1rem;
}
	
/* ===== ゾーン説明 ===== */
.zone-wrap {
  width: 94%;
  padding: 0.5rem 0;margin: 1rem 0;
}

.zone-list {
  display: grid;
  grid-template-columns: 1fr;
}

.zone-item {
  padding: 1.25rem 0.5rem;
  border-bottom: 1px solid #eee;
}

.zone-item:last-child {
  border-bottom: none;
}

/* ----- 出典 ----- */
.zone-source {
  text-align: right;
  margin: 0.5rem 0 3rem;
}

.zone-source small {
  font-size: clamp(0.625rem, 0.7vw + 0.2rem, 0.75rem);
  color: #000;text-align: right;
}

/* ===== location-school ===== */
.loc-school__inner {
  width: 100%;
  margin: 0 auto;
}
	
	
.loc-row--2col,
.loc-row--3col {
  flex-direction: column;
  gap: 0;
}

.loc-row--2col .loc-item {
  width: 100%;
  margin-bottom: 2rem;
}
	

.loc-row--3col .loc-item {
  width: 100%;
  margin-bottom: 2rem;margin:0 auto 2rem;
}
	
.loc-list__inner {
  width: 100%;
  margin: 0 auto;
}	
	


	
.loc-row--school {
  flex-direction: column;
  gap: 0;
}

.loc-school__img,
.loc-school__txt,
.loc-school__txt--gap {
  width: 100%;
  margin-right: 0;
  padding-left: 0;
}

.loc-school__txt,
.loc-school__txt--gap {
  margin-top: 0.75rem;
  margin-bottom: 1.5rem;
}
/* ===== location-park ===== */
.loc-row--park2,
.loc-row--park3 {
  flex-direction: column;
  gap: 0; width: 100%;
}
	
.loc-row--park2 .loc-item,
.loc-row--park3 .loc-item {
  width: 100% !important; /* --w を上書き */
  margin-bottom: 2rem;
}
.loc-park__inner {
  width: 100%;
  margin: 0 auto 0;
}



 /* ===== 周辺施設 共通 ===== */
    .nearby {
      width: 100%; 
    }
  .nearby {
      width: 100%; margin-top: 2rem;margin-bottom: 0rem;
    }
	
	  .nearby__note {width: 100%; 
      font-size: clamp(0.55rem, 0.8vw + 0.2rem, 0.7rem);
      color: #555;
      text-align: center;
      padding: 0.6rem 0rem;
      line-height: 1.8;
    }
   .nearby__grid {
  flex-direction: column;
  gap: 0; /* ← 追加：PC の gap: 1.5rem をリセット */
}
.nearby__col {
  width: 100%;
}
   


    /* ===== 施設ブロック ===== */
    .fac {
      width: 100%;
    }

    .fac__hd {
      font-size: clamp(0.75rem, 1.2vw + 0.3rem, 0.9rem);
      font-weight: bold;
      color: #fff;
      background-color: #8b7c5a;
      padding: 0.35rem 0.75rem;
      letter-spacing: 0.1em;
    }

    .fac__list {
      list-style: none;
      padding: 0.3rem 0rem;
    }

    .fac__item {
      display: flex;
      align-items: baseline;
      gap: 0.2rem;
      padding: 0.18rem 0;
      font-size: clamp(0.6rem, 0.9vw + 0.25rem, 0.78rem);
      color: #333;
      line-height: 1.5;
    }

    .fac__name {
      white-space: nowrap;
      flex-shrink: 0;
    }

    .fac__name small {
      font-size: 0.85em;
    }

    .fac__name sup {
      font-size: 0.7em;
      vertical-align: super;
      line-height: 1;
    }

    .fac__ld {
      flex: 1;
      min-width: 0.5rem;
      border-bottom: 1px dotted #999;
      margin-bottom: 0.25rem;
    }

    .fac__dist {
      white-space: nowrap;
      flex-shrink: 0;
      font-size: clamp(0.6rem, 0.9vw + 0.25rem, 0.78rem);
    }
/* ===== lifeinfo ===== */
    .nearby__note {
      font-size: clamp(0.55rem, 0.8vw + 0.2rem, 0.7rem);
      color: #000;
      text-align: center;
      padding: 0.6rem 0rem;
      line-height: 1.8;
    }

	 .nearby__grid {
        flex-direction: column;
      }
      .nearby__col {
        width: 100%;
      }
  
      .nearby__note {
        text-align: left;
        padding: 0rem;
      }
	
	/* ===== location-school ===== */
.loc-item{
;margin: 1rem 0% 0rem 4%;
}	
.loc-row--3col{
;margin: 1rem 0% 0rem 4%;
}	
	
.loc-school{
;margin: 1rem 6% 0rem 0rem;
}
	
.loc-park{
;margin: 1rem 9% 0rem 0%;
}
.loc-parkloc-park{
;margin: 1rem 10% 0rem 0%;
}

.loc-school__txt {
  width: 80%;
  flex-shrink: 0;
  padding-left: 7%; padding-top: 0rem;
  box-sizing: border-box;text-align: left;
}

/* 左テキストブロックに右マージンで3%gap確保 */
.loc-school__txt--gap {
  margin-right: 3%;
}	
	
	
    }