@charset "UTF-8";

*html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}

.f-center { text-align: center; }
.f-right { text-align: right; }
.f-left { text-align: left; }
.f-small { font-size: 12px; }

.left { float: left }
.right { float: right }
.right-330 { float:right; width: 330px; }

.margin-left { margin: 25px 0 0 25px; }

.line01 {
background: url(images/line01.gif) repeat-x 0px 0px;
height: 1px;
margin-bottom: 25px;
overflow: hidden;
}
table {
line-height: 150%;
}


/* Color */
.color-green { color: #093; }
.color-blue { color: #069; }
.color-red { color: #C00; }
.color-red-l { color: #f00; }

/* Link */
#item-list a,#item-list a:link,
#sale-content a,#sale-content a:link,
#shohin-list a,#shohin-list a:link {
color: #0066cc;
text-decoration: underline;
}
#item-list a:active ,#item-list a:hover,
#sale-content a:active ,#sale-content a:hover,
#shohin-list a:active ,#shohin-list a:hover {
color: #39C;
text-decoration: underline;
}
#item-list a:visited,
#sale-content a:visited,
#shohin-list a:visited {
color: #996699;
text-decoration: underline;
}

/* Side menu */

.side-etc td { vertical-align: middle; }

/* etc */
#nomikata,
#chigai,
#genzairyou {
font-size: 13px;
line-height: 1.6;
margin: 0 auto;
text-align: left;
width: 520px;
}
#nomikata p,
#chigai p, {
margin: 1.6em 0;
}
#genzairyou {
margin:1.6em auto;
}
#nomikata h4,
#genzairyou h4 {
font-size: 16px;
font-weight: bold;
border-bottom: 1px solid #FC3;
border-left: 5px solid #FC3;
margin: 35px 0 10px 0;
padding: 2px 0px 2px 10px;
background-color: #FFC;
}

/* 商品一覧 ---------------------------- */

#item-list {
width: 520px;
}
#item-list h2 {
margin: 10px 0 5px 0;
}
#item-list p {
margin: 1.2em 0;
}
#item-list table {
margin: 10px 0 25px 0;
}
#item-list th, #item-list td {
vertical-align: top;
}

/* 商品ページ -------------------------- */

#sale-content p {
margin: 1.3em 0;
}
#sale-content p.chuui {
margin: 0.8em 0;
}
#sale-content .top-p {
margin-top: 0;
}
#sale-content h4 {
color: #fff;
font-size: 14px;
font-weight: bold;
line-height: 35px;
margin: 15px 0;
padding-left: 17px;
background: #393 url(images/title-bg.jpg) no-repeat 0px 0px;
}

.sale-table {
width: 520px;
  margin-bottom: 25px;
}
.sale-table table {
width: 100%;
}
.sale-photo {
  position: relative;
  width: 170px;
}
.rank-l {
  position: absolute;
  top: 4px;
  left: 4px;
}
.kakaku {
background-color: #FFC;
padding: 10px 15px;
}
#sale-content .kakaku p {
margin: 0;
line-height: 170%;
}
#sale-content hr {
margin: 10px 0;
}
ul.shosai {
list-style: none;
margin: 0;
padding: 0;
_zoom: 1;
overflow: hidden;
}
ul.shosai li {
float:left;
}
#sale-content ul.shosai a {
background: #FFF url(images/button-bg.jpg) no-repeat 0px 0px;
display: block;
line-height: 32px;
text-decoration: none;
text-align: center;
width: 110px;
}
#sale-content ul.shosai a:hover {
background-position: 0px -32px;
}

.kago-body {
padding: 3px 10px;
text-align: right;
}
.kago-body td {
padding: 5px 0px;
}
.kago-button {
margin: 5px 0;
vertical-align: middle;
}
.kago-button2 {
border: 0px;
cursor:pointer;
width: 130px;
height: 28px;
margin: 0;
vertical-align: middle;
background: #fff url(images/kago-button.gif) no-repeat left top;
}

.category-bn { text-align: center; }
.category-bn ul {
list-style:none;
margin: 0 auto;
padding: 0;
width: 505px;
}
.category-bn li {
float: left;
margin-left: 15px;
}



/* 飲みかたについて -------------------------- */

#nomikata p.star {
background: url(images/star.gif) no-repeat 0 0;
margin: 0.8em 0 1.6em 0;
padding: 0 0 0 25px;
}
#nomikata ul {
margin: 25px 0;
padding: 0;
list-style: none;
}
#nomikata li {
background: url(images/star.gif) no-repeat 0 0;
margin: 1em 0;
padding: 0 0 0 25px;
list-style: none;
}
#nomikata h5 {
font-size: 15px;
font-weight: bold;
background-image: url(images/glass.gif);
background-repeat: no-repeat;
background-position: 0px 2px;
color: #036;
margin: 7px 0;
padding: 2px 0px 2px 32px;
}
#nomikata table {
font-size: 14px;
line-height: 100%;
}
#nomikata img {
margin-bottom: 5px;
}
#nomikata .f-center img {
margin: 10px 5px 10px 0;
}

