@charset "UTF-8";
/*
-----------------------------------------------
Honda Miso Honten Web Site ver.1 Layout CSS
Author:   Hideyuki Koyama -MONTAGE lab.(http://www.montagelab.jp)
Version:  2013, Oct
----------------------------------------------- */


body{ margin:0; padding:0; background: #fafafa; height:100%;}
img{ border:0; vertical-align:bottom;}


/*-- clearfix
----------------------------------------------- */
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;}  
* html .clearfix             { zoom: 1; } /* IE6 */  
*:first-child+html .clearfix { zoom: 1; } /* IE7 */


.not{margin-top:0 !important; vertical-align:top;}
.nor{margin-right:0 !important;}
.nob{margin-bottom:0 !important;}
.nol{margin-left:0 !important;}

.nobt{border-top:none !important;}
.nobr{border-right:none !important;}
.nobb{border-bottom:none !important;}
.nobl{border-left:none !important;}

.bt{border-top:1px solid #999;}
.br{border-right:1px solid #999;}
.bb{border-bottom:1px solid #999;}
.bl{border-left:1px solid #999;}

.hide{display:none;}



/*-- body background
----------------------------------------------- */
body#home {}
/*
body#home #wrapper {
background:url(../img/common/bg_index.jpg) no-repeat center top;
}
*/

/*-- basic layout box
----------------------------------------------- */
#wrapper { position:relative;text-align:center;}
/*body#unchanged #wrapper { background:#fafafa url(../img/common/bg_bk2.gif) repeat-y center top;}*/
#headerwrap { position:relative; margin:0 auto; text-align:left; overflow:hidden;}
#containerwrap { position:relative; z-index:20; margin:0; width:100%;}
#footerwrap { clear:both; position:relative; text-align:left; border-top:1px solid #ddd; background:#fafafa;}


/*-- #headerwrap
----------------------------------------------- */
#header{position:relative; margin:0 auto; width:960px;}
#branding{
position:absolute;
top:124px;
right:20px;
z-index:10;
}
#branding h1{
margin:0;
padding:0;
width:156px;
height:255px;
}

#header #images{
position:relative; top:0; left:0; height:390px;
}
#header #images .image{
position:absolute; top:0; left:-120px;
}

#aesthetic #headerwrap,
#saikyomiso #headerwrap,
#aboutmiso #headerwrap,
#items #headerwrap,
#recipetop #headerwrap{
background:#000;
}


/*-- #containerwrap
----------------------------------------------- */
#container{position:relative; margin:0 auto; width:960px; text-align:left;}
#maincol{
float:left;
position:relative; /* IE6 layout bug fix */
padding:40px 0 0 0;
width:960px;
}

.multi-col2 { -moz-column-count:2; -webkit-column-count:2; colum-count:2;
-moz-column-gap:2em; -webkit-column-gap:2em; column-gap:2em;
}
.multi-col3 { -moz-column-count:3; -webkit-column-count:3; colum-count:3;
-moz-column-gap:2em; -webkit-column-gap:2em; column-gap:2em;
}




/*-- #footerwrap
----------------------------------------------- */
#footer{
position:relative;
margin:0 auto;
padding:4px 0 16px 528px;
width:400px;
}



/*-- .home
----------------------------------------------- */
/*#headerwrap{overflow:hidden;}
.home #header #images{
position:relative; top:0; left:50%; height:auto;
}
.home #header #images .image{
position:relative; top:0; left:-60px;
background:#000;
}
.home #containerwrap #maincol{
margin-top:-738px;
width:420px;
}*/

/*-- #unchanged
----------------------------------------------- */
#unchanged #header #images { position:relative; top:0; left:50%; height:auto;}
/*#unchanged #header #images .image { position:relative; top:0; left:150px; background:#000;}*/
#unchanged #subcol { float:right; width:210px;}
#unchanged #containerwrap #maincol { margin-top:-760px; width:560px;}

.un_greeting .col2,
.un_yomoyama .col2,
.un_history .col2 { width:560px;}
.un_greeting .col2 .cola, .un_greeting .col2 .colb,
.un_yomoyama .col2 .cola, .un_yomoyama .col2 .colb,
.un_history .col2 .cola, .un_history .col2 .colb { width:260px;}



/*-- #location
----------------------------------------------- */
#location #containerwrap{
border-top:1px solid #ddd;
}
#location #header #images{
position:relative; top:0; left:0; width:613px; height:auto; border-right:1px solid #ddd;
}
#location #header #images .image{
position:relative; top:0; left:-50px;
}
/*tel*/
table.tel {
	width:auto;
	margin:0 0 5px;
	border-collapse:collapse;
}
table.tel tr{
	border:none;
	border-width:0;
}
table.tel th,
table.tel td{
	line-height:1.8;
	padding:0;
}
table.tel th{
	width:auto;
	font-weight:normal;
}
table.tel td{
	border-left:none;
}


