.img-ob {
    position: relative
}

.img-ob img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    -o-object-fit: cover;
    object-fit: cover
}

.bg-parallax {
    position: relative;
    z-index: 0
}

.img-parallax {
    clip: rect(0, auto, auto, 0);
    margin-bottom: 0;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: -1
}

.img-parallax img {
    width: 100% !important;
    height: 100vh !important;
    position: fixed;
    bottom: 0;
    left: 0;
    padding: 0;
    margin: 0;
    -o-object-fit: cover;
    object-fit: cover;
    z-index: 0;
    transform: translateZ(0)
}

.slick-dots li {
    border-radius: 0;
    width: 17px;
    height: 17px;
    box-sizing: border-box;
    border: 1px solid #fff;
    background: rgba(0, 0, 0, 0);
    margin: 0;
    cursor: pointer
}

.slick-dots li.slick-active {
    background: #fff
}

.slick-dots li+li {
    margin-left: 15px
}

.slick-dots li button {
    display: none
}

.btn-link {
    max-width: 350px;
    text-align: center;
    position: relative
}

.btn-link a {
    display: block;
    text-decoration: none;
    background: #153893;
    color: #fff;
    position: relative;
    font-size: 18px;
    letter-spacing: .15em;
    line-height: 2;
    padding: 17px 0
}

.btn-link a:after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 20px;
    background: url("../img/menu/arrow.png") no-repeat center/100% auto;
    width: 9px;
    height: 15px
}

@media screen and (min-width: 768px) {
    .img-ob-pc {
        position: relative
    }

    .img-ob-pc img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100% !important;
        height: 100% !important;
        -o-object-fit: cover;
        object-fit: cover
    }

    .txt-center-pc {
        text-align: center
    }

    .btn-link a:hover {
        opacity: .8
    }
}

.remodal-overlay {
    background: url("../img/menu/bg.jpg")
}

.remodal {
    background: rgba(0, 0, 0, 0);
    width: 100%;
    max-width: 100%;
    color: #fff;
    padding: 100px 0 100px
}

.remodal .remodal-close {
    position: absolute;
    width: 50px;
    top: 30px;
    right: 4%;
    height: auto
}

#popupfood h2,
#popupdrink h2 {
    font-size: 6.5vw;
    line-height: 1.5;
    letter-spacing: .15em
}

#popupfood .sub-txt,
#popupdrink .sub-txt {
    margin: 4vw 0 12vw
}

#popupfood .flex .col+.col,
#popupdrink .flex .col+.col {
    margin-top: 60px
}

#popupfood .flex .col h4,
#popupdrink .flex .col h4 {
    border-bottom: 1px solid;
    line-height: 1.5;
    font-size: 16px;
    letter-spacing: .1em;
    padding: 0 0 10px
}

#popupfood .flex .col h4~h4,
#popupdrink .flex .col h4~h4 {
    margin-top: 60px
}

#popupfood .flex .col dl,
#popupdrink .flex .col dl {
    padding: 12px 0 12px;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid rgba(255, 255, 255, .5)
}

#popupfood .remodal-close2,
#popupdrink .remodal-close2 {
    margin: 100px auto 0;
    width: 70px;
    cursor: pointer
}

@media screen and (max-width: 767px) {
    .img-ob-sp {
        position: relative
    }

    .img-ob-sp img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100% !important;
        height: 100% !important;
        -o-object-fit: cover;
        object-fit: cover
    }
}

#key {
    display: block;
    padding: 10vw 0 0
}

#key .img {
    height: 120vw
}

#key .key-txt {
    top: 14vw;
    position: absolute;
    z-index: 2;
    right: -20vw;
    width: 80vw
}

#sec1 {
    position: relative;
    padding: 10vw 0 12vw;
    color: #fff;
    z-index: 2
}

#sec1::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: -12vw;
    background: url("../img/menu/bg.jpg");
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 96%, 0% 100%);
    clip-path: polygon(0 0, 100% 0, 100% 96%, 0% 100%)
}

