@charset "utf-8";
/* ----------------------------------- */
/* ------ 共有 ------ */
/* （まずは3ページ共有のcssから記述。TOPページ以外はこの共有CSSがほとんど） */
/* ----------------------------------- */
/* --▼ 設定的なものとパーツ ここから --- */
html{
    scroll-behavior: smooth;
    scroll-padding-top: 6vw;
}
body{
    width: 100%;
    margin: 0;
    padding: 0;
    color: #233331;
    font-family: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
    line-height: 1.8;
    letter-spacing: 0.3vw;
    text-align: center;
    /* ▼背景を敷くため。背景コンテナ .bg-container */
    position: relative;
    overflow: hidden;
    overflow-y: scroll;
}
h4{
    font-weight: normal;
}
a{
    width: 100%;
    height: 100%;
    color: var(--black);
    text-decoration: none;
    transition: background-color .3s ease-in-out, color .3s ease-in-out;
    display: flex;
    align-items: center;
    justify-content: center;
}
a:hover{
    cursor: pointer;
    color: #3e8f85;
    background: rgba(255,255,255,.5);
}
img{
    width: 100%;
    object-fit: cover;
}
/* ↓ボタン */
.type1{
    width: 100%;
    aspect-ratio: 272/50;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
}
/* 画像は通常配置 */
.type1 img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
/* a だけを上に重ねる */
.type1 a{
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: clamp(16px, 1.223vw, 20px);
    color: #fff;
    font-weight: 600;
    letter-spacing: .2vw;
    text-align: center;
    text-decoration: none;
    transition: background-color .3s ease-in-out, color .3s ease-in-out;
}
.type1 a:hover{
    color: #3e8f85;
    background: rgba(255,255,255,.5);
}
.btn-solo{
    width: max(276px,27.1%);
    margin: 3rem auto 5rem;
}
.midashi-solo{
    display: block;
    margin: 0 auto 3rem !important;
}
/* ▼ 改行位置、表示/非表示など */
.block-1024made,.block-599made{
    display: block;
}
.none-1024made,.none-599made,.br1024{
    display: none;
}
.block-1024de{height: 0; display: none;}
/* ▼ テキスト */
.common-h2{
    width: 100%;
    font-size: 2rem;
    letter-spacing: .2vw;
    line-height: 1.5;
    white-space: nowrap;
    margin: 0 auto;
}
.common-h3{
    width: 100%;
    font-size: clamp(18px, 3.34vw, 24px);
    letter-spacing: .2vw;
    line-height: 1.5;
    white-space: nowrap;
    margin: 0 auto;
}
.common-p{
    width: 100%;
    font-size: clamp(16px, 1.223vw, 20px);
    letter-spacing: 0.1vw;
    margin: 4rem 0 2.5rem;
}
.common-min-p{
    width: fit-content;
    font-size: clamp(12px, .952vw, 16px);
    letter-spacing: 0;
}
.common-border{
    width: 100%;
    height: 0;
    border-bottom: 1px solid #53beb2;
    margin: .5rem 0;
}
.box-l{
    width: min(1280px,90%);
    border-radius: 20px;
    margin: 0 auto;
    padding: 2.4rem 0 2rem;
}
.common-bt-l{
    width: 27.12%;
}

.common-item-others{
    width: 60.9%;
    margin: 0 auto 1rem;
    padding: 3vw 0 0;
    display: flex;
    justify-content: space-between;
}
/* 下地が透明のカードレイアウト */
.no-white{
    background: rgba(0,0,0,0) !important;
}
.common-item-others .no-white .common-h3{
    margin-top: 1vw;
}
.common-item-others .no-white .common-p{
    margin-top: clamp(66.625px, calc(32.96px + 3.282vw), 96px) !important;
}
/* -------------------------- */
.common-item-others .item{
    padding: 1.75vw 1.75vw 1vw;
}
.common-item-others .item .common-p{
    letter-spacing: .1vw;
}
.common-item-others .item .type1{
    margin: .5rem 0;
}
.common-item-others .item .type2{
    width: 100%;
    aspect-ratio: 272 / 50;
    border-radius: 20px;
    border: none;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
}
.common-item-others .item .type2 a{
    font-size: clamp(16px, 1.223vw, 20px);
    color: #fff;
    font-weight: 600;
    letter-spacing: .2vw;
    line-height: 1.5;
    font-weight: 600;
    text-decoration: none;
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    transition: background-color .3s ease-in-out, color .3s ease-in-out;
}
.common-item-others .item .type2 img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.center{
    margin: 0 auto;
    min-width: 268.8px;
}
.bottom-space{
    margin-bottom: 10rem;
}

.common-item-three{
    width: 66.4%;
    margin: 0 auto;
    padding: 3vw 0 0;
    display: flex;
    justify-content: space-between;
}
.common-item-three .item{
    width: 31.476%;
    border-radius: 20px;
    padding: 0;
    box-sizing: border-box;
    text-align: left;
}
.common-item-three .item p{
    height: 10rem;
}
.table-container{
    width: 65%;
    height: auto;
    margin: 0 auto;
    background: #fff;
    border-radius: 20px;
    box-sizing: border-box;
    padding: 1.5rem 0;
}

.site-wrap-top,
.site-wrap-stay,
.site-wrap-access,
.site-wrap-rental,
.site-wrap-form,
.site-wrap-formcomp{
    overflow: hidden;      /* はみ出した背景を隠す */
    overflow-y: auto;      /* site-wrap 内の縦スクロール */
}
/* 背景色と山並み画像。heightの高さで調整 */
.bg-container-top,
.bg-container-stay,
.bg-container-access,
.bg-container-rental,
.bg-container-form,
.bg-container-formcomp{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -10;
    overflow: hidden;
}
.yama-bg{
    width: 100%;
    aspect-ratio: 10/4;
    margin: -1px 0;
}
.yama-bg img{
    display: block;
    width: 100%;
    height: 100%;
}
/* スマホ横～タブレット縦 */
@media (max-width: 1024px){
    .none-1024made,.block-1024de,br.br1024{
        display: block;
    }
    .block-1024made{
        display: none;
    }
    .common-h2{
        font-size: 1.75rem;
    }
    .common-p{
        font-size: 16px;
        line-height: 1.7;
    }
    .common-min-p{
        font-size: 12px;
    }
    .container{ 
        width: 90%; 
    }
    .common-item-others{
        width: 80%;
        padding: 4vw 0 0;
    }
    .common-item-others .common-h3{
        font-size: 20px;
    }
    .common-item-others .item .common-p{
        height: clamp(136px, calc(309.89px - 16.98vw), 208px);
        margin: 2.5rem auto 0;
        letter-spacing: .05vw;
    }
    .common-item-others .item .type2{
        aspect-ratio: 336 / 96;
    }
    .common-item-others .item .type2 a{
        font-size: 16px;
        letter-spacing: 1.6px;
    }
    .pad-left{
        position: relative;
        left: clamp(-12px, calc(12vw - 84px), 0px);
        letter-spacing: .1vw;
    }
    .common-item-three{
        width: 72%;
        flex-wrap: wrap;
        justify-content: center;
        gap: 3vw;
        padding: 0;
    }
    .common-item-three .item{
        width: calc((100% - 3vw) / 2);
    }
    .common-item-three .item:nth-child(3){
        margin: 1rem auto 0;
    }
    .common-item-three .item p{
        height: clamp(96px, calc(-13.21vw + 231.25px), 152px);
        margin: 4.8vw auto 0;
    }
    .table-container{
        width: 80%;
    }
}
/* スマホ縦 */
@media (max-width: 599px){
    .block-599made{display: none !important;}
    .none-599made,.br.br1024{display: block !important;}
    .common-item-others{
        width: 100%;
        flex-direction: column;
    }
    .common-item-others .item{
        width: 90%;
        margin: 0 auto;
        padding: 1.5rem 1.5rem .75rem;
    }
    .common-item-others .common-h3{
        margin-top: 2.5vw;
    }
    .common-item-others .item .common-p{
        height: clamp(104px,calc(284.45px - 30.13vw),176px);
    }
    .pad-left{
        position: static;
        letter-spacing: .2vw;
    }
    .common-item-three{
        width: 90%;
    }
    .common-item-three .item .common-h3{
        margin-top: 3vw;
    }
    .common-item-three .item p {
        height: clamp(96px, calc(-13.21vw + 231.25px), 152px);
        margin: clamp(39.6px, calc(2.23vw + 31.58px), 44.93px) auto 0;
    }
    .common-item-three .item .override{
        line-height: 1.2;
        margin-top: 2vw;
    }
    .common-item-three .item .override-p{
        margin: clamp(46.08px, calc(2.773vw + 36.1px), 52.71px) auto 0;
    }
    .table-container{
        width: 90%;
    }
}
/* --- 設定的なものとパーツ ここまで--- */
/* ----------------------------------- */
/* ---▼ header（共有）ここから---- */
header{
    width: 100%;
    aspect-ratio: 1920/116;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 30;
}

