/* ==============================
  メニューページ
============================== */

/* メニューのメイン画像
========================================================================== */
.menu-mv-wrap {
    position: relative;
    padding-bottom: 8.7%;
    background-color: #FFF;
}
.menu-mv-wrap .sec-title-wrap {
    position: relative;
}
.menu-mv-wrap .sec-title {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    /* margin-left: 2em; */
    color: #FFF;
    height: 100%;
}
.menu-mv-wrap h2.tb-rl {
    height: 100%;
    justify-content: center;
    align-items: center;
}
.menu-mv-wrap h2 span.en {
    flex-direction: row;
}
.menu-mv-wrap h2 p {
    width: auto;
    margin: auto;
}
.menu-mv-wrap  p {
    width: 869px;
    margin: 5.8% auto 7.9%;
    text-align: center;
}

.menu-mv-wrap ul {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 76.5%;
    margin: 0 auto;
}
.menu-mv-wrap ul li {
    width: 29.3%;
    text-align: center;
}

.menu-mv-wrap ul li a {
    position: relative;
    width: 100%;
    color: #FFF;
    border: 1px solid #000;
    padding: 10px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1;
}
.menu-mv-wrap ul li a::after {
    position: absolute;
    content: "";
    right: 15.8px;
    width: 13.6px;
    height: 6.8px;
    top: 30.7%;
    width: 8px;
    height: 8px;
    border-top: 1px solid #fff;
    border-left: 1px solid #fff;
    border-right: none;
    transform: rotate(225deg);
}
.menu-mv-wrap ul li.drink a::after {
    border: none;
    background-image: url(../common/images/other-link.svg);
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
    width: 16px;
    height: 16px;
    transform: none;
}

.menu-mv-wrap ul li.drink a {
    color: #000;
}
.menu-mv-wrap ul li.lunch a {
    background-color: #B7975A;
    border-color: #B7975A;
}
.menu-mv-wrap ul li.dinner a {
    background-color: #000;
}
@media print, screen and (max-width: 768px) {
    .menu-mv-wrap {
        padding-bottom: 21.3vw;
    }
    .menu-mv-wrap  p {
        width: 81.6vw;
        margin: 10.6vw auto 16.8vw;
    }

    .menu-mv-wrap ul {
        flex-direction: column;
        width: 81.6vw;
    }
    .menu-mv-wrap ul li {
        width: 100%;
    }
    .menu-mv-wrap ul li + li {
        margin-top: 6.4vw;
    }

    .menu-mv-wrap ul li a {
        padding: 2.6vw 0;
    }
    .menu-mv-wrap ul li a::after {
        right: 4.2vw;
        width: 3.6vw;
        height: 1.8vw;
        top: 30.7%;
        width: 2.1vw;
        height: 2.1vw;
    }
    .menu-mv-wrap ul li.drink a::after {
        background-size: 4.2vw;
        width: 4.2vw;
        height: 4.2vw;
    }
}

/* メニューのお昼のメニュー
========================================================================== */
.menu .menu-wrap .menu-en {
    top: 2.9%;
    right: 1.8%;
}

