@charset "UTF-8";
/*
Theme Name: yagiin css
Theme URL: http://www.yagiin.net/
Description: indexCSS（インデックス用）.
Version: 1.0
Author: スパイスショップ山羊印
Author URL: http://www.yagiin.net/
*/

/* CSS Document */
/* リード・カバー用
------------------ */
.read {
margin:0 10px 30px 0;
padding:0;
}
.read h2 {
width:560px;
height:200px;
margin:0 0 10px 0;
padding:0;
font-size:1em;
background:url(../img/index/cover-index.jpg) no-repeat left center;
text-indent:-9999em;
}
.read h2 a {
width:560px;
height:200px;
margin:0;
padding:0;
text-decoration:none;
display:block;
}
.read p {
font-size:0.85em;
}
/* スパイス共用
------------------ */
.spice-title {
clear:both;
position:relative;
width:560px;
margin:0 0 0 0;
padding:0;
}
.spice-read {
float:left;
margin:0 5px 10px 0;
padding:0;
}
.spice-read p {
margin:0;
padding:0;
color:#996600;
}
/* スパイスオリジナル用
------------------ */
.spice-origin {
margin:0 0 10px 0;
padding:0;
}
.spice-origin h3 {
float:left;
width:290px;
height:65px;
margin:0;
padding:0;
font-size:1em;
background:url(../img/index/title-original.gif) no-repeat -1px 0;
text-indent:-9999em;
}
.spice-origin h3 a {
width:290px;
height:65px;
margin:0;
padding:0;
background:url(../img/index/title-original.gif) no-repeat -1px 0;
text-indent:-9999em;
text-decoration:none;
display:block;
}
.spice-origin h3 a:hover {
width:290px;
height:65px;
margin:0;
padding:0;
background:url(../img/index/title-original.gif) no-repeat 0px 1px;
text-indent:-9999em;
text-decoration:none;
display:block;
}
/* スパイスオリジナル・商品コンテナ用
------------------ */
.origin-container {
clear:both;
position:relative;
width:100%;
margin:10px 0 0 0;
padding:0;
}
.origin-container-left {
float:left;
position:relative;
width:325px;
margin:0;
padding:0;
}
.origin-item-s {
float:left;
width:135px;
margin:0 17px 0 0;
padding:0;
}
.origin-item-s img {
margin:0;
padding:0;
border:none;
position:relative;
}
.origin-item-s p {
margin:5px 0 10px 0;
padding:0;
line-height:125%;
}
.item-standard {
margin:0;
padding:0;
}
.item-standard h4 {
width:135px;
height:22px;
margin:5px 0;
padding:0;
font-size:1em;
color:#333333;
text-indent:-9999em;
background:url(../img/index/ori-standard.gif) no-repeat 0 0;
position:relative;
}
.item-standard h4 a {
width:135px;
height:22px;
margin:0;
padding:0;
font-size:1em;
color:#333333;
background:url(../img/index/ori-standard.gif) no-repeat 0 0;
text-decoration:none;
display:block;
}
.item-standard h4 a:hover {
width:135px;
height:22px;
margin:0;
padding:0;
font-size:1em;
color:#333333;
background:url(../img/index/ori-standard.gif) no-repeat 0 -22px;
text-decoration:none;
display:block;
}
.item-milde {
margin:0;
padding:0;
}
.item-milde h4 {
width:135px;
height:22px;
margin:5px 0;
padding:0;
font-size:1em;
color:#333333;
text-indent:-9999em;
background:url(../img/index/ori-milde.gif) no-repeat 0 0;
position:relative;
}
.item-milde h4 a {
width:135px;
height:22px;
margin:0;
padding:0;
font-size:1em;
color:#333333;
background:url(../img/index/ori-milde.gif) no-repeat 0 0;
text-decoration:none;
display:block;
}
.item-milde h4 a:hover {
width:135px;
height:22px;
margin:0;
padding:0;
font-size:1em;
color:#333333;
background:url(../img/index/ori-milde.gif) no-repeat 0 -22px;
text-decoration:none;
display:block;
}
.item-hot {
margin:0;
padding:0;
}
.item-hot h4 {
width:135px;
height:22px;
margin:5px 0;
padding:0;
font-size:1em;
color:#333333;
text-indent:-9999em;
background:url(../img/index/ori-hot.gif) no-repeat 0 0;
position:relative;
}
.item-hot h4 a {
width:135px;
height:22px;
margin:0;
padding:0;
font-size:1em;
color:#333333;
background:url(../img/index/ori-hot.gif) no-repeat 0 0;
text-decoration:none;
display:block;
}
.item-hot h4 a:hover {
width:135px;
height:22px;
margin:0;
padding:0;
font-size:1em;
color:#333333;
background:url(../img/index/ori-hot.gif) no-repeat 0 -22px;
text-decoration:none;
display:block;
}
.item-superhot {
margin:0;
padding:0;
}
.item-shot h4 {
width:135px;
height:22px;
margin:5px 0;
padding:0;
font-size:1em;
color:#333333;
text-indent:-9999em;
background:url(../img/index/ori-shot.gif) no-repeat 0 0;
position:relative;
}
.item-shot h4 a {
width:135px;
height:22px;
margin:0;
padding:0;
font-size:1em;
color:#333333;
background:url(../img/index/ori-shot.gif) no-repeat 0 0;
text-decoration:none;
display:block;
}
.item-shot h4 a:hover {
width:135px;
height:22px;
margin:0;
padding:0;
font-size:1em;
color:#333333;
background:url(../img/index/ori-shot.gif) no-repeat 0 -22px;
text-decoration:none;
display:block;
}

