@charset "utf-8";

/* リセット */

*{ margin: 0;padding: 0;
}

a { text-decoration : none;
	color:#666;
}

ul, ol { list-style : none;
}

img { vertical-align : middle;
}

/* @end */





/* @group HTML */

html {
font-family :"メイリオ", "はれのそら明朝", "ＭＳ Ｐゴシック";
font-size:95%; /*レスポンシブタイプセッティングの指定*/
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
	

/*background : url(../images/960_grid_12_col.png) repeat-y top center;*/


display: table;
  width: 100%;
  height: 100%;
}

body{
  display: table-cell; 
  text-align: center;
  vertical-align: middle;
}

body{  
    margin: 0;  
    padding:1px 0 50px 0;  
}  
* html body{  
    overflow: hidden;  
}

p.not-text{
	display:none;
	}

.not-text2{
	display:none;
	}

form.not-text{
	display:none;
	}


#sp{
background:#FFFAF3;
}

#sp2{
background:#000;
}

.white{
color: #fff;
}

iframe {
    width: 290px;
    border: none;
	overflow: hidden;
	margin: 0 auto;
	padding: 0;
	text-align: center;
}

p{
text-align: left;
margin-top: 2%;
	margin-bottom: 3%;
	margin-left: 2%;
	margin-right: 2%;
	font-size: 1em;
}

.top-table{
margin-top: -20px;
}


/* @end */


/*WEBフォント（教科書フォント）*/

@font-face {
    font-family: "HGRSKP";
    src: url(HGRSKP.eot) format("eot");
    src: url(HGRSKP.ttf) format("truetype");
    font-weight: normal;
    font-style: normal;

}

/* @group Heading */


h2 {
font-family: HGRSKP,"ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
font-size : 1.25em; 
line-height : 1.3333; /* 48px */
margin-bottom : 0.6667em;
	margin-top: 0.6667em;
  color: #666;

text-align:center;
	 font-weight: normal;
    font-style: normal;
} 

h3 {
font-family:"ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
font-size : 2em; /* 36px */
line-height : 1; /* 24px */
margin-bottom : 1em;
color:#666;
text-align:left;

}

h4{
font-family:"ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
font-size : 1.25em;
text-align:left;
line-height : 1; /* 24px */
color:#666;
} 

h5,h6 {
font-family:"ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
font-size : 1.25em;
text-align:left;
line-height : 1; /* 24px */
padding-left:5%;
color:#666;
} 



.img-btm{
	vertical-align: -150%;
}


.li-cnt4{
	text-align:left;
	line-height:150%;
	margin:1.5em;
	font-size:1.5em;
}

/* @end */

/* ヘッダーエリア（header） */

header { 

width: 100%; 
text-align : center;
background-color: #000;
box-shadow: 0px 1px 5px 0px #888;　/* CSS3 影をつける */
border-bottom:solid 1px #FFF;
box-sizing:border-box; /* CSS3 ボーダーを幅にカウントしない */
	z-index: 10000;
}

/* @end */

/* グローバルナビゲーション */

nav {
width: 100%;  /*navにwidth:100%追加し*/


}

nav ul {
overflow : hidden;
}

nav ul li { 
float : left;
border-collapse:collapse;
box-sizing:border-box; /* CSS3 ボーダーを幅にカウントしない */

}

nav ul li a {
display : block;
color : #FFF;
padding : 0.75em 0;

}

nav ul li a:hover {
color : white;
background-color : #222;
}


.hgroup a:hover {
	background: #222;

}

/* @end */



/*navにwidth:100%を追加し、Javascriptで追加した.fixedクラスを指定します。*/

.fixed{
position: fixed;
top: 0px;
left: 0px;
z-index: 9999;
}


/* メインイメージ */

#main-img{
	margin: 0;
	padding:0;
	width: 100%;
	background-image:url(../images/back.jpg);


}

#main-img980{
	display: none;

}

.viewer{
display: none;
}



/*フッター*/

footer{
	font-family: 'a-otf_kyoukasho_ica_prol';
	width: 100%;
	padding:0.8em 0;
	font-size: 0.8em;
	color:#333;
	text-align:center;
	border-top: solid 1px #333;
}

.p-footer{
	width: 100%;
	margin: 0 auto;
	text-align: center;
	
}

/*コンテンツ共通部分*/

#content01,#content02,#content03,#content04,#content05,#content06,#content07,.content{
	width:100%;
	height: auto;
	margin:0 auto;
	text-align:center;
	padding-top:1em;
padding-bottom:1em;
}

