@charset "utf-8";

/*-----------------------------------
KIHACHI CSS common.css
------------------------------------*/

body,div,p,ul,li,h1,h2,h3,h4,h5,h6{
	margin: 0;padding:0;
	color:#000;
	font-family:"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;
	font-weight:normal;
	}
h2{
	font-size:18px;
	}
.SP{
	display: none;
	}
span.br{
	display: block;
	}

div#fb-root {
    margin-top: 156px !important;
}
/*------------------------------------------------*/


/*###############################################################*/
@media only screen and (max-width: 640px) {
	h2{
		font-size:22px;
		}
	.SP{
		display: block;
		}
	.PC{
		display: none;
		}
	span.br{
		display: inline;
		}
}
/*###############################################################*/
li{
	list-style: none;
	}
img{
	vertical-align: bottom;
	border:none;
	}
a{
	text-decoration:none;
	color:#000;
	}
a:hover {
	opacity:0.8;
	-moz-opacity:0.8;
	-webkit-opacity:0.8;
	-o-opacity:0.8;
	-ms-opacity:0.8;
	-khtml-opacity:0.8;
	filter:alpha(opacity=80);
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
	}

/*------------------------------------------------*/
.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

.clearfix { display: inline-table; }

/* Hides from IE-mac ＼*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */

/*------------------------------------------------*/
a#pagetop{
	position: fixed;
	bottom:0;
	right:0;
	z-index: 15;
	background: #000;
	color: #fff;
	font-size:11px;
	line-height:11px;
	display: block;
	padding:10px;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	a#pagetop{
		position: fixed;
		bottom:0;
		right:0;
		z-index: 10;
		background: #000;
		color: #fff;
		font-size:14px;
		line-height:11px;
		display: block;
		padding:10px;
		}
}
/*###############################################################*/

body{
	text-align: center;
	}
body #header{
	width:100%;
	height:77px;
	background: #fff;
	position: fixed;
	z-index:10;
	/*IE8対応*/
	width:960px\9;
	top:0\9;left:0\9;right:0\9;bottom:0\9;
	margin-right:auto\9;margin-left:auto\9;
	}
body #header > .inner{
	width:100%;
	min-width:640px;
	text-align: left;
	margin: 0 auto;
	}
body #header > .inner > li{
	list-style:none;
	float: left;
	line-height:57px;
	padding:10px;
	/*width : 45%;*/
	}
body #header > .inner li:nth-child(2),
body #header > .inner > *:first-child + * {
	text-align: center;
	float: right;
	}
body #header > .inner li h1{
	/*line-height:57px;*/
	}

body #header > .inner li ul#head-nav{
	margin:0 0 0 auto;
	width: 550px;
	z-index:100px;
	/*IE8対応*/
	width:420px\9;
	}
body #header > .inner li ul#head-nav li{
	float: left;
	width:89px;
	font-size:11px;
	border-right:1px solid #666;
	padding:0 10px;
	height:14px;
	line-height:14px;
	text-align: center;
	}
body #header > .inner li ul#head-nav li a{
	display: block;
	}
body #header > .inner li ul#head-nav li:nth-last-child(1),
body #header > .inner li ul#head-nav > *:first-child{
	border-right:1px solid #fff;
	}
body #header > .inner li strong{
	display: block;
	position: absolute;
	right:0;
	top:28px;
	font-size:28px;
	line-height:28px;
	padding-right:20px;
	}
body #header > .inner li p{
	display: block;
	position: absolute;
	right:0;
	top:38px;
	font-size:11px;
	padding-right:20px;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body #header{
		height:80px;
		z-index: 99999999999;
		}
	body #header .inner li{
		width:100%;
		text-align: center;
		}
	body #header > .inner li ul#head-nav{
		display: none;
		}

	body #header > .inner > li{
		width:100%;
		float: none;
		line-height:57px;
		padding:0;
		}

	h1{
		background:#fff;
		margin:10px 0;padding:0;
		width:100%;
		border-bottom:1px solid #ccc;
		height:80px;
		}
	h1 img{
		width:330px;
		}
	body #header > .inner li strong{
		display:none;
		}
	body #header > .inner li p{
		display:none;
		}
	body #header #SP-menu{
		position: absolute;
		top:0;
		right:0;
		}
}
/*###############################################################*/


/*------------------------------------------------
Wrap
------------------------------------------------*/
div#wrap{
	padding-top:77px;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	div#wrap{
		padding-top:80px;
		width:640px;
		overflow: hidden;
		}
}
/*###############################################################*/

