@media screen and (max-width: 1024px) {
  /* ===== ACCESSページ SP ===== */

/* MV */
.ac-mv {
  position: relative;
  overflow: hidden;background-color:#ebe6dc
}
.ac-mv-img {
  position: relative;
  width: 100%;
}
.ac-mv-img img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}
.ac-mv-img .img-note {
  position: absolute;
  bottom: 1%;
  left: 1.5%;
  font-family: var(--font-sans-jp);
  font-size: 0.55rem;
  color: rgba(255,255,255,0.8);
}
.ac-mv-bgtxt {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  pointer-events: none;
  margin: 0;
  line-height: 1;
}
.ac-mv-bgtxt img {
  height: 100%;
  width: auto;
  display: block;
  opacity: 0.75;
}

/* イントロ */
.ac-intro {
  padding: 5% 0 4%;
  background: var(--color-light);
}
.sec-en-label {
  font-family: var(--font-en-sans);font-weight: 500;
  font-size: clamp(0.8rem, 1.3vw, 1.4rem);
  letter-spacing: 0.0em;
  color: var(--color-sub);
  text-transform: uppercase;
  margin-bottom: 2%;
}
.ac-intro-ttl {
  font-family: var(--font-sans-jp);
  font-size: clamp(1.0rem, 1.6vw, 1.8rem);
  font-weight: 500;
  letter-spacing: 0.06em;
  color: var(--color-dark);
  line-height: 1.5;
  margin-bottom: 2%;
}
.ac-intro-lead {
  font-family: var(--font-sans-jp);
  font-size: clamp(0.9rem, 1.1vw, 1rem);
  line-height: 1.9;
  color: var(--color-dark);
  margin-bottom: 4%;
}

/* 地図 */
.ac-map-fig {
  margin: 0 0 5%;
}
.ac-map-fig img {
  width: 100%;
  height: auto;
  display: block;
}

/* 統計グラフ */
.ac-stat {
  margin-bottom: 5%;
}
.ac-stat-ttl {
  font-family: var(--font-sans-jp);
  font-size: clamp(1rem, 1.5vw, 1.3rem);
  font-weight: 500;
  color: var(--color-dark);
  margin-bottom: 2%;
  line-height: 1.6;
}
.ac-stat-lead {
  font-family: var(--font-sans-jp);
  font-size: clamp(0.9rem, 1vw, 0.9rem);
  line-height: 1.9;
  color: var(--color-dark);
  margin-bottom: 3%;
}
.ac-stat-fig {
	padding: 2%;width:50%;margin: 0 auto}

.ac-stat-fig img {
  width: 100%;
  height: auto;
  display: block;
}

/* 30分以内コピー */
.ac-copy {
  margin-bottom: 3%;
}
.ac-copy-ttl {
  font-family: var(--font-sans-jp);
  font-size: clamp(1rem, 1.5vw, 1.3rem);
  font-weight: 500;
  color: var(--color-dark);
  margin-bottom: 2%;
  line-height: 1.6;
}
.ac-copy-body {
  font-family: var(--font-sans-jp);
  font-size: clamp(0.9rem, 1vw, 0.9rem);
  line-height: 1.9;
  color: var(--color-dark);
  margin-bottom: 1.5%;
}
.ac-copy-note {
  font-family: var(--font-sans-jp);
  font-size: clamp(0.65rem, 0.8vw, 0.75rem);
  color: #888;
  line-height: 1.7;text-align: left;
}

.ac-timetable-note {
  font-size: clamp(0.6rem, 0.75vw, 0.68rem);
  color: #000;text-align: left;
  margin-bottom: 4%;font-family: var(--font-sans-jp);
}
	
	
/* バナー共通 */
.ac-wrapper{width: 100%;  background-color:#d7dce3;margin-top: 5%
	}
.ac-banner {width: 80%;
  position: relative;
  overflow: hidden;margin: 0 auto;

}
.ac-banner-img {
  position: relative;
  width: 100%;
}
.ac-banner-img img {
  width: 100%;
  height: auto;
}
.ac-banner-img .img-note {
  position: absolute;
  bottom: 1%;
  right: 1.5%;
  font-family: var(--font-sans-jp);
  font-size: 0.55rem;
  color: rgba(255,255,255,0.8);
}

/* 電車アクセス詳細 */
.ac-train {
  padding: 5% 0 4%;
  background: #fff;
}
.ac-sect-ttl {
  font-family: var(--font-sans-jp);
  font-size: clamp(1rem, 1.8vw, 1.8rem);
  color: var(--color-dark);
  line-height: 1.7;
  margin-bottom: 3%;text-align: left;
}

/* 路線図 */
.ac-routemap {
  margin: 5% 0 5%;
}
.ac-routemap img {
  width: 100%;
  height: auto;
  display: block;
}


