@charset "utf-8";

.tFv {
    position: relative;
}

.tFv::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #291106;
    background: linear-gradient(90deg, rgba(41, 17, 6, 0.75) 0%, rgba(41, 17, 6, 0.05) 100%);
}

.tMenu::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #fff;
    opacity: 0.8;
}

.tMenuBg::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%);
    opacity: 0.8;
}

.tMenuBg::after {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    left: auto;
    width: 66%;
    max-width: 718px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%);
    opacity: 0.8;
}

.tMenuFlL {
    display: contents !important;
}

.tMenuTitBx {
    order: 1;
}

.tLinkFl {
    gap: 22px;
}

.tLinkItem {
    position: relative;
}

.tLinkItem::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #552F1B;
    opacity: .46;
    transition: all .3s;
}

.tLinkItem:hover::before {
    background: #241007;
    opacity: .78;
}

.tLinkItemIn01 {
    display: none;
}

/* ++商品紹介++ */
.tRecommend {
    position: relative;
}

.tRecommend::before {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    height: 200px;
    background: var(--secondary);
}

.tRecBx section {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 25px;
    place-items: center;
    align-items: start;
}

.tRecItem {
    width: 100%;
    max-width: 360px;
}

.tRecLink {
    width: 100%;
}

.tRecImg {
    position: relative;
    width: 100%;
    aspect-ratio: 9 /7;
    overflow: hidden;
    background: #F8F2EB;
}

.tRecImg img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    max-width: 100%;
    width: auto;
    max-height: 100%;
    height: auto;
    margin: auto;
}

.tRecImg>img+.noImg {
    display: none;
}

.tRecItem .tRecImg img {
    transition: all .3s;
}

.tRecItem:hover .tRecImg img {
    transform: scale(1.1);
}

.tRecTit {
    margin: 10px 0 0;
    font-size: 18px;
    line-height: 1.5em;
    letter-spacing: 0.05em;
    font-weight: bold;
    text-align: center;
    font-family: var(--fontB);
    color: var(--black);
}

/* --商品紹介-- */

/* ++店舗情報++ */
.tInfoBxR {
    display: contents !important;
}

.tInfoTitBx {
    order: -1 !important;
}

/* --店舗情報-- */

/* ++お知らせ++ */
.tNewsBxL {
    display: contents !important;
}

.tNewsBtnBx {
    order: 2;
}

/* --お知らせ-- */

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

@media screen and (min-width:768px) {

    .tMenuFlL {
        display: flex !important;
    }

    .tLinkItemIn01 {
        display: flex;
        transition: all .3s;
    }

    .tLinkItemIn02 {
        opacity: 0;
        pointer-events: none;
        transition: all .3s;
    }

    .tLinkItem:hover .tLinkItemIn01 {
        opacity: 0;
        pointer-events: none;
    }

    .tLinkItem:hover .tLinkItemIn02 {
        opacity: 1;
        pointer-events: all;
    }

    /* ++商品紹介++ */
    .tRecommend::before {
        height: 350px;
    }

    .tRecBx section {
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
    }

    /* --商品紹介-- */

    /* ++店舗情報++ */
    .tInfoBxR {
        display: flex !important;
    }

    /* --店舗情報-- */

    /* ++お知らせ++ */
    .tNewsBxL {
        display: flex !important;
    }

    /* --お知らせ-- */
}

/* min-width: 768px ここまで */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

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

@media screen and (min-width:1024px) {


    /* ++商品紹介++ */
    .tRecTit {
        margin: 20px 0 0;
        font-size: 24px;
    }

    /* --商品紹介-- */
}

/* min-width: 1024px ここまで */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

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

@media screen and (min-width:1440px) {

    .tFvTxtBx {
        left: 125px !important;
    }

    .tFvTit {
        font-size: 100px !important;
    }

    .tLinkItem {
        padding: 50px 40px 70px !important;
    }

    .tRecBx section {
        gap: 160px;
    }

}

/* min-width: 1440px ここまで */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */