@charset "utf-8";

@media screen and (max-width: 1040px) {
	.SP{ display: block;}
	.PC{ display: none;}
/*--header-------------------------------------------------------*/
	body{
		width: 100%;
		max-width: 100%;
		overflow-x: hidden;
	}
/*--header-------------------------------------------------------*/
#header{
	position: relative;
	width: 100%;
	min-height: 70vw;
}
#header .httl{
  position: absolute;
	display: block;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
	padding:0 30px;
	width: 80%;
}
#header .httl::before{
	content: " ";
	display: block;
	position: absolute;
	left:0;
	top:0;
	width: 13px;
	height: 100%;
	border:solid 2px #fff;
	border-right: none;
}
#header .httl::after{
	content: " ";
	display: block;
	position: absolute;
	right:0;
	top:0;
	width: 13px;
	height: 100%;
	border:solid 2px #fff;
	border-left: none;
}
#header .httl h1{
	font-size:1em;
	letter-spacing: 1.8px;
	line-height: 1.5em;
	padding-bottom:15px;
}
#header .httl p,#header .httl div{
	font-size:0.9em;
	letter-spacing: 1.8px;
	line-height: 1.5em;
	padding-bottom:10px;
}
#header .httl div{
	font-size:1.6em;
	letter-spacing: 4px;
	line-height: 1.5em;
}
#header #menu{
	display: block;
	position: fixed;
	padding:4px 0;
	backface-visibility:hidden;
	-webkit-backface-visibility:hidden;
	top: 10px;
	right: 10px;
	z-index: 9999;
}
.menu1,
.menu1 span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;

}
.menu1 {
  position: relative;
  width: 30px;
  height: 24px;
}
.menu1 span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: #fff;
  border-radius: 3px;
	box-shadow: 0 0 3px #000;
}
.menu1 span:nth-of-type(1) {
  top: 0;
}
.menu1 span:nth-of-type(2) {
  top: 10px;
}
.menu1 span:nth-of-type(3) {
  bottom: 0;
}
.menu1.active span:nth-of-type(1) {
  -webkit-transform: translateY(10px) rotate(-45deg);
  transform: translateY(10px) rotate(-45deg);
}
.menu1.active span:nth-of-type(2) {
  opacity: 0;
}
.menu1.active span:nth-of-type(3) {
  -webkit-transform: translateY(-10px) rotate(45deg);
  transform: translateY(-10px) rotate(45deg);
}
#gnav{
	width: 80%;
    height: 100%;
    transition: all 0.2s;
    transform: translate(100%);
    position: fixed;
    top: 0;
    right: 0;
    z-index: 1000;
	margin:0 auto;
	background: #1D1D1D;
	border-radius: 0;
	opacity: 0.9;
}
#gnav.open {
    transform: translate(0);
}
#gnav ul{
	justify-content: left;
	padding:30px;
}
#gnav ul li{
	width: 100%;
	font-size:1em;
	line-height: 1.4em;
	text-align: left;
	letter-spacing: 1.5px;
}
#gnav ul li a{
	padding:10px 0;
}

/*--header end-------------------------------------------------------*/

/*--content-------------------------------------------------------*/
#content{
	padding:50px 0 30px;
}
/*--main content end-------------------------------------------------------*/
/*--footer-------------------------------------------------------*/

#footer{
	padding:50px 0 0;
}
#footer .finfoL{
	float:none;
	width: 100%;
	text-align: center;
	padding-bottom:20px;
}
#footer .finfoL h3{
	font-size:1em;
}
#footer .finfoL .flogo{
	font-size:2em;
	letter-spacing: 4px;
	line-height: 1.3em;
	padding-bottom:15px;
}
#footer .finfoL .flogo span{
	letter-spacing: 1.5px;
}

#footer .finfoR{ float:none; width: 100%;}
#footer .finfo{
	padding:20px 0 20px;
}
#footer .finfo li{
	font-size:0.8em;
	line-height: 1.6em;
	letter-spacing: 1px;
	padding:0 0 15px;
}
#footer .finfo li:nth-child(1){
	margin-top:0;
	text-indent: 0;
	padding-left:0;
}
#footer .finfo li:nth-child(4){ margin-top:0; }
#map{
	width: 100%;
}
	#map iframe{ height: 150px;}

