@charset "utf-8";

.lower-cover-bg-pc {
	display: block;
}

.lower-cover-bg-sp {
	display: none;
}

/*===========================================================
冒頭
===========================================================*/

.intro-wrapper {
    padding: 13rem 0 14rem;
}

.intro-inner {
    padding: 0 1.5rem;
}

.intro-area {
    max-width: 157rem;
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 3rem;
    margin: 0 -1.5rem 0 auto;
}

.intro-title {
    letter-spacing: 0.18em;
    line-height: 1.66em;
    writing-mode: vertical-rl;
}

.intro-img-area {
    max-width: 120rem;
    text-align: center;
    flex: 1;
}

.intro-text-area {
    max-width: 80rem;
    width: 100%;
    margin: 7rem auto 0;
}

.intro-text-area strong {
    font-size: 1.125em;
    font-weight: inherit;
}

.btn-group {
    max-width: 72rem;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6rem;
    margin: auto;
}

.intro-btn-group {
    margin-top: 6rem;
}

/*===========================================================
おすすめの逸品
===========================================================*/

.food-wrapper {padding: 13rem 0 14.5rem;}

.food-inner {
    max-width: 125rem;
    width: 100%;
    padding: 0 1.5rem;
    margin: auto;
}

.food-main-title {
    max-width: 43.5rem;
    width: 100%;
    margin: auto;
}

.food-group {
    margin: 9rem 0 0;
}

.food-area {
    display: flex;
    justify-content: space-between;
}

.food-img-block {
    max-width: 55rem;
    width: 45.08%;
    text-align: center;
}

.food-text-block {
    max-width: 60rem;
    width: 49.18%;
    margin: 2.4rem 0 0;
}

.food-area:not(:first-child) {
    margin: 8rem 0 0;
}

.food-area-reverse {
    flex-direction: row-reverse;
}

.food-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1.5rem;
    padding: 0 0 1.8rem;
    position: relative;
    color: var(--secondary);
}

.food-title {
    flex: 1;
    font-size: 3.5rem;
    font-weight: normal;
    font-family: var(--font-family02);
    letter-spacing: 0.05em;
    line-height: 1.45em;
}

.food-header:before {
    content: "";
    display: block;
    width: 100%;
    height: 0.3rem;
    background: url(../../../../uploads/title_decoration03.png) no-repeat center / cover;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}

.food-price {
    font-size: 1.87em;
    font-weight: normal;
    font-family: var(--font-family02);
    letter-spacing: 0.05em;
    line-height: 1.46em;
    text-align: right;
}

.food-body {
    display: flex;
    flex-direction: column;
    gap: 3rem;
    letter-spacing: 0.05em;
    line-height: 2.187em;
    margin: 3rem 0 0;
}

.food-btn-group {
    margin-top: 10.5rem;
}

/*===========================================================
銘酒
===========================================================*/

.drink-wrapper {
    padding: 15rem 0 13rem;
}

.drink-inner {
    max-width: 145rem;
    width: 100%;
    padding: 0 1.5rem;
    margin: auto;
}

.drink-img-block01 {
    max-width: 71.1rem;
    width: 50.07%;
    text-align: center;
}

.drink-text-block01 {
    max-width: 63rem;
    width: 44.36%;
}

.drink-title {
    max-width: 50.8rem;
    width: 100%;
}

.drink-area01 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.drink-text {
    margin: 6rem 0 0;
}

.drink-area02 {
    max-width: 132rem;
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    align-items: center;
    margin: 6rem 0 0 auto;
}

.drink-text-block02 {
    max-width: 60rem;
    width: 45.45%;
}

.drink-img-block02 {
    max-width: 54.1rem;
    width: 40.98%;
}

.drink-btn-group {
    margin-top: 8rem;
}

.modal-btn {
    width: 57%;
}

/*===========================================================
モーダル
===========================================================*/

.modal {
    display: none;
}

.menu-frame {
    max-width: 142rem;
    width: 100%;
    padding: 7rem 1.5rem 9rem;
    margin: auto;
    color: var(--base-font-color)
}

.menu-frame-bg01 {
    background: var(--base-bg-color);
}

.menu-frame-bg02 {
    background: url(../../../../uploads/bg02.jpg) repeat center top;
}

.menu-notice {
    font-size: 0.93em;
    letter-spacing: 0.05em;
    line-height: 1.4em;
    margin: 1rem 0 0;
}

.menu-area {
    max-width: 128rem;
    width: 100%;
    margin: 6rem auto 0;
}

.menu-lead-text {
    margin: 2rem 0 0;
}

.menu-grid {
    display: grid;
}

.menu-grid-col2 {
    grid-template-columns: repeat(2,1fr);
    gap: 6rem;
}

.menu-grid-col3 {
    grid-template-columns: repeat(3,1fr);
    gap: 4.5rem;
}

