@charset "utf-8";
@import url('css/slideshow.css');
@import url('css/layout.css');
@import url('css/slicknav.css');

.sp {
	display:none;
}

@media screen and (max-width:740px) {
	.pc {
		display:none;
	}
	.sp {
		display:block;
		color:#ffffff;
	}
}

@media screen and ( max-width: 740px ) {   /* ウィンドウサイズが 740px 以下の場合有効 */
    .container{padding:2em 0 1em 0;}
    #header #logo{ position:relative;}
    #header #logo h1{margin:14px auto; padding:0; font-size:22px; text-transform:uppercase; width: 257px;}
    #mv2 {
        width: 100%;
        height:100px;
        background-position:center top;
        background-repeat:no-repeat;
        background-size:cover;
    }
    .banner01 {position: relative; display:block; padding:2em 3em; width:100%; background-color:#e5a200;}
    .banner02 {position: relative; display:block; padding:2em 3em; width:100%; background-color:#e54100;}
    .banner01 .banner_icon,.banner02 .banner_icon  {position: absolute; left:0; right: 0; margin:0 auto; width:120px; top: -30px;}
    .entry img {
        float:right;
        width:60%;
    }
    input { width: 100%;}
    select { width: 100%;}
    textarea { width: 100%;}
}

@media screen and ( min-width: 741px )  {  /* ウィンドウサイズが 741px 以上の場合有効 */
    .container{padding:50px 0 30px 0;}
    #header #logo{ position:absolute;}
    #header #logo h1{margin:14px 0 0 0; padding:0; font-size:22px; text-transform:uppercase; width: 257px;}
    #mv2 {
        width: 100%;
        height:250px;
        background-position:center top;
        background-repeat:no-repeat;
        background-size:cover;
    }
    .banner01 {position: relative; display:table-cell; padding:2em 3em; width:25%; background-color:#e5a200;}
    .banner02 {position: relative; display:table-cell; padding:2em 3em; width:25%; background-color:#e54100;}
    .banner01 .banner_icon,.banner02 .banner_icon  {position: absolute; left:0; right: 0; margin:0 auto; width:140px; top: -70px;}
    .entry img {
        float:right;
        width:26%;
    }
    input { width: 30%;}
    select { width: 30%;}
    textarea { width: 50%;}
}

.mv_text {
    position: absolute;
    bottom:0;
    left:0;
    }


input.wpcf7-submit, input.wpcf7-confirm, input.wpcf7-back {
  background:#583C32;
  color:#fff;
  border:1px solid #583C32;
  padding:5px 10px;
  cursor: pointer;
  }

input.wpcf7-submit:hover, input.wpcf7-confirm:hover, input.wpcf7-back:hover {
  background:#9a8455;
  color:#fff;
  }

span.must { color:#C0272D;}

.content ul {
    padding:0.5em 2em;
}


.banner01 a,.banner02 a {display:block; color:#FFFFFF;}
.banner01 a:hover,.banner02 a:hover  {
 display:block;
 filter:alpha(opacity=70);
 -moz-opacity:0.7;
 opacity:0.7;
    }

.footer_logo {width:244px;}

.gallery_img {background-image: url("./img/mv/gallery.jpg");}
.menu_img {background-image: url("./img/mv/menu.jpg");}
.price_img {background-image: url("./img/mv/price.jpg");}
.news_img {background-image: url("./img/mv/news.jpg");}
.access_img {background-image: url("./img/mv/access.jpg");}

/* インフォメーションバナー
--------------------------------------------------------------------------------------------------------------- */
#inforbanner {
    width: 100%;
}

@media screen and ( max-width: 740px ) {   /* ウィンドウサイズが 640px 以下の場合有効 */
  #inforbanner .button {
    width : 100%;       /* 各ボタンを横幅の50% にする。 */
    float :left;       /* 指定要素を左に寄せる  */
  }
}

@media screen and ( min-width: 741px )  {  /* ウィンドウサイズが 641px 以上の場合有効 */
  #inforbanner .button {
    width : 50%;       /* 各ボタンを横幅の25% にする。 */
    float :left;       /* 指定要素を左に寄せる  */
  }
}
#inforbanner .button img {width:100%; height:auto; padding:0px 10px 20px 10px;}

#banner {
  width:100%;
  margin:0 auto;
  letter-spacing: -.40em;
}

@media screen and ( max-width: 740px ) {   /* ウィンドウサイズが 640px 以下の場合有効 */
  .gallery .gallery-icon {
    width : 50%;       /* 各ボタンを横幅の50% にする。 */
  }
}

@media screen and ( min-width: 741px )  {  /* ウィンドウサイズが 641px 以上の場合有効 */
  .gallery .gallery-icon {
    width : 25%;       /* 各ボタンを横幅の25% にする。 */
  }
}
.gallery .gallery-icon {padding:10px; height:auto; vertical-align: top;
display: -moz-inline-box; /*for Firefox 2*/
display: inline-block; /*for modern*/
/display: inline; /*for ie5～7*/
/zoom: 1; /*for ie5～7*/
letter-spacing: normal;
float:left;
}
.gallery .gallery-icon img {width:100%;height:auto;}


/* Tables
--------------------------------------------------------------------------------------------------------------- */
@media screen and ( max-width: 740px ) {   /* ウィンドウサイズが 740px 以下の場合有効 */
    table.food, .food th, .food td{border-collapse:collapse; vertical-align:top; color:#313131; text-align:left;}
    table.food, .food th{table-layout:auto;}
    table.food{width:100%; margin-bottom:15px;}
    .food th, .food td{display:block; width:100%; border:none;}
    .food th {padding:1em 0 0 0; font-weight:normal;}
    .food td {padding:1em 0 2em 0;}
}

@media screen and ( min-width: 741px )  {  /* ウィンドウサイズが 741px 以上の場合有効 */
    table.food, .food th, .food td{border-collapse:collapse; vertical-align:top; color:#313131; text-align:left;}
    table.food, .food th{table-layout:auto;}
    table.food{width:100%; margin-bottom:15px;}
    .food th, .food td{padding:1em 0 2em 0; width:33%; border:none;}
    .food th { font-weight:normal; text}
    .food td {padding-left:2em;}
}