/*-- #wonder
----------------------------------------------- */
#wonder #containerwrap #maincol{
margin-top:-340px;
}
#power #containerwrap #maincol{
margin-top:-340px;
}


/*-- #processed
----------------------------------------------- */
#processed #containerwrap{
border-top:1px solid #ddd;
}


/*-- #recipe
----------------------------------------------- */
#recipe_top #containerwrap{
border-top:1px solid #ddd;
}
#recipe #containerwrap{
border-top:1px solid #ddd;
}
#recipe #maincol{
width:613px;
border-right:1px solid #ddd;
}
#recipe #header #images{
position:relative; top:0; left:0; width:613px; height:408px; border-right:1px solid #ddd;
}
#recipe #header #images .image{
position:absolute; top:0; left:-50px;
}


/*-- #item
----------------------------------------------- */
#item #containerwrap{
border-top:1px solid #ddd;
}
#item #maincol{
padding:0 13px 0 0;
width:600px;
border-right:1px solid #ddd;
}
#item #header #images{
position:relative; top:0; left:0; width:613px; height:408px; border-right:1px solid #ddd;
}
#item #header #images .image{
position:absolute; top:0; left:-50px;
}



/*-- column system
----------------------------------------------- */
.column { margin-bottom:4em;}
.column:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;}  
* html .column             { zoom: 1; } /* IE6 */  
*:first-child+html .column { zoom: 1; } /* IE7 */


.cola, .colb, .colc, .cold{width:210px;}

.col2{width:450px;}
.col2 .cola{float:left;}
.col2 .colb{float:right;}
.col2:after {  
visibility: hidden;  
display: block;  
font-size: 0;  
content: " ";  
clear: both;  
height: 0;  
}  
* html .col2             { zoom: 1; } /* IE6 */  
*:first-child+html .col2 { zoom: 1; } /* IE7 */


.col3{width:690px;}
.col3 .cola{float:left;padding:0 34px 0 0;}
.col3 .colb{float:left;}
.col3 .colc{float:right;}


.col4{width:940px;}
.col4 .cola{float:left;padding:0 33px 0 0;}
.col4 .colb{float:left;padding:0 33px 0 0;}
.col4 .colc{float:left;}
.col4 .cold{float:right;}


.cel2{
width:440px !important;
}
.cel3{
width:696px !important;
}

/* layout check 
#header{border:1px solid #0ff;}
#container{border:1px solid #00f;}
#footer{border:1px solid #0f0;}
#maincol{border:1px solid #f00;}
.cola, .colb, .colc, .cold{
border:1px solid #f00;
}
*/


#headslide { position:relative; left:-120px; width:1200px;}
#itemslide { position:relative; left:-50px; width:663px;}





/*-- .privacy-policy
----------------------------------------------- */
#privacy-policy #maincol {
	margin-top:60px;
}
#privacy-policy #h_privacy-policy {
	float:left;
	width:210px;
	height:360px;
	text-indent:-9000px;
	background:url(../img/headline/h_privacy-policy.png) no-repeat 0 0;
	margin:0 0 0 -28px;
}
#privacy-policy .privacy-policy_body {
	float:left;
	width:750px;
}
#privacy-policy .privacy-policy_body h3 {
	text-align:center;
}
#privacy-policy .policy ol,
#privacy-policy .policy ul {
	list-style:none;
	padding:0;
	margin:0;
}
#privacy-policy .policy p {
	text-indent:0;
	padding:0;
	margin:0;
}
#privacy-policy .policy h4 {
	font-size:16px;
	font-weight:bold;
}
#privacy-policy .text {
	padding-left:32px;
}
#privacy-policy .text li {
	text-indent:-2em;
	padding-left:2em;
}
#privacy-policy .text table {
	width:100%;
	border-right:1px solid #ccc;
}
#privacy-policy .text table tr {
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
}
#privacy-policy .text table th {
	text-align:center;
	vertical-align:middle;
	background-color:#ccc;
	border-left:1px solid #ccc;
	padding:8px;
}
#privacy-policy .text table th:last-child {
	border-left:1px solid #fff;
}
#privacy-policy .text table td {
	vertical-align:middle;
	border-left:1px solid #ccc;
	padding:8px;
}
#privacy-policy .text .contact {
	text-indent:0;
	border:1px solid #ccc;
	padding:12px 24px;
	margin:0.5em 0 0.75em;
}
#privacy-policy .text .contact dd {
	padding-left:28px;
}
#privacy-policy .date {
	text-align:right;
	margin-top:40px;
}