@charset "utf-8";
/*
Theme Name: kuromamecha2
Theme URI: http://www.kuromamecha.com/
Description: kuromamecha2
Version: 1.0
Author: ブレハ
Author URI: http://www.brainhands.com/
*/

/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,hr { 
margin:0;
padding:0;
}
table {
border-collapse:collapse;
border-spacing:0;
}
fieldset,img { 
border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
font-style:normal;
font-weight:normal;
}
ol,ul {
list-style:none;
}
caption,th {
text-align:left;
}
h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:normal;
}
q:before,q:after {
content:'';
}
abbr,acronym {
border:0;
}
hr {
color: #fff;
border: 0px none;
height: 1px;
border-bottom: 1px solid #bfbfbf;
margin: 20px 0;
}

/* common */
a:link {
color: #000;
text-decoration: none;
}
a:visited {
color: #000;
text-decoration: none;
}
a:hover {
color: #000;
text-decoration: none;
}
a:active {
color: #000;
text-decoration: none;
}
.clearfix:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
.clearfix{
overflow:hidden;
}
/* Hides from IE-mac \*/
* html .clearfix{
height:1%;
overflow:visible;
}
/* End hide from IE-mac */
.left {
float: left;
}
.right {
float: right;
}
.bottom {
vertical-align: bottom;
}


/* layout */
body {
font-size: 12px;
line-height: 1.6;
font-family: "Lucida Grande", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック",  "Lucida Sans Unicode", Arial, Verdana, sans-serif;
background: url(images/bak_body.jpg) top center no-repeat;
}

.serif {
font-family: "ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","MS P明朝","MS PMincho",serif;}

#wrapper {
margin: 0 auto;
width: 980px;
}

#header {
width: 980px;
/*height: 108px;*/
height: 120px;
position: relative;
}

#container {
width: 980px;
overflow: visible;
}

#mainCol{
width: 980px;
}

#footer {
width: 980px;
height: 96px;
margin: 0 0 60px 0;
position: relative;
}

/* header */
h1#title {
text-align: center;
background: url(images/bak_h1.png) repeat-x;
height: 25px;
}

h1#title a {
color: #fff;
}

#logo {
position: absolute;
top: 50px;
right: 0px;
}

#grobalNavi {
width: 480px;
height: 24px;
background: url(images/bak_grobalNavi.png) left center no-repeat;
position: absolute;
top: 60px;
left: 0;
padding: 5px 0 0 30px;
}

#grobalNavi li {
float: left;
margin: 0 24px 0 0;
}

#grobalNavi li a {
color: #fff;
}

#shoppingNavi {
position: absolute;
top: 60px;
left: 500px;
}

#shoppingNavi li {
float: left;
margin: 0 5px 0 0;
}

#shoppingNavi li a {
color: #fff;
text-align: center;
display: block;
width: 96px;
height: 24px;
background: url(images/bak_shoppingNavi.png) left center no-repeat;
padding-top: 5px;
}

/* footer */

#footerBody {
width: 980px;
height: 96px;
background: url(images/bak_footer.png) no-repeat;
}

#extraNavi {
position: absolute;
top: 64px;
left: 30px;
}

#extraNavi a {
color: #68615e;
}

#localNavi {
position: absolute;
top: 64px;
left: 170px;
}

#localNavi li {
display: inline;
margin: 0 10px 0 0;
}

#localNavi li a {
color: #fff;
}

#copyright {
color: #554c49;
text-align: right;
position: absolute;
top: 100px;
right: 0;
}

/* top */
#helloArea {
width: 980px;
height: 350px;
}

#helloArea .mainBanner {
width: 630px;
height: 350px;
/*position: relative;*/
float: left;
}

#helloArea .mainBanner li {
display: inline;
}

#helloArea .balloon {
width: 213px;
height: 111px;
position: absolute;
top: 10px;
left: 240px;
z-index: 3;
}

#helloArea .subBanner {
width: 350px;
height: 350px;
background: url(images/bak_subBanner.jpg) no-repeat;
position: relative;
float: left;
}

#helloArea .subBanner .message {
position: absolute;
top: 0;
right: 10px;
z-index: 3;
}