#sec1::after {
    background: url("../img/drink/sec1_deco.png") no-repeat left top/100%;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 50vw;
    height: 50vw
}

#sec1 .set1 {
    position: relative;
    z-index: 2;
    margin: 0 4%
}

#sec1 .set2 {
    position: relative;
    z-index: 2;
    margin: 12vw 0 0
}

#sec1 .set2 .img {
    height: 60vw
}

#sec1 .set2 .left {
    margin: 10vw 4% 0
}

#sec1 .set2 .left h2 {
    width: 60vw
}

#sec1 .set2 .left .txt {
    margin: 8vw 0 0
}

#sec1 .group-btn {
    margin: 12vw 4% 0
}

#sec1 .group-btn .sub-txt {
    padding: 0 13% 0
}

#sec2 {
    position: relative;
    z-index: 1
}

#sec2 .deco {
    position: absolute;
    top: 0;
    left: 80vw;
    width: 25vw
}

#sec2 .deco2 {
    position: absolute;
    top: 57vw;
    width: 25vw;
    right: 80vw
}

#sec2 .inner {
    position: relative;
    z-index: 2;
    padding: 0 4%
}

#sec2 h2 {
    margin: 0 10% 8vw
}

#sec2 .txt2 {
    margin: 15px 0 8vw
}

#sec2 .img {
    height: 55vw
}

#sec2 .group {
    margin-top: 10vw
}

#sec2 .group .box {
    position: relative;
    z-index: 2;
    padding: 6vw 4% 8vw;
    margin: -10vw 4% 0;
    color: #fff;
    background: #153893;
    box-sizing: border-box
}

#sec2 .group .box .txt3 {
    font-size: 16px;
    border-bottom: 1px solid;
    padding: 0 0 10px 15px
}

#sec2 .group .box .txt {
    margin: 15px 0 0 15px
}

#sec2 .bnr {
    margin: 12vw auto 0;
    box-shadow: 0px 9px 15px 0px rgba(0, 0, 0, .2)
}

/*  */
#sec2 .inner .sec2-bnr a {
    display: block;
    line-height: 1.5;
    background: url("../img/drink/s2_bnr.jpg") no-repeat left top/cover;
    color: #fff;
    font-size: 5vw;
    text-shadow: 1px 2px 3px #000;
    padding: 10vw 5% 15vw;
    margin-top: 15vw;
    letter-spacing: .15em;
    box-shadow: rgba(0, 0, 0, .16) 0px 10px 36px 0px, rgba(0, 0, 0, .06) 0px 0px 0px 1px
}

#sec2 .inner .sec2-bnr a:hover {
    opacity: .8
}

#sec2 .inner .sec2-bnr a span {
    letter-spacing: .15em
}

#sec2 .inner .sec2-bnr a span.fs-s {
    font-size: 4vw
}

#sec2 .inner .sec2-bnr a span.fs-xl {
    display: block;
    position: relative;
    font-size: 7.5vw;
    margin-right: 43%
}

#sec2 .inner .sec2-bnr a span.fs-xl::before {
    content: "";
    position: absolute;
    background: url("../img/robata/sec4_border.png") no-repeat bottom center/100%;
    width: 100%;
    height: 1vw;
    bottom: 0;
    left: 0
}

#sec2 .inner .sec2-bnr a span .fs-m {
    font-size: 5vw
}
/*  */



#sec3 {
    text-align: center;
    margin: 15vw 4% 0;
    padding: 0 0 12vw
}

#sec3 h2 {
    margin: 0 10% 7vw
}

#sec3 .slide .slick-arrow {
    position: absolute;
    top: 50vw;
    width: 6vw;
    height: 8vw
}

#sec3 .slide .slick-arrow.slick-prev {
    left: 0vw;
    background: url("../img/drink/left.png") no-repeat center/100% auto
}

