@charset "UTF-8";

/* @group reset*/

*{margin:0;padding:0;}
a {text-decoration:underline;color:#d30006;}
ul,ol {list-style:none;}
img {vertical-align:middle;}

/* @end*/


div:after,
ul:after {
  content: "";
  display: block;
  clear: both;
}

/* .viewer
------------------------- */
.viewer {
    margin: 0 auto;
    width: 100%;
    position: relative;
    overflow: hidden;
}
.viewer ul {
    width: 100%;
    overflow: hidden;
    position: relative;
}
.viewer ul li {
    top: 0;
    left: 0;
    width: 100%;
    position: absolute;
}
.viewer ul li img {
    width: 100%;
}
 
/* sideNavi
------------------------- */
.viewer .btnPrev,
.viewer .btnNext {
    margin-top: -25px;
    top: 50%;
    width: 50px;
    height: 50px;
    position: absolute;
    z-index: 101;
}
.viewer .btnPrev {
    left: 10px;
    background: #ccc url(../img/btnPrev.jpg) no-repeat center center;
}
.viewer .btnNext {
    right: 10px;
    background: #ccc url(../img/btnNext.jpg) no-repeat center center;
}
 
 
/* =======================================
    ClearFixElements
======================================= */
.viewer ul:after {
    content: ".";
    height: 0;
    clear: both;
    display: block;
    visibility: hidden;
}
 
.viewer ul {
    display: inline-block;
    overflow: hidden;
}


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



img {max-width:100%;}
html {font-family:verdana,san-serif;line-height:1.8;font-size:14px;}

.mb10{margin-bottom:10px;}
.mb20{margin-bottom:20px;}
.mb30{margin-bottom:30px;}
.mb40{margin-bottom:60px;}

.mr30{margin-right:30px;}
.mr50{margin-right:150px;}
.mr70{margin-right:70px;}
.mr100{margin-right:100px;}

.tac {text-align:center;}
.tal {text-align:left;}

.fs16 {font-size:16px;}
.pad5 {padding-left:3px;}

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

header{
	background:url(images/bg_header.gif) ;
	text-align:center;
	padding-top:30px;
	height:175px;
}
header .headerArea{
	width:980px;
	margin:0 auto;
	position:relative;
	height:140px;
}

header .headerArea h1{
	margin-bottom:20px;
	float:left;
	position:absolute;
	top:0;
	left:0;
}
header .headerArea h2{
	margin-bottom:35px;
	display:block;
	position:absolute;
	top:0;
	left:350px;
}
header .headerArea ul{
	float:right;
}
header .headerArea ul li{
	float:left;
	margin-right:5px;
}
header .headerArea ul li a{
	display:block;
}
header nav#forPC{
	width:980px;
	margin:0 auto;
}
header nav#forSP{
	display:none;
}
header nav#forPC ul  {
	float:left;
}
header nav#forPC ul li {
	float:left;
	margin-right:40px;
}
header nav#forPC ul li a{
	display:block;
}

header p {
	width: 3em;
	position: absolute;
	top: 0;
	right: 0;
}
header p .link {
	background: url("../../img/icon01.png") no-repeat center left;
	padding-left: 0.9em;
	font-size: 90%;
}
header p .link a {
	color: #231815;
	text-decoration: none;
}
header p .link a:hover {
	text-decoration: underline;
}

/* ---------------main--------------------*/

#main{
	
	background-color:#f3f4f4;
}

#contents{
	background-image:url(images/bg.png);
	background-position:center top;
	background-color:#f3f4f4;
	background-repeat: no-repeat;  
	padding-bottom:10px;
}

h3{
	text-align:center;
	padding:50px 0;
}
h4{
	text-align:center;
	margin-bottom:20px;
	
}

.spCopy {
	display:none;
}


/* ---------------contentsarea01--------------------*/
#product{
	background:#ffffff;
	border-radius: 8px;        /* CSS3草案 */  
    -webkit-border-radius: 8px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 8px;   /* Firefox用 */ 
	width:860px;
	margin:0 auto 20px auto;
	padding:0 60px 60px 60px;
}

#product #area01 {
	margin-bottom:50px;
}

#product #area01 .leftarea{
	width:520px;
	float:left;
}

#product #area01 p.right{
	float:right;
	width:300px;
}

#product #area01 h5{
	padding-top:30px;
	margin-bottom:30px;
}


#product #area01 p.right{
	float:right;
}

#product #area02 h5{
	margin-top:20px;
	margin-bottom:50px;
}

#product #area02 p.left{
	float:left;
	width:304px;
	margin-right:40px;
}

#product #area02 p.right{
	display:none;
}

#product #area02 .manju{
	float:left;
	width:170px;
}

#product #area02 .manjuText{
	float:right;
	margin-right:20px;
}

#product #area02 .manju img:hover{
	filter:alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;
}


/* ---------------contentsarea02--------------------*/
#recipe{
	background:#ffffff;
	border-radius: 8px;        /* CSS3草案 */  
    -webkit-border-radius: 8px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 8px;   /* Firefox用 */ 
	width:860px;
	margin:0 auto 20px auto;
	padding:0 60px 40px 60px;
}

#recipe #area03 .leftarea{
	width:540px;
	float:left;
}

#recipe #area03 p.right{
	float:right;
	width:300px;
}

#recipe #area03 h5{
	padding-top:30px;
	margin-bottom:30px;
}

#recipe #area03 p.right{
	float:right;
}

#recipe #area04 h5{
	margin-bottom:30px;
}