#helloArea .subBanner ul {
position: absolute;
top: 160px;
right: 8px;
}

#newsArea {
width: 854px;
margin: 16px 0;
padding: 8px 0 8px 124px;
border: 1px solid #000;
background: url(images/bak_news.gif) left center no-repeat;
position: relative;
}

#newsArea .newsDate {
display: inline;
}

#newsArea h2.newsTitle{
display: inline;
background: url(images/icon_triangle_orange.gif) left center no-repeat;
padding: 0 0 0 12px;
}

#newsArea .newstoList {
position: absolute;
top: 8px;
right: 8px;
}

div#categoryArea {
width: 980px;
}

div#categoryArea div.kuromamecha {
float: left;
width: 380px;
margin: 0 21px 0 0;
}

div#categoryArea div.other {
float: left;
width: 179px;
margin: 0 21px 0 0;
}

div#categoryArea div.last {
float: left;
width: 179px;
margin: 0;
}

div#categoryArea p {
margin: 10px 0 0 0;
color: #867a75;
}

div#categoryArea ul {
margin: 10px 0 0 0;
float: left;
}

div#categoryArea li {
width: 167px;
padding: 0 0 0 12px;
background: url(images/icon_triangle_black.png) left 6px no-repeat;
margin: 0 0 0.4em 0;
}

div#extraBanner li {
display: inline;
margin: 0 4px 0 0;
}

div#extraBanner li.last {
margin: 0;
}

ul#infoArea {
margin: 28px 0;
}

ul#infoArea p {
font-size: 10px;
color: #574838;
line-height: 1.8;
}

ul#infoArea img {
margin: 0 0 19px 0;
}

ul#infoArea h3 {
font-size: 11px;
font-weight: bold;
margin: 0 0 4px 0;
}

ul#infoArea h4 {
font-size: 10px;
color: #574838;
font-weight: bold;
margin: 6px 0 4px 0;
}

ul#infoArea li {
float: left;
}

ul#infoArea li.infoCol1 {
width: 228px;
padding: 0 16px 0 36px;
}

ul#infoArea li.infoCol2 {
width: 307px;
padding: 0 16px;
border-left: 1px solid #bfbfbf;
}

ul#infoArea li.infoCol3 {
width: 307px;
padding: 0 36px 0 16px;
border-left: 1px solid #bfbfbf;
}

/* page */
#page {
line-height: 2;
}

#page h2 {
font-size: 26px;
margin: 0 0 6px 0;
}

#page h3 {
font-size: 18px;
margin: 14px 0 10px 0;
border-bottom: 1px solid #bfbfbf;
}

#page h4 {
font-size: 14px;
margin: 14px 0 6px 0;
font-weight: bold;
}

#page h5 {
font-size: 13px;
margin: 14px 0 10px 0;
border-bottom: 1px dotted #bfbfbf;
}

#page h6 {
font-weight: bold;
}

#page img {
margin: 4px 0;
}

#page table {
width: 100%;
border-top: 1px solid #000;
border-right: 1px solid #000;
margin: 0 0 10px 0;
}

#page th, #page td {
padding: 3px 10px;
border-left: 1px solid #000;
border-bottom: 1px solid #000;
}

#page th {
text-align: center;
font-weight: bold;
background: #e69e3d;
}

#page strong {
color: #ad4933;
font-weight: bold;
}

#page .prefNavi {
margin: 0 0 10px 0;
}

#page .prefNavi li {
display: inline;
font-size: 14px;
padding: 0 0 0 12px;
background: url(images/icon_triangle_orange.gif) left center no-repeat;
}

#page .prefNavi li a {
margin: 0 10px 0 0;
}

#page dl {
margin: 0 0 2.0em 0;
padding: 0;
}

#page dl dt {
margin: 0 0 0.5em 0;
padding: 0 0 0.5em 0;
}

#page dl dd {
margin: -2.5em 0 0.5em 0;
padding: 0 0 0.5em 15.5em;
border-bottom: 1px dotted #bfbfbf;
}

#page .borderLine {
padding: 10px 30px;
border: 1px solid #ad4933;
margin: 10px 0 10px 0;
}