.menu-box:not(:first-child) {
    margin: 6rem 0 0;
}

.menu-title {
    display: flex;
    align-items: baseline;
    gap: 1rem;
}

.menu-title:before {
    content: "";
    display: block;
    max-width: 1.8rem;
    width: 100%;
    height: 1.8rem;
    background: var(--primary);
    transform: rotate(45deg);
}

.menu-sub-title {
    font-size: 2.2rem;
    font-weight: bold;
    letter-spacing: 0.05em;
    line-height: 1.45em;
    margin: 2.5rem 0 0;
}

.menu-list {
    font-weight: 600;
    letter-spacing: 0.05em;
    line-height: 1.5em;
    margin: 1rem 0 0;
}

.menu-item {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem 0 1rem;
    border-bottom: dashed 0.1em;
}

.menu-name {
    flex: 1;
}

.menu-text {
    margin: 2.5rem 0 0;
}

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (width <= 1920px) {


/*===========================================================

===========================================================*/



}

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (width <= 1550px) {


/*===========================================================
冒頭
===========================================================*/

.intro-area {
    padding: 0 0 0 7%;
}

}


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (width <= 1024px) {


/*===========================================================

===========================================================*/



} 


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (width <= 768px) {



    /*===========================================================
    冒頭
    ===========================================================*/
    
    .intro-wrapper {
        padding: 8rem 0;
    }
    
    .intro-area {
        display: block;
        margin: 0 auto;
        padding: 0;
    }
    
    .intro-title {
        margin: auto;
    }
    
    .intro-img-area {
        margin: 3rem 0 0;
    }
    
    .intro-text-area {
        margin: 4rem auto 0;
    }
    
    .btn-group {
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        gap: 2rem;
    }
    
    .intro-btn-group {
        margin-top: 4rem;
    }

    /*===========================================================
    おすすめの逸品
    ===========================================================*/

    .food-wrapper {
        padding: 8rem 0;
    }

    .food-main-title {
        width: 70%;
    }
    
    .food-group {
        margin: 5rem 0 0;
    }
    
    .food-area {
        display: block;
    }
    
    .food-area:not(:first-child) {
        margin: 4rem 0 0;
    }
    
    .food-img-block {
        max-width: 100%;
        width: 100%;
    }
    
    .food-text-block {
        max-width: 100%;
        width: 100%;
        margin: 3rem 0 0;
    }
    
    .food-body {
        margin: 2rem 0 0;
    }
    
    .food-header {
        gap: 1rem;
        padding: 0 0 1rem;
    }
    
    .food-btn-group {
        margin-top: 4rem;
    }

    /*===========================================================
    銘酒
    ===========================================================*/

    .drink-wrapper {
        padding: 10rem 0 8rem;
    }
    
    .drink-area01 {
        display: block;
    }
    
    .drink-img-block01 {
        max-width: 100%;
        width: 100%;
    }
    
    .drink-text-block01 {
        max-width: 100%;
        width: 100%;
        margin: 3rem 0 0;
    }
    
    .drink-text {
        margin: 3rem 0 0;
    }
    
    .drink-area02 {
        display: block;
    }
    
    .drink-img-block02 {
        max-width: 100%;
        width: 100%;
    }
    
    .drink-text-block02 {
        max-width: 100%;
        width: 100%;
        margin: 3rem 0 0;
    }
    
    .drink-btn-group {
        margin-top: 4rem;
    }

    .drink-title {
        width: 80%;
    }
    
    /*===========================================================
    モーダル
    ===========================================================*/

    .menu-frame {
        padding: 4rem 1.5rem 5rem;
    }
    
    .menu-area {
        margin: 4rem auto 0;
    }
    
    .menu-grid-col3 {
        grid-template-columns: repeat(2,1fr);
        gap: 3rem;
    }
    
    .menu-box:not(:first-child) {
        margin: 4rem 0 0;
    }
    
    .menu-text {
        margin: 1.5rem 0 0;
    }
    
    .menu-sub-title {
        font-size: 1.8rem;
        margin: 1.5rem 0 0;
    }
    
    .menu-list {
        margin: 0;
    }

} 


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (width <= 576px) {
    
    .lower-cover-bg-pc {
        display: none;
    }

    .lower-cover-bg-sp {
        display: block;
    }

    /*===========================================================
    おすすめの逸品
    ===========================================================*/

    .food-header {
        flex-direction: column;
    }
    
    .food-price {
        width: 100%;
    }
    
    .food-title {
        font-size: 2.8rem;
    }

    /*===========================================================
    モーダル
    ===========================================================*/
    
    .menu-grid-col3 {
        grid-template-columns: repeat(1,1fr);
    }
    
    .menu-grid-col2 {
        grid-template-columns: repeat(1,1fr);
    }

}


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (width <= 414px) {


/*===========================================================

===========================================================*/



}


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */