@charset "utf-8";

div#menuWrap {
  width: 960px;
  margin: 5px auto 20px;
  display: grid;
  display: -ms-grid;
  -ms-grid-columns: 1fr 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  -ms-grid-rows: 270px 150px;
  /* grid-template-rows: 270px 150px repeat(auto-fit, 150px); */
}
div#menuWrap > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
div#menuWrap > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
div#menuWrap > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 4;
}
div#menuWrap > *:nth-child(4) {
  -ms-grid-row: 2;
  -ms-grid-column: 3;
}
div#menuWrap > *:nth-child(5) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}
div#menuWrap > *:nth-child(6) {
  -ms-grid-row: 4;
  -ms-grid-column: 1;
}
div#menuWrap > *:nth-child(7) {
  -ms-grid-row: 4;
  -ms-grid-column: 3;
}
div#menuWrap > *:nth-child(8) {
  -ms-grid-row: 4;
  -ms-grid-column: 4;
}
div#menuWrap > *:nth-child(9) {
  -ms-grid-row: 5;
  -ms-grid-column: 1;
}
div#menuWrap > *:nth-child(10) {
  -ms-grid-row: 5;
  -ms-grid-column: 2;
}
div#menuWrap > *:nth-child(11) {
  -ms-grid-row: 7;
  -ms-grid-column: 1;
}
div#menuWrap > *:nth-child(12) {
  -ms-grid-row: 7;
  -ms-grid-column: 2;
}
div#menuWrap > *:nth-child(13) {
  -ms-grid-row: 7;
  -ms-grid-column: 3;
}
div#menuWrap > *:nth-child(14) {
  -ms-grid-row: 7;
  -ms-grid-column: 4;
}
div#menuWrap > *:nth-child(15) {
  -ms-grid-row: 8;
  -ms-grid-column: 1;
}
div#menuWrap > *:nth-child(16) {
  -ms-grid-row: 8;
  -ms-grid-column: 3;
}
div#menuWrap > *:nth-child(17) {
  -ms-grid-row: 8;
  -ms-grid-column: 4;
}
div#menuWrap > *:nth-child(18) {
  -ms-grid-row: 9;
  -ms-grid-column: 1;
}
div#menuWrap > *:nth-child(19) {
  -ms-grid-row: 9;
  -ms-grid-column: 2;
}

div#menuWrap div.box {
  margin: 10px;
  border-radius: 8px 8px 0 0;
  position: relative;
  overflow: hidden;
}
div#menuWrap div.box.food {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1 / 3;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 4 / 7;
}
div#menuWrap div.box.drink {
  -ms-grid-column: 3;
  -ms-grid-column-span: 2;
  grid-column: 3 / 5;
  -ms-grid-row: 2;
  -ms-grid-row-span: 2;
  grid-row: 2 / 5;
}
/* div#menuWrap div.box.special { -ms-grid-column:1; -ms-grid-column-span:2; grid-column:1 / 3; -ms-grid-row:3; -ms-grid-row-span:2; grid-row:3 / 5; } */
div#menuWrap div.box.special01 {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1 / 3;
  -ms-grid-row: 3;
  -ms-grid-row-span: 1;
  grid-row: 1 / 2;
}
div#menuWrap div.box.special02 {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1 / 3;
  -ms-grid-row: 5;
  -ms-grid-row-span: 2;
  grid-row: 2 / 4;
}
div#menuWrap div.box.special03 {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1 / 3;
  -ms-grid-row: 5;
  -ms-grid-row-span: 2;
  grid-row: 4 / 6;
}

/* 特販ないとき
div#menuWrap div.box.otsumami,
div#menuWrap div.box.dessert { -ms-grid-row:3; -ms-grid-row-span:2; grid-row:3 / 7; }
*/

/* 特販あるとき */
div#menuWrap div.box.otsumami,
div#menuWrap div.box.dessert {
  -ms-grid-row: 5;
  -ms-grid-row-span: 2;
  grid-row: 5 / 7;
}

div#menuWrap div.box.lunch {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1 / 3;
  -ms-grid-row: 7;
  -ms-grid-row-span: 2;
  grid-row: 7 / 9;
}
div#menuWrap div.box.girlsplan {
  -ms-grid-column: 3;
  -ms-grid-column-span: 2;
  grid-column: 3 / 5;
  -ms-grid-row: 7;
  -ms-grid-row-span: 2;
  grid-row: 7 / 9;
}
div#menuWrap div.box.noodle,
div#menuWrap div.box.party {
  -ms-grid-row: 9;
  -ms-grid-row-span: 2;
  grid-row: 7 / 9;
}
div#menuWrap div.box.kids,
div#menuWrap div.box.energy {
  -ms-grid-row: 9;
  -ms-grid-row-span: 2;
  grid-row: 10 / 11;
}