#nomikata table {
border-collapse: collapse;
text-align: left;
width: 100%;
}
#nomikata caption {
text-align: left;
font-weight: bold;
margin: 0.5em 0;
}
#nomikata th,
#nomikata td,
.border-green {
padding: 8px 10px;
border: 1px solid #9C6;
}
#nomikata .border-green p {
margin: 0;
}
#nomikata .blue th,
#nomikata .blue td {
border: 1px solid #69C;
}
#nomikata th {
background-color: #F5F5E1;
padding-right: 0px;
width: 100px;
}
#nomikata dl {
margin: 25px 0;
}
#nomikata dd {
margin: 0.5em 0 0 25px;
}
th.w2 {
width: 60px;
}
td.w2 {
width: 130px;
}

/* 粒・パウダーの違いと凝固剤について -------------------------- */

#chigai h4 {
background: url(images/star.gif) no-repeat 0px 1px;
font-size: 16px;
font-weight: bold;
margin-top: 35px;
padding-left: 27px;
color: #093;
}

/* 原材料 ------------------------------------------------------ */

#genzairyou .right { width: 385px; }
#genzairyou dl {
margin: 10px 0 0 0;
padding: 0;
}
#genzairyou dt, #genzairyou dd {
float: left;
}
#genzairyou dt {
background: url(images/star.gif) no-repeat 0px 0px;
margin: 0;
padding: 0 20px 0 25px;
}
#genzairyou dd {
margin: 0  35px 0 0;
padding: 0;
}
#genzairyou table {
width: 100%;
border: 1px solid #9C6;
border-collapse: collapse;
margin: 10px 0 5px 0;
padding: 0;
}
#genzairyou caption {
background: url(images/star.gif) no-repeat 0px 0px;
font-size: 14px;
line-height: 1.6;
text-align: left;
padding-left: 25px;
}
#genzairyou th, #genzairyou td {
border: 1px solid #9C6;
padding: 5px 10px;
text-align: left;
vertical-align: top;
}
#genzairyou .genzairyou-table th {
text-align: center;
vertical-align: middle;
}
#genzairyou .eiyou-table th {
/*background-color: #F5F5E1;*/
}
#genzairyou .genzairyou-table td,
#genzairyou .eiyou-table td {
text-align: right;
}
#genzairyou td.f-left {
text-align: left;
}
#genzairyou table strong { color: #C00; }
#genzairyou .bg-color th,
#genzairyou .bg-color td {
background-color: #F5F5E1;
}

/* 商品リスト 共通 */

#shohin-list {
border: 1px solid #393;
border-radius: 8px;        /* CSS3草案 */  
-webkit-border-radius: 8px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 8px;   /* Firefox用 */
font-size: 14px;
padding: 10px 0;
}
#shohin-list ul {
float: left;
margin: 0;
padding: 0;
list-style: none;
width: 310px;
}
#shohin-list li {
margin: 0.5em 0 0.5em 18px;
  padding: 0 0 0 18px;
background: url(images/arrow.gif) no-repeat 0px 4px;
line-height: 1.4;
}
#shohin-list li.star {
background-image: url(images/star.gif);
background-position: -5px 0px;
}
#shohin-list li.rank {
  padding: 12px 0px 4px 35px;
  background-position: 0px 6px;
}
#shohin-list li.r1 {
  background-image: url(images/r1.png);
  background-position: 5px 0px;
}
#shohin-list li.r2 {
  background-image: url(images/r2.png);
  background-position: 5px 0px;
}
#shohin-list li.r3 {
  background-image: url(images/r3.png);
  background-position: 5px 0px;
}
#shohin-list li.r4 {
  background-image: url(images/r4.png);
  background-position: 5px 0px;
}
#shohin-list li.r5 {
  background-image: url(images/r5.png);
  background-position: 5px 0px;
}
#shohin-list li.r6 {
  background-image: url(images/r6.png);
  background-position: 5px 0px;
}
#shohin-list h4 {
  margin: 0 0 5px 0;
  background-image: none;
}
#shohin-list a,#shohin-list  a:link {
text-decoration: none;
}
#shohin-list a:visited {
text-decoration: none;
}
#shohin-list a:active ,#shohin-list a:hover {
text-decoration: underline;
}

/* Clearfix ------------------------------------------------ */

#shohin-list:after {
content: ".";
display: block;
clear: both;
height: 0;
font-size: 0.1em;
line-height: 0;
visibility: hidden;
}
#shohin-list {
display: inline-block;
}
/* Hides from IE-mac \*/
* html #shohin-list {
height: 1%;
}
#shohin-list {
display: block;
}
/* End hide from IE-mac */