.menu .menu-wrap .inner {
    width: 76.5%;
    margin: 0 auto;
}
.menu .menu-wrap h2 {
    display: block;
}
.menu .menu-wrap h2 span {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.5;
}
.menu .menu-wrap h2 span::before,
.menu .menu-wrap h2 span::after {
    content: "";
    background-image: url(../common/images/title-deco.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-size: 9px 13px;
    width:9px;
    height: 13px;
    margin: 0;
}
.menu .menu-wrap h2 span::before {
    margin-right: 1em;
    /* left: calc(50% - 4.4em); */
}
.menu .menu-wrap h2 span::after {
    margin-left: 1em;
    /* right: calc(50% - 4.4em); */
}
.menu .menu-wrap h2::after {
    content: "";
    border-bottom: 1px solid #000;
    width: 109px;
    display: block;
    margin: 30.5px auto 0;
}
.menu .dinner_menu-wrap.menu-wrap h2::after {
    border-bottom-color: #FFF;
}

.menu .menu-wrap .lunch_menu-con {
    display: flex;
    justify-content: space-between;
    width: 100%;
}
.menu .menu-wrap .lunch_menu-con + .lunch_menu-con {
    margin-top: 11.4%;
}
.menu .menu-wrap .lunch_menu-con .photo-wrap {
    width: 45.4%;
}
.menu .menu-wrap .lunch_menu-con .text-wrap {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.menu .menu-wrap .lunch_menu-con .text-wrap h4 {
    position: relative;
    margin: 0;
    border-left: 5px solid #B7975A;
    padding-left: 14px;
    line-height: 1.5;
    letter-spacing: 0.01em;
}
.menu .menu-wrap .lunch_menu-con .text-wrap h4::before {
    display: none;
}
.menu .menu-wrap .lunch_menu-con .text-wrap h4::after {
    position: absolute;
    content: "";
    bottom: -15.5px;
    left: 0;
    display: block;
    border-bottom: 1px solid #000;
    width: 98px;
}
.menu .menu-wrap .lunch_menu-con .text-wrap > p {
    margin: 3em 0 auto;
    font-size: clamp(1.25rem, 1.1vw, 1.6rem);
}

.menu .menu-wrap .add-menu {
    flex-direction: column;
    width: 84.7%;
    margin: 11.4% auto 0;
}
.menu .menu-wrap .add-menu .title-wrap {
    margin-bottom: 4.5%;
}
.menu .menu-wrap .add-menu h4 {
    margin-right: 0;
    text-align: center;
    padding: 3px 0;
}
.menu .menu-wrap .add-menu h4::before {
    display: none;
}
.menu .menu-wrap .add-menu .photo-menu-box {
    display: flex;
    justify-content: space-between;
}
.menu .menu-wrap .add-menu .photo-menu-box .photo-wrap {
    width: 44.2%;
}
.menu .menu-wrap .add-menu .photo-menu-box .text-wrap {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.menu .menu-wrap .add-menu .photo-menu-box .text-wrap h5 {
    position: relative;
    border-left: 5px solid #B7975A;
    font-size: 2.4rem;
    font-size: clamp(1.6rem, 1.75vw, 2.4rem);
    padding-left: 14px;
    line-height: 1.5;
    margin-bottom: 8.3%;
}
.menu .menu-wrap .add-menu .photo-menu-box .text-wrap h5::after {
    position: absolute;
    content: "";
    bottom: -15.5px;
    left: 0;
    display: block;
    border-bottom: 1px solid #000;
    width: 98px;
}
.menu .menu-wrap .add-menu dl {
    display: flex;
    justify-content: space-between;
    font-size: 1.7rem;
    font-size: clamp(1.3rem, 1.24vw, 1.7rem);
    padding: 27px 0;
}
.menu .menu-wrap .add-menu dl:first-of-type {
    margin: 20px 0 0;
}
.menu .menu-wrap .add-menu dl + dl {
    border-top: 1px dotted #000;
}
.menu .menu-wrap .add-menu dt {
    display: flex;
    align-items: center;
}
.menu .menu-wrap .add-menu dt::before {
    content: "";
    background-image: url(../common/images/title-deco.svg);
    background-repeat: no-repeat;
    background-size: 9px 13px;
    width:9px;
    height: 13px;
    display: block;
    margin-right: 11px;
    background-size: contain
}

.menu .menu-wrap .add-menu .btn {
    margin: 100px auto 0;
}
@media print, screen and (max-width: 768px) {
    .menu .menu-wrap .menu-en {
        top: 5.3vw;
        right: 1.3vw;
    }

    .menu .menu-wrap .inner {
        width: 81.6vw;
    }
    .menu .menu-wrap h2 span {
        font-size: 6.4vw;
    }
    .menu .menu-wrap h2 span::before,
    .menu .menu-wrap h2 span::after {
        background-size: 1.49vw 2.29vw;
        width: 1.49vw;
        height: 2.29vw;
    }
    .menu .menu-wrap h2::after {
        width: 21.3vw;
        margin: 4vw auto 0;
    }

    .menu .menu-wrap .lunch_menu-con {
        flex-direction: column;
    }
    .menu .menu-wrap .lunch_menu-con + .lunch_menu-con {
        margin-top: 21.3vw;
    }
    .menu .menu-wrap .lunch_menu-con .photo-wrap {
        width: 100%;
        margin-bottom: 6.4vw;
    }
    .menu .menu-wrap .lunch_menu-con .text-wrap {
        width: 100%;
    }
    .menu .menu-wrap .lunch_menu-con .text-wrap h4 {
        border-left-width: 1.3vw;
        padding-left: 3.2vw;
        font-size: 5.3vw;
        letter-spacing: 0.05em;
        margin-bottom: 12.2vw;
    }
    .menu .menu-wrap .lunch_menu-con .text-wrap h4::after {
        bottom: -5.8vw;
        width: 26vw;
    }
    .menu .menu-wrap .lunch_menu-con .text-wrap p {
        font-size: 3.7vw;
    }
    .menu .menu-wrap .lunch_menu-con .text-wrap .btn {
        margin: 16.8vw auto 0;
    }

    .menu .menu-wrap .add-menu {
        width: 81.6vw;
        margin: 21.3vw auto 0;
    }
    .menu .menu-wrap .add-menu .title-wrap {
        margin-bottom: 10.6vw;
        width: 100%;
    }
    .menu .menu-wrap .add-menu h4 {
        padding: 2.6vw 0;
        font-size: 4.8vw;
        letter-spacing: 0.05em;
    }
    .menu .menu-wrap .add-menu .photo-menu-box {
        flex-direction: column;
    }
    .menu .menu-wrap .add-menu .photo-menu-box .photo-wrap {
        width: 100%;
        margin-bottom: 6.3vw;
    }
    .menu .menu-wrap .add-menu .photo-menu-box .text-wrap {
        width: 100%;
    }

    .menu .menu-wrap .add-menu .photo-menu-box .text-wrap h5 {
        border-left-width: 1.3vw;
        font-size: 5.3vw;
        padding-left: 3.2vw;
        margin-bottom: 12.8vw;
        letter-spacing: 0.05em;
    }
    .menu .menu-wrap .add-menu .photo-menu-box .text-wrap h5::after {
        bottom: -6.4vw;
        width: 26.1vw;
    }
    .menu .menu-wrap .add-menu .photo-menu-box .text-wrap p {
        font-size: 3.7vw;
    }

    .menu .menu-wrap .add-menu dl {
        flex-direction: column;
        font-size: 4.5vw;
        padding: 5.8vw 0;
    }
    .menu .menu-wrap .add-menu dl:first-of-type {
        margin: 10.9vw 0 0;
    }
    .menu .menu-wrap .add-menu dt {
        display: flex;
        align-items: center;
    }
    .menu .menu-wrap .add-menu dt::before {
        background-size: 2.2vw 3.3vw;
        width:2.2vw;
        height: 3.3vw;
        margin-right: 2.9vw;
    }
    .menu .menu-wrap .add-menu dd {
        text-align: right;
    }

    .menu .menu-wrap .add-menu .btn {
        margin: 13.3vw auto 0;
    }
}


/* メニューの夜のメニュー
========================================================================== */
.menu .menu-wrap {
    position: relative;
}
.menu #dinner_menu.menu-wrap .menu-en {
    top: 2.9%;
    left: 1.8%;
}
.menu .menu-wrap.dinner_menu-wrap .inner {
    width: 88.2%;
}

/*メニュー用*/
.menu .menu-wrap .dinner_menu-con {
    width: 100%;
}
.menu .menu-wrap .dinner_menu-con .text-wrap {
    width: 86.7%;
    margin: 3.6% auto 0;
    display: flex;
    justify-content: space-between;
}
.menu .menu-wrap .dinner_menu-con .text-wrap .detail-box {
    width: 40.53%;
    display: flex;
    flex-direction: column;
}
.menu .menu-wrap .dinner_menu-con .text-wrap .detail-box p {
    font-size: 1.7rem;
    font-size: clamp(1.3rem, 1.24vw, 1.7rem);
    line-height: 1.5;
}
.menu .menu-wrap .dinner_menu-con .text-wrap .detail-box p.attention {
    color: #B7975A;
    font-size: 1.5rem;
    font-size: clamp(1.2rem, 1.09vw, 1.5rem);
}

.menu .menu-wrap .dinner_menu-con .text-wrap .detail-box .btn {
    margin: auto 0 0;
}
.menu .menu-wrap .dinner_menu-con .text-wrap .menu-box {
    width: 50%;
}
.menu .menu-wrap .dinner_menu-con .text-wrap .menu-box h4 {
    font-size: 2.4rem;
    font-size: clamp(1.6rem, 1.75vw, 2.4rem);
    border-bottom: 1px dotted #FFF;
    margin-right: 0;
    margin-bottom: 4.4%;
    letter-spacing: 0.01em;
}
.menu .menu-wrap .dinner_menu-con .text-wrap .menu-box h4::before {
    display: none;
}
.menu .menu-wrap .dinner_menu-con .text-wrap .menu-box dl {
    display: flex;
    font-size: 1.7rem;
    font-size: clamp(1.3rem, 1.24vw, 1.7rem);
    align-items: flex-start;
    line-height: 1.5;
}
.menu .menu-wrap .dinner_menu-con .text-wrap .menu-box dl + dl {
    margin-top: 3%;
}
.menu .menu-wrap .dinner_menu-con .text-wrap .menu-box dl dt {
    width: 34.9%;
}
.menu .menu-wrap .dinner_menu-con .text-wrap .menu-box dl dd {
    width: 59.2%;
}

@media print, screen and (max-width: 768px) {
    .menu .menu-wrap {
        padding-top: 20vw;
    }
    .menu #dinner_menu.menu-wrap .menu-en {
        top: 5.3vw;
        left: 3.2vw;
    }
    .menu .menu-wrap.dinner_menu-wrap .inner {
        width: 81.6vw;
    }
    .menu .menu-wrap .dinner_menu-con .text-wrap {
        position: relative;
        width: 100%;
        margin: 5.3vw auto 0;
        flex-direction: column;
        padding-bottom: 33vw;
    }
    .menu .menu-wrap .dinner_menu-con .text-wrap .detail-box {
        width: 100%;
    }
    .menu .menu-wrap .dinner_menu-con .text-wrap .detail-box p {
        font-size: 3.7vw;
    }
    .menu .menu-wrap .dinner_menu-con .text-wrap .detail-box p.attention {
        font-size: 4vw;
    }

    .menu .menu-wrap .dinner_menu-con .text-wrap .detail-box .btn {
        position: absolute;
        bottom: 0;
        right: 0;
        left: 0;
        margin: 0 auto;
    }
    .menu .menu-wrap .dinner_menu-con .text-wrap .menu-box {
        width: 100%;
        margin-top: 9.3vw;
    }
    .menu #dinner_menu.menu-wrap .dinner_menu-con .text-wrap .menu-box h4 {
        font-size: 6.4vw;
        margin-left: 0;
        margin-bottom: 6.2vw;
    }
    .menu .menu-wrap .dinner_menu-con .text-wrap .menu-box dl {
        font-size: 4.5vw;
        justify-content: space-between;
    }
    .menu .menu-wrap .dinner_menu-con .text-wrap .menu-box dl + dl {
        margin-top: 3%;
    }
    .menu .menu-wrap .dinner_menu-con .text-wrap .menu-box dl dt {
        width: 28vw;
    }
    .menu .menu-wrap .dinner_menu-con .text-wrap .menu-box dl dd {
        width: 44.8vw;
    }
}