#content,#content2,#content3,#content4,#content5,#content6,#content7,#content8,#content9{
width:100%;
	overflow: hidden;
	margin:0 auto;
	text-align:center;
}




section{
	padding-left:2%;
	padding-right:2%;
	display: flex;
  flex-direction: column;
}



/* コンテンツエリア Content01 */

#content01 {
width : 90%;
margin : 0 auto;
text-align : center;
padding-bottom: 1%;
}

/* Flexbox Content01 */

.content{
width : 90%;
margin : 0 auto;
text-align : center;
padding-bottom: 1%;
}

 
.flex-container{
    display: flex;
    min-height: 10vh;
    flex-direction: column;
	-js-display: flex;
	display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}
 
.flex-items {

  flex: 1;
 
  display: flex;
 flex-wrap: wrap;
}
 
.item01 {
  flex: 1 1 150px;
  background-color: #FFF;
	border: solid 1px #C5C5C5;
	margin: 1%;
}

.item01v {
  flex: 1 1 150px;
}

.item01s {
  flex: 1 1 150px;
}

.item01g {
  flex: 1 1 150px;
}

.item02 {
  flex: 1 1 350px;
  background-color: #FFF;
	border: solid 1px #C5C5C5;
	margin: 1%;
}

.item03 {
  flex: 3 1 350px;
  background-color: #FFF;
	border: solid 1px #C5C5C5;
	margin: 1%;
}


.item04 {
  flex: 1 1 20px;
	border-left:#C5C5C5 solid 1px;
	border-right: #C5C5C5 solid 1px;
	border-collapse: collapse;
	margin-top: 4em;
	margin-bottom: 1em;
	font-size: .7em;
}
.item04 a{
	color: #777777;
	text-decoration: none;
}

.item04 a:hover{
	color: #999999;
	text-decoration:underline;
}

.left-box{
	padding: .5em;
	text-align: left;
}

.left-box2{
	display: inline-block;
	padding: .5em;
	text-align: left;
	border: solid 1px #CDCDCD;
}


.left-box h3{
	font-size:1em;
	text-align: left;
	font-family: "游明朝", YuMincho,"ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
	font-weight: normal;
}

.left-box h3 span{
	font-size: .7em;
}

.left-box h2 span{
	font-size: .7em;
}

h2 span{
	font-size: .7em;
}

.left-box p{
	font-size:.9em;
	text-align: left;
	font-family :"メイリオ", "はれのそら明朝", "ＭＳ Ｐゴシック";
	font-weight: normal;
}



.btn01 a{
	width:70%;
    font-size:.9em;
    font-weight:normal;
    text-decoration:none;
    display:block;
    text-align:center;
    padding:5px;
    color:#000;
    border: solid 1px #C5C5C5;
	margin: 0 auto;
	
}

.btn01 a:hover{
	border: solid 1px #C5C5C5;
}


.btn01-no a{
	display: none;
	
}

.btn01-no a:hover{
	display: none;
}


.lines-on-sides, h2 {
  display: table;
  text-align: center;
  white-space: nowrap;
}
.lines-on-sides:after, h2:after, .lines-on-sides:before, h2:before {
  content: '';
  display: table-cell;
  width: 50%;
  background: -webkit-linear-gradient(transparent 50%, currentColor 50%, currentColor -webkit-calc(50% + 1px), transparent -webkit-calc(50% + 1px));
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, currentColor), color-stop(currentColor calc(50% + 1px)), to(transparent calc(50% + 1px)));
  background: linear-gradient(transparent 50%, currentColor 50%, currentColor calc(50% + 1px), transparent calc(50% + 1px));
  -webkit-background-clip: padding;
  background-clip: padding;
}
.lines-on-sides:after, h2:after {
  border-left: 1em solid transparent;
}
.lines-on-sides:before, h2:before {
  border-right: 1em solid transparent;
}

.lines-on-sides, .v-menu {
  display: table;
  text-align: center;
  white-space: nowrap;
}
.lines-on-sides:after, .v-menu:after, .lines-on-sides:before, .v-menu:before {
  content: '';
  display: table-cell;
  width: 50%;
  background: -webkit-linear-gradient(transparent 50%, currentColor 50%, currentColor -webkit-calc(50% + 1px), transparent -webkit-calc(50% + 1px));
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, currentColor), color-stop(currentColor calc(50% + 1px)), to(transparent calc(50% + 1px)));
  background: linear-gradient(transparent 50%, currentColor 50%, currentColor calc(50% + 1px), transparent calc(50% + 1px));
  -webkit-background-clip: padding;
  background-clip: padding;
}
.lines-on-sides:after, .v-menu:after {
  border-left: 1em solid transparent;
}
.lines-on-sides:before, .v-menu:before {
  border-right: 1em solid transparent;
}

