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

html{font-size:62.5%;}
body{
font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
font-size:14px; font-size:1.4rem;
line-height:1.8;
white-space:normal;
color:#444;
-webkit-text-size-adjust: none;
}


/*-- text class
----------------------------------------------- */
p { clear:both; padding:0 3em 1.8em 0;}
#container p { margin:0; padding:0 0 1.8em 0; text-indent:1em;}
#container p.nodrop { text-indent:0em;}
.column p,
#subcol p{ clear:both; padding:0 0 1.8em 0;}

.center{text-align:center;}
.right{text-align:right;}


/*-- text decoration class
----------------------------------------------- */
.num{ color:#960;}

/* size */
.large{ font-size:120%;}
.small{ font-size:86%;}
.abs-small{font-size:11px; font-size:1.1rem;}

/* color */
.dark{ color:#000;}
.pale{ color:#999;}
.attention{ color:#E03728;}
.note{ font-size:12px; font-size:1.2rem; line-height:1.5; color:#666;}
.caption{ font-size:12px; font-size:1.2rem; line-height:1.5; color:#9d9994;}

/* family */
.serif{font-family: "Times New Roman", Times, serif;}
.sans{font-family: "Helvetica Neue", Helvetica, sans-serif;}

/* style */
.normal{font-style: normal;}
.italic{font-style: italic;}

em { font-style:normal; font-weight:bold;}

cite{font-size:90%; font-style:normal; color:#ccc;}
cite a{color:#ccc;}
cite a:hover{color:#999;}



/*-- headline class
----------------------------------------------- */
h1, h2, h3, h4, h5, h6{
font-family:"ＭＳ 明朝","Times New Roman", Times, serif;
line-height:1.4;
}
h3{
margin:26px 0 23px 0;
margin:2.6rem 0 2.3rem 0;
color:#222;
font-size:20px; font-size:2rem;
font-weight:normal;
}
h4{
margin:1.8em 0 1.4em 0;
color:#222;
font-weight:normal;
}
h5{
margin:1.6em 0 0.5em 0;
color:#222;
font-size:110%;
font-weight:bold;
}
h3 .price{padding-left:1em;font-size:90%; color:#666;}
#aesthetic #maincol h3 {font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif; color:#111;}



/* unordered List style
--------------------------------------------------
----------------------------------------------- */
ul{
margin:0;
padding:0;
list-style:none;
}
#maincol ul{}
#maincol ul li{}


/* defined List style
--------------------------------------------------
----------------------------------------------- */
dl, dl dt, dl dd{
margin:0;
padding:0;
line-height:1.5;
}
dl.dtdd dt{
clear:both;
float:left;
width:160px;
display:block;
}
dl.dtdd dd{
display:block;
margin:5px 0 8px;
padding:0 0 0 160px;
}


/* ordered List style
--------------------------------------------------
----------------------------------------------- */
ol{
margin:0;
padding:0 0 0 1.5em;
list-style-position:outside; 
}



/*-- headline replace class
----------------------------------------------- */
/*-- h2 置き換え
----------------------------------------------- */
h2#h_un_history,
h2#h_un_greeting,
h2#h_un_yomoyama,
h2#h_un_profile,
h2#h_saikyomiso,
h2#h_ob_aesthetic,
h2#h_ob_wonder,
h2#h_ob_miso,
h2#h_location,
h2#h_aa_kasaneru,
h2#h_aa_musubu,
h2#h_aa_kuchikiri,
h2#h_aa_tatamu,
h2#h_aa_mitateru,
h2#h_aa_wasu,
h2#h_aa_awaseru,
h2#h_aa_yobanashi,
h2#h_aa_shikiru,
h2#h_aboutmiso,
h2#h_am_history,
h2#h_am_type,
h2#h_healthy,
h2#h_he_power,
h2#h_processed,
h2#h_recipe,
h2#h_items{
margin:0 0 0 -28px;
width:210px;
height:175px;
text-indent:-9000px;
}
h2#h_un_history{ width:300px; background:url(../img/headline/h_un_history.gif) no-repeat 0 0;}
h2#h_un_greeting{ background:url(../img/headline/h_un_greeting.gif) no-repeat 0 0;}
h2#h_un_yomoyama{ width:240px; background:url(../img/headline/h_un_yomoyama.gif) no-repeat 0 0;}
h2#h_un_profile{ background:url(../img/headline/h_un_profile.gif) no-repeat 0 0;}
h2#h_saikyomiso{ width:240px; background:url(../img/headline/h_un_saikyomiso.gif) no-repeat 0 0;}
h2#h_location{ background:url(../img/headline/h_un_location.gif) no-repeat 0 0;}

h2#h_ob_aesthetic{ width:450px; background:url(../img/headline/h_ob_aesthetic.gif) no-repeat 0 0;}
h2#h_ob_wonder{ background:url(../img/headline/h_ob_wonder.gif) no-repeat 0 0;}
h2#h_ob_miso{ width:250px; background:url(../img/headline/h_ob_miso.gif) no-repeat 0 0;}


h2#h_aa_kasaneru{ height:255px; background:url(../img/headline/h_aa_kasaneru.gif) no-repeat 0 0;}
h2#h_aa_musubu{ height:255px; background:url(../img/headline/h_aa_musubu.gif) no-repeat 0 0;}
h2#h_aa_kuchikiri{ height:255px; background:url(../img/headline/h_aa_kuchikiri.gif) no-repeat 0 0;}
h2#h_aa_tatamu{ height:255px; background:url(../img/headline/h_aa_tatamu.gif) no-repeat 0 0;}
h2#h_aa_mitateru{ height:255px; background:url(../img/headline/h_aa_mitateru.gif) no-repeat 0 0;}
h2#h_aa_wasu{ height:255px; background:url(../img/headline/h_aa_wasu.gif) no-repeat 0 0;}
h2#h_aa_awaseru{ height:255px; background:url(../img/headline/h_aa_awaseru.gif) no-repeat 0 0;}
h2#h_aa_yobanashi{ height:255px; background:url(../img/headline/h_aa_yobanashi.gif) no-repeat 0 0;}
h2#h_aa_shikiru{ height:255px; background:url(../img/headline/h_aa_shikiru.gif) no-repeat 0 0;}

h2#h_aboutmiso{
width:360px;
background:url(../img/headline/h_aboutmiso.gif) no-repeat 0 0;
}
h2#h_am_history{
width:220px;
background:url(../img/headline/h_am_history.gif) no-repeat 0 0;
}
h2#h_am_type{
background:url(../img/headline/h_am_type.gif) no-repeat 0 0;
}

h2#h_healthy{
width:370px;
background:url(../img/headline/h_healthy.gif) no-repeat 0 0;
}
h2#h_he_power{
height:210px;
background:url(../img/headline/h_he_power.gif) no-repeat 0 0;
}

h2#h_processed{
width:220px;
background:url(../img/headline/h_processed.gif) no-repeat 0 0;
}


h2#h_recipe{
background:url(../img/headline/h_recipe.gif) no-repeat 0 0;
}
#recipe h2#h_recipe{
position:absolute; top:-290px; left:660px;
}

h2#h_items{
height:220px;
background:url(../img/headline/h_items.gif) no-repeat 0 0;
}
#item h2#h_items{
position:absolute; top:-290px; left:660px;
}



