@charset "UTF-8";
/* ==========================================================================
   対応地域セクションの見出し
   左に見出し、右に地図アイコンを横並びで配置する
   ========================================================================== */

.area-head {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: clamp(10px, 2vw, 24px);
}

.area-head__title {
    margin: 0;
    text-align: left;
}

.area-head__map {
    flex: none;
    /* 元画像は133x115px */
    width: clamp(64px, 9vw, 133px);
    height: auto;
}

/* SPは見出しの下に回り込むので、地図を大きめに */
@media (max-width: 575.98px) {
    .area-head__map {
        width: 30%;
    }
}