@charset "utf-8";
@import url('http://fonts.googleapis.com/earlyaccess/notosansjapanese.css');


/* font-size(基準14pxに対して) */
/* 
10px font-size:71%;
12px font-size:86%;
14px font-size:100%;
16px font-size:114%;
18px font-size:129%;
20px font-size:143%;
22px font-size:157%;
24px font-size:171%;
 */
	
/* ----------------------------------------------------------------------------------------------------

 INDEX
	
	----------------------------------------------------------------------------------------------------
 PC body
	----------------------------------------------------------------------------------------------------
 PC header
	----------------------------------------------------------------------------------------------------
 PC main
	----------------------------------------------------------------------------------------------------
 PC footer
	
	----------------------------------------------------------------------------------------------------
 Media Queries
	----------------------------------------------------------------------------------------------------
 SP body
	----------------------------------------------------------------------------------------------------
 SP header
	----------------------------------------------------------------------------------------------------
 SP main
	----------------------------------------------------------------------------------------------------
 SP footer
---------------------------------------------------------------------------------------------------- */


/* ----------------------------------------------------------------------------------------------------
 PC body
---------------------------------------------------------------------------------------------------- */

body {
	color:#4d4d4d;
	line-height:2.0;
	font-size: 14px;
	text-align:center;
	font-family: 'Noto Sans Japanese', serif;
}
img{
	max-width:100%;
	height:auto;
}
a{
	color:#4d4d4d;
	text-decoration:underline;
}
a:hover{
	color:#f00;
	text-decoration:underline;
}

/* ----------------------------------------------------------------------------------------------------
 PC header
---------------------------------------------------------------------------------------------------- */
#header{
	margin:0 auto;
	width:960px;
	height:132px;
	text-align:left;
	position:relative;
	z-index:1;
	background-color:#fff;
}
#header img{vertical-align:top;}
#header h1{
	font-weight:normal;
	font-size:86%;
	position:absolute;
	top:10px;
	right:0;
	line-height:1.6;
}
#logo{
	position:absolute;
	top:24px;
	left:0;
}
#h-nav{
	margin:0;
	padding:0;
	list-style:none;
	position:absolute;
	top:34px;
	left:206px;
}
#h-nav li{
	margin:0;
	padding:0 0 8px;
	line-height:1.0;
}
#h-info{
	margin:0;
	padding:0;
	list-style:none;
	width:252px;
	position:absolute;
	top:42px;
	right:0;
}
#h-info li{
	margin:0;
	padding:0 0 8px;
	line-height:1.0;
	text-align:center;
}
#bnr-r{
	position:fixed;
	top:124px;
	right:0;
	z-index:100;
}
#sp-h-nav{display:none;}
#main-nav-box{display:none;}

/* ----------------------------------------------------------------------------------------------------
 PC main
---------------------------------------------------------------------------------------------------- */
#main-image{
	width:100%;
	min-width:960px;
	text-align:center;
}
#main-image img{vertical-align:top;}
#main{
	width:100%;
	min-width:960px;
	position:relative;
	z-index:2;
}
#contents{
	width:100%;
	text-align:left;
	padding-bottom:50px;
}
#contents img{vertical-align:top;}
#top #contents{
	margin:-88px auto 0 auto;
	width:960px;
}
.contents-box{
	margin:0 auto;
	width:960px;
	text-align:left;
}
hr{
	clear:both;
	height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	margin:20px 0;
	border-top:1px #d2d2d2 solid;
}


