.br-pc,
.br-sp {
    display: none;
}

@media screen and (min-width: 768px) {
    .br-pc {
        display: inline;
    }
}

@media screen and (max-width: 767px) {
    .br-sp {
        display: inline;
    }
}

/* 天気 */
.weather {
    position: absolute;
    bottom: 10%;
    right: 18%;
    z-index: 10;
    max-width: 348px;
    width: 100%;
}

.weather-card {
    background: #F2F0E9;
    border-radius: 12px;
    padding: 28px 12px 28px 20px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
    max-width: 348px;
    height: 94px;
    width: 100%;
    display: flex;
    gap: 30px;
    align-items: center;
    border: none;
    position: relative;
    box-sizing: border-box;
}

.weather-right {
    margin-right: 0;
    padding-right: 0;
}

.weather-left {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
}

.weather-title {
    font-size: 25px;
    color: #8AB262;
    font-weight: 700;
    letter-spacing: 2px;
    line-height: 1.2;
}

.location {
    font-size: 16px;
    color: #8AB262;
    font-weight: 700;
}

.weather-right {
    display: flex;
    align-items: center;
    gap: 8px;
}

.temperature {
    margin-left: 10px;
    font-size: 40px;
    font-weight: bold;
    color: #333;
    font-family: 'Prompt', sans-serif;
}

.degree {
    font-size: 26px;
    vertical-align: top;
    margin-left: 2px;
}

.weather-icon {
    font-size: 40px;
    animation: gentle-float 4s ease-in-out infinite;
    transition: transform 0.3s ease;
}

@keyframes gentle-float {

    0%,
    100% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-8px);
    }
}

/* 天気カードの位置・サイズ調整 */
@media (max-width: 768px) {
    .weather {
        position: absolute;
        top: 50%;
        right: 10%;
        max-width: 320px;
        width: 90%;
        margin: 0;
        transform: translateY(-50%);
        z-index: 10;
    }

    .weather-card {
        top: 300px;
        flex-direction: row;
        /* 横並びのまま */
        height: auto;
        padding: 20px;
        gap: 15px;
        align-items: center;
    }

    .temperature {
        font-size: 32px;
    }

    .degree {
        font-size: 20px;
    }

    .weather-left {
        margin-bottom: 0;
    }

    .weather-right {
        width: auto;
        justify-content: flex-start;
        gap: 12px;
    }

    .weather-title {
        font-size: 20px;
    }

    .location {
        font-size: 14px;
    }

    .weather-icon {
        font-size: 32px;
        animation: none;
        /* アニメは控えめに */
    }
}

@media (max-width: 400px) {
    .weather {
        top: 55%;
        right: 8%;
        max-width: 280px;
        width: 90%;
        transform: translateY(-50%);
    }

    .weather-title {
        font-size: 18px;
    }

    .location {
        font-size: 14px;
    }

    .temperature {
        font-size: 28px;
    }

    .degree {
        font-size: 18px;
    }

    .weather-icon {
        font-size: 28px;
    }
}

/* ABOUT */
.about__container {
    background-color: #fff;
    position: relative;
    z-index: 10;
}

.about__feature {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    gap: 80px;
    margin-top: 110px;
}