#sec3 .slide .slick-arrow.slick-next {
    right: 0vw;
    left: auto;
    background: url("../img/drink/right.png") no-repeat center/100% auto
}

#sec3 .slide .item {
    /* box-sizing: border-box */
    width: 500px;
}

#sec3 .slide .item .img {
    /* box-sizing: border-box; */
    margin: 0 14%
}

#sec3 .slide .item h4 {
    margin: 5vw 0 5vw;
    font-size: 5.5vw;
    line-height: 1.3;
    letter-spacing: .15em
}

#sec3 .slide .item h4 small {
    display: block;
    font-size: 4vw;
    letter-spacing: .15em
}

#sec3 .slide .item .txt {
    max-width: 90%;
    margin: 0 auto;
    text-align: left;
    letter-spacing: .1em
}

#bg {
    background: url("../img/menu/bg.jpg");
    color: #fff
}

#bg .bg-parallax {
    min-height: 50vw;
    -webkit-clip-path: polygon(0 0, 100% 10%, 100% 100%, 0% 100%);
    clip-path: polygon(0 0, 100% 10%, 100% 100%, 0% 100%)
}

#sec4 {
    padding: 15vw 0 0
}

#sec4 .flex .right h2 {
    margin: 0 33% 7vw
}

#sec4 .flex .right .txt {
    letter-spacing: .1em
}

#sec4 .flex .left {
    position: relative;
    margin: 20vw 10% 0
}

#sec4 .flex .left h3 {
    position: absolute;
    top: -7vw;
    left: 5vw;
    background: #c40004;
    text-align: center;
    height: 60vw;
    font-size: 5.5vw;
    line-height: 1.5;
    padding: 0 1vw
}

#sec4 .flex .left h3 small {
    font-size: 4vw
}

#sec5 {
    margin: 12vw 4% 10vw
}

#sec5 .bnr-shared {
    margin: 12vw 8% 0
}

#sec5 .box {
    position: relative;
    padding: 0 0 10vw
}

#sec5 .box::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 4vw;
    bottom: 0;
    border: 1px solid rgba(255, 255, 255, .8)
}

#sec5 .box:after {
    content: "";
    position: absolute;
    left: 1.5vw;
    right: 1.5vw;
    top: 5vw;
    bottom: 1.5vw;
    border: 1px solid rgba(255, 255, 255, .8)
}

#sec5 .box h3 {
    font-size: 5vw;
    line-height: 1.5;
    letter-spacing: 0em
}

#sec5 .box h3 small {
    font-size: 5vw
}

#sec5 .box h3 span {
    padding: 0 5%;
    display: inline-block;
    position: relative;
    z-index: 2;
    background: url("../img/menu/bg.jpg")
}

#sec5 .box .inner {
    margin: 8vw 7% 0;
    position: relative
}

#sec5 .box .inner #feed dl {
    width: 200px;
    margin: 0 auto
}

#sec5 .box .inner #feed dl dt a {
    display: block
}

#sec5 .box .inner #feed dl dt span {
    display: block;
    background: url("../img/drink/rss_img.jpg") no-repeat center/cover;
    width: 100% !important;
    height: 40vw !important
}

#sec5 .box .inner #feed dl dd {
    box-sizing: border-box;
    padding: 5vw 0 0
}

#sec5 .box .inner #feed dl dd span {
    display: block;
    margin: 0 0 -3px
}

#sec5 .box .inner #feed dl dd a {
    letter-spacing: 0
}

#sec5 .box .inner .btn-more {
    margin: 3vw 0 0;
    font-size: 16px;
    text-align: center
}

#sec5 .box .inner .btn-more img {
    width: auto
}