body#Story div#wrap,
body#Restaurant div#wrap,
body#Patisserie div#wrap{
	padding-top:80px;
	}

/*------------------------------------------------
メインビジュアル
------------------------------------------------*/
body .main-vis{
	position:relative;
	overflow: hidden;
	width:100%;
	width:960px\9;
	margin:0 auto;
	}

body .main-vis p.arrow{
	position:absolute;
	max-width:700px;
	top:28%;
	left:0;right:0;
	margin:0 auto;
	width:80%;
	}
body .main-vis p.arrow img{
	width:90%;
	}
body .main-vis .bxslider{

	}
body .main-vis .bxslider li{

	}

body .main-vis li img{
	width:100%;
	min-width:640px;
	/*IE8対応*/
	width:960px\9;
	}

/*###############################################################*/
@media only screen and (max-width: 640px) {
	body .main-vis p.arrow{
		top:30px;
		}
}
/*###############################################################*/

/*------------------------------------------------
ナビゲーション
------------------------------------------------*/
body #nav{
	width:100%;
	background:#DADFE2;
	color:#fff;
	height:57px;
	overflow: hidden;
	z-index:9;
	padding-top:77px;
	margin-top: -77px;
	/*IE8対応*/
	width:960px\9;
	left:0\9;right:0\9;bottom:0\9;
	margin:0 auto\9;
	padding:0px\9;
	}
body#Story #nav,
body#Restaurant #nav,
body#Patisserie #nav{
	position: fixed;
	top:77px;
	box-shadow: 0px 0px 10px #666;
	border-bottom:1px solid #fff;
	}
body #nav .inner{
	width:100%;
	min-width:640px;
	text-align: left;
	margin: 0 auto;
	}
body #nav .inner li{
	width : -webkit-calc(100% / 7 - 1px) ;
	width : calc(100% / 7 - 1px);
	float: left;
	background: #fff;
	text-align: center;
	font-size:13px;
	border-right:1px solid #666;
	/*IE8対応*/
	width:136px\9;
	}
body #nav .inner li a{
	text-align: center;
	display:block;
	text-align: center;
	line-height:57px;
	height:57px;
	background:#DADFE2;
	color:#000;
	}
body #nav .inner li:nth-last-child(1),
body #nav .inner > *:last-child + *{
	border-right:none;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body #nav{
		color:#fff;
		height:114px;
		}

	body #nav .inner li{
		width : -webkit-calc(100% / 3 - 1px) ;
		width : calc(100% / 3 - 1px);
		float: left;
		background: #fff;
		text-align: center;
		font-size:13px;
		border-right:1px solid #fff;
		border-bottom:1px solid #fff;
		}
	body#Story #nav,
	body#Restaurant #nav,
	body#Patisserie #nav{
		display: none;
		}
}
/*###############################################################*/


/*------------------------------------------------
ナビゲーション(固定版)
------------------------------------------------*/
body #nav-fix{
	width:100%;
	background:#DADFE2;
	color:#fff;
	height:57px;
	overflow: hidden;
	z-index:9;
	position:fixed;
	top:77px;
	box-shadow: 0px 0px 10px #666;
	border-bottom:1px solid #fff;
	/*IE8対応*/
	width:960px\9;
	left:0\9;right:0\9;bottom:0\9;
	margin-right:auto\9;margin-left:auto\9;
	padding:0px\9;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body #nav-fix {
		width:1px;
		margin-left:-100px;
		}
}
/*###############################################################*/
body #nav-fix .inner{
	width:100%;
	min-width:640px;
	text-align: left;
	margin: 0 auto;
	}
body #nav-fix .inner li{
	width : -webkit-calc(100% / 7 - 1px) ;
	width : calc(100% / 7 - 1px);
	float: left;
	background: #fff;
	text-align: center;
	font-size:13px;
	border-right:1px solid #666;
	/*IE8対応*/
	width:136px\9;
	}
body #nav-fix .inner li a{
	text-align: center;
	display:block;
	color:#fff;
	text-align: center;
	line-height:57px;
	background:#DADFE2;
	color:#000;
	}
body #nav-fix .inner li:nth-last-child(1),
body #nav-fix .inner > *:last-child + *{
	border-right:none;
	}
/*------------------------------------------------
バナー
------------------------------------------------*/
body #banner01{
	color:#fff;
	margin:20px 0;
width:100%;
	/*IE8対応*/
	width:960px\9;
	top:0\9;left:0\9;right:0\9;bottom:0\9;
	margin-right:auto\9;margin-left:auto\9;
	}
body #banner01 ul{
	width:100%;
	margin:0 auto;
	}
body #banner01 li{
	float: left;
	}
body #banner01 li.bnr-left{
	width : -webkit-calc(100%*0.7328125);
	width : calc(100%*0.7328125);
	}
body #banner01 li.bnr-right{
	width : -webkit-calc(100%*0.2671875);
	width : calc(100%*0.2671875);
	text-align: right;
	}
body #banner01 img{
	width : 100%;
	}

/*------------------------------------------------
GIFT FROM KIHACHI
------------------------------------------------*/
body #Gift{
	color:#fff;
	margin:20px 0;
	position:relative;
	/*IE8対応*/
	width:960px\9;
	top:0\9;left:0\9;right:0\9;bottom:0\9;
	margin-right:auto\9;margin-left:auto\9;
	}
body #Gift img{
	width : 100%;
	}
body #Gift h2{
	color:#000;
	line-height:57px;
	font-weight:normal;
	background:#fff;
	height:57px;
	position:absolute;
	top:0;
	width:100%;
	opacity:0.8;
	-moz-opacity:0.8;
	-webkit-opacity:0.8;
	-o-opacity:0.8;
	-ms-opacity:0.8;
	-khtml-opacity:0.8;
	filter:alpha(opacity=80);
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
	z-index:3;
	}
body #Gift p{
	color:#fff;
	line-height:57px;
	font-weight:normal;
	height:57px;
	position:absolute;
	top:130px;
	width:100%;
	font-size:22px;
	text-shadow: 2px 2px 12px #000000;
	z-index:3;
	}
body #Gift p a{
	color:#fff;
	}

body #Gift .inner{
	width:100%;
	text-align: left;
	margin: 0 auto;
	position:absolute;
	bottom:0;
	}
body #Gift .inner li{
	width : -webkit-calc(100% / 3.001) ;
	width : calc(100% / 3.001);
	float: left;
	text-align: center;
	font-size:14px;
	color:#fff;
	/*IE8対応*/
	width:320px\9;
	background-color:#666\9;
	}

body #Gift .inner li:nth-child(1),
body #Gift .inner > *:first-child{
	background-color:rgba(212,44,54,0.90);
	}
body #Gift .inner li:nth-child(2),
body #Gift .inner > *:first-child + *{
	background-color:rgba(153,153,153,0.90);
	}
body #Gift .inner li:nth-child(3),
body #Gift .inner > *:first-child + * + *{
	background-color:rgba(210,148,118,0.90);
	}
body #Gift .inner li a{
	text-align: center;
	display:block;
	color:#ff0000;
	text-align: center;
	}
body #Gift .inner li img{
	width:98%;
	}
/*------------------------------------------------*/
@media only screen and (max-width: 640px) {
	body #Gift .inner{
		width:100%;
		text-align: left;
		margin: 0 auto;
		position:relative;
		}
	body #Gift .inner li{
		float:none;
		width:100%;
		}
}
/*------------------------------------------------*/

/*------------------------------------------------
VOICE
------------------------------------------------*/
body #Voice{
	color:#fff;
	overflow: hidden;
	margin:20px 0;
	position:relative;
	}
body #Voice h2{
	position:absolute;
	top:0;
	background:#fff;
	height:57px;
	line-height:57px;
	text-align: center;
	font-weight:normal;
	width:100%;
	opacity:0.8;
	-moz-opacity:0.8;
	-webkit-opacity:0.8;
	-o-opacity:0.8;
	-ms-opacity:0.8;
	-khtml-opacity:0.8;
	filter:alpha(opacity=80);
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
	z-index:3;
	}
body #Voice .inner{
	width:100%;
	min-width:640px;
	text-align: left;
	margin: 0 auto;
	/*IE8対応*/
	width:960px\9;
	}
body #Voice .inner li{
	width : -webkit-calc(100% / 5.001) ;
	width : calc(100% / 5.001);
	float: left;
	background: #fff;
	text-align: center;
	font-size:14px;
	/*IE8対応*/
	width:192px\9;
	position: relative;
	}
body #Voice .inner li img{
	width : 100%;
	}
body #Voice .inner li a{
	text-align: center;
	display:block;
	color:#fff;
	text-align: center;
	line-height:57px;
	}
body #Voice .inner li a p{
	position: absolute;
	top:40%;
	bottom:0;
	left:0;
	right:0;
	margin:auto;
	z-index: 10;
	opacity:0;
	transition:all 0.3s;
	font-size:20px;
	color:#fff;
	text-shadow: 2px 2px 12px #000000;
	}
body #Voice .inner li a p img{
	width:50px;
	display: block;
	margin:0 auto;
	}