/* ----------------------------------------------------------------------------------------------------
 PC footer
---------------------------------------------------------------------------------------------------- */
#pankuzu{
	padding:12px 0;
	width:100%;
	min-width:960px;
	background-color:#FAF8F3;
	line-height:1.6;
}
#pankuzu-i{
	margin:0 auto;
	width:960px;
	color:#000;
	text-align:left;
}
#pankuzu-i a{
	color:#000;
	text-decoration:underline;
}
#pankuzu-i a:hover{
	color:#f00;
	text-decoration:underline;
}
#footer{
	padding:10px 0 30px;
	width:100%;
	min-width:960px;
	background-color:#F2EEE2;
	line-height:1.6;
	color:#454545;
}
#footer img{vertical-align:top;}
#footer-i{
	margin:0 auto;
	width:960px;
	text-align:left;
	position:relative;
}
#page-top{
	width:66px;
	height:66px;
	position:absolute;
	top:-90px;
	right:24px;
	z-index:2;
}
.f-text{
	margin-bottom:14px;
	font-size:114%;
}
#f-box{
	width:100%;
}
#f-box-l{
	width:294px;
	float:left;
}
#f-box-r{
	width:640px;
	float:right;
}
#f-logo{
	margin-bottom:14px;
}
#sp-f-address{display:none;}
#sp-f-info{display:none;}
#sp-f-time{display:none;}
#f-nav{
	margin:0 0 0 4px;
	padding:0;
	list-style:none;
}
#f-nav li{
	margin:0;
	padding:0 0 12px 26px;
}
#f-nav li#f-nav-1{background:url(../img/com/footer/f_icon_1.gif) no-repeat 0 0;}
#f-nav li#f-nav-2{background:url(../img/com/footer/f_icon_2.gif) no-repeat 0 0;}
#f-nav li#f-nav-3{background:url(../img/com/footer/f_icon_3.gif) no-repeat 0 0;}
#f-nav li#f-nav-4{background:url(../img/com/footer/f_icon_4.gif) no-repeat 0 0;}
#f-nav li#f-nav-5{background:url(../img/com/footer/f_icon_5.gif) no-repeat 0 0;}
#f-nav li a{
	color:#454545;
	text-decoration:none;
}
#f-nav li a:hover{
	color:#454545;
	text-decoration:underline;
}
#f-logo-link{
	margin:0 0 30px;
	padding:0;
	list-style:none;
}
#f-logo-link li{
	margin:0 0 0 40px;
	padding:0;
	float:left;
	display:inline;
}
#f-logo-link li:first-child{margin:0;}
#sp-f-logo-link{display:none;}
#f-info{
	margin:0;
	padding:0;
	list-style:none;
}
#f-info li{
	margin:0;
	padding:0 0 10px 30px;
}
#f-info li#f-address{background:url(../img/com/footer/f_icon_6.gif) no-repeat 0 0;}
#f-info li#f-tel{background:url(../img/com/footer/f_icon_7.gif) no-repeat 0 0;}
#f-info li#f-time{background:url(../img/com/footer/f_icon_8.gif) no-repeat 0 0;}
#copyright{
	padding:14px 0;
	width:100%;
	min-width:960px;
	color:#fff;
	background-color:#000;
}
#copyright a{
	color:#fff;
	text-decoration:none;
}
#copyright a:hover{
	color:#fff;
	text-decoration:underline;
}

/* ----------------------------------------------------------------------------------------------------
 Media Queries
---------------------------------------------------------------------------------------------------- */
@-ms-viewport{
	width:device-width;
}

@viewport{
	width:device-width;
}