/*コース用*/
.menu .menu-wrap .dinner_menu-con.course-con + .dinner_menu-con.course-con {
    margin-top: 9.5%;
}
.menu .menu-wrap .dinner_menu-con.course-con h3 {
    font-size: 3.8rem;
    font-size: clamp(2rem, 2.7vw, 3.8rem);
    border-left: 5px solid #B7975A;
    padding-left: 15px;
    line-height: 1.2;
    width:86.7%;
    margin: 0 auto 19px;
}
.menu .menu-wrap .dinner_menu-con.course-con h3 span {
    display: block;
    font-size: 2.4rem;
    font-size: clamp(1.6rem, 1.75vw, 2.4rem);
}
.menu .menu-wrap .dinner_menu-con.course-con .photo-wrap {
    display: grid;
    grid-template-columns: 66.1% 32.6%;
    grid-template-rows: repeat(2, auto);
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    justify-content: space-between;
}
.menu .menu-wrap .dinner_menu-con.course-con .photo-wrap .course-main {
    grid-area: 1 / 1 / 3 / 2;
}
.menu .menu-wrap .dinner_menu-con.course-con .photo-wrap .course-sub01 {
    grid-area: 1 / 2 / 2 / 3;
}
.menu .menu-wrap .dinner_menu-con.course-con .photo-wrap .course-sub02 {
    grid-area: 2 / 2 / 3 / 3;
    margin-top: 10px;
}

