

@media screen and (max-width:760px) {


    :root {
        --font-size: 1rem;
        --line-height: 2.8;
        --margin-bottom: 7rem;
        --border-radius: .4rem;
        --box-shadow: 0 0 .3rem #00000090;
    }

    html.murasakiHpTop {
        font-size: 2.4vw;
    }

    .content {
        width: 100%;
        overflow-x: hidden;
    }

    .top__h2 {
        padding-block: 8rem 4rem;
        font-size: 3rem;
        text-align: center;
    }

    #loading img {
        width: 14%;
    }

    #murasakiHpTop__body__langButton {
        top: 8em;
        right: 69em;
        font-size: .07rem;
    }

    #murasakiHpTop__body__NavButton {
        font-size: .07rem;
        width: 7%;
        top: 1.6rem;
        right: 1.4rem;
    }


    /***************
header
***************/

    .murasakiHpTop__body__PcHeader {
        padding-block: 1.9rem 1.5rem;
    }

    .pcHeader__h1 {
        margin-inline: 2% 0;
        font-size: 1.1rem;
        text-align: left;
    }

    /***************
ファーストビュー
***************/

    #top__fv {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
            -ms-flex-direction: row-reverse;
                flex-direction: row-reverse;
    }

    .top__fv__div {
        width: 13%;
    }

    .top__fv__div__logo {
        width: 38%;
        aspect-ratio: 159/808;
        margin: 1rem 0 0;
    }

    .top__fv__pic {
        width: 86%;
        height: 39rem;
        overflow: hidden;
    }

    .top__fv__pic img {
        height: 107%;
        -o-object-fit: cover;
           object-fit: cover;
        -o-object-position: -27rem 0;
           object-position: -27rem 0;
    }

    .top__fv__div__info {
        font-size: .68rem;
        text-align: right;
        line-height: 2;
        margin-left: 0;
        margin-right: .4rem;
    }


    /***************
    about
    ***************/

    .top__about__div__pic {
        position: relative;
        width: 60%;
    }

    .top__about__div__pic img {
        -o-object-position: -14rem 0;
           object-position: -14rem 0;
    }

    .top__about__div {
        height: 36rem;
        background: url(../img/icon/1.png) right +28% bottom 1rem / 7rem no-repeat;
    }

    .top__about__p.en {
        top: 0;
        right: 2%;
        margin: 0;
        text-align: right;
    }

    .top__guide__last {
        height: 50rem;
    }

    .top__guide__last__pic {
        width: 103%;
        max-height: unset;
    }

    .top__guide__last__p {
        top: 5rem;
        left: 2%;
        line-height: 2;
        text-shadow: 0 0 1rem #fff;
    }

    .top__guide__last__p.en {
        top: 12rem;
        width: 77%;
    }

    .gallery {
        aspect-ratio: 1/1;
        padding: 0;
        width: 98%;
        -ms-grid-columns: 31.8% 31.8% 31.8%;
        grid-template-columns: 31.8% 31.8% 31.8%;
        -ms-grid-rows: 23.4% 23.4% 23.4% 23.4%;
        grid-template-rows: 23.4% 23.4% 23.4% 23.4%;
    }

    .gallery > *:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }

    .gallery > *:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 2;
    }

    .gallery > *:nth-child(3) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }

    .gallery > *:nth-child(4) {
        -ms-grid-row: 2;
        -ms-grid-column: 1;
    }

    .gallery > *:nth-child(5) {
        -ms-grid-row: 2;
        -ms-grid-column: 2;
    }

    .gallery > *:nth-child(6) {
        -ms-grid-row: 2;
        -ms-grid-column: 3;
    }

    .gallery > *:nth-child(7) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }

    .gallery > *:nth-child(8) {
        -ms-grid-row: 3;
        -ms-grid-column: 2;
    }

    .gallery > *:nth-child(9) {
        -ms-grid-row: 3;
        -ms-grid-column: 3;
    }

    .gallery > *:nth-child(10) {
        -ms-grid-row: 4;
        -ms-grid-column: 1;
    }

    .gallery > *:nth-child(11) {
        -ms-grid-row: 4;
        -ms-grid-column: 2;
    }

    .gallery > *:nth-child(12) {
        -ms-grid-row: 4;
        -ms-grid-column: 3;
    }



    .top__guide__div,
    .top__guide__div:nth-child(2n) {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }

    .top__guide__slider {
        width: 90%;
        margin: auto;
    }

    .top__guide__div__text {
        top: 2rem;
        width: 72%;
        text-align: justify;
        margin: auto;
    }

    .top__guide {
        background: url(../img/icon/2.png) right +7% top +41.6rem / 10rem no-repeat,
        url(../img/icon/3.png) right +16% top +92.7rem / 5rem no-repeat,
        url(../img/icon/4.png) left +6% top +54% / 8rem no-repeat,
        url(../img/icon/5.png) left +7% top +74% / 6rem no-repeat,
        url(../img/icon/6.png) right +8% bottom / 10rem no-repeat;
    }

    .top__guide__div {
        margin-bottom: 8rem;
    }

    .guide__p.en {
        font-size: .904em;
        line-height: 1.6;
    }

    .main__bg {
        background: none;
    }

    /***************
営業時間
***************/
    .top__hour__div {
        width: 100%;
        height: 10rem;
    }

    .top__hour__div p:nth-child(1) {
        top: 0;
        bottom: 0;
        left: 0;
        margin: 0;
        width: 100%;
        text-align: center;
    }

    .top__hour__div p:nth-child(2) {
        top: 4rem;
        width: 100%;
        right: 0;
        text-align: center;
    }

    .top__hour__div small:nth-child(3) {
        right: 0;
        bottom: 0;
        width: 100%;
        text-align: center;
    }


    /***************
料金
***************/

    .top__fee__div {
        width: 90%;
        height: auto;
        margin: auto;
    }

    .top__fee__div p {
        position: static;
        width: 80%;
        margin: 0 auto 1rem;
    }

    .top__fee__div p:nth-child(4) {
        margin-top: 4rem;
        border-bottom: none;
    }

    .top__fee__div small:nth-child(5) {
        position: static;
        display: block;
        width: 100%;
        margin-top: 1rem;
        text-align: center;
    }


    /***************
アクセス
***************/

    .top__access {
        padding-bottom: 0;
    }

    .top__access__map {
        display: block;
        width: 90%;
        height: auto;
        aspect-ratio: 1 / .8;
    }

    .top__access__details {
        width: 90%;
        height: auto;
    }

    .access__public {
        position: static;
        width: 100%;
        margin-bottom: 2rem;
    }

    .access__public__p {
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        padding-inline: 1rem;
        margin: 0 auto 1rem;
        font-size: 1.8rem;
        font-weight: 700;
        line-height: 1;
        border-bottom: .1rem solid #000;
    }

    .access__car {
        position: static;
        width: 100%;
        padding-block: 2rem;
        margin-bottom: 2rem;
    }

    .access__car__pic img {
        width: 60%;
    }

    .access__car__small {
        width: 80%;
        margin: 1rem auto 0;
    }

    .access__addr,
    .access__tel {
        position: static;
        width: 100%;
        border-radius: var(--border-radius);
        -webkit-box-shadow: var(--box-shadow);
                box-shadow: var(--box-shadow);
    }

    .access__tel {
        margin-top: 2rem;
        text-align: center;
    }

    /***************
    アクセス
    ***************/

    .top__sns__div {
        display: block;
        -ms-grid-columns: 1fr 1% 1fr 1% 1fr;
        grid-template-columns: repeat(3, 1fr);
        gap: 1%;
        width: 83%;
        max-width: 98%;
        margin: auto;
    }

    .top__sns__div > div:nth-child(1) {
        aspect-ratio: 1 / 1.4;
        margin-bottom: 3rem !important;
    }
    .top__sns__div > iframe:nth-child(2),
    .top__sns__div > iframe:nth-child(3) {
        aspect-ratio: 1 / 1.5;
        margin-bottom: 3rem !important;
    }

    /***************
    フッター
    ***************/

    .murasakiHpTop__footer {
        padding-top: 4rem;
    }
    .murasakiHpTop__footer img {
        width: 24%;
    }
}