@charset "UTF-8";

/* Mobile Size */
@media screen and (max-width:767px){
    
    .row{
        width: 96%;
    }
    .rowWide {
        width:100%;
    }
    .pcOnly {
        display: none;
    }
    .spOnly {
        display: block;
    }
    .algLeftSP {
        font-size: 0.8rem;
        line-height: 160%;
        padding-left: 1em;
        text-align: left;
    }
    b.phoneNumb {
        margin-right:0.5em;
        font-size:1rem;
    }
    h3.titGreen {
        margin-bottom: 2em;
        font-size: 1rem;
    }
    header.headerCommon .flxBox {
        height: 22vw;
    }
    header.headerCommon h1 img {
        width: 38vw;
        height: auto;
        margin-left: 0.4em;
    }
    header.headerCommon h2 {
        margin-right: 1em;
        font-size: 0.75rem;
    }
    #topPageVisual img {
        width: 100%;
        height: 66vw;
        object-fit: cover;
    }
    #menuAreaTop {
        padding-bottom: 0em;
    }
    #menuAreaTop .flxBox {
        flex-direction: column;
    }
    #menuAreaTop ul .menuList {
        padding-left:1em;
        padding-right: 1em;
        text-align: center;
    }
    #menuAreaTop ul h4 {
        text-align: center;
        font-size: 1rem;
    }
    #menuAreaTop ul li.shopMenu .menuList {
        margin-bottom: 0.4em;
        font-size: 0.88rem;
    }
    #menuAreaTop ul li.shopMenu .photoSpace {
        padding:0;
    }
    #menuAreaTop ul li.shopMenu .photoSpace img {
        width : calc(100% / 3) ;
        height: 33vw;
    }
    #menuAreaTop ul li#ikebukuro {
        margin-bottom: 2em;
        padding-right: 0;
        border-right: none;
    }
    #menuAreaTop .titMenueTop {
        margin-bottom: 2em;
        border-bottom: none;
    }
    #menuAreaTop .titMenueTop h3 {
        padding-bottom: 0em;
        font-size: 1rem;
        letter-spacing: 0.1em;
        border-bottom: none;
    }
    #instaArea {
        padding-bottom: 2em;
        padding-top: 2em;
    }
    #instaArea .pluginArea {
        padding-top: 1.6em;
    }
    #instaArea .pluginArea img {
        width: 30vw;
        height: auto;
        margin-left: 4px;
    }
    #instaArea {
        flex-direction: column;
    }
    #instaArea h3 {
        font-weight: 400;
        font-family: 'Noto Serif JP', serif;
        letter-spacing: 0.2em;
    }
    .btnToPage#toStanderd {
        width:100%;
        height: 26vw;
        margin-bottom: 4em;
        background-size:100% auto;
    }
    .btnToPage#toStanderd a {
        font-size: 1rem;
    }
    #conceptTop {
        padding-bottom: 0em;
        padding-top: 4em;
    }
    #conceptTop p {
        padding: 0 1em;
        margin-bottom: 2em;
        text-align: left;
    }
    #conceptTop .flxBox img {
        width: 50%;
        height: 48vw;
    }
    #shopList ul {
        flex-direction: column;
        padding: 0em 2em;
    }
    .btnToPage#toDelivere {
        width:84vw;
        height: 26vw;
        background-size:100% auto;
    }
    .btnToPage#toDelivere a p {
        font-size: 1rem;
    }
    .btnToPage#toDelivere a h4 {
        font-size: 1rem;
    }
    #shopList {
        padding-bottom: 2em;
        padding-top: 2em;
    }
    #shopList ul li {
        margin-top: 2em;
    }
    #shopList ul h5 {
        margin-bottom: 1em;
        font-size: 1rem;
    }
    #shopList ul p {
        font-size: 0.75rem;
    }
    footer .footerMain {
        flex-direction: column;
    }
    footer .footerMain h2 {
        margin-bottom: 2em;
    }
    footer .footerMain ul li {
        font-size: 0.88rem;
    }
    
    
    /* Standard Page */
    .titPageArea {
        width: 100%;
        height: 60vw;
        background-attachment: scroll;
    }
    .titPageArea h3 {
        margin-bottom: 0.4em;
        font-size: 1.5rem;
        letter-spacing: 0.2em;
    }
    .titPageArea p {
        padding: 0 1em;
        font-size: 0.88rem;
    }
    #conceptMain {
        padding-bottom: 6em;
        padding-top: 3em;
    }
    #conceptMain .titSect {
        padding-bottom: 2em;
        line-height: 200%;
    }
    #conceptMain .titSect p {
        padding: 0 1em;
        text-align: left;
    }
    #conceptMain .box .flxBox {
        margin-bottom: 2em;
        flex-direction: column;
        align-items: center;
    }
    #conceptMain .imgArea img.imgBox1 {
        width: 100%;
        height: 40vw;
        object-fit: cover;
        font-family: 'object-fit: cover;'; /*object-fit　IE11対策*/
    }
    #conceptMain .box .flxBox .txtArea {
        padding-left: 1em;
        padding-right: 1em;
        padding-top: 2em;
        text-align: center;
    }
    #conceptMain .box #conceptBox2 {
        flex-direction: column;
    }
    #conceptMain .box .flxBox .txtArea h4, .boxConcept2 .txtArea h4 {
        margin-bottom: 0.4em;
        font-size: 1.25rem;
    }
    .boxConcept2 {
        align-items: center;
        flex-direction: column;
    }
    .boxConcept2 .imgArea img.imgBox2 {
        margin-left: 0vw;
        width: 100%;
        height: 40vw;
        object-fit: cover;
        font-family: 'object-fit: cover;'; /*object-fit　IE11対策*/
    }
    .boxConcept2 .txtArea {
        padding-left: 1em;
        padding-right: 1em;
        padding-bottom: 2em;
        padding-top: 2em;
        text-align: center;
    }
    .boxConcept2 .txtArea p.text {
        margin-top: 0em;
        padding-bottom: 1em;
        padding-top: 1em;
        line-height: 180%;
        border-bottom: thin solid #DED5C1;
    }
    .boxConcept2 .txtArea p:last-child {
        border-bottom: none;
    }
    
    /* Delivery Page */
    #bentoMenu {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
    }
    #menuDeliv li {
        width: 50%;
        font-size: 0.88rem;
        line-height: 160%;
    }
    #menuDeliv li img {
        width: 44vw;
        height: auto;
    }
    #menuDeliv li h5 {
        margin-bottom: 0.6em;
        font-size: 0.88rem;
    }
    .titDeliv {
      padding-left: 1em;
      padding-right: 1em;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
    }
    .titDeliv p {
        text-align: left;
    }
    .titDeliv h2 {
        margin-bottom: 1.8em;
        font-size: 1.25rem;
    }
    .titDeliv h3 {
        margin-bottom: 1em;
        padding-bottom:0.8em;
        font-size: 1rem;
    }
    #drink ul {
        width: 90vw;
    }
    #order {
        padding-bottom: 2em;
        padding-top:3em;
    }
    #order dl {
        margin-bottom: 2em;
        padding-left: 0;
        padding-right: 0;
        flex-direction: column;
        font-size: 0.75rem;
        line-height: 160%;
    }
    #order dl dt {
        width:100%;
        margin-bottom: 1em;
        font-weight: 600;
    }
    #order dl dd {
        width: 100%;
    }

}