/* サブ写真がない場合のクラス */
.menu .menu-wrap .dinner_menu-con.course-con .photo-wrap.no-sub-photos .course-main {
    grid-area: 1 / 1 / 3 / 3;
}

.menu .menu-wrap .dinner_menu-con.course-con .photo-wrap.no-sub01 .course-sub02 {
    grid-area: 1 / 2 / 3 / 3;
}

.menu .menu-wrap .dinner_menu-con.course-con .photo-wrap.no-sub02 .course-sub01 {
    grid-area: 1 / 2 / 3 / 3;
}
@media print, screen and (max-width: 768px) {
    .menu .menu-wrap .dinner_menu-con.course-con + .dinner_menu-con.course-con {
        margin-top:  23.5vw;
    }
    .menu .menu-wrap .dinner_menu-con.course-con h3 {
        font-size: 5.3vw;
        border-left-width: 1.3vw;
        padding-left: 3.2vw;
        width: 81.6vw;
        margin: 0 auto 5vw;
    }
    .menu .menu-wrap .dinner_menu-con.course-con h3 span {
        font-size: 5.3vw;
        margin-top: 2.3vw;
    }
    .menu .menu-wrap .dinner_menu-con.course-con .photo-wrap {
        grid-template-columns: repeat(2, 40.3vw);
        grid-template-rows: repeat(2, auto);
    }
    .menu .menu-wrap .dinner_menu-con.course-con .photo-wrap .course-main {
        grid-area: 1 / 1 / 2 / 3;
        margin-bottom: 1vw;
    }
    .menu .menu-wrap .dinner_menu-con.course-con .photo-wrap .course-sub01 {
        grid-area: 2 / 1 / 3 / 2;
        margin-right: 1vw;
    }
    .menu .menu-wrap .dinner_menu-con.course-con .photo-wrap .course-sub02 {
        grid-area: 2 / 2 / 3 / 3;
        margin-top: 0;
    }
    .menu .menu-wrap .dinner_menu-con.course-con .photo-wrap.no-sub-photos .course-main {
        grid-area: 1 / 1 / 3 / 3;
    }

    .menu .menu-wrap .dinner_menu-con.course-con .photo-wrap.no-sub01 .course-sub02 {
        grid-area: 2 / 1 / 3 / 3;
    }
    .menu .menu-wrap .dinner_menu-con.course-con .photo-wrap.no-sub02 .course-sub01 {
        grid-area: 2 / 1 / 3 / 3;
    }
}