div#menuWrap div.box.voicedrink {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1 / 3;
  -ms-grid-row: 11;
  -ms-grid-row-span: 2;
  grid-row: 10 / 12;
}

div#menuWrap div.box.voicedrink-org {
  -ms-grid-column: 3;
  -ms-grid-column-span: 2;
  grid-column: 3 / 5;
  -ms-grid-row: 11;
  -ms-grid-row-span: 2;
  grid-row: 11 / 13;
}

div#menuWrap div.box.mio,
div#menuWrap div.box.shotbottle,
div#menuWrap div.box.tequila {
  -ms-grid-row: 13;
  -ms-grid-row-span: 2;
  grid-row: 13 / 15;
}

div#menuWrap div.box.bottle {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 3 / 5;
  -ms-grid-row: 11;
  -ms-grid-row-span: 2;
  grid-row: 7 / 9;
}

div#menuWrap div.box.sjk {
  -ms-grid-column: 3;
  -ms-grid-column-span: 2;
  grid-column: 3 / 5;
  -ms-grid-row-span: 2;
  grid-row: 10 / 12;
}

div#menuWrap div.box img {
  object-fit: cover;
  -o-object-fit: cover;
  height: 250px;
  width: 100%;
  /* border-radius: 8px; */
  -moz-transition: -moz-transform 0.2s linear;
  -webkit-transition: -webkit-transform 0.2s linear;
  -o-transition: -o-transform 0.2s linear;
  -ms-transition: -ms-transform 0.2s linear;
  transition: transform 0.2s linear;
}
div#menuWrap div.box img:hover {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -o-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05);
}
div#menuWrap div.box.sizeL img {
  height: 400px;
}
div#menuWrap div.box div.caption {
  /* position: absolute; */
  left: 0;
  bottom: 0;
  margin: 0;
  width: 100%;
  font-size: 112%;
}
div#menuWrap div.box div.caption.captionRed {
  color: #fff;
  padding: 15px 0 15px 42px;
  border-radius: 0 0 8px 8px;
}
div#menuWrap div.box div.caption.captionWh {
  font-size: 15px;
  color: #1a1a1a;
  padding: 10px 0 10px 42px;
}
div#menuWrap div.box div.caption.captionRed.iconFD {
  background: #e50012 url("../img/1812/ic_food_wh.png") no-repeat left 8px
    center / 30px;
  border-radius: 0 0 8px 8px;
}
div#menuWrap div.box div.caption.captionRed.iconDK {
  background: #e50012 url("../img/1812/ic_drink_wh.png") no-repeat left 8px
    center / 30px;
  border-radius: 0 0 8px 8px;
}
div#menuWrap div.box div.caption.captionWh.iconFDP {
  background: #f1f1f1 url("../img/1812/ic_food_pk.png") no-repeat left 8px
    center / 30px;
  border-radius: 0 0 8px 8px;
}
div#menuWrap div.box div.caption.captionWh.iconDKB {
  background: #f1f1f1 url("../img/1812/ic_drink_bl.png") no-repeat left 8px
    center / 30px;
  border-radius: 0 0 8px 8px;
}

div#menuWrap div.box div.caption.iconBK {
  background: #454545 url("../img/1812/ic_food_blk.png") no-repeat left 8px
    center / 30px;
  color: #fff;
  border-radius: 0 0 8px 8px;
  padding: 10px 0 10px 42px;
}

div#menuWrap div.box.sizeL div.caption {
  font-size: 137%;
}

div#menuWrap div#topItem {
  text-align: center;
  width: 218px;
}
div#menuWrap div#topItem img {
  height: auto;
}
div#menuWrap div#topItem h2 {
  margin: 0;
}
div#menuWrap div#topItem h2 img {
  max-width: 180px;
}
div#menuWrap div#topItem ul {
}
div#menuWrap div#topItem ul li {
}
div#menuWrap div#topItem ul li img {
  max-height: 180px;
  width: auto;
  margin: 0 auto;
}
.bx-wrapper {
  margin-bottom: 0;
}
.bx-wrapper .bx-pager.bx-default-pager a {
  background-color: #ccc;
  width: 6px;
  height: 6px;
  margin: 0 4px;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
  background-color: #e60012;
}