@media screen and (min-width: 768px) {
    #key {
        padding: 100px 0 0
    }

    #key .img {
        height: 900px
    }

    #key .key-txt {
        top: 100px;
        right: 0;
        left: auto;
        width: auto
    }

    #sec1 {
        padding: 76px 0 79px;
        z-index: 2
    }

    #sec1::before {
        bottom: -106px;
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 85.1%, 0% 100%);
        clip-path: polygon(0 0, 100% 0, 100% 85.1%, 0% 100%)
    }

    #sec1:after {
        height: 765px;
        width: 682px
    }

    #sec1 .set1 {
        display: flex;
        justify-content: center;
        margin: 0 0 0 11px
    }

    #sec1 .set1 .txt {
        height: 190px
    }

    #sec1 .set2 {
        display: flex;
        flex-direction: row-reverse;
        align-items: flex-start;
        margin: 112px 0 0
    }

    #sec1 .set2 .img {
        width: calc(50% + 130px);
        height: 480px;
        max-width: calc(100% - 535px)
    }

    #sec1 .set2 .left {
        width: 515px;
        margin: 60px 0 0
    }

    #sec1 .set2 .left h2 {
        width: auto
    }

    #sec1 .set2 .left .txt {
        margin: 68px 0 0 7px;
        width: 470px
    }

    #sec1 .group-btn {
        margin: 103px auto 0;
        width: 350px
    }

    #sec1 .group-btn .sub-txt {
        padding: 0
    }

    #sec1 .group-btn .bnr-shared a {
        padding-left: 7px
    }

    #sec2 .deco {
        top: -79px;
        left: calc(50% + 425px);
        width: auto
    }

    #sec2 .deco2 {
        top: 847px;
        width: auto;
        right: calc(50% + 387px)
    }

    #sec2 .inner {
        padding: 0 20px
    }

    #sec2 h2 {
        margin: 0 0 52px
    }

    #sec2 .txt2 {
        margin: 20px 0 36px
    }

    #sec2 .img {
        max-width: 1100px;
        margin: 0 auto;
        height: 580px
    }

    #sec2 .group {
        margin: 63px auto 0;
        width: 1000px;
        box-sizing: border-box;
        padding: 0 0 0 98px;
        display: flex;
        align-items: flex-start
    }

    #sec2 .group .box {
        margin: 68px 0 0 -47px;
        width: 418px;
        padding: 32px 22px 34px 23px
    }

    #sec2 .group .box .txt3 {
        font-size: 18px;
        line-height: 35px;
        border-bottom: 1px solid;
        padding: 0 0 14px 25px
    }

    #sec2 .group .box .txt {
        line-height: 35px;
        font-size: 15px;
        margin: 15px 0 0 29px
    }

    #sec2 .bnr {
        margin: 98px auto 0;
        width: 880px
    }

/*  */
#sec2 .inner .sec2-bnr {
    max-width: 880px;
    margin: 115px auto 0
}

#sec2 .inner .sec2-bnr a {
    margin-top: 0;
    padding: 91px 0 207px 33px;
    line-height: 54px;
    font-size: 25px
}

#sec2 .inner .sec2-bnr a span.fs-s {
    font-size: 20px
}

#sec2 .inner .sec2-bnr a span.fs-xl {
    font-size: 35px;
    margin: 0 0 0 -4px
}

#sec2 .inner .sec2-bnr a span.fs-xl::before {
    width: 235px;
    height: 8px;
    bottom: -1px
}

#sec2 .inner .sec2-bnr a span .fs-m {
    font-size: 25px
}