/* Google 自動翻訳 */
#lang-switch{
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 96px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    letter-spacing: 0.08em;
    background: #fff;
    color: #000;
    border: none;
    line-height: 1;
    cursor: pointer;
    box-shadow: 3px 3px 6px rgba(0,0,0,0.15);
    transition: background-color .3s ease-in-out, color .3s ease-in-out;
}
#lang-switch:hover{
    color: #DCF6F7;
    background: rgba(255,255,255,.5);
}
.notranslate{
    translate: no;
}
/* Google翻訳UIは非表示 */
#google_translate_element{
    display: none !important;
}
/* ============================
    Google翻訳の表示物を全部消す
    （上の邪魔なバー含む）
============================ */
/* 翻訳時に勝手に入る余白/ズレ対策 */
html{
    margin-top: 0 !important;
}
body{
    top: 0 !important;
}
/* 上に出るGoogle翻訳バー（iframe） */
iframe.goog-te-banner-frame{
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    width: 0 !important;
    top: -9999px !important;
    left: -9999px !important;
}
/* 翻訳が入れるラッパーのズレ抑止 */
.skiptranslate{
    margin-top: 0 !important;
}
/* 吹き出し/ツールチップ */
#goog-gt-tt,
.goog-te-balloon-frame,
.goog-tooltip,
.goog-tooltip:hover{
    display: none !important;
}
/* 最近の翻訳UI系（環境によって出る） */
.VIpgJd-ZVi9od-ORHb-OEVmcd,
.VIpgJd-ZVi9od-aZ2wEe-wOHMyf{
    display: none !important;
}


.nav-pc{
    width: 100%;
    height: 100%;
    position: relative;
}
.nav-pc img{
    width: 100%;
    height: 100%;
}
.nav-pc ul{
    width: 42.9%;
    height: 100%;
    margin: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: absolute;
    top: 0;
    left: 28.55%;
    padding-left: 0;
}
.nav-pc ul li{
    height: 100%;
    color: #fff;
    list-style: none;
}
.nav-pc ul li a{
    height: 100%;
    font-size: clamp(16px,1.56vw,20px);
    padding: 0 .2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    transition: background-color .3s ease-in-out, color .3s ease-in-out;
}
.nav-pc ul li a:hover{
    color: #3e8f85;
    background: rgba(255,255,255,.5);
}

/* ▼ ハンバーガーボタン ▼ */
.nav-sp-toggle{
    display: none;
    position: fixed;
    top: 12px;
    right: 16px;
    width: 56px;
    height: 56px;
    background: #53BFB2;
    border: none;
    padding: 0;
    z-index: 40;
    cursor: pointer;
}
.nav-sp-toggle span{
    position: absolute;
    left: 50%;
    width: 60%;
    height: 2px;
    background: #fff;
    transition: transform .25s ease, opacity .25s ease;
    transform: translate(-50%, -50%);
}
.nav-sp-toggle span:nth-child(1){
    top: 50%;
    transform: translate(-50%, -50%) translateY(-8px);
}
.nav-sp-toggle span:nth-child(2){
    top: 50%;
}
.nav-sp-toggle span:nth-child(3){
    top: 50%;
    transform: translate(-50%, -50%) translateY(8px);
}
.nav-sp-toggle.is-open span:nth-child(1){
    transform: translate(-50%, -50%) rotate(45deg);
}
.nav-sp-toggle.is-open span:nth-child(2){
    opacity: 0;
}
.nav-sp-toggle.is-open span:nth-child(3){
    transform: translate(-50%, -50%) rotate(-45deg);
}