/* ==============================================================
 Less than TABLET
================================================================= */
@media screen and (max-width: 991px) {
  div#menuWrap {
    width: 96%;
  }
}

/* ==============================================================
 Less than 851px
================================================================= */
@media screen and (max-width: 851px) {
  div#menuWrap {
    width: 92%;
    margin: 2% auto 4%;
    display: block;
    overflow: hidden;
    zoom: 1;
  }
  div#menuWrap:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
  }
  div#menuWrap div.box {
    float: left;
    display: inline;
    width: 47%;
    margin: 1.5%;
  }
  div#menuWrap div#topItem {
    width: 47%;
  }
  div#menuWrap div.box.sizeL {
    width: 97%;
  }
  div#menuWrap div.box.sizeL img {
    height: 350px;
  }
  div#menuWrap div.box.potato,
  div#menuWrap div.box.apetizer {
    width: 47%;
  }
  div#menuWrap div.box.special01,
  div#menuWrap div.box.special02,
  div#menuWrap div.box.special03,
  div#menuWrap div.box.voicedrink,
  div#menuWrap div.box.bottle,
  div#menuWrap div.box.voicedrink-org,
  div#menuWrap div.box.sjk {
    width: 97%;
  }
  div#menuWrap div.box.special01 img,
  div#menuWrap div.box.special02 img,
  div#menuWrap div.box.special03 img,
  div#menuWrap div.box.voicedrink img,
  div#menuWrap div.box.voicedrink-org img {
    height: auto;
  }
  div#menuWrap div.box.girlsplan {
    width: 63.7%;
  }
  div#menuWrap div.box div.caption.captionRed.iconFD,
  div#menuWrap div.box div.caption.captionRed.iconDK,
  div#menuWrap div.box div.caption.captionWh.iconFDP,
  div#menuWrap div.box div.caption.captionWh.iconDKB {
    background-size: 20px auto;
  }
  div#menuWrap div.box.special div.caption,
  div#menuWrap div.box.special div.caption01,
  div#menuWrap div.box.special div.caption02 {
    font-size: 15px;
  }
  div#menuWrap div.box div.caption.captionRed,
  div#menuWrap div.box div.caption.captionWh {
    padding-left: 40px;
    padding-right: 8px;
  }
}

/* GRID
	div#menuWrap { grid-template-columns:1fr 1fr; grid-template-rows:auto; }
	div#menuWrap div.box { grid-row:auto !important; grid-column:1 !important; }
	div#menuWrap div.box.sizeL { grid-column:1 / 3 !important; }
	/*
}


/* ==============================================================
 Less than SP-LANDSCAPE
================================================================= */
@media screen and (max-width: 568px) {
  div#menuWrap div.box {
    width: 47%;
  }
  div#menuWrap div.box.lunch,
  div#menuWrap div.box.girlsplan,
  div#menuWrap div.box.voicedrink,
  div#menuWrap div.box.bottle,
  div#menuWrap div.box.voicedrink-org {
    width: 97%;
  }
  div#menuWrap div.box img {
    height: 210px;
  }
  div#menuWrap div.box.drink img,
  div#menuWrap div.box.special img {
    height: 230px;
  }
  div#menuWrap div.box.special01 img,
  div#menuWrap div.box.special02 img,
  div#menuWrap div.box.special03 img,
  div#menuWrap div.box.voicedrink img,
  div#menuWrap div.box.voicedrink-org img {
    /* height:210px; */
  }
}

/* ==============================================================
 SP-LANDSCAPE
================================================================= */
@media screen and (min-width: 480px) and (max-width: 767px) {
}

/* ==============================================================
 SP-PORTRAIT
================================================================= */
@media screen and (min-width: 0px) and (max-width: 479px) {
}

/* ==============================================================
 Less than SP-PORTRAIT
================================================================= */
@media screen and (max-width: 479px) {
  div#menuWrap div.box.special01 img,
  div#menuWrap div.box.special02 img,
  div#menuWrap div.box.special03 img,
  div#menuWrap div.box.voicedrink img,
  div#menuWrap div.box.voicedrink-org img {
    /* height:180px; */
  }
}

/* ==============================================================
 Less than SP-PORTRAIT / iPhone5
================================================================= */
@media screen and (max-width: 320px) {
  div#menuWrap div.box.special01 img,
  div#menuWrap div.box.special02 img,
  div#menuWrap div.box.special03 img,
  div#menuWrap div.box.voicedrink img,
  div#menuWrap div.box.voicedrink-org img {
    /* height:150px; */
  }
}