/* ===============================
京都旅マップ
kyoto-map.css
=============================== */


/* 導入文 */

.map-intro{
max-width:700px;
margin:140px auto 5px;/*40px auto;*/
line-height:1.9;
text-align:center;
font-size:1rem;
}



/* 京都地図 */

.map-area{
text-align:center;
margin:40px auto;/*40px auto;*/
}

.map-area img{
max-width:800px;
width:100%;
border-radius:6px;
box-shadow:0 4px 12px rgba(0,0,0,0.08);
}



/* エリアブロック */

.area-block{
max-width:720px;
margin:70px auto;/*70px auto;*/
padding:0 20px;
}

.area-block h2{
border-left:4px solid #C41E3A;
padding-left:12px;
margin-bottom:20px;
font-size:1.3rem;
}



/* スポット一覧 */

.spot-list{
list-style:none;
padding:0;
margin:0;
}

.spot-list li{
display:flex;
justify-content:space-between;
align-items:center;
padding:16px 10px;
border-bottom:1px solid #e6e6e6;
}



/* 寺社名 */

.spot-name{
font-weight:600;
font-size:1.05rem;
}



/* ボタン横並び */

.spot-links{
display:flex;
gap:10px;
}



/* 旅行記ボタン */

.btn-article{
text-decoration:none;
color:white;
background:#C41E3A;
padding:6px 12px;
border-radius:4px;
font-size:0.9rem;
transition:0.2s;
}

.btn-article:hover{
opacity:0.8;
}



/* 地図ボタン */

.btn-map{
text-decoration:none;
color:white;
background:#555;
padding:6px 12px;
border-radius:4px;
font-size:0.9rem;
transition:0.2s;
}

.btn-map:hover{
opacity:0.8;
}



/* ===============================
レスポンシブ
=============================== */

@media (max-width:600px){


/* エリア余白 */

.area-block{
margin:50px auto;
}


/* スポット縦並び */

.spot-list li{
flex-direction:column;
align-items:flex-start;
gap:10px;
}


/* ボタン少し大きく */

.btn-article,
.btn-map{
padding:8px 14px;
font-size:0.95rem;
}


}


/*中  少し強調したい通常文*/
.responsive-text01 {
  text-align: left; /*center*/
  font-weight: normal;/*bold;*/
  margin-bottom: 0.8em;
  margin-left: 2.0em;
  font-size: clamp(0.9rem, 2.2vw, 1.1rem);
  letter-spacing: -0.05em; /* 文字間隔を狭くする */
}