/*  */



    #sec3 {
        margin: 94px 58.5px 0;
        padding: 0 0 92px
    }

    #sec3 h2 {
        margin: 0 0 59px
    }

    #sec3 .slide {
        max-width: 1383px;
        margin: 0 auto
    }

    #sec3 .slide .slick-arrow {
        top: 247px;
        width: 33px;
        height: 55px
    }

    #sec3 .slide .slick-arrow.slick-prev {
        left: -33.5px
    }

    #sec3 .slide .slick-arrow.slick-next {
        right: -33.5px
    }

    #sec3 .slide .slick-slide {
        width: 461px !important
    }

    #sec3 .slide .item .img {
        padding: 0
    }

    #sec3 .slide .item h4 {
        margin: 30px 0 32px;
        font-size: 30px
    }

    #sec3 .slide .item h4 small {
        font-size: 20px
    }

    #sec3 .slide .item .txt {
        max-width: 340px;
        margin: 0 auto
    }

    #bg .bg-parallax {
        min-height: 517px;
        -webkit-clip-path: polygon(0 0, 100% 36%, 100% 100%, 0% 100%);
        clip-path: polygon(0 0, 100% 36%, 100% 100%, 0% 100%)
    }

    #sec4 {
        padding: 137px 0 0
    }

    #sec4 .flex {
        display: flex;
        flex-direction: row-reverse;
        justify-content: space-between
    }

    #sec4 .flex .right {
        width: 377px
    }

    #sec4 .flex .right h2 {
        margin: 0 0 90px 71px
    }

    #sec4 .flex .left {
        width: 500px;
        margin: 1px 0 0 -4px
    }

    #sec4 .flex .left h3 {
        top: -41px;
        left: 29px;
        height: 311px;
        font-size: 30px;
        padding: 0 5px
    }

    #sec4 .flex .left h3 small {
        font-size: 20px
    }

    #sec5 {
        margin: 91px auto 30px;
        max-width: 1000px
    }

    #sec5 .bnr-shared {
        margin: 0
    }

    #sec5 .bnr-shared a {
        margin: 116px auto 0
    }

    #sec5 .box {
        margin: 0 60px;
        padding: 0 0 77px
    }

    #sec5 .box::before {
        top: 22px
    }

    #sec5 .box:after {
        left: 8px;
        right: 8px;
        top: 30px;
        bottom: 9px
    }

    #sec5 .box h3 {
        font-size: 30px;
        letter-spacing: .12em
    }

    #sec5 .box h3 small {
        font-size: 25px
    }

    #sec5 .box h3 span {
        padding: 0 23px
    }

    #sec5 .box .inner {
        margin: 53px auto 0;
        max-width: 560px
    }

    #sec5 .box .inner #feed dl {
        display: flex;
        width: auto
    }

    #sec5 .box .inner #feed dl dt {
        width: 200px
    }

    #sec5 .box .inner #feed dl dt a:hover {
        opacity: .8
    }

    #sec5 .box .inner #feed dl dt span {
        width: 100% !important;
        height: 130px !important
    }

    #sec5 .box .inner #feed dl dd {
        width: calc(100% - 200px);
        padding: 18px 0 0 55px
    }

    #sec5 .box .inner .btn-more {
        position: absolute;
        bottom: -10px;
        right: 11px;
        font-size: 21px;
        margin: 0
    }

    .remodal {
        padding: 160px 0 188px
    }

    .remodal .remodal-close {
        width: auto;
        top: 43px;
        right: 57px
    }

    #popupfood h2,
    #popupdrink h2 {
        font-size: 38px
    }

    #popupfood .sub-txt,
    #popupdrink .sub-txt {
        margin: 20px 0 100px
    }

    #popupfood .wrap,
    #popupdrink .wrap {
        max-width: 1000px;
        margin: 0 auto
    }

    #popupfood .flex,
    #popupdrink .flex {
        margin: 0 30px;
        display: flex;
        justify-content: space-between
    }

    #popupfood .flex .col,
    #popupdrink .flex .col {
        width: 428px
    }

    #popupfood .flex .col+.col,
    #popupdrink .flex .col+.col {
        margin-top: 0
    }

    #popupfood .flex .col h4,
    #popupdrink .flex .col h4 {
        font-size: 20px;
        letter-spacing: .15em
    }

    #popupfood .flex .col h4~h4,
    #popupdrink .flex .col h4~h4 {
        margin-top: 100px
    }

    #popupfood .remodal-close2,
    #popupdrink .remodal-close2 {
        margin: 196px 0 0;
        width: auto;
        text-align: center
    }

    #popupfood .remodal-close2:hover,
    #popupdrink .remodal-close2:hover {
        opacity: .8
    }
}