/* ▼ SPメニュー ▼ */
.nav-sp{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding-top: 60px;
    background: #53BFB2;
    z-index: 30;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .5s ease, visibility .5s ease;
}
.nav-sp.is-open{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
/* × ボタン（擬似要素なし） */
.nav-sp-close{
    position: absolute;
    top: 16px;
    right: 16px;
    width: 34px;
    height: 34px;
    background: none;
    border: none;
    padding: 0;
}
.nav-sp-close span{
    position: absolute;
    top: 50%;
    left: 50%;
    width: 28px;
    height: 2px;
    background: #fff;
}
.nav-sp-close span:nth-child(1){
    transform: translate(-50%, -50%) rotate(45deg);
}
.nav-sp-close span:nth-child(2){
    transform: translate(-50%, -50%) rotate(-45deg);
}
/* メニュー */
.nav-sp ul{
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.nav-sp ul li{
    width: 50%;
    margin: 1rem 0;
}
.nav-sp ul li a{
    font-size: 24px;
    color: #fff;
    line-height: 2;
    letter-spacing: .5em;
}
/* 下部リンク */
.nav-sp-weather{
    width: 100%;
    background: #DEF2F1;
    color: #53BFB2;
    font-size: 24px;
    letter-spacing: .15em;
    padding: 1.3rem 0;
    margin-top: 6vw;
}
/* ----header（共有）ここまで ---- */
/* ------------------------------- */
/* ---▼ main内（共有）ここから ----- */
.common-top{
    width: 100%;
    aspect-ratio: 1000/378;
    padding: 3rem 0 0;
    margin: 14vw auto 0;
}
.common-top p{
    width: 100%;
    margin: 8vw auto 6vw;
}
.common-top-inner{
    width: 60.9%;
    aspect-ratio: 609/50;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.common-top-inner .type1{
    width: 44.49%;
    white-space: nowrap;
}

.common-hgroup{
    width: 100%;
    aspect-ratio: 1000/162;
    padding: 3rem 0;
    margin: 0 auto;
}
.rogo-higashidate{
    width: 10.4%;
    min-width: 150px  ;
    aspect-ratio: 200/75;
    margin: 0 auto;
}
.rogo-higashidate img,
.rogo-koishiya img{
    width: 100%;
}
.rogo-koishiya{
    width: 10.4%;
    min-width: 150px;
    aspect-ratio: 200/59;
    margin: 0 auto;
}

.img-l{
    width: 100%;
}
.img-l-inner{
    width: 47%;
    aspect-ratio: 900/505;
    margin: 0 auto;
}
.img-l p{
    width: 43%;
    margin: 0 auto;
    text-align: justify;
    letter-spacing: 0.1vw;
    line-height: 1.7;
}
/* スマホ横～タブレット縦 */
@media (max-width: 1024px){
    .none-1024made,.block-1024de{
        display: block;
    }
    .block-1024made{
        display: none;
    }
    .common-top{
        margin: 14vw auto 10vw;
    }
    .container{ 
        width: 90%; 
    }

    /* main内（宿泊ページ順。その後、交通手段⇒レンタル）*/
    .common-top-inner{
        width: 80%;
    }
    .common-top-inner .type1{
        width: 45%;
    }
    .img-l-inner{
        width: 80%;
    }
    .img-l p {
        width: 74%;
        margin: .5rem auto 0;;
    }
}
/* スマホ縦 */
@media (max-width: 599px){
    .common-top p{
        width: 90%;
        margin: 14vw auto 10vw;
    }
    .common-top-inner{
        flex-direction: column;
    }
    .common-top-inner .type1 {
        width: 83.333%;
        margin: 0 auto .5rem;
    }
    .rogo-higashidate,
    .rogo-koishiya{
        min-width: 120px;
    }
    .common-top-inner{
        width: 90%;
    }
    .common-top-inner .type1{
        width: 84.56%;
    }
    .img-l-inner{
        width: 90%;
    }
    .img-l p {
        width: 84%;
    }
}
/* ----------------------------------- */
/* ------main内（共有）ここまで ------ */
/* ----------------------------------- */




/* ----------------------------------- */
/* ------index.html------ */
/* ----------------------------------- */
main{
    width: 100%;
    position: relative;
}
.site-title{
    width: 100%;
    aspect-ratio: 1920/1205;
    margin: 0 0 3vw 0;
    position: relative;
    text-indent: -9999px;
    overflow: hidden;
}
.main-bg-pc{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.main-bg-sp{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: none;
}
.main-bg-pc img,
.main-bg-sp img{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
}
.main-h2{
    font-size: 2.85vw;
    color: #0071bc;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-style: italic;
    letter-spacing: -0.17vw;
    line-height: 1.23;
    text-align: right;
    white-space: nowrap;
    margin: 0;
    position: absolute;
    top: 48.5vw;
    right: 17vw;
    z-index: 10;
}
.main-h2-span{
    font-size: .58em;
    letter-spacing: -0.08vw;
    font-style: normal;
}
.br1024,.br599,.h2br-2,.about-img-sp{
    height: 0;
    display: none;
}
/* ----------------------------------- */
/* --メインのフェード処理-- */
/* --jsで制御------------------------- */
.main-slide-pc{
    width: 100%;
    aspect-ratio: 1920/990;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    overflow: hidden;
}
.main-slide-sp{
    width: 100%;
    aspect-ratio: 720/1052;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    overflow: hidden;
    display: none;
}
.main-slide-pc img,
.main-slide-sp img{
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 1s ease-in-out;   /* フェード1秒 */
}
/* 不透明にて画像表示 */
.main-slide-pc img.is-active,
.main-slide-sp img.is-active{
    opacity: 1;
}
/* ----------------------------------- */

.about{
    width: 100%;
    aspect-ratio: 1000/326;
    position: relative;
}
.about-text{
    width: 34.4%;
    aspect-ratio: 344/326;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    position: relative;
    top: -.5rem;
    z-index: 0;
}
.about-text h2{
    width: 100%;
    font-size: 1.58rem;
    letter-spacing: .2vw;
    line-height: 1.5;
    white-space: nowrap;
    position: absolute;
    top: 3vw;
    left: 0;
    right: auto;
}
.about-text h3{
    width: 100%;
    font-size: 1.37vw;
    margin: 11vw 0 0 0;
    letter-spacing: 0.1vw;
}
.blue{
    height: 0;
    color: #0071bc;
    margin: 0;
}
.about-text p{
    width: 100%;
    font-size: 1.37vw;
    margin: 0;
    letter-spacing: 0.1vw;
}
.about-img{
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}
.about-img-inner{
    width: 100%;
    aspect-ratio: 1000/326;
    margin-bottom: 2rem;
    display: flex;
    justify-content: space-between;
}
.about-img-inner img{
    width: 32.8%;
    aspect-ratio: 678/672;
}
.resorts{
    width: 100%;
    height: clamp(2220px,calc(2220px + (100vw - 1025px) * 1256 / 895),3456px);
    position: relative;
}
.resorts h2{
    color: #000;
    position: absolute;
    top: -4.5rem;
    left: 0;
    z-index: 30;
}
.resorts-item-sp{display: none;}
.resorts-item{
    width: 65%;
    height: auto;
    position: absolute;
    top: 14.5vw;
    left: 17.5%;
    z-index: 20;
}
.item-top{
    width: 100%;
    background: #fff;
    border-radius: 20px;
    margin: 0 auto;
    padding: 2.5rem 0 1.5rem;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}
.item-top-l{
    width: 44.3%;
    height: auto;
    text-align: left;
}
.item-top-l h3{
    font-size: clamp(20px,1.631vw,24px);
}
.item-top-l p{
    font-size: clamp(16px,1.223vw,20px);
    letter-spacing: 0.1vw;
    margin: 3.8vw 0 2vw 0;
    text-align: justify;
}
.item-top-l h4{
    font-size: clamp(16px,1.223vw,20px);}
.item-top-l .border{
    width: 100%;
    border-bottom: 1px solid #53beb2;
    margin: 3vw 0 1vw;
}
.item-top-l ul{
    width: 100%;
    list-style: none;
    padding-left: 0;
    margin: 0 0 0 -0.3vw;
    display: flex;
    flex-wrap: wrap;
    
}
.item-top-l ul li{
    width: fit-content;
    font-size: clamp(12px,.952vw,16px);
    text-align: left;
    padding-right: .8rem;
    letter-spacing: 0;
}
.item-top-r{
    width: 41.8%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1vw;
}
.item-top-img{
    width: 100%;
    aspect-ratio: 549/387;
    border-radius: 20px;
    overflow: hidden;
}
.item-top-img img{
    width: 100%;
    height: 100%;
}

.item-others{
    width: 100%;
    margin: 0 auto;
    padding: 3vw 0 0;
    display: flex;
    justify-content: space-between;
}
.item{
    width: 48%;
    background: #fff;
    border-radius: 20px;
    padding: 1.75vw;
    box-sizing: border-box;
    text-align: left;
}
.item h3{
    width: 100%;
    font-size: clamp(18px,1.631vw,24px);
    text-align: center;
    margin-top: 1.5vw;
    letter-spacing: 0.14vw;
}
.item p{
    width: 92%;
    height: 11rem;
    font-size: clamp(16px,1.223vw,20px);
    letter-spacing: 0;
    line-height: 1.7;
    margin: 3.8vw auto 0;
    text-align: justify;
}
.item h4{
    font-size: clamp(16px,1.223vw,20px);
    padding-left: 1.5vw;
}
.item .border{
    width: 90%;
    border-bottom: 1px solid #53beb2;
    margin: 3vw auto 1vw;
}
.item ul{
    width: 100%;
    height: 4vw;
    list-style: none;
    padding-left: 0;
    margin: -.5rem 0 .8rem;
}
.item ul li{
    width: fit-content;
    font-size: clamp(12px,.952vw,16px);
    text-align: left;
    padding: 0 1rem 0 1rem;
    letter-spacing: 0;
}
.item-others .item :nth-child(7) {
    margin-bottom: .8rem;
}

.ticket{
    width: 100%;
    position: relative;
    margin-bottom: 15rem;
}
.ticket p:nth-of-type(2){
    width: 81%;
    margin: 3.5rem auto 2rem;
}
.top-box{
    width: 65%;
    background: #fff;
    padding-top: 2rem;
    margin-bottom: 1rem;
}
/* ---- 表 ---- */
.top-box-inner{
    width: 86%;
    margin: 4rem auto 2rem;
    display: flex;
    justify-content: center;
    align-items: self-start;
}
.price-table-l{
    width: 18%;
    flex-shrink: 0;
    margin: 0;
    border-collapse: collapse;
}
/* 大きい表だけ横スクロールさせるラッパー */
.price-table-scroll {
    width: 85%;
    overflow-x: auto;   /* 横方向にだけスクロールバー */
    overflow-y: hidden; /* 縦方向は隠す */
}
.price-table{
    width: 100%;
    min-width: 384px;
    margin: 0;
    border-collapse: collapse;
    flex-shrink: 0;
}
.price-table-r{
    overflow: hidden;
    overflow-x: auto;
}
.top-box-inner th,
.top-box-inner td{
    width: 960px;
    font-size: clamp(16px, 1.223vw, 20px);
    font-family: "Noto Sans JP", sans-serif;
    line-height: 42px;
    letter-spacing: 0.1rem;
    white-space: nowrap;
    text-align: right;
    padding-right: 1.6rem;
}
.top-box-inner thead th{
    background-color: #d8f1f0; /* ヘッダーの水色 */
    text-align: center;
    padding-right: 0;
}
.top-box-inner .price-table thead th{
  padding:1px 0;
}

th span{
    color: #d8f1f0; /* セル維持のため字を入れ見えなく */
    line-height: 1;
    font-size: 12px;
}
.top-box-inner tr{
    border-bottom: 2px solid #7cd0ce; /* 行ごとのライン色 */
}
/* 1行目（1日券）の上の線を消す */
/* デフォルトの線は tbody の tr だけに適用する */
.top-box-inner tbody tr{
    border-bottom: 2px solid #7cd0ce;
}
/* thead の tr には線を付けない */
.top-box-inner thead tr {
    border-bottom: none;
}
/* 最終行（10日券）の下の線を消す */
.price-table-l tbody tr:last-child,
.price-table tbody tr:last-child {
    border-bottom: none;
}
.price-table td span.unit{
    padding-left: 4px;
}
.ticket .top-box .common-min-p{
    width: 82%;
    margin: 0 auto;
    text-align: left;
}
.bottom-box{
    width: 65%;
    padding-top: 1.5rem;
    margin: 0 auto 2rem;
    display: flex;
    justify-content: space-between;
}
.bottom-text{
    width: 48%;
    text-align: left;
}
.bottom-text .common-p{
    margin: 0;
    line-height: 16px;
    text-align: left;
    padding-left: .7rem;
}
.bottom-text ul{
    width: 100%;
    height: fit-content;
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    margin: 0 0 12px;
}
.bottom-text ul li{
    width: 89%;
    font-size: clamp(12px, .952vw, 16px);
    letter-spacing: 0;
    text-align: left;
    padding: 0 0 0 1.5rem;
    text-indent: -.8rem;  
    margin-bottom: .8rem;
}
/* ▼ 2行と3行のボタン */
.ticket .type2{
    width: 50%;
    aspect-ratio: 272/50;
    margin: 0 auto;
    border-radius: 20px;
    border: none;
    overflow: hidden;
    position: relative;
}
/* 画像は通常配置（壊れない） */
.ticket .type2 img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
/* a だけを全面に重ねる */
.ticket .type2 a{
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: clamp(20px, 1.631vw, 24px);
    color: #fff;
    font-weight: 600;
    text-align: center;
    letter-spacing: .2vw;
    line-height: 1.5;
    text-decoration: none;
    transition: background-color .3s ease-in-out, color .3s ease-in-out;
}
.ticket .type2 a:hover{
    cursor: pointer;
    color: #3e8f85;
    background: rgba(255,255,255,.5);
}
.top .solo-a{
    width: fit-content;
    text-decoration: underline;
    margin: 0 auto;
    position: relative;
    top: 1rem;
}
.top .solo-a a{
    color: #233331;
    width: fit-content;
    text-decoration: underline;
    font-weight: bold;
}
.min-p-solo{
    font-size: 12px;
    margin: 1.5rem auto 4rem;
}

/* ---▼「おすすめの宿泊施設」---- */
.facility .common-h2{
    margin-bottom: 3.5rem;
}
.facility .item-others{
    width: 65%;
    margin: 0 auto 9rem;
    padding: 0;
    display: flex;
    justify-content: space-between;
}
.facility .item {
    padding: 1.5vw 1.5vw .9vw;
}
.facility h3{
    width: 100%;
    font-size: clamp(18px, 1.631vw, 24px);
    text-align: center;
    margin-top: 2vw;
    letter-spacing: 0.14vw;
}
.item-others p{
    width: 92%;
    height: 12rem;
    margin: clamp(56px, calc(46.82px + 0.895vw), 64px) auto 0;
}
.facility .override{
    width: 100%;
    font-size: clamp(18px, 1.631vw, 24px);
    text-align: center;
    margin-top: 1vw;
    letter-spacing: 0.14vw;
    line-height: 1.5;
    white-space: nowrap;
}
.facility .override-p{
    margin: clamp(64px, calc(36.51px + 2.682vw), 88px) auto 0;
}

.facility .item .type1{
    margin-bottom: .6rem;
}

/* ---▼「交通手段」---- */
.sec-access{
    width: 100%;
    margin-bottom: 7rem;
}
.sec-access p{
    width: 81%;
    margin: 4rem auto 2.5rem;
}
.sec-access-img{
    width: 65%;
    margin: 0 auto;
}
.sec-access-inner{
    width: 100%;
    max-height: 100px;
    margin: 3rem auto 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6vw;
}
/* ▼ 2つのボタン */
.sec-access-inner .type1{
    width: 28.2%;
    aspect-ratio: 272 / 50;
    margin: 0;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    display: flex;
    align-items: center;
}

footer{
    width: 100%;
    aspect-ratio: 192/45;
    font-size: clamp(14px,1.02vw,16px);
    color: #fff;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}
.footer-inner-pc p:nth-of-type(1){
    margin: 0 0 2rem;
}
.footer-inner-pc p:nth-of-type(2) a{
    width: auto;
    height: auto;
    display: inline-flex;
    align-items: baseline;
    justify-content: flex-start;
}
.footer-inner-sp{
    display: none;
}
footer img{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

/* 背景色と山並み画像。heightの高さで調整 */
.bg-container-top .bg-white{
    width: 100%;
    height: clamp(1016.94px,99vw,1968px);
    background: #fff;
}
.bg-container-top .bg-yama1{
    width: 100%;
    height: 23.9%;
    background: #DCF6F7;
}
.bg-container-top .bg-yama2{
    background: #B7E5E5;
    width: 100%;
    height: clamp(1392px, calc(-10.726vw + 1597.94px), 1488px);
}
.bg-container-top .bg-yama3{
    width: 100%;
    height: 118rem;
    background: #9bd1cf;
}

/* スマホ横～タブレット縦 */
@media (max-width: 1024px){
    .about-img,
    .resorts-item{display: none;}
    header{
        aspect-ratio: auto !important;
        height: 60px;
    }
    .nav-pc ul{
        width: 68%;
        left: 16%;
    }
    .nav-pc ul li a{
        line-height: 40px;
    }
    .site-title{
        margin: 0 0 8vw 0;
    }
    .main-h2{
        font-size: clamp(26.5px, 1.75vw, 29.22px);
        letter-spacing: -0.1vw;
        line-height: 1.23;
        top: 49.5vw;
        right: 5vw;
        z-index: 10;
    }
    .main-h2-span{
        font-size: 16px;
        letter-spacing: -0.08vw;
    }
    .h2br-2{
        display: block;
        margin-top: -1vw;
    }
    .about{
        margin-bottom: 3rem;
    }
    .about-text{
        width: 100%;
        aspect-ratio: auto;
    }
    .about-text h2{
        font-size: 24px;
        top: 0;
    }
    .about-text h3{
        font-size: clamp(14px,4vw,18px);
        margin: 6.4rem 0 2rem 0;
        line-height: 1.8;
    }
    .about-text p{
        font-size: clamp(14px,4vw,18px);
        margin: 0 0 2.5rem 0;
    }
    .about-img-sp{
        display: block;
        width: 100%;
        aspect-ratio: 1000/1006;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    .about-img-sp-inner{
        width: 100%;
        aspect-ratio: 1000/467;
        display: flex;
        justify-content: space-between;
    }
    .about-img-sp-inner img{
        width: 47.2%;
        aspect-ratio: 472/467;
    }
    .resorts{
        width: 100%;
        height: clamp(1380px,calc(145.47vw + 507.19px),1996.8px);
        position: relative;
        z-index: 0;
    }
    .resorts-bgcolor{
        height: 200rem;
        top: 201rem;
    }
    .resorts h2{
        letter-spacing: .2vw;
        top: 63vw;
    }
    .resorts-item{
        width: 65%;
        height: auto;
        position: absolute;
        top: 64.5vw;
        left: 17.5%;
    }

    /* ▼ SP用エリアカード（スライダー） */
    .resorts-item-sp{
        display: block;
        width: 80%;
        position: absolute;
        top: calc(65.09vw + 101.43px);
        left: 10%;
    }
    .resorts-item-sp .sp-track{
        position: relative;
        overflow: hidden;
    }
    .resorts-item-sp .item{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        opacity: 0;
        transform: translateX(100%); /* 初期：右外 */
        pointer-events: none;
        transition: 
            transform .75s cubic-bezier(.22,.61,.36,1),
            opacity  .55s ease;
    }
    /* 表示中カード */
    .resorts-item-sp .item.is-active{
        position: relative;
        opacity: 1;
        transform: translateX(0);
        pointer-events: auto;
        padding: 1.5rem 1.5rem .5rem;
    }

    .resorts-item-sp .item .item-sp-img{
        width: 100%;
        aspect-ratio: 549 / 387;
        line-height: 0;
    }
    .resorts-item-sp .item .item-sp-img img{
        width: 100%;
        height: 100%;
    }
    .resorts-item-sp .item h3{
        width: 100%;
        font-size: 20px;
        text-align: center;
    }
    .resorts-item-sp .item p{
        width: 98%;
        height: fit-content;
        /* font-size: 14px; */
        letter-spacing: 0.1vw;
        line-height: 1.7;
        margin: 36px auto 8px;
        text-align: justify;
    }
    .resorts-item-sp .item h4{
        font-size: 16px;
        padding-left: .2rem;
    }
    .resorts-item-sp .item .border{
        width: 98%;
        border-bottom: 1px solid #53beb2;
        margin: 30px auto 12px;
    }
    .resorts-item-sp .item ul{
        width: 100%;
        height: fit-content;
        list-style: none;
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        margin: 0 0 12px;
    }
    .resorts-item-sp .item ul li{
        width: fit-content;
        font-size: 12px;
        text-align: left;
        padding: 0 .8rem 0 0;
        letter-spacing: 0;
    }
    .resorts-item-sp .item .type1{
        width: 60%;
        margin: 0 auto .5rem;
    }
    .item div:nth-of-type(3){
        margin-bottom: .75rem !important;
    }
    .item .type1 a{
        font-size: 16px;
        font-weight: 600;
        letter-spacing: 1.6px;
        line-height: 0;
    }
    /* ▼ 矢印ボタン */
    .resorts-nav-sp{
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 40;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
    }
    /* 矢印本体 */
    .resorts-nav-sp::before{
        content: "";
        width: 28px;
        height: 28px;
        border-top: 4px solid #0071BC;
        border-right: 4px solid #0071BC;
        display: block;
    }
    /* 左矢印（＜） */
    .resorts-nav-sp.prev{left: -1rem;}
    .resorts-nav-sp.prev::before{transform: rotate(-135deg);}
    /* 右矢印（＞） */
    .resorts-nav-sp.next{right: -1rem;}
    .resorts-nav-sp.next::before{transform: rotate(45deg);}

　　.resorts-item-sp .type1-override{
        width: 50%;
        aspect-ratio: 336/96;
        border-radius: 20px;
        overflow: hidden;
    }
    .resorts-item-sp .type1-override a{
        font-size:  16px;
        line-height: 1.6;
    }
    .resorts-item-sp .type1-override img{
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 0;
    }
    .bottom-box{
        width: 77%;
        flex-direction: column;
        justify-content: center;
        margin: 0 auto 1rem;
    }
    .bottom-text{
        width:100%;
        margin-bottom: 1rem;
    }
    .top-box{
        width: 80%;
        padding-top: 1rem;
    }
    .top-box-inner{
        width: 90%;
        margin: 2.4rem auto 2rem;
    }
    .top-box-inner th,.top-box-inner td{
        font-size: 14px;
        line-height: 36px;
    }
    .ticket{
        margin-bottom: clamp(152px, 30.13vw + 43.5px, 224px);
    }
    .ticket .commo-h2{
        margin-bottom: 3.5rem;
    }
    /* ▼ ボタン「その他のリフト券・詳細はこちら」 */
    .ticket .type2{
        width: 50%;
        aspect-ratio: 336/96;
        border-radius: 20px;
        overflow: hidden;
    }
    .ticket .type2 a{
        font-size:  16px;
        line-height: 1.6;
    }
    .ticket .type2 img{
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 0;
    }
    /* ---▼「おすすめの宿泊施設」---- */
    .facility .item-others{
        width: 80%;
        margin: 0 auto;
        flex-direction: column;
        justify-content: center;
    }
    .facility .item{
        width: 100%;
        margin-bottom: 2.5rem;
        padding: 1.5rem;
    }
    .facility .override{
        font-size: 20px;
        letter-spacing: 0.1vw;
        line-height: 1.5;
        margin: 2.5vw auto 0;
    }
    .facility .item-others p{
        width: 93%;
        height: 8.5rem;
        margin: 4.4rem auto 0;
    }
    .facility .item .type1{
        width: 69.45%;
        aspect-ratio: 272 / 50;
        border: none;
        margin: 0 auto .75rem;
        position: relative;
    }
    .facility h3{
        font-size: 20px;
        margin-top: 2vw;
    }
    .facility .item-others .item:nth-of-type(2){
        margin-bottom: 3.5rem;
    }
    .facility .item-others .item:nth-of-type(2) p{
        height: 7.5rem;
        margin: 3rem auto 0;
    }
    .facility .item-others .item .type1:nth-of-type(4){
        aspect-ratio: 336/96;
        margin: 0 auto .75rem;
    }
    .facility .item-others .item .type1:nth-of-type(5){
        aspect-ratio: 336/96;
        margin: 0 auto;
    }
    .facility .item-others .item .type1:nth-of-type(4) a,
    .facility .item-others .item .type1:nth-of-type(5) a{
        line-height: 1.5;
    }

    /* 交通手段 */
    .sec-access{
        margin-bottom: 6rem;
    }
    .sec-access p{
        width: 81%;
        margin: 3.5rem auto 2rem;
    }
    .sec-access-img{
        width: 80%;
    }
    .sec-access-inner{
        flex-direction: column;
        max-height: none;
        margin: 1.5rem auto 0;
        gap: 4vw;
    }
    /* ▼ 2つのボタン */
    .sec-access-inner .type1{
        width: 50%;
        aspect-ratio: 336/96;
        border-radius: 20px;
        line-height: 1.5;
    }

    footer{
        font-size: 14px;
        aspect-ratio: 192 / 90;
    }

    /* 背景色と山並み画像。heightの高さで調整 */
    .bg-container-top .bg-white{
        height: clamp(1170.71px, calc(1170.71px + (1682.31px - 1170.71px) * ((100vw - 600px) / (1024px - 600px))), 1682.31px);
    }
    .bg-container-top .bg-yama1{
        height: clamp(788.8px, calc(788.8px + (932.8px - 788.8px) * ((100vw - 600px) / (1024px - 600px))), 932.8px);
    }
    .bg-container-top .bg-yama2{
        height: clamp(1728px, calc(-26.42vw + 1998.5px), 1840px);
    }
    .bg-container-top .bg-yama3{
        height: 225rem;
    }
}

/* スマホ縦 */
@media (max-width: 599px){
    /* SP時のヘッダー色（背景は透明） */
    header{
        height: 60px;
        background: transparent;
    }
    .site-title{
        aspect-ratio: 1440/2520;
        margin: 0 0 10vw 0;
    }
    .nav-pc,
    .main-bg-pc,
    .main-slide-pc,
    .footer-inner-pc{
        display: none;
    }
    .nav-sp-toggle,
    .main-bg-sp,
    .main-slide-sp,
    .br599,
    .footer-inner-sp{
        display: block;
    }
    .main-h2{
        font-size: clamp(26.5px, 6.36vw, 24px);
        top: 141vw;
        right: 4vw;
    }
    .main-h2-span{
        font-size: 18px;
        letter-spacing: .4vw;
        line-height: 0;
        margin: -1%;
    }
    .about-text h2{
        font-size: 5.91vw;
        line-height: 1.5;
        letter-spacing: 0;
    }
    .about-text h3{
        font-size: clamp(14px,4vw,18px);
        margin: 26vw 0 9vw 0;
    }
    .about-text p{
        font-size: clamp(14px,4vw,18px);
    }
    .about-img-sp{
        top: 117vw;
    }

    .resorts{
        height: clamp(1200px, 140.59vw + 693.9px, 1536px);
    }
    .resorts-item-sp{
        top: clamp(336px, 91.05vw + 8.2px, 553.6px);
    }
    .resorts-bgcolor{
        height: 10vw;
        top: 82vw;
    }
    .resorts-item-sp .item .type1{
        width: 100%;
    }
    .resorts-item-sp .type1-override a{
        font-size:  14px;
    }
    .top-box{
        width: 90%;
        padding-top: 3rem;
    }
    .top-box .common-min-p{
        width: 85%;
    }
    .bottom-box{
        width: 90%;
        margin: 0 auto;
    }

    /* ▼ ボタン「その他のリフト券・詳細はこちら」 */
    .ticket .type1{
        width: 81%;
        aspect-ratio: 272 / 60;
        border-radius: 20px;
    }
    .ticket .type1 img {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: -10;
    }
    .ticket .type1 a{
        font-size: 4.95vw;
        line-height: 1.4;
    }
    .ticket .type2{
        width: 76.36%;
    }
    .top .solo-a a{
        letter-spacing: 0.5px;
    }

    /* ---▼「おすすめの宿泊施設」---- */
    .facility .item {
        margin-bottom: 2.5rem;
        padding: 1.5rem 1.5rem .75rem;
    }
    .facility .override{
        font-size: 20px;
        letter-spacing: 0.1rem;
        line-height: 1.6;
        margin: 1rem auto 76px;
    }
    .facility .item-others{
        width: 90%;
    }
    .facility .item-others p{
        width: 96%;
        height: 12rem;
        line-height: 1.8;
        letter-spacing: 0.1rem;
        margin: 2.8rem auto 0;
    }
    .facility .item-others .item:nth-of-type(2) p{
        height: 10.5rem;
    }
    .facility .item .type1{
        width: 99.6%;
        margin: 0 auto .5rem !important;
    }

    .sec-access-img{
        width: 90%;
    }
    .sec-access p{
        margin: 3rem auto 1.5rem;
    }
    .sec-access-inner .type1{
        width: 76.36%;
        aspect-ratio: 336 / 96;
        border-radius: 20px;
        overflow: hidden;
    }

    footer{
        font-size: 12.8px;
        aspect-ratio: 60 / 45;
    }
    .footer-inner-sp p:nth-of-type(1){
        margin: 0 0 2.5rem;
    }
    .footer-inner-sp p:nth-of-type(2){
        margin: 0;
    }
    .footer-inner-sp p:nth-of-type(2) a:last-of-type{
        position: relative;
        top: -0.5rem;
    }

    /* 背景色と山並み画像。heightの高さで調整 */
    .bg-container-top .bg-white{
        height: clamp(1296px, 301.26vw + 211.5px, 2016px);
    }
    .bg-container-top .bg-yama1{
        height: clamp(848px, 33.47vw + 727.5px, 928px);
    }
    .bg-container-top .bg-yama2{
        height: clamp(1920px, calc(-60.25vw + 2281px), 2064px);
    }
}
/* ----------------------------------- */
/* ------index.html ここまで ------ */
/* ----------------------------------- */




/* ----------------------------------- */
/* ----stay.html---- */
/* ----------------------------------- */
.common-hgroup-override{
    width: 100%;
    aspect-ratio: 1000/282;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.common-hgroup-override .common-h2{
    margin: 4rem auto 0;
}
.common-hgroup-override .common-p{
    width: 100%;
    font-size: clamp(16px, 1.223vw, 20px);
    letter-spacing: 0.1vw;
    margin: 1rem auto 5rem;
}
.common-hgroup-override .blue{
    height: auto;
}
.common-hgroup-override .common-h3{
    margin: .5rem auto 3rem;
}

/* 背景色と山並み画像。heightの高さで調整 */
.bg-container-stay .bg-white{
    width: 100%;
    height: 2%;
    background: #fff;
}
.bg-container-stay .bg-yama1{
    width: 100%;
    height: 28%;
    background: #DCF6F7;
}
.bg-container-stay .bg-yama2{
    background: #B7E5E5;
    width: 100%;
    height: 23%;
}
.bg-container-stay .bg-yama3{
    width: 100%;
    height: 20%;
    background: #9bd1cf;
}
@media (max-width: 1024px){
    /* 背景色と山並み画像。heightの高さで調整 */
    .bg-container-stay .bg-white{height: 1.5%;}
    .bg-container-stay .bg-yama1{height: 32%;}
    .bg-container-stay .bg-yama2{height: 28%;}
    .bg-container-stay .bg-yama3{height: 20%;}
}
/* スマホ縦 */
@media (max-width: 599px){
    .stay .common-item-others .item {
        width: 90%;
        margin: 0 auto 1.5rem;
        padding: 1.5rem 1.5rem .75rem;
    }
        /* 背景色と山並み画像。heightの高さで調整 */
    .bg-container-stay .bg-white{height: .5%;}
    .bg-container-stay .bg-yama1{height: 44.5%;}
    .bg-container-stay .bg-yama2{height: 27%;}
    .bg-container-stay .bg-yama3{height: 19%;}
}
/* ----------------------------------- */
/* ------stay.html ここまで ------ */
/* ----------------------------------- */




/* ----------------------------------- */
/* ----access.html---- */
/* ----------------------------------- */
.override-top-space{
    aspect-ratio: auto;
}
.override-top{
    margin-top: 1rem !important;
}
.access .common-item-three{
    margin: 0 auto 7rem;
}
.access .btn-solo{
    margin: 0 auto;
}
.access .solo-2{
    margin: 2rem auto 3rem;
}
.access .p-solo{
    line-height: 2.4;
}
.access .p-solo-sp,
.access .p-solo-sp-2{
    display: none;
}
.hgroup-override{
    margin: 6rem 0 0;
    padding: 0;
    aspect-ratio: auto;
}
/* カードレイアウト「大きな荷重もおまかせ」の見出し調整 */
.override-h3{
    position: relative;
    top: 1rem;
}

.access .table-container .common-h3{
    margin: 0 0 6rem;
}
.access .table-container .top-box-inner{
    width: min(71%,689px);
    margin: 0 auto 2rem;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}
.access .top-box-inner th, .top-box-inner td {
    padding-right: 0;
    text-align: center;
}
.access .table-container .price-table-l{
    flex-shrink: none;
    flex: 0 0 26%;
}
.access .table-container .price-table{
    flex: 1 1 37%;
    min-width: 0; /* flexで縮めるため必要 */
}
.info-container{
    width: 65%;
    margin: 0 auto 2rem;
    display: flex;
    justify-content: space-between;
}
.info-box{
    width: 48%;
    margin: 0;
}
.access .bottom-box{
    width: 100%;
    display: block;
}
.access .bottom-text{
    width: 100%;
    text-align: left;
    margin-bottom: 1rem;
}
.access .bottom-text p{
    margin: -.7rem 0rem .8rem 1rem;
}
.access .table-container .common-min-p{
    width: 67%;
    margin: 0 auto;
    text-align: left;
    text-indent: -.8rem;
    padding-left: .8rem;
}
.access .table-container .top-box-inner td{
    height: 2.5rem;
}
.td-override{
    height: 3.2rem;
    line-height: 1.2 !important;
}
.access .top-box-inner tbody tr{
    border-bottom: 2px solid #7cd0ce;
    height: 3.6rem;
}
.access .top-box-inner th,
.access .top-box-inner td{
    height: 3.6rem;
    vertical-align: middle;
}
.td-override{
    line-height: 1.2 !important;
}
.border-container{
    width: 65%;
    margin: 2rem auto .75rem;
    border: 1px solid #000;
    text-align: left;
    padding: 1.5rem 0;
    box-sizing: border-box;
}
.border-container p{
    display: block;
    width: fit-content;
    margin: 0 auto 1rem;
    font-size: clamp(12px, .952vw, 16px);
    letter-spacing: 0.1vw;
}
.override-margin{
    margin: 4rem auto !important;
}
.override-margin-2{
    margin: 0 auto 2rem !important;
}
.override-margin-3{
    margin: 0 auto 6rem !important;
}
.contact-kari{
    width: 100%;
    padding: .5rem 0;
    box-sizing: border-box;
}
.contact-kari ol{
    width: 66%;
    margin: 0 auto;
}
.contact-kari ol li{
    width: fit-content;
    font-size: clamp(12px, .952vw, 16px);
}

/* 背景色と山並み画像。heightの高さで調整 */
.bg-container-access .bg-white{
    width: 100%;
    height: 1.2%;
    background: #fff;
}
.bg-container-access .bg-yama1{
    width: 100%;
    height: 28%;
    background: #DCF6F7;
}
.bg-container-access .bg-yama2{
    background: #B7E5E5;
    width: 100%;
    height: 18%;
}
.bg-container-access .bg-yama3{
    width: 100%;
    height: 35%;
    background: #9bd1cf;
}
/* スマホ横～タブレット縦 */
@media (max-width: 1024px){
    .access .img-l-inner {
        margin-top: 3rem;
    }
    .access .p-solo{
        display: none;
    }
    .access .p-solo-sp{
        display: block;
        width: 80%;
        margin: 0 auto;
        text-align: left;
        text-align: justify;
    }
    .access .p-solo-sp-2{
        display: block;
        width: 80%;
        margin: 0 auto;
        text-align: left;
        text-align: justify;
    }
    .access .table-container .top-box-inner,
    .info-container,
    .border-container{
        width: 80%;
    }
    .access .table-container .common-min-p{
        width: 76%;
    }
    .contact-kari ol{
        width: 78%;
        padding-left: 0;
    }

    /* 背景色と山並み画像。heightの高さで調整 */
    .bg-container-access .bg-yama1{height: 32.5%;}
    .bg-container-access .bg-yama2{height: 20.5%;}
    .bg-container-access .bg-yama3{height: 35%;}
}
/* スマホ縦 */
@media (max-width: 599px){
    .access .override-599{
        flex-direction: column;
    }
    .access .override-599 .item{
        width: 80%;
        margin: 0 auto 5rem;
    }
    .access .override-599 .item p{
        height: 8rem;
    }
    .access .img-l-inner {
        margin-top: 2rem;
    }
    .access .hgroup-override {
        margin: 6rem 0 0;
        padding: 0;
    }
    .access .table-container .common-h3 {
        margin: 0 0 5rem;
    }
    .access .table-container .top-box-inner{
        width: 90%;
    }
    .info-container{
        width: 90%;
        flex-direction: column;
        margin: 0 auto 3rem;
    }
    .info-box{
        width: 90%;
        margin: 0 auto -1.5rem;
    }
    .access .table-container .common-min-p{
        width: 86%;
    }
    .border-container{
        width: 86%;
        margin: 2rem auto .5rem;
        padding: 1rem 1rem;
    }
    .access .table-container .top-box-inner td{
        letter-spacing: 1.5px;
    }
    .contact-kari ol{
        width: 80%;
    }

    /* ---▼「送迎料金」の表、横スクロール出現---- */
    /* 3列ヘッダーを持つ price-table を含む table-container だけ */
    .access .table-container:has(.price-table thead th:nth-child(3)) .top-box-inner{
        width: 90%;
        display: flex;
        align-items: flex-start;
        overflow: visible;
    }
    /* 左は固定 */
    .access .table-container:has(.price-table thead th:nth-child(3)) .price-table-l{
        flex: 0 0 120px;
        width: 120px;
    }
    /* 右だけ横スクロール */
    .access .table-container:has(.price-table thead th:nth-child(3)) .price-table-scroll{
        flex: 1 1 auto;
        overflow-x: auto;
    }
    /* 599pxから列幅固定（3列×100px） */
    .access .table-container:has(.price-table thead th:nth-child(3)) .price-table{
        table-layout: fixed;
        width: 300px;
        min-width: 300px;
    }
    .access .table-container:has(.price-table thead th:nth-child(3)) .price-table th,
    .access .table-container:has(.price-table thead th:nth-child(3)) .price-table td{
        width: 100px;
        white-space: nowrap;
    }

    /* 背景色と山並み画像。heightの高さで調整 */
    .bg-container-access .bg-yama1{height: 32%;}
    .bg-container-access .bg-yama2{height: 23%;}
    .bg-container-access .bg-yama3{height: 39%;}
}
/* ----------------------------------- */
/* ------access.html ここまで ------ */
/* ----------------------------------- */




/* ----------------------------------- */
/* ----rental.html---- */
/* ----------------------------------- */
.rental .h2-solo{
    margin:  0 0 4rem;
}
.rental .common-item-three{
    margin: 0 auto 7rem;
}
.rental .common-item-three .item{
    padding: 1rem;
}
.override-margin-4{
    position: relative;
    top: -0.5rem;
    line-height: 1.2;
}
.rental .common-item-three .common-p{
    height: clamp(calc(192px + 2.5rem), calc(-4.47vw + 277.8px + 2.5rem), calc(232px + 2.5rem));
}
.rental .btn-solo{
    margin: 3rem auto 10rem;
}
.rental .common-item-others .item{
    height: clamp(600px, calc(22.35vw + 371.45px), 800px);
}
.rental .common-item-others .override-height{
    height: clamp(456px, calc(27.7vw + 171.2px), 704px);
}
.rental .common-item-others .item .override-p-top{
    height: fit-content;
    margin: clamp(66.625px, calc(3.282123vw + 32.98324px), 96px) auto 0;
    text-align: left;
}
.rental .common-item-others .item .override-p-top2{
    height: fit-content;
    margin: clamp(66.625px, calc(3.282123vw + 32.98324px), 96px) auto 0;
}
.override-p-top .nowrap{
    white-space: nowrap;
}
.override-p-top  .p-space{
    display: block;
    height: 1rem;
}
.override-size{
    aspect-ratio: 1000 / 124;
    padding: 3rem 0 1.5rem;
}
.rental .table-container .common-h4{
    font-weight: bold;
    margin: 0 auto 2.5rem;
    white-space: nowrap;
}
.rental .table-container .common-h4-2{
    font-weight: bold;
    margin: 0 auto 1rem;
    white-space: nowrap;
}
.rental .table-container .common-h4-3{
    font-weight: bold;
    margin: 3rem auto 1rem;
    white-space: nowrap;
}
.rental .table-container .common-min-p{
    width: 80%;
    margin: 0 auto 0.5rem;
    text-align: left;
    text-indent: -.8rem;
    padding-left: 0.8rem;
}
.rental .table-container .top-box-inner{
    width: min(71%,689px);
    margin: 0 auto 2rem;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}
.rental .top-box-inner th, .top-box-inner td{
    padding-right: 0;
    text-align: center;
}
.rental .table-container .price-table-l{
    flex-shrink: none;
    flex: 0 0 26%;
}
.rental .table-container .price-table{
    flex: 1 1 37%;
    min-width: 0; /* flexで縮めるため必要 */
}
.min-p-box{
    width: 80%;
    margin: 3rem auto;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
}
.min-p-box .common-min-p{
    margin: 0;
}
.rental .override-bottom{
    margin: 3rem auto 6rem;
}

/* 背景色と山並み画像。heightの高さで調整 */
.bg-container-rental .bg-white{
    width: 100%;
    height: 2%;
    background: #fff;
}
.bg-container-rental .bg-yama1{
    width: 100%;
    height: 45%;
    background: #DCF6F7;
}
.bg-container-rental .bg-yama2{
    background: #B7E5E5;
    width: 100%;
    height: 16%;
}
.bg-container-rental .bg-yama3{
    width: 100%;
    height: 8%;
    background: #9bd1cf;
}
/* スマホ横～タブレット縦 */
@media (max-width: 1024px){
    .rental .common-item-three .common-p{
        height: clamp(calc(160px + 1rem), calc(-22.64vw + 391.82px + 1rem), calc(256px + 1rem));
    }
    .rental .common-item-three .item{
        width: calc((100% - 3vw) / 2);
    }
    .rental .common-item-others{
        width: 80%;
        flex-direction: column;
        gap: 2rem;
    }
    .rental .common-item-others .item{
        width: 75.3%;
        height: clamp(584px, calc(26.42vw + 425.48px), 696px);
        margin: 0 auto;
        padding: 1.25rem 1.25rem 1rem;
    }
    .rental .common-item-others .override-height{
        height: clamp(464px, calc(39.62vw + 226.28px), 632px);
    }
    .rental .common-item-others .item .override-p-top{
        width: 100%;
    }
    .rental .common-item-others .item .override-p-top2{
        width: 100%;
        margin: clamp(66.625px, calc(3.282123vw + 32.98324px), 96px) auto 0;
    }

    /* 背景色と山並み画像。heightの高さで調整 */
    .bg-container-rental .bg-yama1{height: 61%;}
    .bg-container-rental .bg-yama2{height: 18%;}
    .bg-container-rental .bg-yama3{height: 5%;}
}
/* スマホ縦 */
@media (max-width: 599px){
    .rental .override-599{
        flex-direction: column;
        margin: 0 auto; 
    }
    .rental .override-599 .item{
        width: 80%;
        margin: 0 auto 1rem;
    }
    .rental .override-599 .item p{
        height: 12.5rem;
    }
    .rental .common-item-three .common-p{
        height: clamp(208px, calc(-33.47vw + 408.5px), 288px);
        margin: clamp(39.6px, calc(2.23vw + 31.58px), 44.93px) auto 0;
    }
    .rental .common-item-three .left{
        position: relative;
        left: clamp(-24px, calc(20vw - 96px), 0px);
    }
    .rental .common-item-others{
        width: 90%;
    }
    .rental .common-item-others .item{
        width: 100%;
        height: clamp(560px, calc(30.13vw + 451.53px), 632px);
    }
    .rental .common-item-others .override-height{
        height: clamp(432px, calc(56.9vw + 226.92px), 568px);
    }

    /* 背景色と山並み画像。heightの高さで調整 */
    .bg-container-rental .bg-yama1{height: 57.5%;}
    .bg-container-rental .bg-yama2{height: 28%;}
    .bg-container-rental .bg-yama3{height: 4%;}
}


/* ----------------------------------- */
/* ----page-contact.php---- */
/* ----pagr-contactcomplete.php---- */
/* ----------------------------------- */
.contact-form{
    width: 420px;
    padding-top: 8rem;
    margin: 0 auto;
    line-height: 1.5;
    letter-spacing: 0.2vw;
    text-align: left;
}
.common-title{ /* .common-h2と同内容 */
    width: 100%;
    font-size: 2rem;
    letter-spacing: .2vw;
    line-height: 1.5;
    white-space: nowrap;
    margin: 0 auto 2rem;
    color: #0071bc;
    text-align: center;
}
.form-item{
    font-size: 1rem;
    margin: 1rem 0;
}
.contact-form span{
    height: 0;
    color: #e7763e;
    margin-left: .5rem;
}
fieldset{
    background: #fff;
    border: none;
    border-radius: 20px;
    margin: 2rem auto;
}
.placard{
    margin: 0;
}
.form-item textarea{
    box-sizing: border-box;
    width: 100%;
    height: 5rem;
}
.submit-btn{
    margin-bottom: 8rem;
}
/* 背景色と山並み画像。heightの高さで調整 */
.bg-container-form .bg-white{
    width: 100%;
    height: 7%;
    background: #fff;
}
.bg-container-form .bg-yama1{
    width: 100%;
    height: 0%;
    background: #DCF6F7;
}
.bg-container-form .bg-yama2{
    background: #B7E5E5;
    width: 100%;
    height: 0%;
}
.bg-container-form .bg-yama3{
    background: #9bd1cf;
    width: 100%;
    height: 5%;
}

.formcomp{
    width: 80%;
    aspect-ratio: 4/3;
    padding-top: 30%;
    box-sizing: border-box;
    margin: 0 auto;
    letter-spacing: 0.2vw;
    text-align: left;
}
.formcomp .common-title{
    width: fit-content;
    margin:  0 auto;
}
.formcomp .page-content{
    width: fit-content;
    margin:  0 auto;
    font-size: clamp(16px, 1.223vw, 20px);
}

.bg-container-formcomp .bg-white{
    width: 100%;
    height: 8%;
    background: #fff;
}
.bg-container-formcomp .bg-yama1{
    width: 100%;
    height: 0%;
    background: #DCF6F7;
}
.bg-container-formcomp .bg-yama2{
    background: #B7E5E5;
    width: 100%;
    height: 0%;
}
.bg-container-formcomp .bg-yama3{
    background: #9bd1cf;
    width: 100%;
    height: 5%;
}
/* スマホ横～タブレット縦 */
@media (max-width: 1024px){
    .contact-form{
        width: 468px;
    }
    .common-title{
        font-size: 1.5rem;
    }
    .formcomp{
        aspect-ratio: 3/4;
        padding-top: 50%;
    }
    /* 背景色と山並み画像。heightの高さで調整 */
    .bg-container-form .bg-white{height: 4%;}
    .bg-container-form .bg-yama1{height: 5%;}
    .bg-container-form .bg-yama2{height: 5%;}
    .bg-container-form .bg-yama3{height: 31%;}
    .bg-container-formcomp .bg-white{height: 7%;}
}

.commonHead{
    position: inherit;
}


/* スマホ縦 */
@media (max-width: 599px){
    .contact-form{
        width: 310.5px;
        padding-top: 7rem;
    }
    .form-item{
        font-size: 14px;
    }
    .form-item textarea{
        box-sizing: border-box;
        width: 80%;
        height: 5rem;
    }
    .formcomp{
        aspect-ratio: 3/4;
        padding-top: 45%;
    }
    .formcomp .common-title{
        font-size: 20px;
    }
    /* 背景色と山並み画像。heightの高さで調整 */
    .bg-container-form .bg-white{height: 4%;}
    .bg-container-form .bg-yama1{height: 16%;}
    .bg-container-form .bg-yama2{height: 16%;}
    .bg-container-form .bg-yama3{height: 27%;}
    .bg-container-formcomp .bg-white{height: 4%;}
}