/* 2駅 */
.ac-stations {
  display: flex;
  flex-wrap: wrap;    /* 折り返しを許可 */
  width: 90%;         /* 全体の横幅 */
  margin: 5% auto ;    /* 上下に5%の余白、左右は中央寄せ */
  gap: 5%;            /* アイテム間の縦横の隙間を5%に設定 */
  align-items: flex-start;
}

.ac-sta-item {
  /* (100% - gapの5%) / 2列 = 47.5% 
     計算が面倒な場合は calc(50% - 2.5%) などでもOK 
  */
  flex: 0 0 47.5%; 
  text-align: center;
  box-sizing: border-box;margin-bottom:5%
}

/* 画像がはみ出さないための調整 */
.ac-sta-fig img, 
.ac-sta-item p img {
  width: 100%;
  height: auto;
  display: block;
}	
.ac-stat-fig {
	padding: 2%;width:90%;margin: 0 auto}

.ac-stat-fig img {
  width: 100%;
  height: auto;
  display: block;
}

.ac-sta-name {
  font-family: var(--font-sans-jp);
  font-size: clamp(0.85rem, 1.1vw, 1rem);
  font-weight: 500;
  color: var(--color-dark);
  margin-bottom: 1%;
}
.ac-sta-time {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 2%;
  font-family: var(--font-sans-jp);
  margin-bottom: 1%;
}
.ac-time-lbl {
  font-size: clamp(0.6rem, 0.8vw, 0.72rem);
  color: #666;
  line-height: 1.4;
  text-align: right;
}
.ac-time-num {
  font-family: var(--font-en-sans);
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  font-weight: 600;
  color: #7a3040;
  line-height: 1;
}
.ac-time-min {
  font-size: clamp(0.75rem, 1vw, 0.9rem);
  color: var(--color-dark);
}
.ac-time-sub {
  font-size: clamp(0.6rem, 0.75vw, 0.68rem);
  color: #888;
  line-height: 1.4;
  text-align: left;
}
.ac-sta-note {
  font-size: clamp(0.55rem, 0.7vw, 0.62rem);
  color: #999;
  line-height: 1.5;
}

/* 電車注釈 */
.ac-train-note {
  font-family: var(--font-sans-jp);
  font-size: clamp(0.6rem, 0.75vw, 0.68rem);
  color: #000;margin: 0 auto;
  width: 88%;
  line-height: 1.8;
  margin-bottom: 7%;
  padding: 0% 0;

}

/* 始発本数 */
.ac-hatsu {
  margin-bottom: 5%;
}
.ac-hatsu-lead {
  font-family: var(--font-sans-jp);
  font-size: clamp(0.9rem, 1vw, 0.9rem);
  line-height: 1.9;
  color: var(--color-dark);
  margin-bottom: 3%;
}
.ac-hatsu-nums {
  display: flex;
  gap: 3%;
  margin-bottom: 2%;
}
.ac-hatsu-box {
  flex: 1;
  background: var(--color-light);
  padding: 3% 4%;
  text-align: center;
}
.ac-hatsu-lbl {
  font-family: var(--font-sans-jp);
  font-size: clamp(0.65rem, 0.85vw, 0.78rem);
  color: #666;
  margin-bottom: 2%;
  line-height: 1.5;
}
.ac-hatsu-val {
  font-family: var(--font-sans-jp);
  font-size: clamp(1rem, 1.4vw, 1.2rem);
  color: var(--color-dark);
}
.ac-hatsu-val strong {
  font-family: var(--font-en-sans);
  font-size: clamp(2.4rem, 4vw, 3.6rem);
  font-weight: 700;
  color: #7a3040;
  line-height: 1;
}
.ac-hatsu-src {
  font-size: clamp(0.6rem, 0.75vw, 0.68rem);
  color: #000;
  margin-bottom: 3%;
}
.ac-hatsu-copy {
  font-family: var(--font-sans-jp);
  font-size: clamp(1rem, 1.6vw, 1.6rem);
  line-height: 1.7;
  color: var(--color-dark);
  margin-bottom: 3%;font-weight: 400
}

/* 時刻表 */
.ac-timetable {
  margin: 0 0 1.5%;
  background: #fff;
  padding: 2%;
}
.ac-timetable img {
  width: 100%;
  height: auto;
  display: block;
}
.ac-timetable-note {
  font-size: clamp(0.6rem, 0.75vw, 0.68rem);
  color: #000;text-align: right;
  margin-bottom: 4%;font-family: var(--font-sans-jp);
}

/* 始発シーン */
.ac-scene {
width:90%; 
background: var(--color-light);
padding: 3% 3%;text-align: center;
margin-bottom: 4%;margin: 0 auto;
}
.ac-scene-imgs {
  display: flex;
  gap: 4%;
}
.ac-scene-fig {
  flex: 1;
  position: relative;
  margin: 0;
}
.ac-scene-fig img {
  width: 100%;
  height: auto;
  display: block;
}
.ac-scene-fig .img-note {
  position: absolute;
  bottom: 20%;
  right: 1.8%;
  font-family: var(--font-sans-jp);
  font-size: 0.55rem;
  color: rgba(255,255,255,0.8);
}
.ac-scene-fig figcaption {
  font-family: var(--font-sans-jp);
  font-size: clamp(0.7rem, 1.2vw, 1.2rem);
  color: #000;
  text-align: center;
  padding: 1.5% 0;
}

	
	
