/* ドリンクメニュー、フードメニュー用cssファイル */


/*=============================================
 * .clearfix
 *=============================================*/

.nav-fl,
.nav-fr,
.clearfix {
	zoom: 1 !important;
}
.nav-fl:after,
.nav-fr:after,
.clearfix:after,
dl::after {
	content: "." !important;
	clear: both !important;
	display: block !important;
	height: 0 !important;
	visibility: hidden !important;
    margin: 5px;
}
.nav-fl:after,
.nav-fr:after,
.clearfix:after,
dl::before {
	content: "." !important;
	clear: both !important;
	display: block !important;
	height: 0 !important;
	visibility: hidden !important;
    margin: 5px;
}

.fl {
	float: left;
}
.fr {
	float: right;
}
.fn {
	float: none;
}

/*=============================================*/

.info {
  margin: auto auto;
  position: relative;
  z-index: 1;
}

.info .box {
  width: 48%;
}
.sparkring_box {
    width: 100%;
}

.drink-category-title {
    font-weight: 700;
    margin: 1px 0;
}

.info .box dl, .info .sparkring_box dl {
  font-size: 15px;
  line-height: 20px;
  padding: 0 0 5px;
  margin-bottom: 5px;
}

.info .box dl dt, .info .sparkring_box dl dt {
  float: left;
}

.drink-frame .box dl dt {
    width: 50%;
}

.drink-frame .box .sparkling dt, .drink-frame .sparkring_box .sparkling dt {
    width: auto;
}


.info .box dl dt span, .info .sparkring_box dl dt span {
  font-weight: bold;
}

.info .box dl dd, .info .sparkring_box dl dd {
  float: right;
  text-align: left;
  padding-right: 5px;
}

.drink-frame .box dl dd, .drink-frame .sparkring_box dl dd {
  float: none;
}
.drink-frame .box .sparkling dd, .drink-frame .sparkring_box .sparkling dd {
  float: right;
}

.drink-frame .box dl .drink-price dd, .menu-price {
  font-weight: 700;
}

.box dl dt p, .sparkring_box dl dt p {
    font-weight: normal;
}

.blank-box {
    padding: 1em;
}

hr.style-one {
    border: 0;
    height: 1px;
    background: #333;
    margin: 0;
    background-image: -webkit-linear-gradient(left, #ccc, #333, #ccc);
    background-image:    -moz-linear-gradient(left, #ccc, #333, #ccc);
    background-image:     -ms-linear-gradient(left, #ccc, #333, #ccc);
    background-image:      -o-linear-gradient(left, #ccc, #333, #ccc);
}

.menu-grid {
    margin: 2em 0;
}
.menu-grid hr {
    border-top: 3px dashed #bbb;
}

@media(max-width:1280px){
  .info .box {
    width: 100%;
  }
}

@media only screen and (max-width: 1080px) and (min-width: 769px) {
  .info {
    width: 100%;
    position: relative;
    z-index: 1;
  }
}

@media only screen and (max-width: 768px) {
  .info {
    width: 100%;
    margin: 0;
    padding: 4%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  .wrap {
      padding: 0 0;
  }
  .menu-grid {
      text-align: center;
  }
}