@charset "utf-8";
/*
=======================================
	Reset CSS
=======================================
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, main, menu, nav, section, summary,
time, mark, audio, video{
	margin:0;
	padding:0;
}

article,aside,details,figcaption,figure,
footer,header,main,menu,nav,section{
	display:block;
}

html{
	-webkit-text-size-adjust: 100%;
}

img{
	border: 0;
	max-width:100%;
	height:auto;
}

ul,ol{
	list-style-type: none;
}

table {
	border-collapse: collapse; 
	border-spacing: 0;
}

img, input, select, textarea { 
	vertical-align: middle;
}

a { 
	color:#ffefd5;
	transition:0.5s;
	text-decoration:none;
}

a:hover,
.category-title a:hover {
	color:#d53e04;
}

a:hover img {
	opacity:0.7;
}



/*Base Layout*/

body {
	margin:0 auto;
	background:#24140e;
	color:#fff;
	line-height:2;
	font-size:18px;
	font-family: 'Lato', 'Noto Sans JP', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}

.innner {
	width:1000px;
	margin:0 auto;
	padding:0;
}

@media screen and (max-width:750px){
.innner {
	width:100%;
	margin:0 auto;
	}
}

#container {
	max-width:1000px;
	padding-left:10px;
	padding-right:10px;
	margin:0 auto;
}

#container:after {
	content:"";
	display:block;
	clear:both;
}

@media screen and (max-width:750px){
#container {
/*	width:100%;	★*/
	margin:0 auto;
	}
	
}


h1 {
	/*background:url(../images/bg_h1.png) center no-repeat;*/
	font-size:2em;
	text-align:center;
	margin-bottom:15px;
}

/*header
--------------------*/
#header {
	background:#fff;
	text-align:center;
	position:relative;
}

.logomin {
	width:150px;
	height:8
	margin-right:20px;0px;
}

.imggrimm {
	width:700px;
	height:80px;
	margin:0;
}

#logo_s {
	display:inline;
}

@media screen and (max-width:750px){
#header {
	max-width:100%;
	height:auto;
	}
}

/* "pc" */
.pc { display: block !important; 
}

.sp { display: none !important; 
}
/* "sp" */

@media only screen and (max-width: 750px) {
	.pc { display: none !important; }
	.sp { display: block !important; }
}


/*global navigation
--------------------*/
#gnav {
	background:url(../images/gnav.png) no-repeat;
	height:50px;
	max-width:100%;
	background-size:contain;	/* ★ */
}

#gnav ul {
	overflow:hidden;
}

#gnav li {
	float:left;
	width:25%;
}

#gnav li a {
	display:block;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	height:50px;
}

#gnav a:hover {
	background:#ecdfc2;
	opacity:0.5;
}

/*humberger nav
--------------------*/
#nav-open {
	display: inline-block;
	width: 45px;
	height: 30px;
	vertical-align: middle;
	margin:15px;
}

/*humberger design*/
#nav-open span, 
#nav-open span:before, 
#nav-open span:after {
	position: absolute;
	transition: all 0.4s;
	height: 4px;
	width: 40px;
	border-radius: 4px;
	background: #fff;
	display: block;
	content: '';
	cursor: pointer;
	z-index: 9999;
}

#nav-open span:before {
	bottom: -10px;
}

#nav-open span:after {
	bottom: -20px;
}


/*humberger中身*/
#nav-content {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	transition: .2s ease-in-out;
}

#nav-content.open {
	display: block;
	opacity: 1;
	overflow: auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9998;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.9);
	overflow: hidden;
}


/*:beforeぼかし*/
#nav-content.open:before {
	content: '';
	overflow: hidden;
	-webkit-filter: blur(10px);
	-moz-filter: blur(10px);
	-o-filter: blur(10px);
	-ms-filter: blur(10px);
	filter: blur(10px);
	z-index: -1;
}


/*チェックが入ったら表示する内容*/

.hamburger-top {
	height: 40px;/*×ボタンと被らないように*/
}

.category {
	text-align: center;
	margin-top: 2rem;
}

.category-title {
	padding: 0.5rem;
	margin-left: -2rem;
	list-style: none;
}

.category-title a {
	color: #333;
	text-decoration: none;
}


/*三本線を動かす*/
#nav-open.active span {
	-webkit-transform: translateY(8px) rotate(-45deg);
	transform: translateY(8px) rotate(-45deg);
	background-color: #888;
}

#nav-open.active span:before {
	-webkit-transform: translateY(-8px) rotate(45deg);/*打ち消す*/
	transform: translateY(-8px) rotate(45deg);/*打ち消す*/
	opacity: 0;
}

#nav-open.active span:after {
	-webkit-transform: translateY(-16px) rotate(45deg);
	transform: translateY(-16px) rotate(90deg);
	background-color: #888;
}