/*--footer end-------------------------------------------------------*/
/* common */
.ttl1{
	clear: both;
	position: relative;
	display: block;
	width: 90%;
	text-align: center;
	padding:5px 25px;
	min-height: 100%;
	font-size:1.6em;
	line-height: 1.2em;
	letter-spacing: 5px;
	margin:0 auto 30px;
}
.ttl2{
	clear: both;
	position: relative;
	display: inline-block;
	text-align: center;
	padding:15px 25px;
	min-height: 100%;
	font-weight: 600;
	font-size:1.2em;
	line-height: 1.5em;
	margin:0 0 30px;
}
.ttl1 span{
	font-size:0.8em;
	letter-spacing: 3px;
}
.ttl1::before,.ttl2::before{
	width: 13px;
	height: 100%;
}
.ttl1::after,.ttl2::after{
	width: 13px;
	height: 100%;
}
.ttl3{
	font-size:1.6em;
	letter-spacing: 4px;
}
.ttl3.takeout-ttl {
	font-weight: bold;
	color:#888;
	font-size:1.5em;
	letter-spacing: 3.8px;
}

/* common end */

/* TOP */
.top1{ width: 90%; margin:0 auto; padding:0 0 20px;}
.top1 h2{
	font-size:1.3em;
	line-height: 1.5em;
	padding-bottom:20px;
	letter-spacing: 3px;
}
.top1 p{
	font-size:1em;
	line-height: 1.8em;
	font-weight: normal;
	padding-bottom:40px;
}
.top2{
	margin-bottom:45px;
}
.top2 h2{
	padding:30px 0;
	font-size:1.3em;
	letter-spacing: 3px;
	line-height: 1.5em;
}
.top2 ul{
	width:90%;
	margin:0 auto;
}
.top2 ul li{
	width: 100%;
	padding:0 0 35px;
	margin:0;
	text-align: left;
}
.top2 ul li:nth-child(2n){ margin:0;}
.top2 ul li h3{
	font-size:1em;
	padding-bottom:20px;
}
.top2 ul li p{ font-weight: normal; line-height: 2em; font-size:0.8em; padding-bottom:30px;}
.top2 ul li .more{
	margin:0 auto;
	position: relative;
	bottom:0;
	  left: auto;
	  transform:none;
}
.top2 ul li .more a{
	font-size:1em;
	padding:10px 25px;
}

.top3{
	padding:30px 0;
}
.top3 .pic{
	width: 100%;
	padding-bottom:30px;
}
.top3 .pic img{ width: 100%;}
.top3 h3{
	color:#000000;
	font-size:1.1em;
	font-weight: 600;
	line-height: 1.4em;
	letter-spacing: 3px;
	padding:0 5% 20px;
}
.top3 p{
	font-size:0.9em;
	padding:0 5% 20px;
}
.top3 .more a{
	border-radius: 6px;
	font-size:1em;
	letter-spacing: 2px;
	padding:12px 25px 15px;
	line-height: 1em;
}
.top3 .more a i{
	top:32%;
}
.fbtns{
	background: #E2E2E2;
	padding:30px 0 15px;
	margin:50px 0;
}

.fbtns ul li{ margin-bottom:15px;}
.fbtns ul li a{
	padding:0 20px;
}
.fbtns ul li a .img{
	width: 100px;
	margin-right:20px;
}
.fbtns ul li a .txt{
	width: calc(100% - 120px);
	position: relative;
	font-size:1.1em;
	letter-spacing: 3px;
}
	.fbtns ul li a .txt span{ padding-left:10px;}
.fbtns ul li a .txt i{
	right:-5px;

}
.eventbtn{ padding:0 5% 50px;}

.eventbtn a{
	position: relative;
	display: block;
	width: 100%;
	margin:0 auto 20px;
}
.eventbtn p{ font-size:0.8em;}
.insta{
	padding: 0 0 70px;
}
	.insta h3{ padding-bottom:15px;}
.insta h3 img{ width:87px; height: auto;}
/* TOP end */
/* beefstew & vegitable */


.sec1wrap{
	padding:20px 0 80px;
}
.sec1 h2{
	margin:0 auto 15px;
	font-size:1.5em;
	font-weight: normal;
	letter-spacing: 4px;
}
.sec1 div,.sec2 div{
	width:100%;
}
.sec1 .pic{ float:none;}
.sec2 .pic{ float:none;}

.sec1 .txt{
	float:none;
	padding:30px 5%;
	text-align: left;
	font-size:0.8em;
}
.sec2 .txt{
	font-size:0.8em;
	float:none;
	padding:30px 5%;
}

.sec1 .txt h3,.sec2 .txt h3{
	padding-bottom:20px;
}

.step ol li{
	padding:60px 0 35px;
}
.step ol li::before{
	position: absolute;
	 font-family: "Font Awesome 5 Free";
  top: 10px;
  left: 50%;
  margin-left: -9px;
  content: '\f358';
  color: #000;
  font-size: 18px;
}
.step ol li:nth-child(1){ padding-top:0;}
.step ol li:nth-child(1)::before{ content: none;}
.step ol li:last-of-type{ border-bottom:none;}
.step ol li h3{
	float:left;
	font-family: 'Rufina', serif;
	font-size:1.5em;
	letter-spacing: 4px;
	font-weight: normal;
}
.step ol li .pic{ float:none; clear: both;width: 100%; padding-top:10px;}
.step ol li .txt{
	clear: both;
	float:none;
	width:100%;
	padding:15px 0;
	font-size:0.9em;
	font-weight: normal;
}
/* beefstew & vegitable end*/
/* menu */
#menupage #header .httl{ padding:0 30px; }
#menupage #header .httl h1{
	padding:15px 0 10px;
}