body #Voice .inner li a:hover p{
	opacity:1;
 	transition:all 0.3s;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body #Voice .inner li{
		width : -webkit-calc(100% / 2.001) ;
		width : calc(100% / 2.001);
		float: left;
		background: #fff;
		text-align: center;
		font-size:14px;
		}
	body #Voice .inner li a p{
		opacity:1;
		}
}
/*###############################################################*/


/*------------------------------------------------
Recommend
------------------------------------------------*/
body #Recommend{
	background:#fff;
	color:#fff;
	overflow: hidden;
	margin:20px 0;
	/*IE8対応*/
	width:960px\9;
	top:0\9;left:0\9;right:0\9;bottom:0\9;
	margin-right:auto\9;margin-left:auto\9;
	}
body #Recommend .inner{
	width:100%;
	min-width:640px;
	text-align: left;
	margin: 0 auto;
	/*IE8対応*/
	width:960px\9;
	}
body #Recommend .inner li{
	width : -webkit-calc(96% / 2.001) ;
	width : calc(96% / 2.001);
	float: left;
	background: #fff;
	text-align: center;
	font-size:14px;
	padding : -webkit-calc(2% / 2.001) ;
	padding : calc(2% / 2.001);
	/*IE8対応*/
	width:442px\9;
	padding:19px\9;
	}
body #Recommend .inner li img{
	width : 100%;
	}
body #Recommend .inner li a{
	text-align: center;
	display:block;
	color:#fff;
	text-align: center;
	line-height:57px;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body #Recommend .inner li{
		width :100%;
		float: none;
		background: #fff;
		text-align: center;
		}
}
/*###############################################################*/


/*------------------------------------------------
About KIHACHI
------------------------------------------------*/
body #About{
	margin:20px 0;
	/*IE8対応*/
	width:960px\9;
	top:0\9;left:0\9;right:0\9;bottom:0\9;
	margin-right:auto\9;margin-left:auto\9;
	position:relative;
	}
body #About h2{
	position:absolute;
	top:0;
	background:#fff;
	height:57px;
	line-height:57px;
	text-align: center;
	font-weight:normal;
	width:100%;
	opacity:0.8;
	-moz-opacity:0.8;
	-webkit-opacity:0.8;
	-o-opacity:0.8;
	-ms-opacity:0.8;
	-khtml-opacity:0.8;
	filter:alpha(opacity=80);
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
	z-index:3;
	}
body #About img{
	width:100%;
	min-width:640px;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body #About{
		overflow:hidden;
		}
	body #About h2{
		height:57px;
		line-height:57px;
		font-weight:normal;
		text-align: center;
		}
	body #About img{
		width:960px;
		margin-left:-160px;
		}

}
/*###############################################################*/

/*------------------------------------------------
Ranking
------------------------------------------------*/
body #Ranking{
	margin:20px 0;
	/*IE8対応*/
	width:960px\9;
	top:0\9;left:0\9;right:0\9;bottom:0\9;
	margin-right:auto\9;margin-left:auto\9;
	}
body #Ranking h2{
	height:57px;
	line-height:57px;
	font-weight:normal;
	}
body #Ranking .inner{
	width:100%;
	min-width:640px;
	text-align: left;
	margin: 0 auto;
	}
body #Ranking .inner li{
	width : -webkit-calc(100% / 5.001) ;
	width : calc(100% / 5.001);
	float: left;
	background: #fff;
	text-align: center;
	font-size:14px;
	/*IE8対応*/
	width:192px\9;
	}
body #Ranking .inner li img{
	width : 100%;
	}
body #Ranking .inner li a{
	text-align: center;
	display:block;
	color:#fff;
	text-align: center;
	}
body #Ranking .inner li a p{
	padding:10px;
	height:4em;
	background-color:#DADFE2;
	}
body #Ranking .inner li a p strong{
	font-weight:bold;
	font-size:16px;
	line-height:1.0em;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body #Ranking .inner li{
		width : -webkit-calc(100% / 3.001) ;
		width : calc(100% / 3.001);
		float: left;
		background: #fff;
		text-align: center;
		}
	body #Ranking .inner li a{
		line-height:1.2em;
		}
	body #Ranking .inner li a p{
		padding:10px;
		height:4em;
		background-color:#DADFE2;
		font-size:16px;
		}
	body #Ranking .inner li a p span{
		display: block;
		}
	body #Ranking .inner li a p strong{
		font-weight:bold;
		font-size:16px;
		}
}
/*###############################################################*/

/*------------------------------------------------
PRICE & CATEGORY
------------------------------------------------*/
body #Cat-block{
	margin:20px 0;
	/*IE8対応*/
	width:960px\9;
	top:0\9;left:0\9;right:0\9;bottom:0\9;
	margin-right:auto\9;margin-left:auto\9;
	}
body #Cat-block div#PRICE{
	width : -webkit-calc(100% / 5.001) ;
	width : calc(100% / 5.001);
	float: left;
	/*IE8対応*/
	width:192px\9;
	}
body #Cat-block div#PRICE h2{
	
	}
body #Cat-block div#PRICE .inner{
	padding:20px;
	width:80%;
	text-align: left;
	margin: 0 auto;
	}
body #Cat-block div#PRICE .inner li{
	width:100%;
	text-align: left;
	margin: 0 auto;
	font-size: 14px;
	line-height: 3em;
	border-bottom:1px solid #ccc;
	}
body #Cat-block div#PRICE .inner li a{
	display:block;
	padding:0 10px;
	}
body #Cat-block div#PRICE .inner li a:hover{
	background: #f9e5be;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body #Cat-block{
		
		}
	body #Cat-block div#PRICE {
		width:100%;
		float: right;
		}
	body #Cat-block div#PRICE h2{

		}

	body #Cat-block div#PRICE input{
		width:100%;
		height:1.5em;
		}

	body #Cat-block div#PRICE input[value="検索"] {
		width:100px;
		height:1.5em;
		margin-left:208px;
		font-size:18px;
		}
}
/*###############################################################*/


body #Cat-block div#CATEGORY{
	width : -webkit-calc(100% / 5.001 * 4) ;
	width : calc(100% / 5.001 * 4);
	float: left;
	/*IE8対応*/
	width:768px\9;
	}

body #Cat-block h2{
	height:57px;
	line-height:57px;
	font-weight:normal;
	}
body #Cat-block div#CATEGORY .inner{
	width:100%;
	text-align: left;
	margin: 0 auto;
	}
body #Cat-block div#CATEGORY .inner li{
	width : -webkit-calc(96% / 4.001) ;
	width : calc(96% / 4.001);
	float: left;
	background: #fff;
	text-align: center;
	font-size:14px!important;
	padding : -webkit-calc(1.9% / 4.001) ;
	padding:calc(1.9% / 4.001 );
	/*IE8対応*/
	width:184px\9;
	padding:4px\9;
	}
body #Cat-block div#CATEGORY .inner li img{
	width : 100%;
	}
body #Cat-block div#CATEGORY .inner li a{
	text-align: center;
	display:block;
	color:#fff;
	text-align: center;
	line-height:1.5em;
	font-size:14px;
	}
body #Cat-block div#CATEGORY .inner li a p{
	padding:10px;
	height:1.5em;
	background-color:#DADFE2;
	overflow: hidden;
	}
body #Cat-block div#CATEGORY .inner li a p strong{
	font-weight:bold;
	font-size:14px;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body #Cat-block div#CATEGORY{
		width:100%;
		}
	body #Cat-block div#CATEGORY .inner li{
		width : -webkit-calc(100% / 3.001) ;
		width : calc(100% / 3.001);
		float: left;
		font-size:16px;
		padding: 0;
		}
	body #Cat-block h2{
		width:640px;
		}
}
/*###############################################################*/


/*------------------------------------------------
newitems
------------------------------------------------*/
body #newitems{
	margin:20px 0;
	/*IE8対応*/
	width:960px\9;
	top:0\9;left:0\9;right:0\9;bottom:0\9;
	margin-right:auto\9;margin-left:auto\9;
	}
body #newitems h2{
	height:57px;
	line-height:57px;
	font-weight:normal;
	}
body #newitems .inner{
	width:100%;
	min-width:640px;
	text-align: left;
	margin: 0 auto;
	}
body #newitems .inner li{
	width : -webkit-calc(100% / 5.001) ;
	width : calc(100% / 5.001);
	float: left;
	background: #fff;
	text-align: center;
	font-size:14px;
	/*IE8対応*/
	width:192px\9;
	}
body #newitems .inner li img{
	width : 100%;
	}
body #newitems .inner li a{
	text-align: center;
	display:block;
	color:#fff;
	text-align: center;
	}
body #newitems .inner li a p{
	padding:10px;
	height:2em;
	background-color:#DADFE2;
	}