@media screen and (max-width: 480px) {
	/* ブラウザの幅が480px以下のときの指定 */

	/* ----------------------------------------------------------------------------------------------------
		SP body
	---------------------------------------------------------------------------------------------------- */
	body {
		line-height:1.6;
		text-align:left;
		height:auto;
		overflow: auto;
	}
	img{
		max-width:100%;
		height:auto;
	}
	
	/* ----------------------------------------------------------------------------------------------------
		SP header
	---------------------------------------------------------------------------------------------------- */
	#header{
		margin:0 auto;
		padding:0 0 12px;
		width:100%;
		height:auto;
		z-index:999;
	}
	#header h1{
		margin-bottom:12px;
		padding:2px 10px;
		font-weight:normal;
		font-size:86%;
		position:static;
		top:0;
		left:0;
	}
	#logo{
		float:left;
		margin-left:10px;
		width:118px;
		position:static;
		top:12px;
		left:16px;
	}
	#h-nav{display:none;}
	#h-info{display:none;}
	#bnr-r{display:none;}
	
	#sp-h-nav{
		float:right;
		margin-right:10px;
		display:block;
		margin:0;
		padding:0;
		list-style:none;
		position:static;
		top:12px;
		right:10px;
		width:124px;
	}
	#sp-h-nav li{
		margin:0 0 0 4px;
		padding:0;
		width:58px;
		height:58px;
		float:left;
		position:relative;
	}
	#sp-h-nav li:first-child{
		margin:0;
	}
	#h-btn-tel{
		width:58px;
		height:58px;
		position:absolute;
		top:0;
		left:0;
		display:block;
		z-index:2;
	}
	#h-btn-tel-no{
		width:58px;
		height:58px;
		position:absolute;
		top:0;
		left:0;
		display:block;
		z-index:1;
	}

	#nav-btn{
		width:58px;
		height:58px;
		position:absolute;
		top:0;
		left:0;
		display:block;
		z-index:2;
	}
	#nav-btn-close{
		width:58px;
		height:58px;
		position:absolute;
		top:0;
		left:0;
		display:block;
		z-index:1;
	}
	#bg-nav{
		z-index:100;
		display:none;
		position:fixed;
		top:0;
		left:0;
		width:100%;
		height:120%;
		background-color:rgba(240,239,238,0.95);
	}
	#main-nav-box{
		width:100%;
		padding:10px;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		-ms-box-sizing:border-box;
		-o-box-sizing:border-box;
		box-sizing:border-box;
		position:relative;
		display:none;
		z-index:110;
		text-align:left;
	}
	#main-nav-box img{vertical-align:top;}
	#main-nav-box.show{display:block;}
	#main-nav-box .h-nav-title{
		padding-bottom:15px;
		border-bottom:1px #DCD9D7 solid;
	}
	#main-nav-box ul{
		margin:0 0 30px;
		padding:0;
		list-style:none;
	}
	#main-nav-box ul li{
		margin:0;
		padding:0;
		border-bottom:1px #DCD9D7 solid;
	}
	#main-nav-box ul li a{
		display:block;
		padding:10px 10px 10px 52px;
		color:#42210B;
		text-decoration:none;
	}
	#main-nav-box ul li a:hover{
		color:#42210B;
		text-decoration:none;
	}
	#main-nav-box ul li a{
		-webkit-background-size:29px 29px !important;
		-moz-background-size:29px 29px !important;
		-ms-background-size:29px 29px !important;
		-o-background-size:29px 29px !important;
		background-size:29px 29px !important;
	}
	#main-nav-box ul li.h-nav-1 a{background:url(../img/sp/com/header/h_nav_1.png) no-repeat 10px 6px;}
	#main-nav-box ul li.h-nav-2 a{background:url(../img/sp/com/header/h_nav_2.png) no-repeat 10px 6px;}
	#main-nav-box ul li.h-nav-3 a{background:url(../img/sp/com/header/h_nav_3.png) no-repeat 10px 6px;}
	#main-nav-box ul li.h-nav-4 a{background:url(../img/sp/com/header/h_nav_4.png) no-repeat 10px 6px;}
	#main-nav-box ul li.h-nav-5 a{background:url(../img/sp/com/header/h_nav_5.png) no-repeat 10px 6px;}
	#main-nav-box ul li.h-nav-mart-1 a{background:url(../img/sp/com/header/h_nav_mart_1.png) no-repeat 10px 6px;}
	#main-nav-box ul li.h-nav-mart-2 a{background:url(../img/sp/com/header/h_nav_mart_2.png) no-repeat 10px 6px;}
	#main-nav-box ul li.h-nav-eat-1 a{background:url(../img/sp/com/header/h_nav_eat_1.png) no-repeat 10px 6px;}
	#main-nav-box ul li.h-nav-eat-2 a{background:url(../img/sp/com/header/h_nav_eat_2.png) no-repeat 10px 6px;}

	/* ----------------------------------------------------------------------------------------------------
		SP main
	---------------------------------------------------------------------------------------------------- */
	#main-image{
		min-width:0;
	}
	#main{
		min-width:0;
	}
	#contents{
		width:100%;
		padding-bottom:20px;
	}
	#top #contents{
		width:100%;
		margin-top:0;
	}
	.contents-box{
		padding:0 10px;
		width:100%;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		-ms-box-sizing:border-box;
		-o-box-sizing:border-box;
		box-sizing:border-box;
	}
	.fb_iframe_widget,
.fb_iframe_widget span,
.fb_iframe_widget iframe[style]{ width: 100%!important;height:340px !important; }


	/* ----------------------------------------------------------------------------------------------------
		SP footer
	---------------------------------------------------------------------------------------------------- */
	#pankuzu{
		display:none;
	}
	#footer{
		border-top:22px #FAF8F3 solid;
		padding:20px 10px 30px;
		min-width:0;
		width:auto;
	}
	#footer img{vertical-align:top;}
	#footer-i{
		width:100%;
	}
	#page-top{
		width:60px;
		height:60px;
		position:absolute;
		top:-70px;
		right:50%;
		margin-right:-30px;
	}
	.f-text{
		margin-bottom:14px;
		font-size:71%;
	}
	#f-box{
		width:100%;
		min-width:300px;
	}
	#f-box-l{
		width:144px;
		float:left;
	}
	#f-box-r{
		width:140px;
		float:right;
	}
	#f-logo{
		margin-bottom:10px;
		width:130px;
	}
	#sp-f-address{
		display:block;
		font-size:86%;
	}
	#sp-f-info{
		display:block;
		margin:0 auto 8px auto;
		padding:0;
		list-style:none;
		width:300px;
	}
	#sp-f-info li{
		margin:0;
		padding:0;
		float:left;
	}
	#sp-f-toiawase{width:156px;}
	#sp-f-tel{width:144px;}
	#sp-f-time{
		display:block;
		margin:0 10px;
		font-size:71%;
	}
	#f-nav{
		display:none;
	}
	#f-logo-link{display:none;}
	#sp-f-logo-link{
		display:block;
		margin:0 0 30px;
		padding:0;
		list-style:none;
	}
	#sp-f-logo-link li{
		margin:0;
		padding:10px 0;
		border-top:1px #DDD6C7 solid;
		float:none;
		display:block;
	}
	#sp-f-logo-link li:first-child{margin:0;}
	#f-info{
		display:none;
	}
	#copyright{
		padding:6px;
		width:auto;
		min-width:0;
		font-size:71%;
		text-align:center;
	}
	
}