/*懐石用*/
.menu .special_menu-wrap {
    background-color: var(--theme-color, var(--omoya-color));
    color: #FFF;
}
.menu .special_menu-wrap .inner {
    width: 70.7%;
    margin: 0 auto;
}
.menu .special_menu-wrap .special_menu-con {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin: 0;
}
.menu .special_menu-wrap .special_menu-con .title-wrap {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 43.4%;
}
.menu .special_menu-wrap .special_menu-con h3 {
    font-size: 3.8rem;
    font-size: clamp(2rem, 2.7vw, 3.8rem);
    border-left: 5px solid #B7975A;
    padding-left: 15px;
    line-height: 1.2;
    margin: 0;
}
.menu .special_menu-wrap .special_menu-con h3 span {
    display: block;
    font-size: 2.4rem;
    font-size: clamp(1.6rem, 1.75vw, 2.4rem);
}

.menu .special_menu-wrap .special_menu-con  .text-wrap {
    width: 54.1%;
    font-size: 1.7rem;
    font-size: clamp(1.3rem, 1.24vw, 1.7rem);
}
.menu .special_menu-wrap .special_menu-con  .text-wrap p.attention {
    color: #B7975A;
    font-size: 1.5rem;
    font-size: clamp(1.2rem, 1.09vw, 1.5rem);
}
@media print, screen and (max-width: 768px) {
    .menu .special_menu-wrap .inner {
        width: 81.6vw;
    }
    .menu .special_menu-wrap .special_menu-con {
        flex-direction: column;
        position: relative;
        padding-top: 0;
        padding-bottom: 23.8vw;
    }
    .menu .special_menu-wrap .special_menu-con .title-wrap {
        position: unset;
        width: 100%;
    }
    .menu .special_menu-wrap .special_menu-con h3 {
        font-size: 5.3vw;
        border-left-width: 1.3vw;
        padding-left: 3.2vw;
        line-height: 1.8;
    }
    .menu .special_menu-wrap .special_menu-con h3 span {
        font-size: 5.3vw;
    }
    .menu .special_menu-wrap .special_menu-con .title-wrap .btn {
        position: absolute;
        bottom: 0;
        right: 0;
        left: 0;
        margin: 0 auto;
    }

    .menu .special_menu-wrap .special_menu-con  .text-wrap {
        width: 100%;
        font-size: 3.7vw;
        margin-top: 6.4vw;
    }
    .menu .special_menu-wrap .special_menu-con  .text-wrap p.attention {
        font-size: 4vw;
    }
}

