/* --- グーグルマップセクション（google-map.css） 固有スタイル --- */

.gmap-section {
    padding: 0 0 80px;         /* 上下の余白（他のセクションとの間隔） */
    background-color: #fff;  /* 背景色 */
}

.gmap-inner {
    max-width: 1000px;       /* 地図の最大横幅 */
    margin: 0 auto;
    padding: 0 20px;         /* スマホ時の左右余白 */
}

/* 地図の枠 */
.gmap-container {
    width: 100%;
    line-height: 0;          /* iframe下の微細な隙間を解消 */
    border-radius: 4px;      /* 角を少し丸くする */
    overflow: hidden;        /* 角丸を有効にするため */
    box-shadow: 0 4px 15px rgba(0,0,0,0.08); /* 軽い影で地図を浮かせる */
    margin-bottom: 30px;     /* テキスト情報エリアとの間隔 */
}

.gmap-container iframe {
    width: 100%;
    height: 450px;           /* PCでの高さ */
    vertical-align: bottom;
    border: 0;
}

/* --- 所在地情報テキストエリア（新設） --- */
.gmap-info {
    text-align: center;      /* 中央揃え */
    margin-bottom: 30px;     /* ボタンとの間隔 */
}

/* ホテル名（テキストサイズ中・レクストンブルー） */
.gmap-hotel-name {
    font-size: 20px;
    font-weight: 700;
    color: #0054a6;
    margin-bottom: 12px;
}

/* 住所・電話（テキストサイズ小・黒） */
.gmap-address, 
.gmap-tel {
    font-size: 14px;
    color: #000;
    line-height: 1.6;
    margin-bottom: 4px;
}

/* ボタンの配置 */
.gmap-btn-wrapper {
    text-align: center;
}

/* Googleマップで見るボタン */
.btn-gmap-rect {
    display: inline-block;
    padding: 15px 50px;
    background-color: #0054a6; /* レクストンブルー */
    color: #fff;
    text-decoration: none;
    font-weight: 700;
    font-size: 16px;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.btn-gmap-rect:hover {
    background-color: #003d7a; /* ホバー時は少し濃い青に */
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0,84,166,0.3);
}

.btn-gmap-rect .arrow {
    margin-left: 10px;
    display: inline-block;
    transition: transform 0.3s ease;
}

.btn-gmap-rect:hover .arrow {
    /* ↗ の向きに合わせて斜め上へ動かす */
    transform: translate(3px, -3px);
}

/* --- レスポンシブ --- */
@media (max-width: 768px) {
    .gmap-section {
        padding: 40px 0;
    }

    .gmap-container iframe {
        height: 300px; /* スマホでは地図を少し低くする */
    }

    .gmap-hotel-name {
        font-size: 18px; /* スマホではホテル名を少し小さく調整 */
    }

    .btn-gmap-rect {
        width: 100%; /* スマホではボタンを横幅いっぱいに */
        box-sizing: border-box;
        padding: 15px 20px;
    }
}