.menu01{
	padding:0;
}

.menu01 .pic{
	float:none;
	margin: 10px auto 0;
	width:100%;
}
.menu01 .txt{
	float:none;
	width:100%;
	padding:20px 0;
}
.menu01 .txt p{
	font-size:1em;
	padding-bottom:20px;
}
.menu01 .txt h3{
	font-size:1.4em;
	line-height: 1.3em;
	padding-bottom:15px;

}
.menu01 .txt .price{ padding:10px 0 0;}
.price{ font-size:1.4em !important; }
.osusume{ font-size:12px !important; }
.menulist1{
	padding:20px 0;
	margin-left:0;
}
.menulist1 li{
	width: 100%;
	margin:0 0 20px;
}
.menulist1 li p{ padding-bottom:20px;}

.menulist1 li .img{
	padding-bottom:15px;
}
.menulist1 li h3{
	font-size:1.4em;
	min-height: auto;
	padding-bottom:15px;
}
.menu02{
	padding:40px 0;
}
.menu03{
	padding:40px 0;
}
.menulist2{
	padding:30px 0 0;
}
.menulist2 li{
	width: 100%;
	margin:0 0 20px;
	letter-spacing: 1px;
	/* padding-right:5em; */
	font-weight: 500;
}
.menulist2 li:nth-child(2n){
	margin:0 0 20px;
}
.menulist1 li .img.topMenuImg{
	width: 100%;
	max-width: 350px;
	margin: 0 auto;
}
.menulist2 li.sweetsMenuImgBox,
.menulist2 li.sweetsMenuImgBox:nth-child(2n){
	width: 100%;
	max-width: 500px;
	margin: 0 auto 20px;
}
}

@media screen and (max-width: 1040px) {
  .lunchBox p {
    width: 100%;
    margin-bottom:30px;
    padding-right:0;
}
}
/*.menulist2 li:nth-child(odd){ order:1;}
.menulist2 li:nth-child(even){ order:2;}*/


.menulist2 li .up{
	white-space: nowrap;
	margin-left:0;
}
.menulist3{
	padding:15px 20px;
}
.menulist3 ul{
	width: 100%;
}
.menulist3 ul:nth-child(2n){
	width: 100%;
}
.menu04{
	padding:40px 0 40px;
}
#drink{ padding-top:40px;}
/* menu end*/
/* shop */
#shop #header .httl{ padding:0 30px; }
#shop #header .httl h1{
	padding:15px 0 10px;
}
.imglist{
	padding:30px 0;
	margin:0 -5%;
}
.imglist li{
	width: 32%;
}
.shop1{
	padding:30px 0;
}
.shop1 h2{ padding:0 0 30px;}
.shop1 table{
	margin-bottom:30px;
}
.shop1 table th{
	width: 35%;
	padding:15px 0;
}
.shop1 table td{
	padding:15px 10px;
	word-break: break-all;
}
.shop1 p{ padding:0 0 30px; font-size:1em;}
#access .map iframe{ height: 200px;}
/* shop end*/

}

/* 20200312追記ここから */
@media screen and (max-width: 1040px) {
.season h2.ttl3 {
    border-bottom: dotted 1px #a0a0a0;
    padding-bottom: 10px;
    margin-bottom: 15px;
}

.season ul:after {
    display: block;
    content: "";
    clear: both;
}

.season li {
    float: none;
}

section.season {
    width: 95%;
    margin: 0 auto;
}

li.settl {
    width: 90%;
    text-align: left;
}

li.secost {text-align: right;font-weight: bold;}

.season ul {
    border-bottom: 1px dashed #aaa;
    margin-bottom: 15px;
}
}
/* 20200312追記ここまで */

/* 20230818@追加 */

@media screen and (max-width: 1040px){

    .tekeImgF > ul > li {
    width: 100%;
}

    .tekeImgF {
    display: block;
}

.tekuImg{
	width:80%;
	margin: 10px auto;
}

.tekeMenuSub {
	font-size: 20px;
}

.tekeTitRed {
	font-size: 15px;
}

.reservationSubTit {
	font-size: 10px;
}

}

/* 20230818@追加ここまで */

/* 20231225@追加 */

@media screen and (max-width: 1040px){

	.imgDtlTxt {
		font-size: 1.em;
	}

}

/* 20231225@追加ここまで */