/* メニューのドリンクメニュー
========================================================================== */
.drink_menu-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #FFF;
}
.drink_menu-wrap a {
    position: relative;
    width: 100%;
    padding: 50px 0 70px;
}
.drink_menu-wrap a::after {
    content: "";
    display: block;
    background-image: url(../common/images/other-link-big.svg);
    background-size: 46px;
    background-repeat: no-repeat;
    background-position: center;
    width: 46px;
    height: 46px;
    position: absolute;
    right: 70px;
    top: 0;
    bottom: 0;
    margin: auto 0;
}
.drink_menu-wrap h2 {
    position: relative;
    justify-content: center;
}
.drink_menu-wrap h2::after {
    position: absolute;
    content: "";
    bottom: -15.5px;
    left: 0;
    right: 0;
    display: block;
    border-bottom: 1px solid #000;
    width: 109px;
    margin: 0 auto;
}
@media print, screen and (max-width: 768px) {
    .drink_menu-wrap a {
        padding: 17vw 0;
    }
    .drink_menu-wrap a::after {
        background-size: 8.5vw;
        width: 8.5vw;
        height: 8.5vw;
        right: 5.3vw;
    }
    .drink_menu-wrap h2 {
        font-size: 6.4vw;
    }
    .drink_menu-wrap h2::after {
        bottom: -5.3vw;
        width: 29vw;
    }

}


/* ポップアップのドリンクメニュー
========================================================================== */
.drink-menu-popup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.75);
    z-index: 1000;
    overflow-y: auto;
}

.drink-menu-content {
    position: relative;
    width: 76.5%;
    margin: 4.3% auto;
    background: #fff;
    padding: 7.6%;
    box-sizing: border-box;
    min-height: calc(100vh - 100px);
}

button.close-btn {
    position: fixed;
    top: 6.4%;
    right: 5.7%;
    width: 34px;
    height: 27px;
    cursor: pointer;
    z-index: 1001;
    background: none;
    border:none;
}
button.close-btn::before {
    position: absolute;
    content: "";
    display: block;
    transform: rotate(-36deg);
    border-bottom: 2px solid #FFFFFF;
    width: 100%;
    top: 45%;
    left: 0;
}

button.close-btn::after {
    position: absolute;
    content: "";
    display: block;
    transform: rotate(36deg);
    border-bottom: 2px solid #FFFFFF;
    width: 100%;
    top: 45%;
    right: 0;
}


.drink-menu-content .menu-en {
    position: absolute;
    top: 1em;
    left:1em;
    font-size: 1.7rem;
    font-size: clamp(1.3rem, 1.24vw, 1.7rem);
    color: #B7975A;
    display: flex;
    align-items: center;
}
.drink-menu-content .menu-en::after {
    display: block;
    content: "";
    width: auto;
    height: 8.4rem;
    margin-top: 2.3rem;
    margin-right: 0.3rem;
    margin-left: 0;
    border-top: none;
    border-right: 1px solid #B7975A;
}

.drink-menu-scroll {
    height: auto;
    overflow-y: visible;
}