/*slideshow
--------------------*/





/*pankuzu
--------------------*/

#pankuzu {
	margin:20px 0;
	margin-left:40px;
	font-size:1.1em;
}

#pankuzu ol {
	width:1000px;
	margin:0;
	padding:5px;
}

#pankuzu li {
	margin-left:10px;
	display:inline-block;
}

#pankuzu li a {
	text-decoration:none;
	padding-right:15px;
	background:url(../images/pankuzu.gif) right center no-repeat;
}

@media screen and (max-width:750px){	/* ★ */
	#pankuzu {
		font-size:0.85em;
		margin-left:10px;
	}
	#pankuzu ol {
		width:100%;
		color: #f08080;
	}
}
/*main
--------------------*/
#main {
	margin-bottom:100px;
}


/*Products
--------------------*/

#category img {
	width:300px;
	height:200px;
}

#category {
	width:1000px;
}

#category ul {
	overflow:hidden;
}

#category li {
	float:left;
	margin:10px;
}

#category h4 {
	clear:both;
	font-size:1.2em;
}


@media screen and (max-width:750px){
	#category {
		width:100%;
	}

	#category img {
		width:85%;
		height:auto;
		margin:10px 25px;
		}

	#category h4 {
		margin:0 25px;
}
}
/*Google Map

.map {
	border:#d8c7a0 1px solid;
	position:relative;
	padding-bottom:50%;
}

.map iframe {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
--------------------*/

/*introduction
--------------------*/
#intro {
	margin-bottom:40px;
	padding:20px 10px;
	background:url(../img/bg_check.png);
}

.intro-text {
	margin-bottom:20px;
	font-size:114%;
}

.intro-map .map {
	margin-bottom:20px;
}

.intro-map address {
	text-align:center;
	font-style:normal;
	font-size:12px;
}


.intro-map address p+p {
	margin-top:10px;
}



/*topics
--------------------*/
#topics {
	clear:both;
	margin-bottom:40px;
	text-align:center;
}

.footer-info-list {
	margin-bottom:20px;
}

#topics dt {
	clear:left;
	float:left;
	width:12em;
	margin-bottom:10px;
}

#topics dd {
	margin-bottom:10px;
	overflow:hidden;
	text-align:left;
}


/*footer
--------------------*/
#footer {
	clear:both;
	max-width:1000px;
/*	height:500px;	★*/
	margin:0 auto;
	background:url(../images/footer.jpg) no-repeat;
	background-size:cover;
	color:#24140e;
}

.bg_rgba {
	max-width:1000px;
/*	height:100%;	★*/
	overflow:hidden;	/* ★ */
	background: rgba(36, 20, 14, 0.7);
}

#footer h2 {
	font-size:1.4em;
	margin:10px 0px 15px 0;
	border-bottom:#fff 1px solid;
	padding:10px 0;
}

#footer h3 {
	font-size:1.2em;
}

.ft_products {
	width:300px;
	float:left;
	margin:20px 15px;
	line-height:1.8em;
	padding-left:20px;
}

.ft_products li a{
	font-size:0.9em;
}

.ft_allergie {
	width:300px;
	float:left;
	margin:20px 15px;
	line-height:1.8em;
	padding-left:20px;
}

.ft_colum {
	width:250px;
	float:left;
	margin:20px 15px;
	line-height:2.5em;
	font-size:0.9em;
	padding-left:20px;
}

.ft_colum li a{
	font-size:1em;
}

.ft_shop {
	width:300px;
	float:left;
	margin:20px 15px;
	line-height:1.8em;
	padding-left:20px;
}


#copyright {
	clear:both;
	text-align:center;
	padding:10px auto;
	background:#24140e;
	color:#fff;
/*	margin-top:20px;	★*/
	margin-bottom:80px;
}



/*SNS
--------------------*/
#sns {
	margin-bottom:20px;
	display:flex;
	justify-content: center;
}

#sns li {
	margin:0 10px;
}

#sns a {
	padding:10px 20px;
	background:#d8c7a0;
	color:#24140e;
	font-size:1.5em;
	border-radius:5px;
	text-decoration:none;
}

#sns a:hover {
	opacity:0.7;
}

.pagetop {
	width:70px;
	height:70px;
	border-radius: 50%;
	background:#d2b48c;
	position:fixed;
	margin:0;
	right:5%;
	bottom:50px;
	text-align:center;
	line-height: 70px;
	font-size:2em;
	color:#24140e;
}


/*
=========================================
	Utilities
=========================================
*/


/* clearfix */
.clearfix:after {
	content: ""; 
	display: block; 
	clear: both; 
}
.clearfix{
	zoom:1;
}