/* オリジナル商品右用
------------------ */
.origin-container-right {
float:right;
width:250px;
margin:0;
padding:0;
}
.origin-item-l {
margin:0 40px 0 0;
padding:0;
}
.origin-item-l img {
margin:0;
padding:0;
border:none;
position:relative;
}
.origin-item-l p {
margin:5px 0 10px;
padding:0;
line-height:150%;
}
.item-start {
margin:0;
padding:0;
}
.item-start h4 {
width:214px;
height:22px;
margin:5px 0;
padding:0;
font-size:1em;
color:#333333;
text-indent:-9999em;
background:url(../img/index/ori-start.gif) no-repeat 0 0;
position:relative;
}
.item-start h4 a {
width:214px;
height:22px;
margin:0;
padding:0;
font-size:1em;
color:#333333;
background:url(../img/index/ori-start.gif) no-repeat 0 0;
text-decoration:none;
display:block;
}
.item-start h4 a:hover {
width:214px;
height:22px;
margin:0;
padding:0;
font-size:1em;
color:#333333;
background:url(../img/index/ori-start.gif) no-repeat 0 -22px;
text-decoration:none;
display:block;
}
.item-kids {
margin:0;
padding:0;
}
.item-kids h4 {
width:214px;
height:22px;
margin:5px 0;
padding:0;
font-size:1em;
color:#333333;
text-indent:-9999em;
background:url(../img/index/ori-kids.gif) no-repeat 0 0;
position:relative;
}
.item-kids h4 a {
width:214px;
height:22px;
margin:0;
padding:0;
font-size:1em;
color:#333333;
background:url(../img/index/ori-kids.gif) no-repeat 0 0;
text-decoration:none;
display:block;
}
.item-kids h4 a:hover {
width:214px;
height:22px;
margin:0;
padding:0;
font-size:1em;
color:#333333;
background:url(../img/index/ori-kids.gif) no-repeat 0 -22px;
text-decoration:none;
display:block;
}
/* スパイスストレート用
------------------ */
.spice-straight {
clear:both;
margin:20px 0 20px 0;
padding:0;
overflow: hidden;
}
.spice-straight:after {
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}

/*\*/
* html .spice-straight {
    height: 1em;
    overflow: visible;
}
/**/
.spice-straight h3 {
float:left;
width:200px;
height:65px;
margin:0;
padding:0;
font-size:1em;
background:url(../img/index/title-straight.gif) no-repeat -1px 0;
text-indent:-9999em;
}
.spice-straight h3 a {
width:200px;
height:65px;
margin:0;
padding:0;
background:url(../img/index/title-straight.gif) no-repeat -1px 0;
text-indent:-9999em;
text-decoration:none;
display:block;
}
.spice-straight h3 a:hover {
width:200px;
height:65px;
margin:0;
padding:0;
background:url(../img/index/title-straight.gif) no-repeat 0px 1px;
text-indent:-9999em;
text-decoration:none;
display:block;
}
.item-straight-container {
clear:both;
width:550px;
margin:0;
padding:0;
border-left:#999999 solid 1px;
border-bottom:#999999 solid 1px;
overflow: hidden;
}
.item-straight-container:after {
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}

/*\*/
* html .item-straight-container {
    height: 1em;
    overflow: visible;
}
/**/
.item-straight {
float:left;
width:274px;
margin:0;
padding:0 0 5px 0;
background:#FFFFCC;
border-right:#999999 solid 1px;
border-top:#999999 solid 1px;
position:relative;
}
.item-straight h5 {
clear:both;
margin:5px;
padding:0 0 2px 0;
font-size:1em;
border-bottom:#CCCCCC solid 1px;
}
.item-straight p {
margin:0 5px;
padding:0;
font-size:0.75em;
color:#666666;
line-height:125%;
}
.item-straight img {
float:left;
margin:0 5px 0 0;
padding:0;
border:none;
}
/* インフォ用
------------------ */
.info {
width:180px;
margin:0 0 0 10px;
padding:0px;
    overflow: hidden;
}