body #newitems .inner li a p strong{
	font-weight:bold;
	font-size:16px;
	line-height:1.0em;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body #newitems .inner li{
		width : -webkit-calc(100% / 3.001) ;
		width : calc(100% / 3.001);
		float: left;
		background: #fff;
		text-align: center;
		}
	body #newitems .inner li a{
		line-height:1.2em;
		}
	body #newitems .inner li a p{
		padding:10px;
		height:2em;
		background-color:#DADFE2;
		font-size:16px;
		}
	body #newitems .inner li a p span{
		display: block;
		}
	body #newitems .inner li a p strong{
		font-weight:bold;
		font-size:16px;
		}
	body #Cat-block div#PRICE .inner li {
		width: 100%;
		text-align: left;
		margin: 0 auto;
		font-size: 26px !important;
		line-height: 4em !important;
		border-bottom: 1px solid #ccc;
	}
}
/*###############################################################*/




/*------------------------------------------------
Story
------------------------------------------------*/
body#Story .main-vis h2{
	color:#fff;
	line-height:1.7em;
	font-weight:normal;
	position:absolute;
	top :175px;
	width:100%;
	font-size:26px;
	color:#fff;
	text-shadow: 2px 2px 12px #000000;
	z-index:5;
	}
body#Story .main-vis h2 a{
	color:#fff;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body#Story .main-vis h2{
		top :100px;
		}
}
/*###############################################################*/
body#Story .main-vis p{
	color:#fff;
	line-height:2em;
	font-weight:normal;
	position:absolute;
	top :10%;
	width:100%;
	font-size:26px;
	color:#fff;
	text-shadow: 2px 2px 12px #000000;
	}
/*------------------------------------------------
Gift
------------------------------------------------*/

body#Story #Gift p{
	color:#fff;
	font-weight:normal;
	position:absolute;
	top:60px;
	width:100%;
	font-size:22px;
	line-height:2.5em;
	color:#fff;
	text-shadow: 2px 2px 12px #000000;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body#Story #Gift{
		height:450px;
		background: #666;
		overflow: hidden;
		}
	body#Story #Gift img{
		width:1280px;
		background: #666;
		overflow: hidden;
		}
}
/*###############################################################*/

#block-uchiiwai,
#block-seasonal,
#block-petit-gift,
#voice01,#voice02,#voice03,#voice04,#voice05{
	padding-top:147px;
	margin-top: -147px;
	}


/*------------------------------------------------
Detail
------------------------------------------------*/
body .Detail{
	margin:60px 0;
	/*IE8対応*/
	width:960px\9;
	top:0\9;left:0\9;right:0\9;bottom:0\9;
	margin-right:auto\9;margin-left:auto\9;
	}
body .Detail h2{
	font-size:22px;
	}

body .Detail p{
	line-height:4em;
	}
	body#Story #block-petit-gift .Detail{
		border-bottom:1px solid #ccc; 
		padding-bottom:60px;
		margin-bottom:-60px;
		}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body .Episode ul li{
		float: none;
		width:100%;
		}
	body .Detail p{
		font-size:15px;
		margin:1em;
		text-align: left;
		line-height:3em;
		}
}
/*###############################################################*/


/*------------------------------------------------
Detail2
------------------------------------------------*/
body .Detail2{
	margin:20px 0;
	border-bottom:1px solid #ccc;
	/*IE8対応*/
	width:960px\9;
	top:0\9;left:0\9;right:0\9;bottom:0\9;
	margin-right:auto\9;margin-left:auto\9;
	}
body .Detail2 h2{
	font-size:22px;
	line-height:57px;
	height:57px;
	}
body .Detail2 ul{
	margin:20px 0;
	}
body .Detail2 ul li{
	width : -webkit-calc(100% / 3.001) ;
	width : calc(100% / 3.001);
	float: left;
	/*IE8対応*/
	width:320px\9;
	}
body .Detail2 ul li img{
	width : 95%;
	}
body .Detail2 ul li p{
	font-size:13px;
	width : 70%;
	margin:0 auto;
	padding-bottom:30px;
	text-align: left;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body .Detail2 ul li{
		width :100%;
		float: none;
		}
	body .Detail2 ul li p{
		font-size:14px;
		width : 90%;
		}
}
/*###############################################################*/

/*------------------------------------------------
Detail-recommend
------------------------------------------------*/
body .Detail-recommend{
	margin:20px 0;
	border-bottom:1px solid #ccc;
	/*IE8対応*/
	width:960px\9;
	top:0\9;left:0\9;right:0\9;bottom:0\9;
	margin-right:auto\9;margin-left:auto\9;
	}
body .Detail-recommend h2{
	font-size:22px;
	line-height:57px;
	height:57px;
	}
body .Detail-recommend ul{
	margin:20px 0;
	}