.drink-menu-content h2 {
    margin-bottom: 13.3%;
}
.drink-menu-content h2 span {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.5;
}
.drink-menu-content h2 span::before,
.drink-menu-content h2 span::after {
    content: "";
    background-image: url(../common/images/title-deco.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-size: 9px 13px;
    width:9px;
    height: 13px;
    margin: 0;
}
.drink-menu-content h2 span::before {
    margin-right: 1em;
}
.drink-menu-content h2 span::after {
    margin-left: 1em;
}

.drink-menu-content h4 {
    text-align: center;
    font-size: 2.4rem;
    font-size: clamp(1.6rem, 1.75vw, 2.4rem);
    padding: 3px 0;
}

.drink-menu-content dl + .title-wrap {
    margin-top: 12.9%;
}

.drink-menu-content  .group_text {
    text-align: center;
    font-size: clamp(1.3rem, 1.24vw, 1.7rem);
    margin-top: 3.6%;
}

.drink-menu-content dl {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: repeat(2, auto);
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    font-size: 1.7rem;
    font-size: clamp(1.3rem, 1.24vw, 1.7rem);
    padding: 3% 0;
    border-bottom: 1px dotted #000;
}
.drink-menu-content .title-wrap + dl {
    margin: 3.6% 0 0;
}
.drink-menu-content dt {
    display: flex;
    align-items: flex-start;
    grid-area: 1 / 1 / 2 / 2;
}
.drink-menu-content dt::before {
    content: "";
    background-image: url(../common/images/title-deco.svg);
    background-repeat: no-repeat;
    background-size: 9px 13px;
    width:9px;
    height: 13px;
    display: block;
    margin-right: 11px;
    background-size: contain;
    margin-top: 0.5em;
}

.drink-menu-content dd {
    grid-area: 1 / 2 / 2 / 3;
    margin: 0 0 0 auto;
    align-self: self-end;
    text-align: right;
}
.drink-menu-content dl .message {
    grid-area: 2 / 1 / 3 / 3;
    font-size: 1.5rem;
    font-size: clamp(1.2rem, 1.09vw, 1.5rem);
    /* width: 53.6%; */
    font-family: MyYuGothicM, YuGothic, sans-serif;
}
.drink-menu-content dl p {
    margin-left: 20px;
}
.drink-menu-content dl p.attention {
    margin-left: 0;
    margin-top: 1em;
    font-family: MyYuGothicM, YuGothic, sans-serif;
}

.drink-menu-content .drink_end_text {
    text-align: center;
    font-size: 1.7rem;
    font-size: clamp(1.3rem, 1.24vw, 1.7rem);
    margin: 3.6% auto 8.6%;
}


.drink-menu-content .drink-menu-scroll .close-btn {
    color: #B7975A;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 34.4%;
    margin: 8.6% auto 0;
    border-bottom: 1px solid #B7975A;
    cursor: pointer;
    padding: 5px 10px;
    box-sizing: border-box;
}
.drink-menu-content .drink-menu-scroll .close-btn span {
    position: relative;
    display: block;
    width: 42px;
    height: 14px;
}
.drink-menu-content .drink-menu-scroll .close-btn span::before {
    position: absolute;
    content: "";
    display: block;
    transform: rotate(-18deg);
    border-bottom: 1px solid #B7975A;
    width: 100%;
    top: 45%;
    left: 0;
}

.drink-menu-content .drink-menu-scroll .close-btn span::after {
    position: absolute;
    content: "";
    display: block;
    transform: rotate(18deg);
    border-bottom: 1px solid #B7975A;
    width: 100%;
    top: 45%;
    right: 0;
}
@media print, screen and (max-width: 768px) {
    .drink-menu-content {
        width: 89.3vw;
        margin: 23vw auto;
        padding: 3.8vw 3.8vw 12vw;
    }

    button.close-btn {
        position: fixed;
        top: 15.7vw;
        right: 4.2vw;
        width: 6.2vw;
        height: 5.3vw;
    }
    button.close-btn::before {
        position: absolute;
        content: "";
        display: block;
        transform: rotate(-36deg);
        border-bottom: 2px solid #FFFFFF;
        width: 100%;
        top: 45%;
        left: 0;
    }

    button.close-btn::after {
        position: absolute;
        content: "";
        display: block;
        transform: rotate(36deg);
        border-bottom: 2px solid #FFFFFF;
        width: 100%;
        top: 45%;
        right: 0;
    }


    .drink-menu-content .menu-en {
        font-size: 3.7vw;
        left: 0.5em;
    }
    .drink-menu-content .menu-en::after {
        height: 11.9vw;
        margin-top: 1rem;
        margin-right: 0.3rem;
    }

    .drink-menu-content h2 {
        margin-top: 16.2vw;
        margin-bottom: 16.2vw;
    }
    .drink-menu-content h2 span::before,
    .drink-menu-content h2 span::after {
        background-size: 1.49vw 2.29vw;
        width: 1.49vw;
        height: 2.29vw;
    }

    .drink-menu-content .title-wrap {
        width: 100%;
    }
    .drink-menu-content h4 {
        font-size: 4.8vw;
        padding: 2.6vw 0;
    }

    .drink-menu-content dl + .title-wrap {
        margin-top: 20vw;
    }

    .drink-menu-content  .group_text {
        font-size: 4.5vw;
        margin-top: 8.5vw;
    }


    .drink-menu-content dl {
        grid-template-columns: 1fr;
        grid-template-rows: repeat(3, auto);
        font-size:4.5vw;
        padding: 6.4vw 0;
    }
    .drink-menu-content .title-wrap + dl {
        margin: 0;
    }
    .drink-menu-content dt {
        grid-area: 1 / 1 / 2 / 2;
    }
    .drink-menu-content dt::before {
        background-size: 2.2vw 3.3vw;
        width: 2.2vw;
        height: 3.3vw;
        margin-right: 2.9vw;
    }

    .drink-menu-content dd {
        grid-area: 3 / 1 / 4 / 2;
    }
    .drink-menu-content dl .message {
        grid-area: 2 / 1 / 3 / 2;
        font-size: 4vw;
        width: 100%;
        margin-top: 3.7vw;
    }
    .drink-menu-content dl p,
    .drink-menu-content dl p.attention {
        margin-left: 5.3vw;
    }

    .drink-menu-content .drink_end_text {
        font-size: 4.5vw;
        margin: 8.5vw auto 20vw;
    }

    .drink-menu-content .drink-menu-scroll .close-btn {
        width: 100%;
        padding: 2vw 2.6vw;
        margin-top: 20.5vw;
    }
    .drink-menu-content .drink-menu-scroll .close-btn span {
        width: 11.1vw;
        height: 3.5vw;
    }

}
/* スペシャルドリンク用 */
.drink-menu-content .drink-photo {
    width: 62.6%;
    margin: 6% auto 5.6%;
}

.drink-menu-content dl.special_drink {
    grid-template-columns: 20.4% 44.6% 31.6%;
    justify-content: space-between;
}
.drink-menu-content dl.special_drink dt {
    grid-area: 1 / 1 / 2 / 2;
}
.drink-menu-content dl.special_drink .name-box {
    font-size: 1.7rem;
    font-size: clamp(1.3rem, 1.24vw, 1.7rem);
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.5;
}
.drink-menu-content dl.special_drink .name-box p {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 3.8rem;
    font-size: clamp(2rem, 2.7vw, 3.8rem);
    margin-left: 0;
}
.drink-menu-content dl.special_drink .name-box span.ruby {
    font-size: 1.7rem;
    font-size: clamp(1.3rem, 1.24vw, 1.7rem);
}
.drink-menu-content dl.special_drink .message {
    grid-area: 1 / 2 / 2 / 3;
    width: auto;
    font-family: MyYuGothicM, YuGothic, sans-serif;
}
.drink-menu-content dl.special_drink .message p {
    margin-left: 0;
}
.drink-menu-content dl.special_drink dd {
    grid-area: 1 / 3 / 2 / 4;
    text-align: right;
}

.drink-menu-content dl dt.big-font {
    font-size: 2.4rem;
    font-size: clamp(1.6rem, 1.75vw, 2.4rem);
}
@media print, screen and (max-width: 768px) {
    .drink-menu-content .drink-photo {
        width: 100%;
        margin: 6.4vw auto 5vw;
    }

    .drink-menu-content dl.special_drink {
        grid-template-columns: 1fr;
        grid-template-rows: repeat(3, auto);
    }
    .drink-menu-content dl.special_drink dt {
        grid-area:1 / 1 / 2 / 4;
    }
    .drink-menu-content dl.special_drink .name-box {
        font-size: 4.8vw;
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        margin-left: 0;
        line-height: 1.5;
    }
    .drink-menu-content dl.special_drink .name-box p {
        font-size: 6.4vw;
        margin-left: 1em;
    }
    .drink-menu-content dl.special_drink .name-box span.ruby {
        font-size: 3.7vw;
    }
    .drink-menu-content dl.special_drink .message {
        grid-area: 2 / 1 / 3 / 2;
        margin-top: 3.7vw;
    }
    .drink-menu-content dl.special_drink .message p {
        margin-left: 0;
    }
    .drink-menu-content dl.special_drink dd {
        grid-area: 3 / 1 / 4 / 2;
    }

    .drink-menu-content dl dt.big-font {
        font-size: 4.8vw;
    }

}