/*-- hr
----------------------------------------------- */
hr{ clear:both; margin:8px 0; height:1px; border:none; background:#ddd; color:#ddd; }

.hr,
.hryellow,
.hrbrown,
.hrred,
.hrblue{
clear:both;
margin:8px 0 32px;
height:26px;
background:url(../img/common/hr_yellow.gif) no-repeat center top;
}
.hryellow{background:url(../img/common/hr_yellow.gif) no-repeat center top;}
.hrbrown{background:url(../img/common/hr_brown.gif) no-repeat center top;}
.hrred{ background:url(../img/common/hr_red.gif) no-repeat center top;}
.hrblue{ background:url(../img/common/hr_blue.gif) no-repeat center top;}



/*--  
----------------------------------------------- */
table {
margin:20px 0;
width:580px;
border-collapse:collapse;
}
table tr{
border:solid #ddd;
border-width:1px 0;
}
table th, table td{
padding:4px 8px;
line-height:1.2;
}
table th{
width:100px;
}
table td{
border-left:1px solid #ddd;
}

table.process{margin:0;border:1px solid #ccc;}
table.process th{border:solid #ccc;border-width:0 0 1px 1px;}
table.process td{border:solid #ccc;border-width:0 0 1px 1px;}
table.process tr{border:none;}
table.process td.pale{border-bottom:1px solid #ddd;}
table.process td.dot{border-bottom:1px dotted #ccc;}
table.process td.dott{border-bottom:1px dotted #ddd;}

/*--  footer
----------------------------------------------- */
#footer p#copyright{
position:absolute; right:0;
margin:6px 0 0 0;
padding:0;
width:293px;
height:20px;
font-size:10px;
overflow:hidden;
text-indent:-9000px;
background:url(../img/common/copyright.gif) no-repeat 0 0;
}