.feature__circle {
    width: 284px;
    height: 284px;
    aspect-ratio: 1 / 1;
    border: 2px solid #8AB262;
    /* 薄いグリーン */
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.feature__circle img {
    width: 60px;
    height: auto;
}

.feature__circle p {
    margin-top: 21px;
    font-size: 24px;
    line-height: 1.5;
}

.about__highlight {
    font-family: "Prompt", sans-serif;
    font-weight: 400;
}

.about_main {
    width: 100%;
    margin-top: 135px;
    display: flex;
    max-width: 1920px;
    justify-content: space-between;
}

.about__image img {
    display: block;
    height: 346px;
}

.about__text {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.8;
}

.about__text p+p {
    margin-top: 50px;
}

.about__text h3 {
    font-size: 30px;
    font-weight: 700;
    line-height: 1.8;
    color: #8AB262;
    margin-bottom: 61px;
}

.about__text p {
    font-size: 18px;
    line-height: 1.8;
}

.about__image.about__image--right {
    margin-top: 144px;
}

.about__button {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    /* 文字と矢印の間 */
    margin: 72px auto 0;
    width: 302px;
    height: 56px;
    background: #8AB262;
    color: #fff;
    border-radius: 35px;
    font-family: "Prompt", sans-serif;
    font-size: 18px;
    transition: background 0.3s, color 0.3s;
    border: 2px solid transparent;
    text-decoration: none;
}

.about__button:hover {
    background: #fff;
    color: #8AB262;
    border: 3px solid #8AB262;
}

.about__button:hover .button__arrow {
    border-top-color: #8AB262;
    border-right-color: #8AB262;
}

.about__button__width {
    font-weight: 700;
    font-family: "Prompt", sans-serif;
    font-size: 18px;
    line-height: 1.8;
}

/* NEWS */
.news__container {
    margin-top: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    background-color: #fff;
    z-index: 2;
    padding-bottom: 20px;
    flex-direction: row;
    /* ← PC用は横並び */
}

.news__container::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 607px;
    height: 2px;
    background-color: #DCE8D0;
    z-index: 3;
}

.news__container h3 {
    margin-right: 52px;
    font-size: 25px;
    font-weight: 700;
    line-height: 1.8;
    color: #8AB262;
}

.news__content {
    display: flex;
    align-items: center;
    gap: 20px;
}

.news__data {
    font-family: "Prompt", sans-serif;
    font-weight: 400;
    font-size: 25px;
    line-height: 1.8;
}

.news__content p {
    font-weight: 500;
    line-height: 1.8;
    font-size: 25px;
}

/* 楽しみかた */
.enjoy_img {
    margin-top: 32px;
    position: relative;
    z-index: 1;
    background: url('../image/enjoy.jpg') no-repeat center center;
    background-size: cover;
    max-width: 1920px;
    min-width: 766px;
    padding-bottom: 32px;
}

.enjoy__img-container {
    display: flex;
    justify-content: center;
    gap: 286px;
    padding: 185px 149px 0px 149px;
    color: white;
}

.enjoy__family,
.enjoy__solo {
    width: 100%;
    max-width: 420px;
}

.enjoy__family h3,
.enjoy__solo h3 {
    font-size: 45px;
    text-align: center;
    line-height: 1.8;
    font-weight: 700;
}

.enjoy__family h3 span,
.enjoy__solo h3 span {
    font-size: 36px;
    line-height: 1.8;
    font-weight: 700;
}

.point {
    font-size: 20px;
    margin-top: 51px;
    display: flex;
    align-items: center;
    margin-bottom: 26px;
}

.enjoy__number {
    font-family: "Prompt", sans-serif;
    font-size: 50px;
    font-weight: 500;
    border-right: 2px solid white;
    margin-right: 20px;
    line-height: 1.5;
    min-width: 45px;
}

/* 楽しみかたボタン */
.enjoy__button {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    margin: 32px auto 0;
    width: 272px;
    height: 56px;
    color: #fff;
    background-color: transparent;
    border: 2px solid #fff;
    border-radius: 35px;
    font-size: 18px;
    line-height: 1.8;
    transition: transform 0.2s ease;
}

/* ホバー時に縮小 */
.enjoy__button:hover {
    transform: scale(0.95);
}

/* クリック時にさらに軽く縮む */
.enjoy__button:active {
    transform: scale(0.92);
}

.enjoy__button-arrow {
    width: 12px;
    height: 12px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    transform: rotate(45deg);
}

/* キャンプサイト・料金 */
.campsite__container {
    margin-top: 160px;
    position: relative;
    background: url('../image/campsite_bg.png') no-repeat center bottom;
    background-size: cover;
    z-index: 10;
    min-height: 2749px;
}

.campsite__title {
    padding-top: 317px;
    text-align: center;
    font-size: 35px;
    line-height: 1.5;
    font-weight: 700;
}

.campsite__map {
    display: flex;
    justify-content: center;
    margin-top: 65px;
}

.campsite__type {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px 32px;
    max-width: 1080px;
    margin: 0 auto;
    padding: 60px 0 0 0;
}

.campsite__type-item {
    position: relative;
    overflow: visible;
}

.site__type-img {
    width: 100%;
    display: block;
    border-radius: 30px;
}