/* 車アクセス */
.ac-car {
  padding: 5% 0 4%;
}
.ac-carmap {
  margin: 0 0 4%;
  background: #fff;
}
.ac-carmap img {
  width: 100%;
  height: auto;
  display: block;
}

/* IC距離表 */
.ac-ic-wrap {
  margin-bottom: 5%;
}
.ac-ic-from {
  font-family: var(--font-sans-jp);
  font-size: clamp(0.75rem, 0.95vw, 0.85rem);
  color: var(--color-dark);
  margin-bottom: 2%;
}
.ac-ic-boxes {
  display: flex;
  gap: 3%;
}
.ac-ic-box {
  flex: 1;
  background: #fff;
  border: 1px solid var(--color-border);
  padding: 3% 4%;
}
.ac-ic-name {
  font-family: var(--font-sans-jp);
  font-size: clamp(0.85rem, 1.1vw, 1rem);
  font-weight: 500;
  color: #fff;
  background: #7a3040;
  padding: 1.5% 3%;
  margin-bottom: 2%;
  display: inline-block;
}
.ac-ic-dist {
  font-family: var(--font-sans-jp);
  font-size: clamp(0.9rem, 1.2vw, 1.1rem);
  color: var(--color-dark);
  margin-bottom: 2%;
}
.ac-ic-dist strong {
  font-family: var(--font-en-sans);
  font-size: clamp(1.6rem, 2.8vw, 2.4rem);
  font-weight: 700;
  color: #7a3040;
  line-height: 1;
}
.ac-ic-tbl {
  width: 100%;
  font-family: var(--font-sans-jp);
  font-size: clamp(0.7rem, 0.9vw, 0.82rem);
  border-collapse: collapse;
}
.ac-ic-tbl caption {
  text-align: left;
  font-size: clamp(0.65rem, 0.82vw, 0.75rem);
  color: #888;
  margin-bottom: 1%;
  padding-bottom: 1%;
}
.ac-ic-tbl td {
  padding: 1% 2%;
  border-bottom: 1px solid var(--color-border);
  color: var(--color-dark);
}
.ac-ic-tbl tr:last-child td {
  border-bottom: none;
}

/* レジャー写真 */

.ac-leisure {
  margin: 5% auto 10%; 
  width: 80%;
  height: auto;       /* 高さをコンテンツに合わせる */
  overflow: hidden;   /* はみ出しをカット、または回り込み解除 */
  display: block;     /* 念のためブロック要素であることを明示 */
}
	
	
.ac-leisure-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2%;
  list-style: none;
  padding: 0;
  margin: 0;
}
.ac-leisure-item {
  position: relative;
}
.ac-leisure-fig {
  margin: 0 0 2%;
}
.ac-leisure-fig img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform var(--transition);
}

.ac-leisure-name {
  font-family: var(--font-sans-jp);
  font-size: clamp(0.72rem, 0.92vw, 0.84rem);
  font-weight: 500;
  color: var(--color-dark);
  margin-bottom: 0.5%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ac-leisure-dist {
  font-family: var(--font-sans-jp);
  font-size: clamp(0.62rem, 0.8vw, 0.72rem);
  color: #888;
}

/* レジャー写真：4列から2列へ変更 */
.ac-leisure {
  margin: 10% auto 0%; /* 下の余白を10%確保 */
  width: 90%;          /* 80%だと2列のとき画像が小さくなりすぎるため90%を推奨 */
  display: block;      /* 親の認識を確実にする */
  overflow: visible;   /* はみ出しを隠さず、高さに追従させる */
}

/* リスト部分をFlexに変更 */
.ac-leisure-grid {
  display: flex;
  flex-wrap: wrap;     /* 折り返しを許可（2列にするため必須） */
  justify-content: space-between; /* 左右に振り分け */
  gap: 0px 4%;        /* 上下20px、左右4%の隙間 */
  list-style: none;
  padding: 0;
  margin: 0;
}

/* 各アイテム（1枚あたりの設定） */
.ac-leisure-item {
  flex: 0 0 48%;       /* 2列にするため約50%弱に設定 */
  margin-bottom: 5%;   /* 下のアイテムとの間隔 */
  box-sizing: border-box;
}

/* 画像の設定 */
.ac-leisure-fig {
  margin: 0;
  width: 100%;
}

.ac-leisure-fig img {
  width: 100%;
  height: auto;        /* 高さを自動計算させて「消える」のを防ぐ */
  display: block;
  object-fit: cover;
  border-radius: 4px;  /* 任意：少し角を丸くすると今風になります */
}
	
	
}