h3 {
  font-size: 1em;
  color: #666;
}

img{
text-align: center;
}

/* @end */




/* コンテンツエリア Content02 */


#content02 {
width : 100%;
background:#FFFAF3;
margin : 0 auto;
text-align : center;
padding: 1% 0;
}



.h3-cnt02{
	font-family: 'a-otf_kyoukasho_ica_prol';
	border-left: #e0d998 solid 5px;
	padding-left:10px;
	margin:2em 1em;
}


.li-cnt2{
	margin:1em;
	background-image:url(../images/arrow.png);
	background-repeat:no-repeat;
	vertical-align:text-top;
	padding-left:20px;
	font-size:1em;
	text-align:left;
}

.li-cnt2 a{
	color:#387c38;
	text-decoration:underline;
}







/* @end */





/* コンテンツエリア Content03 */

#content03 {
width : 100%;
margin : 0 auto;
text-align : center;
padding-top:1em;
padding-bottom:1em;
}

#content03 p { 
margin-bottom : 1.5em;
text-align : left；
}

#content03 img { 
margin-bottom : 1.5em; 

}


/* フッターエリア Footer */


.footer-link{
width : 100%;
margin : 0 auto;
text-align : center;
padding: 0;
}



.box{
display: -webkit-flex;
display: flex;
}

.box2 a{
display: table-cell;

	color: rgba(91,91,91,1.00);
	font-size: .5em;
}

.box li{
margin: 1%;
}

.red a{
	font-weight: bold;
	color: #5B0001;
	text-decoration: underline;
	line-height: 3em;
	font-size: 1.2em;
	
}

.red{

font-weight: bold;
	color:#9E0002;
}

.green{
color: #959F4E;
}
.p-top{
margin-top: 1em;
font-size: 4em;
line-height: 200%;
}

.p-top2{
font-size: 1em;
	color:rgba(195,0,3,1.00);
}

.btn02 a{
	width:80%;
    font-size:.9em;
    font-weight:normal;
    text-decoration:none;
    display:block;
    text-align:center;
    padding:5px;
    color:#FFF;
    border: solid 1px #FFF;
	margin: 10px auto;
	background: #5B0001;
	
}

.scroll{
overflow-y: scroll;
height: 380px;
}


/* ////////////////    季の味　タイトル部分　色変更    ////////////////// */

.h3-cnt03{
	background:#fff8ed;
	color:#B8974F;
	font-weight: bold;
	padding: 10px;
	margin: 0 auto;
	

}

/* ////////////////    季節限定品　タイトル部分　色変更    ////////////////// */
.h3-cnt04{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#a68b68+0,dec4a4+100 */
background: #a68b68; /* Old browsers */
background: -moz-linear-gradient(top, #a68b68 0%, #dec4a4 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #a68b68 0%,#dec4a4 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #a68b68 0%,#dec4a4 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a68b68', endColorstr='#dec4a4',GradientType=0 ); /* IE6-9 */

	color: #FFF;
	font-weight: bold;
	padding: 10px;
	margin: 0 auto;
	

}

.h4-top{
	color: #B8974F;
margin-top: 1em;
	font-family: "游明朝", YuMincho,"ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";

}

.h4-top2{
	color: #B8974F;
	padding-top: 4%;
	margin-top: 2em;
	font-family: "游明朝", YuMincho,"ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";

}
/* ////////////////    季の味　背景色変更    ////////////////// */
.li-top{
	background: #FFF8ED;
}
/* @end */



/*ドロワーメニュー*/

 #menu{
    display: none;
  }
  #menu li{
    width: 100%;
  }
  #toggle{
    display: block;
    position: relative;
    width: 100%;
    background:#5b0001;
  }
  #toggle a{
    display: block;
    position: relative;
    padding: 12px 0 10px;
    border-bottom: 1px solid #FFF;
    color: #F2EFD9;
    text-align: center;
    text-decoration: none;
  }
 


/* トップへ戻るボタン　*/

div#btn_top{
	position:fixed;
	right:0;
	bottom:20px;
	width:26px;
	height:78px;
	background-image:url(../images/top_icon.png);
	background-repeat:no-repeat;
	cursor:pointer;
}


/*黄金の一汁（権太呂のおだし）*/

.item-v{
writing-mode: tb-rl;
	font-family:HGRSKP,"ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
	flex: 1 1;
	line-height: 150%;
	height: 250px;
	font-size: .8em;
-webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;

}