body .Detail-recommend ul li{
	width : -webkit-calc(100% / 4.001) ;
	width : calc(100% / 4.001);
	float: left;
	min-height:200px;
	margin-bottom:20px;
	/*IE8対応*/
	width:240px\9;
	position: relative;
	}
body .Detail-recommend ul li img{
	width : 95%;
	margin-bottom:10px;
	}
body .Detail-recommend ul li p{
	font-size:15px;
	width : 70%;
	margin:0 auto;
	padding-bottom:30px;
	height:4em;
	}
body .Detail-recommend ul li p span{
	display:block;
	color: #666;
	}
body .Detail-recommend ul li p span.zero:before{
	display: block;
	content:"送料無料";
	background-color:#ff0000;
	color:#fff;
	font-size:12px;
	position:absolute;
	top:0;
	right:3%;
	padding:3px 4px;
	}
body .Detail-recommend ul li p span.komi:before{
	display: block;
	content:"送料込";
	background-color:#ff0000;
	color:#fff;
	font-size:12px;
	position:absolute;
	top:0;
	right:3%;
	padding:3px 4px;
	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body .Detail-recommend ul li{
		width : -webkit-calc(100% / 2) ;
		width : calc(100% / 2);
		}
}
/*###############################################################*/

/*------------------------------------------------
カスタム
------------------------------------------------*/

body #uchiiwai h2{
	background: #fee9e9;
	}
body #kisetsu h2{
	background: #beecfb;
	}
body #kisetsu ul li p{
	text-align: center;
	}
body #chottoshita h2{
	background: #DADFE2;
	}


/*------------------------------------------------
Episode
------------------------------------------------*/
body .Episode{
	margin:20px 0;
	border-bottom:1px solid #ccc;
	position: relative;
	/*IE8対応*/
	width:960px\9;
	top:0\9;left:0\9;right:0\9;bottom:0\9;
	margin-right:auto\9;margin-left:auto\9;
	}
body .Episode h2{
	font-size:22px;
	background: #fee9e9;
	line-height:57px;
	height:57px;
	}
body .Episode ul{
	margin:20px 0;
	}
body .Episode ul li{
	width : -webkit-calc(100% / 3 ) ;
	width : calc(100% / 3);
	float: left;
	/*IE8対応*/
	width:320px\9;
	}
body .Episode ul li:nth-child(2),
body .Episode ul > *:first-child + *{
	width : -webkit-calc(100% / 3 *2) ;
	width : calc(100% / 3 *2);
	float: left;
	/*IE8対応*/
	width:960px\9;
	}
body .Episode ul li img{
	width : 100%;
	max-width:300px;
	}
body .Episode ul li h3{
	font-size:22px;
	width : -webkit-calc(100% -40px) ;
	width : calc(100% -40px);
	min-width: 640px;
	margin:0 auto;
	padding:0 20px;
	text-align: left;
	}
body .Episode ul li h4{
	font-size:20px;
	width : -webkit-calc(100% -40px) ;
	width : calc(100% -40px);
	margin:10px auto;
	padding:0 20px;
	text-align: left;
	/*IE8対応*/
	width:920px\9;
	}
body .Episode ul li h4 span{
	font-size:14px;
	color:#999;
	display: block;
	margin:5px 0 20px 0;
	}

body .Episode ul li p{
	font-size:14px;
	width : -webkit-calc(100% -40px) ;
	width : calc(100% -40px);
	margin:0 auto;
	padding:0 20px;
	text-align: left;
	line-height:2em;
	/*IE8対応*/
	width:920px\9;
	}
body .Episode ul li a{
	font-size:13px;
	width:240px;
	margin:20px;
	padding:10px 0px 10px 10px;
	text-align: left;
	line-height:1.2em;
	display: block;
	/*position: absolute;
	bottom:0;
	left:-webkit-calc(100%/3+10px) ;
	left:calc(100%/3+10px) ;*/
	background:red;
	color:#fff;
	text-align: center;
	z-index:3;
	}
body .Episode ul li a:hover{

	}
/*###############################################################*/
@media only screen and (max-width: 640px) {
	body .Episode ul li{
		float: none;
		width:100%;
		}
	body .Episode ul li h3{
		font-weight: bold;
		padding:10px;
		font-size:20px;
		}
	body .Episode ul li h4{
		padding:0 10px;
		font-size:30px;
		}
	body .Episode ul li img{
		width:40%;
		}
	body .Episode ul li p{
		font-size:14px;
		margin:0 auto;
		padding:20px 20px 40px 20px;
		text-align: left;
		line-height:2em;
		width:600px;
		}
}
/*###############################################################*/


