@charset "UTF-8";

/* @group reset*/

*{margin:0;padding:0;font-size:0.99em;}
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;
}

/* ---------------------------------iPAD--------------------------------------*/



img {max-width:100%;}
html {font-family:verdana,san-serif;line-height:1.5;}

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

.mr30{margin-right:30px;}
.mr100{margin-right:100px;}

.tac{text-align:center;}


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

header{
	background:url(images/bg_header.gif) ;
	text-align:center;
}
header .headerArea{
	width:100%;
	margin:0 auto;
	position:relative;
	
}

header .headerArea h1{
	position:absolute;
	top:0;
	left:0;
}
header .headerArea h2{
	margin-bottom:24px;
	display:block;
	padding-top:30px;
	
}
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:100%;
	margin:0 auto;
}
header nav#forSP{
	display:none;
}
header nav#forPC ul li {
	float:left;
	width:50%;
	padding:10px 0;
}
header nav#forPC ul li a{
	display:block;
}

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

#main{
	
	background-color:#f3f4f4;
}

#contents{
	background-image:url(images/bg_azuki-pad.png);
	background-position:right bottom;
	background-color:#f3f4f4;
	background-repeat: no-repeat;  
	padding-bottom:10px;
	background-size:50% auto;
}

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

.mb40{margin-bottom:40px;}

.spCopy {
	display:none;
}

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


#product #area01 h5{
	padding-top:30px;
	margin-bottom:30px;
}
#product #area01 .leftarea{
	width:61.5%;
	float:left;
}

#product #area01 p.right{
	float:right;
	width:32%;
}


#product #area02 h5{
	margin-top:20px;
	margin-bottom:20px;
	width:80%;
}

#product #area02 p.left{
	float:left;
	width:35%;
}

#product #area02 p.right{
	float:right;
	width:60%;
}

#product #area02 .manju{
	display:none;
}
#product #area02 .manjuText{
	display:none;
}


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

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

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

#recipe #area03 .leftarea{
	width:61.5%;
	float:left;
}

#recipe #area03 p.right{
	float:right;
	width:32%;
}

#recipe #area04 h5{
	margin:30px 0;
}

#recipe #area04 h6{
	margin-bottom:10px;
	float:left;
	width:30%;
}

#recipe #area04 p{
	width:67%;
	float:right;
	margin-bottom:30px;
	text-align:left!important;
}


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

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

#ingredients #area05 {
	margin-bottom:20px;
}

#ingredients #area05 .fL{
	float:left;
	width:38%;
}
#ingredients #area05 .fR{
	float:right;
	width:60%;
}
#ingredients #area05 .fR h6{
	margin-bottom:10px;
}

#ingredients #area06 {
	margin-bottom:20px;
}

#ingredients #area06 .fL{
	float:left;
	width:38%;
}
#ingredients #area06 .fR{
	float:right;
	width:60%;
}
#ingredients #area06 .fR h6{
	margin-bottom:10px;
}

#ingredients #area07 {
	margin-bottom:20px;
}

#ingredients #area07 .fL{
	float:left;
	width:23%;
}
#ingredients #area07 .fR{
	float:right;
	width:75%;
}
#ingredients #area07 .fR h6{
	margin-bottom:10px;
}



/* ---------------contentsarea04--------------------*/
#lineup{ 
	width:90%;
	margin:0 auto 20px auto;
	padding:0 3% 2% 3%;
}
#lineup .imageRight{
	float:right;
	width:55%;
}
#lineup .textLeft{
	float:left;
	width:45%;
}
#lineup #area08{
	margin-bottom:25px;
}
#lineup #area08 .imageRightSP{
	display:none;
}

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

#lineup #area09{
	margin-bottom:20px;
	margin-left:10%;
}

#lineup #area09 img{
	float:left;
	width:40%;
}

#lineup #area09 .mr50{
	margin-right:10%;
}
#lineup #area09under{
	border-top:1px dotted #dddddd;
	margin-top:30px;
	padding:5%;
}
#lineup #area09under .fR{
	float:right;
	width:38%;
}
#lineup #area09under .fL{
	float:left;
	width:60%;
}


/* ---------------contentsarea05--------------------*/
#store{
	background:#ffffff;
	border-radius: 8px;        /* CSS3草案 */  
    -webkit-border-radius: 8px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 8px;   /* Firefox用 */ 
	width:90%;
	margin:0 auto 20px auto;
	padding:0 3% 2% 3%;
}

#store #area10 .flImage{
	margin-top:10px;
	width:73%;
}

#store #area10 .frImage{
	display:none;
}

#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:49%;
	float:left;
	margin-bottom:30px;
}

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

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


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

.aboutAreaCont{
	width:98%;
	margin:0 auto;
}

.aboutAreaCont .imageRightSP{
	display:none;
}

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

.aboutAreaCont .aboutBox{
	width:70%;
	margin:0 auto 30px auto;
}

.aboutAreaCont .imageRight{
	float:right;
	width:40%;
}
.aboutAreaCont .textLeft{
	float:left;
	width:60%;
}
.aboutAreaCont .mb40{
	text-align:center;
	margin-bottom:40px;
}



/* ---------------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 15px 0;
width:95%;
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:10px;
	position: relative;
    left: -50%;
}
footer p{
	margin:0 auto 10px auto;
	font-size:10px;
}

}