.item-v h2{
font-weight: bold;
padding: 0;
	margin-left:10px;
	margin-top: 3px;
}

.item02v {
  flex: 1 1 300px;
  background-color: #FFF;

	margin: 1%;
}

.item03v {
  flex: 3 1 150px;
  background-color: #FFF;

	margin: 1%;
}

.item02s {
  flex: 1 1 300px;
  background-color: #FFF;

	margin: 1%;
}

.item03s {
  flex: 3 1 150px;
  background-color: #FFF;

	margin: 1%;
}


.flex-items-v {

  flex: 1;
 
  display: flex;
 flex-wrap: wrap;
	background: #fff;
}
#content06 {
width : 100%;
margin : 0 auto;
text-align : center;
padding-top:1em;
padding-bottom:1em;
}

#content07 {
width : 100%;
margin : 0 auto;
text-align : center;
padding-top:1em;
padding-bottom:1em;
}


/* 権太呂なべ*/

.item02g {
  flex: 1 1 350px;
  background-color: #000;

	margin: 1%;
}

.item03g {
  flex: 3 1 350px;
  background-color: #000;

	margin: 1%;
}

.flex-items-g {

  flex: 1;
 
  display: flex;
 flex-wrap: wrap;
	background: #000;
}

/*店舗情報*/

.shop-table{
text-align: left;
padding: 1%;
	margin: 1%;
font-size: .8em;
	vertical-align: top;
}

.shop-table tr{
border:  solid 5px #FFF;
}

.shop-table td{
padding: 1%;
	margin: 1%;
	vertical-align: top;
}
.border-right{
	margin: 1%;
border-right: solid 1px #7C7C7C;
	padding-bottom: 1%;
	vertical-align: top;
}

.left{
text-align: left;
}

.left-no{
text-align: left;
margin-left: 0;
padding-left: 0;
}

.right{
text-align: right;
}

.border-bottom{
	border-bottom: solid 1px #C1C1C1;
}

.price-table{
width: 95%;
	font-size: .8em;
	margin-bottom:1%;
}

.price-table span{
font-size: .8em;
	padding-left: 1em;
}

.item03s h3{
	margin-bottom: 2%;
	margin-top: 3%;
}


/*tumblr.*/

.specbox-img3{

	border: #4B5C7B solid 1px;
	box-sizing: border-box;
	border-collapse: collapse;
	background: #FFF;
	padding: .2em;
	vertical-align: top;
	margin-bottom: 1em;
	border-radius:5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
	width: 100%;
}

.specbox-left3{
	font-size: 3em;
display:table-cell;
	color: #4B5C7B;
	width: 40%;
	vertical-align: middle;
}

.specbox-right3{
display:table-cell;
	width: 60%;
	color: #4B5C7B;
	text-align: left;
	margin: 0;
	padding: .5em;
	vertical-align: top;
	font-size: .8em;
}

.blue{
	color: #4B5C7B;
}

.specbox-img4{

	border:#D54547 solid 1px;
	box-sizing: border-box;
	border-collapse: collapse;
	background: #FFF;
	padding: .2em;
	vertical-align: top;
	margin-bottom: 1em;
	border-radius:5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
	width: 100%;
}

.specbox-left4{
	font-size: 3em;
display:table-cell;
	color: #D54547;
	width: 40%;
	vertical-align: middle;
}

.specbox-right4{
display:table-cell;
	width: 60%;
	color: #D54547;
	text-align: left;
	margin: 0;
	padding: .5em;
	vertical-align: top;
	font-size: .8em;
}

.shop-map {
    width: 42.2%;
    float: right;
  }

.map-page .shop-map {
    float: none;
    width: 100%;
  }

#googlemap {
  width: 100%;
  height: 180px;
  border: 1px solid #ccc;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.map-page #googlemap {
  height: 450px;
}

#googlemap img {
  max-width: none;
}

.item05s {
  flex: 1 1 980px;
width: 100%;
	clear: both;


}

.underline{
text-decoration: underline;
}


/*=============================================================
768px
=============================================================*/

@media screen and (min-width : 768px){
	
	p.not-text{
	display: block;
	}
	
	.not-text2{
	display:block;
	}

	form.not-text{
	display: block;
	}


#content01 { text-align : left}

#main-img980{
	display: none;


}


/* スライダー　*/


.viewer {
display:block;
margin-left:auto;
margin-right:auto;
margin-top: -24px;
margin-bottom:48px;
width: 768px;
height: 320px;
text-align: center;
overflow: hidden;
}