/*------------------------------------------------
profile
------------------------------------------------*/
body .container{
	padding-top: 157px;
	}

body#Restaurant div#shop-list,
body#Patisserie div#shop-list{
	min-width:640px;
	border-top:1px solid #ccc;
	}
body#Restaurant div#shop-list h2,
body#Patisserie div#shop-list h2{
	margin:2em auto
	}
body#Restaurant div#shop-list .inner,
body#Patisserie div#shop-list .inner{

	}
body#Restaurant div#shop-list .inner li,
body#Patisserie div#shop-list .inner li{
	float: left;
	width : -webkit-calc(100% / 4) ;
	width : calc(100% / 4);
	}
body#Restaurant div#shop-list .inner li img,
body#Patisserie div#shop-list .inner li img{
	width:95%;
	}
body#Restaurant div#shop-list .inner li p,
body#Patisserie div#shop-list .inner li p{
	width:90%;
	line-height:1.2em;
	height:3em;
	margin:1em auto 0 auto;
	font-size:13px;
	}
body#Restaurant div#shop-list .inner li p span,
body#Patisserie div#shop-list .inner li p span{
	display:block;
	}


/*------------------------------------------------
Footer
------------------------------------------------*/
body #footer{
	margin:20px 0 0 0;
	height:300px;
	/*IE8対応*/
	width:960px\9;
	top:0\9;left:0\9;right:0\9;bottom:0\9;
	margin-right:auto\9;margin-left:auto\9;

	}

body #footer #foot{
	border-top:4px solid #565656;
width:100%;
	}
body #footer #foot td{
	text-align: center;
	}
body #footer #foot td img{
	margin-top:-4px;
	}

body #footer div,
body #footer td{
	font-size:11px;
	line-height:2em;
	text-align: left;
	}

body #footer .calframe_rakuten td{
	text-align: center;
	}
body #footer a{
	text-decoration:underline;
	}

/*------------------------------------------------
SP-Footer
------------------------------------------------*/
body #SP-footer{
	margin:20px 0;
	}
body #SP-footer ul{
	border-top:1px solid #ccc;
	margin:20px 0;
	}
body #SP-footer li{

	}

body #SP-footer li a{
	display: block;
	font-size:16px;
	line-height:3em;
	border-bottom:1px solid #ccc;
	text-align: left;
	background: url(https://ic4-a.wowma.net/mi/w/1280/h/1280/q/90/bcimg1-a.wowma.net/plus/u62201652/pc/css/../img/sp/list_allow_gray.jpg)no-repeat 20px 50%;
	background-size:auto 30% ;
	text-indent: 35px;
	}
body #SP-footer #link-rakuten img{
	width:100px;
	}

/*###############################################################
 
 font設定ココから

###############################################################*/

body #nav li,
body #nav-fix li,
h2{
	font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, serif!important;
	}
body #Ranking li p,
body #CATEGORY li p{
	 font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, serif!important;

	}





body #header > .inner li p {
    position: absolute !important;
    right: 0 !important;
    font-size: 11px !important;
    padding-right: 20px !important;
    top: 30px !important;
}

body #header > .inner li strong {
    display: inline !important;
    font-size: 28px !important;
    line-height: auto !important;
    padding-right: 20px !important;
	position: initial !important;
}
body #nav-fix {
    top: 97px !important;
}




div#info-bnr {
    width: 160px;
	position: fixed;
	z-index: 99999;
	bottom: 240px;
	left: 0;
	border: 1px solid #CCCCCC;
	box-shadow: 0 0 9px #CCC;
	background: #fff;
	padding-top: 1%;
}

span.info-bnr-md {
    font-size: 1.3em;
    text-align: left;
    color: #ff4140;
    font-weight: bold;
}

.info-bnr-btn{
    background: #ff6968;
    font-weight: bold;
    margin-top: 10px;
}
.info-bnr-btn a{
	color:#fff !important;
	text-decoration: none !important;
}

div#info-bnr-frame iframe {
    /*height: 630px;*/
	height: 58em;
	width: 100%;
}
@media only screen and (max-width: 640px) {
div#info-bnr-frame iframe {
    height: 125vw;
	width: 100%;
}
}
div#info-bnr-frame {
	margin-top: -200px;
    padding-top: 200px;
	z-index: -1;
}
@media only screen and (min-width: 641px) {
div#info-bnr-frame {
    width: 750px;
    margin: -200px auto 0;
}
}





/*.info-pc,.sp-info {
    display: none !important;
}*/