.info:after {
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}

/*\*/
* html .info {
    height: 1em;
    overflow: visible;
}
/**/
.info h4 {
width:180px;
height:45px;
margin:0;
padding:0;
background:url(../img/pub/side-info-title.gif) no-repeat left bottom;
text-indent:-9999em;
text-decoration:none;
}
.info h4 a {
width:180px;
height:45px;
margin:0;
padding:0;
background:url(../img/pub/side-info-title.gif) no-repeat left bottom;
text-indent:-9999em;
text-decoration:none;
display:block;
}
.infobox {
margin:0;
padding:5px;
background:#FFFFCC url(../img/pub/border-dotted.gif) repeat-x left bottom;
    overflow: hidden;
}

.infobox:after {
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}

/*\*/
* html .infobox {
    height: 1em;
    overflow: visible;
}
/**/
.infobox h5 {
margin:0;
padding:0;
line-height:125%;
}
.infobox p {
margin:10px 0;
line-height:125%;
}
p.date {
margin:0;
padding:0;
font-size:0.6em;
color:#999999;
}
/* サイド・アドミン
------------------ */
.admin {
margin:200px 20px 10px 20px;
}
.admin ul {
margin:0;
padding:0;
list-style:none;
}
.admin li {
margin:0;
padding:0;
font-size:10px;
color:#CCCCCC;
}
.admin li a {
color:#CCCCCC;
}
/* 送料用
------------------ */
.souryou {
clear:both;
}
.souryou p {
width:560px;
height:43px;
margin:5px 0;
padding:0;
font-size:1em;
text-indent:-9999em;
background:url(../img/index/souryou560.jpg) no-repeat left center;
}
.souryou p a {
width:560px;
height:43px;
margin:0;
padding:0;
font-size:1em;
text-indent:-9999em;
text-decoration:none;
display:block;
background:url(../img/index/souryou560.jpg) no-repeat left center;
}
p.guide-haitatsu {
width:529px;
height:238px;
margin:5px 0;
padding:0;
background:url(../img/colormeshop/guide-haitatsu.jpg) no-repeat left center;
text-indent:-9999em;
}
p.guide-haitatsu a {
width:529px;
height:238px;
margin:0;
padding:0;
background:url(../img/colormeshop/guide-haitatsu.jpg) no-repeat left center;
text-indent:-9999em;
text-decoration:none;
display:block;
}

/* サイドからメインへ会社案内
------------------ */
.campany-m {
clear:both;
position:relative;
margin:20px 10px 0 0;
padding:20px;
border:#999999 solid 1px;
overflow: hidden;
}
.campany-m:after {
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}

/*\*/
* html .campany-m {
    height: 1em;
    overflow: visible;
}
/**/
.campany-m h4 {
float:left;
width:161px;
height:94px;
margin:0 0 0 10px;
padding:0;
font-size:1em;
text-indent:-9999em;
background:url(../img/pub/side-campany.gif) no-repeat 0 0;
}
.campany-m h4 a {
width:161px;
height:94px;
margin:0;
padding:0;
text-indent:-9999em;
background:url(../img/pub/side-campany.gif) no-repeat 0 0;
text-decoration:none;
display:block;
}
.campany-m-container {
float:left;
margin:5px 10px 5px 5px;
padding:5px 8px;
}
.campany-m-container h5 {
margin:5px 0 2px 0;
padding:0 0 0 2px;
font-size:0.75em;
border-left:#333333 solid 12px;
font-weight:normal;
letter-spacing:0.1em;
}
.campany-m-container p {
font-size:0.7em;
color:#666666;
line-height:125%;
}

.campany-m ul {
margin:5px 0;
padding:0;
list-style:none;
}
.campany-m li {
margin:0;
padding:0;
font-size:0.7em;
}


/* サイドからメインへ山羊印スパイスについて他
------------------ */
.other-m {
clear:both;
margin:20px 0 0 10px;
padding:0px;
    overflow: hidden;
}

.other-m:after {
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}