.viewer ul {
width: 768px;
height: 320px;
text-align: left;
overflow: hidden;
position: relative;
}

.viewer ul li {
top: 0;
left: 0;
width: 768px;
height: 320px;
display: none;
position: absolute;
}
	
.item-v{

	line-height: 200%;
	height: 350px;
	font-size: 1.1em;
	margin-right: 100px;

}

.item-v h2{
font-weight: bold;
padding: 0;
	margin-left:10px;
	margin-top: 3px;
}
	
	.btn01-no a{
	display: block;
	width:60%;
    font-size:.9em;
    font-weight:normal;
    text-decoration:none;
    display:block;
    text-align:center;
    padding:5px;
    color:#000;
    border: solid 1px #C5C5C5;
	margin: 10px auto;
	
}

.btn01-no a:hover{
	border: solid 1px #C5C5C5;
}
	
.underline{
text-decoration:none;
}

}

/*=============================================================
1024px
===============================================================*/


@media screen and (min-width : 1024px) {
	

	p.not-text{
	display: block;
	}

	.not-text2{
	display:block;
	}

/* @group Nav */

nav ul {
width : 93.75%;/* 960/1024 */
margin : 0 auto}

/* @end */

#main-img980{
	margin: 0;
	padding:0;
	margin-top: 5px;
	display:block;
	z-index: -9999;

}

#main-img{
	display: none;

}
	
	iframe {
    width: 100%;
    border: none;
	overflow: hidden;
	margin: 0 auto;
	padding: 0;
	text-align: center;
}

/*---------------------------------------------
 Contents
----------------------------------------------*/

/* 共通 */
	
section{
	max-width:980px;
	text-align:center;
	margin : 0 auto;
}
	

article,
aside{ 
float : left;
margin : 0 1.0416667% } 
	
	
 
 /* コンテンツ01 */
 

#content01{
overflow : hidden;
width : 980px;
}


#content01 article{ width : 64.5833333%}
#content01 aside{ width : 31.25%}



 /* コンテンツ02 */
 
 
#content02{
overflow : hidden;
width : 100%
}




#content02 article{ width : 45%}
#content02 aside{ width : 50%}





 /* コンテンツ03 */


#content03 {
overflow : hidden;
width : 100%;
}





#content03 article{ width : 64.5833333%}
#content03 aside{ width : 31.25%}




/* @end */






/* Footer */

footer {
width : 100%; 
margin : 0 auto;

}

/* @end */
	
	
/* スライダー　*/

#main-img{
display:none;
}
	
	#main-img980{

	display: block;
	}

.viewer {
display:block;
margin-left:auto;
margin-right:auto;
margin-bottom:48px;
margin-top: -24px;
width: 980px;
height: 400px;
text-align: center;
overflow: hidden;
}

.viewer ul {
width: 980px;
height: 400px;
text-align: left;
overflow: hidden;
position: relative;
}

.viewer ul li {
top: 0;
left: 0;
width: 980px;
height: 400px;
display: none;
position: absolute;
}

/*ドロワーメニュー*/
	
	#menu-box{text-align: center;
	margin: 0 auto;
	overflow: hidden;
	width: 980px;
	}

.hgroup{
	float: left;
	width: 25%;
	margin: 0;
	}
	
	nav{
	float:left;
	width: 75%;
	}


#menu{
display:block;

max-width: 980px;
margin: 0 auto;
padding: 0;


}
	
	
#menu li{

float: left;
width: 10%;
margin: 0;
padding-top: 1%;
font-size:0.7em; 
}
	



.gnav03 a{
	background-color:#777777;
	border-radius: 20px;
	width: 100px;
	margin: 2px auto;
	}

#toggle{ 
 display: none;
}
	
	
.item-v{

	line-height: 200%;
	height: 350px;
	font-size: 1.1em;
	margin-right: 250px;

}

.item-v h2{
font-weight: bold;
padding: 0;
	margin-left:10px;
	margin-top: 3px;
}

	.nowrap{
	white-space: nowrap;
	text-wrap: none;
	}
	
	.box li{
white-space: nowrap;
		text-wrap: none;
		width: 100%;
}
	
	.btn01-no a{
	display: block;
	width:60%;
    font-size:.9em;
    font-weight:normal;
    text-decoration:none;
    display:block;
    text-align:center;
    padding:5px;
    color:#000;
    border: solid 1px #C5C5C5;
	margin: 10px auto;
	
}

.btn01-no a:hover{
	border: solid 1px #C5C5C5;
}

.underline{
text-decoration:none;
}


}