body {
    font-size: 85%;
    line-height: 1.45;
}

.nav-target {
    padding-top: 60px;
    padding-bottom: 70px;
}

@media screen and (max-width: 767px) {
    .nav-target {
        padding-top: 5vw;
        padding-bottom: 0;
    }
}



.txt_area {
    text-align: center;
    margin-bottom: 30px;

}

#drinkwrap {
    width: 960px;
    height: 314px;
    margin: 0 auto 16px;
    background-image: url(../img/drink/img01.jpg);
    background-repeat: no-repeat;
    background-position: left top;
}

#drinkwrap .r {
    float: right;
    width: 470px;
    margin-top: 160px;
}

#menuwrap2 {
    width: 880px;
    background-image: url(../img/drink/bg_mid.jpg);
    background-repeat: repeat-y;
    background-position: left top;
    padding: 40px;
    margin: 0 auto;
}

#menuwrap2 .wrap1 {
    width: 880px;
    clear: both;
    overflow: hidden;
    zoom: 1 !important;
}


#menuwrap2 h4 {
    margin-bottom: 5px;
}

#menuwrap2 .wrap1 .l {
    width: 280px;
    float: left;
}

#menuwrap2 .wrap1 .c {
    width: 280px;
    float: left;
    margin-left: 20px;
}

#menuwrap2 .wrap1 .r {
    width: 280px;
    float: right;
}

#menuwrap2 .menulist1 {
    margin-bottom: 1em;
}

.toggle__sp {}

.toggle__sp h3 {
    font-size: 20px;
    margin-bottom: 15px;
    margin-top: 15px;
    padding-left: 30px;
    position: relative;
}

.toggle__sp h3::before {
    content: "";
    background: url("../img/shared/icon_active.png") no-repeat top center;
    background-size: 100% auto;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 33px;
    height: 26px;
    opacity: 1;
    filter: brightness(0) invert(0);
}


.toggle__sp .inner {}

.toggle__sp dl {
    border-bottom: 1px #a89f8a dotted;
    padding-bottom: 5px;
    margin-bottom: 0.7em;
    display: flex;
    justify-content: space-between;
}

.toggle__sp dl dt {
    text-align: left;
    padding-left: 18px;
    font-weight: bold;
    color: #412818;
    /* background-image: url(../img/shared/icon_maru_bk.png); */
    background-repeat: no-repeat;
    background-position: left 3px;
}

.toggle__sp dl dd {
    text-align: right;
    font-weight: bold;
    color: #ae0000;
    font-size: 90%;


}

.toggle__sp .txt {
    text-align: left;
    padding-left: 18px;
    color: #5e594c;
    font-size: 90%;
    margin-bottom: 15px;
}




#menuwrap_f {
    width: 960px;
    height: 16px;
    background-image: url(../img/drink/bg_bt.jpg);
    background-repeat: no-repeat;
    background-position: left top;
    margin-bottom: 42px;
    margin-left: auto;
    margin-right: auto;
}



@media screen and (max-width: 767px) {
    .nav-target {
        padding-top: 10vw;
    }

    div#contants_bt {
        width: 100%;
    }

    .txt_area {
        padding-left: 5vw;
        padding-right: 5vw;
        text-align: justify;
    }

    #drinkwrap {
        width: auto;
        height: auto;

    }

    #menuwrap2 {
        background: none;
    }

    #menuwrap2 .wrap1,
    #menuwrap2 {
        width: auto;
        padding: 0;
    }

    #menuwrap2 .wrap1 .l,
    #menuwrap2 .wrap1 .c,
    #menuwrap2 .wrap1 .r {
        width: auto;
        float: none;
    }

    #menuwrap2 .wrap1 {
        padding-left: 5vw;
        padding-right: 5vw;
    }

    #menuwrap2 .wrap1 .c {
        margin-left: 0;
    }

    .toggle__sp {
        margin: 3vw 0 0;
        position: relative;
        background: url(../img/drink/bg_o.png) repeat;
        padding: 2vw 3vw;
        box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.1);
    }

    .toggle__sp h3 {
        font-size: 18px;
        margin: 0 10px;
        padding: 8px 0 8px 27px;
    }

    .toggle__sp h3::before {
        width: 23px;
        height: 18px;
    }

    .toggle__sp dl {
        padding: 6px 0;
    }

    .toggle__sp dl dt {
        padding-left: 0;

    }

    #menuwrap_f {
        width: auto;
        height: auto;
    }

    h2.ttl {
        margin-bottom: 5vw;
    }

    #drinkwrap {
        background: url("../img/drink/bg_mid_sp.jpg") no-repeat top center;
        background-size: 100% auto;
        margin: 0 0 5vw;
        border: 4px solid transparent;
        border-image: url('../img/index/bg_wood.jpg') 30% round;
        padding: 4px;


    }



    #drinkwrap .r {
        float: none;
        width: auto;
        margin-top: 0;
        margin-bottom: 8vw;
    }

    #drinkwrap .r h2 {
        margin-bottom: 3vw;
    }

    #drinkwrap .r .text {
        padding-left: 5vw;
        padding-right: 5vw;
        margin-bottom: 4vw;
    }


    .toggle-link::after {
        content: "";
        position: absolute;
        right: 0px;
        top: 50%;
        transform: translateY(-50%);


        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-top: 7px solid #333;

        transition: transform 0.3s ease;
    }


    .toggle.active .toggle-link::after,
    .toggle__sp.active .toggle-link::after {
        transform: translateY(-50%) rotate(180deg);
    }

}