/*\*/
* html .other-m {
    height: 1em;
    overflow: visible;
}
/**/
.other-m p {
margin:10px 5px 0 5px;
}
.about-m {
float:left;
width:180px;
margin:0 20px;
}
.about-m h4 {
width:180px;
height:88px;
margin:0;
padding:0;
font-size:1em;
text-indent:-9999em;
background:url(../img/pub/side-about.jpg) no-repeat 0 0;
}
.about-m h4 a {
width:180px;
height:88px;
margin:0;
padding:0;
text-indent:-9999em;
background:url(../img/pub/side-about.jpg) no-repeat 0 0;
text-decoration:none;
display:block;
}
.about-m h4 a:hover {
width:180px;
height:88px;
margin:0;
padding:0;
text-indent:-9999em;
background:url(../img/pub/side-about.jpg) no-repeat 0 -88px;
text-decoration:none;
display:block;
}
.recipe-m {
float:left;
width:178px;
margin:0 20px;
}
.recipe-m h4 {
width:178px;
height:45px;
margin:0;
padding:0;
font-size:1em;
text-indent:-9999em;
background:url(../img/pub/side-recipe.jpg) no-repeat 0 0;
}
.recipe-m h4 a {
width:178px;
height:45px;
margin:0;
padding:0;
text-indent:-9999em;
background:url(../img/pub/side-recipe.jpg) no-repeat 0 0;
text-decoration:none;
display:block;
}
.recipe-m h4 a:hover {
width:178px;
height:45px;
margin:0;
padding:0;
text-indent:-9999em;
background:url(../img/pub/side-recipe.jpg) no-repeat 0 -45px;
text-decoration:none;
display:block;
}

/* お勧め売れ筋用
------------------ */
p.uresuji-continue {
text-align:right;
margin:0 5px 0 0;
font-size:0.85em;
color:#990000;
font-weight:bold;
}
p.uresuji-continue a {
font-weight:bold;
}
p.uresuji-continue a:hover {
color:#FF6600;
font-weight:bold;
}
.itemarea {
margin:5px 0;
width:150px;
float:left;
text-align:center;
font-size:0.7em;
}
.itemarea img {
margin:0 0 5px 0;
}
/* スタッフブログ用
------------------ */
.staff-blog {
margin:20px 5px 20px 0;
padding:0 5px 10px 5px;
border:#CCCCCC solid 1px;
}
.staff-blog h4 {
width:560px;
height:44px;
margin:10px 0;
padding:0;
background:url(../img/blog/blog-title.gif) no-repeat 0 0;
text-indent:-9999em;
font-size:0.85em;
}
.staff-blog h4 a {
width:560px;
height:44px;
margin:0;
padding:0;
background:url(../img/blog/blog-title.gif) no-repeat 0 0;
text-indent:-9999em;
text-decoration:none;
display:block;
}
.staff-blog h4 a:hover {
width:560px;
height:44px;
margin:0;
padding:0;
background:url(../img/blog/blog-title.gif) no-repeat 0 -44px;
text-indent:-9999em;
text-decoration:none;
display:block;
}
.info-listbox {
margin:5px 20px 5px 0;
padding:5px 0;
background:url(../img/pub/border-dotted.gif) repeat-x left bottom;
overflow: hidden;
}
.info-listbox:after {
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}

/*\*/
* html .info-listbox {
    height: 1em;
    overflow: visible;
}
/**/
.info-listbox h5 {
margin:5px 0;
padding:2px 0 2px 17px;
font-size:1.0em;
background:url(../img/blog/icon-blog-entry.gif) no-repeat left center;
border-bottom:#660000 solid 1px;
}
.info-listbox h5 a {
color:#660000;
}
.info-listbox h5 a:hover {
color:#FF6600;
}
.info-listbox img {
float:left;
width:70px;
height:70px;
margin:2px 10px 0 2px;
padding:0;
}
p.continue-blog {
margin:5px 0;
padding:2px 0 2px 17px;
font-size:1.0em;
background:url(../img/blog/icon-blog-entry.gif) no-repeat left center;
}
.entry-head {
clear:both;
position:relative;
margin:10px 0 5px 0;
padding:0;
overflow: hidden;
}
.entry-head:after {
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}

/*\*/
* html .entry-head {
    height: 1em;
    overflow: visible;
}
/**/
.entry-head ul {
margin:0;
padding:0;
list-style:none;
}
.entry-head li {
float:right;
margin:0 5px;
font-size:0.7em;
color:#666666;
}
.entry-head li a {
color:#996600;
}
/* 0911チャイ用
------------------ */
p.chai {
width:561px;
height:201px;
margin:0 0 2px 0;
padding:0;
background:url(../img/index/cover-chai.jpg) no-repeat left center;
text-indent:-9999em;
}
p.chai a {
width:561px;
height:201px;
margin:0;
padding:0;
background:url(../img/index/cover-chai.jpg) no-repeat left center;
text-decoration:none;
display:block;
}
/* 1002ホール用
------------------ */
p.holl {
width:560px;
height:79px;
margin:0 0 2px 0;
padding:0;
background:url(../img/index/banner-holl.jpg) no-repeat left center;
text-indent:-9999em;
}
p.holl a {
width:560px;
height:79px;
margin:0;
padding:0;
background:url(../img/index/banner-holl.jpg) no-repeat left center;
text-decoration:none;
display:block;
}