#page li {
padding: 0 0 0 12px;
background: url(images/icon_triangle_orange.gif) left center no-repeat;
}

#page .caution {
color: #c78d4b;
}

#page .attention {
font-size: 13px;
color: #ad4933;
margin: 10px 0 0 0;
}

/* item */
#item {
}

#item h2 {
font-size: 26px;
margin: 0 0 6px 0;
}

#item h3 {
font-size: 18px;
margin: 14px 0 10px 0;
}

/* cartArea */
#cartArea {
width: 872px;
margin: 0 auto;
}

#cartArea .cart {
float: left;
width: 188px;
height: 340px;
padding: 0 30px 0 0;
position: relative;
}

#cartArea h3 {
margin: 50px 0 6px 0;
}

#cartArea .cart h4 {
font-size: 14px;
line-height: 1.2;
margin: 10px 0 0 0;
}

#cartArea .cart .itemprice {
color: #ffa111;
font-size: 16px;
margin: 3px 0;
}

#cartArea .cart .itemicon {
text-align: center;
width: 60px;
color: #fff;
font-size: 83%;
background: #fc0009;
padding: 2px 0;
position: absolute;
top: 168px;
right: 30px;
}

#cartArea .cart .yen {
color: #ffa111;
font-size: 12px;
}

#cartArea .cart .addtoCart a {
display: block;
color: #fff;
font-size: 14px;
background: #6d3f29;
width: 186px;
height: 30px;
text-align: center;
padding: 10px 0 0 0;
text-decoration: none;
}

/* specArea */
#specArea {
width: 872px;
margin: 14px auto 0 auto;
}

#specArea h5 {
font-size: 18px;
margin: 50px 0 6px 0;
}

/* single */
#single h2 {
font-size: 26px;
margin: 0 0 6px 0;
}

#single h3 {
font-size: 18px;
text-align: center;
border-bottom: 1px solid #bfbfbf;
margin: 14px 0 10px 0;
padding: 0 0 10px 0;
}

#single h4 {
font-size: 15px;
margin: 22px 0 10px 0;
}

#single h5 {
font-size: 12px;
font-weight: bold;
margin: 14px 0 10px 0;
}

#single h3 a {
color: #ad4933;
}

#single strong {
color: #ad4933;
}

#single th {
color: #fff;
background: #ad4933;
}

#single th, #single td {
padding: 5px 10px;
}

#single .postDate {
text-align: right;
}

#single .postContent {
margin: 10px 0 0 0;
}

#single .postContent p {
line-height: 1.8;
}

#single .pageNavi {
margin: 10px 0 0 0;
}

#mainCol .postNot {
height: 200px;
text-align: center;
}

#mainCol .postNot {
margin-top: 100px;
}

/* itemlist */

#itemlist h2 {
font-size: 26px;
margin: 0 0 6px 0;
}

#itemlist .teiki {
width: 648px;
margin: 0 auto;
}

/* otomo */
#otomoArea {
width: 980px;
}

#otomoArea ul {
width: 872px;
margin: 20px auto 0 auto;
}

#otomoArea li {
float: left;
margin: 0 20px 0 0;
}

#otomoArea li.last {
margin: 0 0 0 0;
}

/* okashi */
#okashiArea {
width: 980px;
}

#okashiArea ul {
width: 872px;
margin: 20px auto 0 auto;
}

#okashiArea li {
float: left;
margin: 0 20px 0 0;
}

#okashiArea li.last {
margin: 0;
}

/* item */
#itemPage {
width: 980px;
overflow: visible;
}

#itemPage img {
margin: 0;
padding: 0;
border: 0;
}

#itemPage ul.menu {
margin: 40px 54px 0 30px;
padding: 6px 10px;
width: 174px;
float: left;
background: url(images/bak_linktoCart.png) left center no-repeat;
}

#itemPage ul.menu li a {
font-size: 14px;
color: #fff;
}

#itemPage div.image {
margin: 36px 0 0 54px;
width: 648px;
float: left;
}

#caution {
border: 2px solid #ac4a2f;
padding: 5px 10px;
text-align: center; 
margin: 0 0 10px 0;
}

#caution a:link, #caution a:visited {
color: #ac4a2f;
font-size: 16px;
}