.ribbon {
    --r: 0.8em;
    /* カットアウトの大きさ */
    position: absolute;
    top: -12px;
    left: 0;
    font-size: 20px;
    font-weight: bold;
    color: #fff;

    border-block: 0 solid transparent;
    padding-block: 0.7em;
    padding-inline: 1.2em calc(var(--r) + 0.7em);
    line-height: 1.5;
    clip-path: polygon(100% 0,
            0 0,
            0 100%,
            100% 100%,
            100% calc(100% - 0.25em),
            calc(100% - var(--r)) 50%,
            100% 0.25em);
    background: #DA832C padding-box;
    width: fit-content;
    z-index: 3;
}

.campsite__button {
    margin-top: 110px;
    display: flex;
    justify-content: center;
}

.campsite__button-link {
    position: relative;
    display: inline-block;
}

.campsite__button-link:hover .campsite__button-img {
    filter: brightness(0.7);
}

.campsite__button-img {
    transition: filter 0.3s ease;
    width: 100%;
    height: 255px;
    object-fit: cover;
    display: block;
    border-radius: 20px;
}

.campsite__button-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    display: flex;
    align-items: center;
    gap: 20px;
}

.campsite__button-text {
    color: white;
    font-size: 35px;
    font-weight: 700;
    line-height: 1.8;
    padding: 10px 20px;
    border-radius: 8px;
}