#recipe #area04 h6{
	float:left;
	margin-right:20px;
	margin-bottom:30px;
}

#recipe #area04 p{
	width:580px;
	float:left;
	margin-bottom:30px;
	margin-top:7px;
}


/* ---------------contentsarea03--------------------*/
#ingredients{
	background:#ffffff;
	border-radius: 8px;        /* CSS3草案 */  
    -webkit-border-radius: 8px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 8px;   /* Firefox用 */ 
	width:860px;
	margin:0 auto 20px auto;
	padding:0 60px 60px 60px;
}

#ingredients h5 {
	text-align:center;
	margin-bottom:30px;
}

#ingredients h6 {
	text-align:center;
}


#ingredients #area05 {
	width:406px;
	float:left;
	margin-right:48px;
	text-align:center;
}

#ingredients #area05 img{
	margin-bottom:15px;
	
}

#ingredients #area06 {
	width:406px;
	float:left;
	text-align:center;
}

#ingredients #area06 img{
	margin-bottom:15px;
	text-align:center;
}


#ingredients #area07 {
	width:285px;
	float:left;
	text-align:center;
}

#ingredients #area07 img{
	margin-bottom:15px;
	text-align:center;
}



/* ---------------contentsarea04--------------------*/
#lineupTOP{ 
	width:100%;
	border-top:1px solid #dddddd;
	/*background-color:#ffffff;*/
}
#lineupTOPB{ 
	width:100%;
	border-top:1px solid #fcfcfc;
	/*background-color:#ffffff;*/
}

#lineup{ 
	width:860px;
	margin:0 auto 20px auto;
	padding:0 60px 10px 60px;
	position:relative;
}

#lineup h4{ 
	position:absolute;
	top:0px;
	left:373px;
	z-index:100;
}


#lineup .imageRight{
	position:absolute;
	top:35px;
	right:40px;
	z-index:1;
}
#lineup .textLeft{
	padding-top:138px;
	margin-bottom:60px;
}
#lineup #area08 .title{
	margin-bottom:25px;
}
#lineup #area08 .imageRightSP{
	display:none;
}


#lineup #area08 table{
	font-size:12px;
	text-align:left;
}
#lineup #area08 table th{
	font-weight:normal;
	vertical-align:top;
}

#lineup #area09{
	margin-bottom:30px;
	margin-left:60px;
	text-align:center;
}

#lineup #area09 img{
	float:left;
}

#lineup #area09under{
	border-top:1px dotted #dddddd;
	margin-top:30px;
	padding:60px;
}
#lineup #area09under .fR{
	float:right;
}
#lineup #area09under .fL{
	float:left;
}


/* ---------------contentsarea05--------------------*/
#store{
	background:#ffffff;
	border-radius: 8px;        /* CSS3草案 */  
    -webkit-border-radius: 8px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 8px;   /* Firefox用 */ 
	width:860px;
	margin:0 auto 20px auto;
	padding:0 60px 40px 60px;
	position:relative;
}

#store h4{ 
	position:absolute;
	top:0px;
	left:373px;
}

#store #area10 h5{
	float:left;
	margin-right:0px;
	margin-top:30px;
	width:70%;
}

#store #area10 .frImage{
	position:absolute;
	top:0px;
	right:0px;
}
#store #area10 .flImage{
	padding:140px 0 70px 0;
}

#store #area11 {
	border-top:1px dotted #dddddd;
	padding-top:20px;
	margin-top:20px;
}

#store #area12 {
	border-top:1px dotted #dddddd;
	padding-top:20px;
}

.shopBox{
	width:430px;
	float:left;
	margin-bottom:30px;
}

.shopBox h6{
	margin-bottom:15px;
	font-size:24px;
	font-weight: 400;
	font-family: 'Shippori Mincho', serif;
}

.shopBox h5{
	margin-bottom:20px;
}

.shopBox .holiday{
	border:1px solid #cccccc;
	font-size:12px;
	padding:3px 0 3px 10px;
	width:330px;
	margin-top:5px;
}


/* ---------------aboutArea--------------------*/
#about{
	background:#ffffff;
	margin:0 auto;
	padding:60px 0px 40px 0px;
}

.aboutAreaCont{
	width:980px;
	margin:0 auto;
}

.aboutAreaCont .imageRightSP{
	display:none;
}


.aboutAreaCont h5{
	margin-bottom:30px;
}

.aboutAreaCont .aboutBox{
	width:670px;
	margin:0 auto 20px auto;
}

.aboutAreaCont .imageRight{
	float:right;
}
.aboutAreaCont .textLeft{
	float:left;
}


/* ---------------google-maps--------------------*/
.google-maps {
position: relative;
padding-bottom: 30%; // これが縦横比
height: 0;
overflow: hidden;
}
.google-maps iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}

#map_canvas {
width:100%;height:400px;
}

/* ---------------totop--------------------*/

#totopLeft {
padding:15px 0 40px 0;
width:980px;
margin:0 auto;
text-align:right;

}


#totop {
background:#b60005;
padding:20px 0;
width:100%;
text-align:center;
}


/* ---------------footer--------------------*/
footer{
	text-align:center;
	padding:25px 0;
}
footer #footerArea {
	overflow: hidden;
    position: relative;
	margin-bottom:20px;
}
footer  ul{
	float: left;
	margin: 0 0 0 0;
    padding: 0;
    position: relative;
    left: 50%;
	font-size:12px;
}
footer ul li{
	float:left;
	margin-left:25px;
	position: relative;
    left: -50%;
}
footer p{
	margin:0 auto 10px auto;
	font-size:10px;
}