/* ======================================= */
/* ファイル名: main-content-rental-car.css */
/* ======================================= */



/* 2. ページタイトル (H2) */
.sub-ttl {
    font-size: 2.2rem;
    font-weight: 700;
    text-align: center;
    color: #007bff;;
    padding: 15px 0;
    margin-top: 0;
    margin-bottom: 20px;
    border-bottom: 3px solid #007bff;
}

/* 店舗内容全体中央揃え */
.sightseeing-section {
    max-width: 800px;
    margin: 0 auto;
}

/* pタグの中央揃え用クラス */
.section-description {
    text-align: center;
    margin-top: 0;
    margin-bottom: 40px;
    line-height: 1.7;
}

/* 4. セクション大見出し (H3) の非表示設定 */
.content-ttl {
    display: none;
}

/* 5. 個別スポット */
.spot-item {
    margin-bottom: 30px;
    padding: 10px 20px;
    border: 1px solid #eee;
    border-radius: 8px;
    background-color: #fafafa;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);

    /* モバイル（縦並び） */
    display: flex;
    flex-direction: column;
    gap: 15px;
}

/* 6. 小見出し H4 */
.inner-ttl {
    width: 100%;
    order: 1;
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1.3;

    border-left: 8px solid #ffcc00;
    border-bottom: 1px dotted #ccc;

    padding: 0 0 5px 15px;
    margin: 0 0 10px 0;

    color: #333;
}

/* 7. 画像 */
figure {
    order: 2;
    margin: 0 0 15px 0;
    text-align: center;

    /* 追加: flexで中央揃え */
    display: flex;
    justify-content: center;
}

figure img {
    display: block;
    margin: 0 auto;
    width: auto;
    max-width: 80%;
    height: auto;
    border-radius: 4px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* 8. 説明文 */
.spot-item p {
    order: 3;
    width: 100%;
}

.contact-text-p1 {
    text-align: left;    /* 左揃え */
    margin: 0;           /* 必要に応じて上下余白を調整 */
}

.contact-text-p2 {
    text-align: center;
    margin: 0 auto;       /* 横方向の余白を自動にして中央揃えを補強 */
    display: block;        /* ブロック要素にして中央揃えを安定化 */
}

.note-red {
    color: #d60000;   /* 落ち着いた赤（おすすめ） */
    font-weight: normal; /* 明朝体が太くならないように */
}


/* PCでは電話リンク無効化 */
.tel-link a {
  pointer-events: none;  /* クリックを無効化 */
  cursor: default;       /* ポインターも通常の矢印に */
}

/* スマホ（幅480px以下）では電話有効化 */
@media (max-width: 480px) {
  .tel-link a {
    pointer-events: auto;  /* クリックを有効化 */
    cursor: pointer;       /* ポインターをリンクに変更 */
  }
}


/* ★★*