.arrow-circle {
    width: 72px;
    height: 72px;
    border: 2px solid #fff;
    /* 枠線の太さと色 */
    background-color: transparent;
    /* 背景を透明に */
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.campsite__button-arrow {
    position: relative;
    left: -3px;
    width: 15px;
    height: 15px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    transform: rotate(45deg);
    transition: border-color 0.3s;
}

/* 施設案内 */
.facility__container {
    margin: -240px 0 0 0;
    position: relative;
    background: url('../image/facility__bg.png') no-repeat center bottom;
    background-size: cover;
    z-index: 8;
    min-height: 1950px;
}

.facility__title {
    padding-top: 317px;
    text-align: center;
    font-size: 35px;
    line-height: 1.5;
    font-weight: 700;
}

.facility__card-grid {
    display: grid;
    /* grid-template-columns: repeat(3, 1fr); */
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 60px;
    max-width: 1080px;
    margin: 80px auto 0;
}

.card {
    background-color: transparent;
    overflow: hidden;
    margin: 0 auto;
}

.card img {
    height: 180px;
    object-fit: cover;
    display: block;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}

.card__body {
    background-color: #fff;
    min-height: 164px;
    padding-left: 38px;
    padding-top: 16px;
    padding-right: 16px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    text-align: left;

    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
}

.card img,
.card__body {
    max-width: 320px;
}

.card__body h4 {
    margin: 0 0 8px 0;
    font-size: 20px;
    line-height: 1.5;
}

.card__body p {
    font-size: 16px;
    line-height: 1.6;
    font-weight: 500;
}

/* お客様の声 */
.voice__container {
    position: relative;
    background: url('../image/voice__bg.png') no-repeat center bottom;
    background-size: cover;
    margin-top: -350px;
    /* ← facility の背景にかぶせる */
    min-height: 1700px;
}

.voice__title {
    padding-top: 350px;
    text-align: center;
    font-size: 35px;
    line-height: 1.5;
    font-weight: 700;
}

.voice__card-container {
    margin: 80px auto 0;
    max-width: 930px;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.voice__item {
    display: flex;
    background-color: #fff;
    border-radius: 20px;
    overflow: hidden;
}

.voice__img {
    max-width: 320px;
    object-fit: cover;
    display: block;
}

.voice__text {
    padding: 45px 45px;
    box-sizing: border-box;
}

.voice__text h4 {
    font-size: 20px;
    font-weight: bold;
    line-height: 1.5;
    border-bottom: 1px solid rgba(51, 51, 51, 0.2);
    padding-bottom: 13px;
}

.voice__text p {
    margin-top: 13px;
    font-size: 16px;
    line-height: 2;
    font-weight: 500;
}

/* 周辺観光・アクセス */
.access__title {
    max-width: 1081px;
    padding-top: 100px;
    text-align: center;
    font-size: 35px;
    line-height: 1.5;
    font-weight: 700;
}

.onsen__wrapper {
    display: flex;
    align-items: flex-start;
    max-width: 1080px;
    margin: 0 auto;
    padding-top: 65px;
}

.onsen__wrapper img {
    width: 50%;
    height: auto;
    border-radius: 20px;
    display: block;
}

.access__text h4,
.onsen__text h4 {
    font-size: 23px;
    font-weight: 700;
    color: #8AB262;
    line-height: 1.8;
}

.onsen__text {
    max-width: 460px;
    margin-left: 73px;
}

.onsen__text p {
    line-height: 2;
    margin-top: 20px;
}

.access__text {
    max-width: 460px;
    word-break: keep-all;
}

.access__text p {
    margin-top: 30px;
    line-height: 2;
}

.map__wrapper {
    max-width: 1080px;
    display: flex;
    flex-direction: row-reverse;
    align-items: flex-start;
    gap: 120px;
    /* ← ここで画像とテキストの余白を確保 */
    margin: 0 auto;
    padding-top: 60px;
}

.map-box {
    width: 542px;
    max-width: 100%;
    margin: 0 auto;
    position: relative;
    aspect-ratio: 4 / 3;
}

.map-frame {
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 20px;
}

.map__address {
    display: block;
    margin-top: 20px;
    line-height: 1.4;
}

/* アコーディオン */
.button__box {
    display: flex;
    flex-direction: column;
}

.accordion__button {
    margin-top: 40px;
    padding: 20px 31px 20px 141px;
    /* 上 右 下 左 */
    border-radius: 6px;
    cursor: pointer;
    white-space: nowrap;
    border: 2px solid #8AB262;
    /* ← 枠線の色と太さ */
    background-color: transparent;
    /* 背景を透明に */
    font-size: 18px;
    line-height: 1.3;
}

.accordion__button::after {
    content: "＋";
    margin-left: 98px;
    color: #8AB262;
}

.accordion__content {
    display: none;
    padding: 20px 40px;
    border: 2px solid #8AB262;
    border-top: none;
    border-radius: 0 0 6px 6px;
    background-color: #fff;
    font-size: 18px;
    line-height: 1.7;
}

.accordion__content p {
    margin-top: 0;
}

/* 開いたときのボタン */
.accordion__button.open {
    background-color: #fff;
    border: 2px solid #8AB262;
    border-bottom: none;
    border-radius: 6px 6px 0 0;
}

/* ＋ → － に切り替え */
.accordion__button.open::after {
    content: "－";
}

/* Googleマップを見るボタン */
.access__button {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    margin: 110px auto 0;
    width: 302px;
    height: 56px;
    background: #fff;
    color: #8AB262;
    border-radius: 35px;
    font-size: 18px;
    border: 2px solid #8AB262;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* ホバー時：反転（緑背景に白文字） */
.access__button:hover {
    background-color: #8AB262;
    color: #fff;
    border-color: #8AB262;
}

/* ホバー時の矢印も白にする */
.access__button:hover .access__button-arrow {
    border-top-color: #fff;
    border-right-color: #fff;
}

/* 通常の矢印（緑） */
.access__button-arrow {
    width: 12px;
    height: 12px;
    border-top: 3px solid #8AB262;
    border-right: 3px solid #8AB262;
    transform: rotate(45deg);
    transition: border-color 0.3s ease;
}

/* mapアイコン共通 */
.map__icon {
    width: 16px;
    height: 22px;
    margin-right: -8px;
    vertical-align: middle;
    transition: filter 0.3s ease;
    position: relative;
    top: 5px;
}

/* mapアイコン切り替え用 */
.map__icon--white {
    display: none;
}

.access__button:hover .map__icon--green {
    display: none;
}

.access__button:hover .map__icon--white {
    display: inline;
}

/* アイコンの親：ズレ防止用 */
.map__icon-wrapper {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 22px;
    margin-right: 8px;
}

/* MVレスポンシブ */
/* スマホ用背景画像切り替え */
@media (max-width: 768px) {
    .mv {
        background-image: url('../image/sp_mv.jpg');
        min-height: 705px;
    }

    .mv__title {
        font-size: 30px;
        line-height: 1.5;
    }

    .mv p {
        font-size: 14px;
        /* 小さめに */
        line-height: 2;
    }
}

/* NEWSレスポンシブ */
@media (max-width: 768px) {
    .news__container {
        display: flex;
        flex-direction: column;
        align-items: center;
        /* 中央寄せ */
        padding: 20px;
        margin-top: 50px;
        position: relative;
        /* ::afterの位置基準になる */
    }

    .news__container::after {
        width: 41%;
    }

    .news__container h3 {
        font-size: 18px;
        margin-right: 0;
    }

    .news__content {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 12px;
        justify-content: center;
        /* 中央寄せ */
        width: 100%;
    }

    .news__data,
    .news__content p {
        font-size: 15px;
        margin-top: 0;
    }
}

/* aboutレスポンシブ */
@media (max-width: 768px) {
    .about__feature {
        display: flex;
        flex-direction: column;
        gap: 0px;
        margin-top: 60px;
        align-items: center;
        text-align: center;
    }

    .feature__circle {
        border: none;
        border-radius: 0;
        width: auto;
        height: auto;
        padding: 0;
        display: flex;
        flex-direction: row;
        align-items: center;
        text-align: left;
        gap: 30px;
        max-width: 320px;
    }

    .feature__circle p {
        font-size: 17px;
    }

    /* ▼ 個別調整 ▼ */

    .circle--bag {
        margin-left: -30px;
        gap: 20px;
    }

    .circle--tent {
        margin-left: 12px;
        gap: 25px;
    }

    .circle--tent p {
        margin-top: 6px;
    }

    .circle--onsen {
        margin-left: 10px;
        gap: 30px;
    }

    .about_main {
        margin-top: 100px;
        flex-direction: column;
        box-sizing: border-box;
        display: flex;
        margin-left: auto;
        margin-right: auto;
    }

    .about__image {
        margin: 0;
        padding: 0;
        line-height: 0;
        width: 100%;
    }

    .about__image img {
        height: 210px;
        width: auto;
        max-width: 100%;
        display: block;
    }

    .about__image.about__image--right {
        display: flex;
        justify-content: flex-end;
        margin-top: 65px;
    }

    .about__image.about__image--left {
        margin-right: auto;
    }

    .about__text h3 {
        margin-top: 65px;
        font-size: 18px;
        line-height: 1.6;
        text-align: center;
    }

    .about__text p {
        font-size: 15px;
    }

    .about__button {
        margin: 48px auto 0;
    }
}

/* 楽しみかたレスポンシブ */
@media (max-width: 950px) {
    .enjoy_img {
        margin-top: 35px;
        background-image: url('../image/enjoy_sp.jpg');
        min-width: auto;
    }

    .enjoy__img-container {
        flex-direction: column;
        gap: 80px;
        padding: 50px 60px 50px 60px;
    }

    .enjoy__family,
    .enjoy__solo {
        max-width: 100%;
        width: auto;
    }

    .enjoy__family h3,
    .enjoy__solo h3 {
        font-size: 35px;
        line-height: 1.8;
    }

    .enjoy__family h3 span,
    .enjoy__solo h3 span {
        font-size: 25px;
    }

    .point {
        font-size: 15px;
        line-height: 1.7;
        margin-top: 40px;
    }

    .enjoy__number {
        font-size: 30px;
        margin-right: 19px;
        min-width: 30px;
        border-right: 1.5px solid white;
    }

    .enjoy__button {
        width: 220px;
        height: 48px;
        font-size: 16px;
        margin-top: 24px;
        gap: 8px;
    }

    .enjoy__button-arrow {
        width: 10px;
        height: 10px;
        border-top: 2px solid #fff;
        border-right: 2px solid #fff;
    }
}

/* キャンプサイト・料金レスポンシブ */
@media (max-width: 768px) {
    .campsite__container {
        margin-top: 10px;
        min-height: 2200px;
        /* 高さは内容に合わせる */
    }

    .campsite__title {
        padding-top: 200px;
        font-size: 20px;
        line-height: 1.8;
    }

    .campsite__map {
        margin-top: 40px;
        padding: 0 5px;
    }

    .campsite__type {
        grid-template-columns: 1fr;
        gap: 40px 0;
        padding: 40px 0 0 0;
    }

    .ribbon {
        font-size: 16px;
        padding-block: 0.5em;
        padding-inline: 1em calc(var(--r) + 0.5em);
    }

    .campsite__button {
        margin-top: 40px;
    }

    .campsite__button-img {
        height: 180px;
    }

    .campsite__button-content {
        top: 30%;
        flex-direction: column;
        /* 縦並びから横並びに変える */
        gap: 3px;
        /* スペースを少し広げる */
        justify-content: center;
        align-items: center;
    }

    .campsite__button-text {
        font-size: 18px;
        line-height: 1.8;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        text-align: center;
    }

    .arrow-circle {
        width: 34px;
        height: 34px;
    }

    .campsite__button-arrow {
        left: -1%;
        width: 8px;
        height: 8px;
        border-top: 2px solid #fff;
        border-right: 2px solid #fff;
    }
}

/* 施設案内レスポンシブ */
@media (max-width: 768px) {
    .facility__container {
        min-height: 3350px;
        /* 高さを増やす */
    }

    .facility__card-grid {
        grid-template-columns: 1fr;
        gap: 50px;
        max-width: 90%;
        margin: 40px auto 0;
        padding: 0 10px;
    }

    .card img,
    .card__body {
        width: 274px;
        height: auto;
    }

    .card__body {
        padding-left: 20px;
        width: 274px;
        height: 147px;
    }

    .card__body h4 {
        font-size: 20px;
        line-height: 1.5;
        font-weight: 700;
    }

    .card__body p {
        font-size: 15px;
        line-height: 1.8;
    }
}

/* お客様の声レスポンシブ */
@media (max-width: 768px) {
    .voice__container {
        min-height: 2150px;
        padding: 35px 35px;
    }

    .voice__title {
        padding-top: 250px;
        font-size: 28px;
        line-height: 1.4;
    }

    .voice__card-container {
        max-width: 100%;
        margin: 40px auto 0;
        gap: 60px;
        padding: 0 10px;
    }

    .voice__item {
        flex-direction: column;
        border-radius: 20px;
        overflow: hidden;
    }

    .voice__img {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 20px 20px 0 0;
        box-sizing: border-box;
    }

    .voice__text {
        padding: 30px;
    }

    .voice__text h4 {
        font-size: 16px;
        line-height: 1.8;
        padding-bottom: 10px;
    }

    .voice__text p {
        font-size: 15px;
        line-height: 1.8;
    }
}

/* 周辺観光・施設案内レスポンシブ */
@media (max-width: 768px) {
    .access__title {
        padding-top: 50px;
        font-size: 28px;
    }

    .onsen__wrapper,
    .map__wrapper {
        max-width: 100%;
        flex-direction: column-reverse;
        align-items: center;
    }

    .map__wrapper {
        gap: 20px;
    }

    .onsen__wrapper img {
        margin-top: 40px;
        width: 100%;
        height: auto;
        margin-left: 0;
        max-width: 300px;
    }

    .map__wrapper img {
        margin-top: 20px;
        width: 100%;
        height: auto;
        margin-left: 0;
        max-width: 300px;
    }

    .map-box {
        max-width: 300px;
    }

    .onsen__text,
    .access__text {
        margin: 0 auto;
        max-width: 90%;
        text-align: center;
        word-break: normal;
        overflow-wrap: normal;
        white-space: normal;
    }

    .onsen__text p,
    .access__text p {
        font-size: 14.5px;
    }

    .access__text h4 {
        font-size: 20px;
    }

    .map__address {
        font-size: 13px;
        line-height: 1.4;
        text-align: center;
    }

    .accordion__button {
        padding: 20px 50px;
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        margin-top: 20px;
    }

    .accordion__button::after {
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        margin-left: 0;
    }

    .accordion__content {
        padding: 15px 20px;
    }

    /* googlemapのボタン */
    .access__button {
        margin-top: 40px;
        width: 299px;
        height: 58px;
        font-size: 18px;
    }

    .access__button-arrow {
        width: 10px;
        height: 10px;
        border-top: 2px solid #8AB262;
        border-right: 2px solid #8AB262;
    }
}