@charset "utf-8";

/* Products */

#g-contents h1.lname {
  letter-spacing: 0;
}

#g-contents h1.br1 {
  padding: 6px 0;
  line-height: 1.1em;
}


#slide div img {
  margin-top: 15px;
}
#top-contents {
  text-align: left;
  margin-top: 30px;
}

#news {
  float: left;
  width: 470px;
}

#news h2 {
/*  color: #007A48;
*/  font-size: 1.3em;
  border-bottom: solid 1px #03934D;
  background: url(../images/i_top_news.gif) 10px bottom no-repeat;
  padding: 5px 25px;
  font-weight: bold;
}

#news dl {
  margin: 10px 0;
}

#news dt {
  padding: 5px 0;
  background-position: 7em 2px;
  background-repeat: no-repeat;
}

#news dt.new {
  background-image: url(../images/i_new.gif);
}

#news dt.news {
  background-image: url(../images/i_news.gif);
}

#news dt.cam {
  background-image: url(../images/i_cam.gif);
}

#news dt.rd{
  background-image: url(../images/i_rd.gif)
}

#news dd {
  border-bottom: dashed 1px #03934D;
  padding: 5px 0 7px 0;
  margin-bottom: 5px;
}

#news dd a {
  color: #333;
}

#news dd a:hover {
  text-decoration: underline;
}

#ba {
  float: left;
  width: 480px;
}

.ba-box {
  float: left;
  width: 220px;
  margin-left: 20px;
}

#search-contents {
}

#search-contents h2 {
  font-size: 1.3em;
  border-bottom: solid 1px #03934D;
  background: url(../products/images/i_search.png) center left no-repeat;
  background-size: 22px;
  padding: 12px 35px 8px 32px;
  margin-bottom: 30px;
  font-weight: bold;
}

#btn-all {
  width: 400px;
  margin: 0 auto 30px;
  text-align: center;
  border-top: solid 7px #71C54F;
  border-right: solid 7px #D1F16C;
  border-bottom: solid 7px #B8EBB9;
  border-left: solid 7px #007A47;
}
#btn-lineup {
  width: 300px;
  margin: 0 auto 30px;
  text-align: center;
  border-top: solid 7px #71C54F;
  border-right: solid 7px #D1F16C;
  border-bottom: solid 7px #B8EBB9;
  border-left: solid 7px #007A47;
}

#btn-all a {
  color: #007A47;
  font-size: 1.8em;
  display: block;
  background: url(../products/images/i_all.gif) no-repeat 50px 5px;
  padding: 18px 15px 15px 70px;
}

#btn-lineup a {
  color: #007A47;
  font-size: 1.4em;
  display: block;
  padding: 12px 0 10px 0;
}

#btn-all:hover, #btn-lineup:hover {
  background-color: #F1FBD3;
}

#prd-list {
  padding: 20px 0;
}

#prd-list h2 {
  font-size: 1.3em;
  border-bottom: solid 1px #03934D;
  padding: 10px 5px;
  margin-bottom: 30px;
  font-weight: bold;
}

.prd-box {
  float: left;
  width: 140px;
  margin-right: 20px;
  clear: none;
}

#prd-list div:nth-of-type(6n) {
  margin-right: 0;
}
#prd-list div:nth-of-type(6n+1) {
  clear: left;
}

.prd-box a.name {
  color: #007A47;
  font-size: 1.1em;
  display: block;
  background: url(../images/i_ya_g_s.gif) no-repeat 0 1px;
  background-size: 7px;
  padding-left: 12px;
  padding-top: 2px;
}
.prd-box a.name:hover {
  text-decoration: underline;
}

.prd-box a.name span {
  display: inline-block;
  font-size: 0.75em;
  line-height: 1.1em;
}

#search-contents h3 {
  color: #fff;
  font-size: 1.3em;
  background: url(../products/images/bg_category.gif) left bottom repeat-x;
  background-color: #007A47;
  padding: 10px 5px 30px 10px;
  margin-bottom: 20px;
  font-weight: bold;
}

.top-category {
}
.top-category div:nth-child(4n) {
  margin-right: 0;
}
.top-cate-box {
  float: left;
  width: 220px;
  height: 220px;
  border: solid 1px #81C9A6;
  margin: 0 20px 20px 0;
  background-position: 93% 90%;
  background-repeat: no-repeat;
  position: relative;
}
.top-cate-box a {
  display: block;
  background: url(../images/i_ya_g_s.gif) no-repeat 0 10px;
  background-size: 7px;
  padding: 10px 0 10px 10px;
  margin: 0 0 0 10px;
  color: #007A47;
  font-size: 1.15em;
  line-height: 1.2em;
  position: absolute;
  top: 0;
  left: 0;
  width: 85%;
  height: 85%;
}
.top-cate-box a:hover {
  text-decoration: none;

}
.top-cate-box:hover {
  background-color: #F1FBD3;
  cursor: pointer;
}
.top-cate-box a.cap {
  padding-top: 8px;
}
.top-cate-box a span.cap {
  display: inline-block;
  font-size: 0.75em;
  line-height: 1.1em;
}

.c-hourin {
  background-image: url(../products/images/c_hourin.png);
}
.c-tuki {
  background-image: url(../products/images/c_tuki.png);
}
.c-zero {
  background-image: url(../products/images/c_zero.png);
}
.c-junmai {
  background-image: url(../products/images/c_junmai.png);
}
.c-yamada_junmai {
  background-image: url(../products/images/c_yamada_junmai.png);
}
.c-josen {
  background-image: url(../products/images/c_josen.png);
}
.c-nouvel {
  background-image: url(../products/images/c_nouvel.png);
}
.c-puti {
  background-image: url(../products/images/c_puti.png);
}
.c-densho {
  background-image: url(../products/images/c_densho.png);
}
.c-okura {
  background-image: url(../products/images/c_okura.png);
}
.c-daiginjo {
  background-image: url(../products/images/c_daiginjo.png);
}
.c-tokubetsu {
  background-image: url(../products/images/c_tokubetsu.png);
}
.c-futsu {
  background-image: url(../products/images/c_futsu.png);
}
.c-kishu {
  background-image: url(../products/images/c_kishu.png);
}
.c-taru {
  background-image: url(../products/images/c_taru.png);
}
.c-kisetsu {
  background-image: url(../products/images/c_kisetsu.png);
}
.c-horodoke {
  background-image: url(../products/images/c_horodoke.png);
}
.c-utakata {
  background-image: url(../products/images/c_utakata.png);
}
.c-kirei {
  background-image: url(../products/images/c_kirei.png);
}
.c-kanjuku {
  background-image: url(../products/images/c_kanjuku.png);
}
.c-plum {
  background-image: url(../products/images/c_plum.png);
}
.c-fwine {
  background-image: url(../products/images/c_fwine.png);
}
.c-gwine {
  background-image: url(../products/images/c_gwine.png);
}
.c-gbeer {
  background-image: url(../products/images/c_gbeer.png);
}
.c-free {
  background-image: url(../products/images/c_free.png);
}
.c-mirin {
  background-image: url(../products/images/c_mirin.png);
}
.c-ryori {
  background-image: url(../products/images/c_ryori.png);
}
.c-amazake {
  background-image: url(../products/images/c_amazake.png);
}
.c-naraduke {
  background-image: url(../products/images/c_naraduke.png);
}
.c-purintai_zero {
  background-image: url(../products/images/c_purintai_zero.png);
}
.c-josen_pacpremium {
  background-image: url(../products/images/c_josen_pacpremium.png);
}
.c-tokubetu_junmai {
  background-image: url(../products/images/c_tokubetu_junmai.png);
}

span.plus {
  background: none;
  font-weight: bold;
  cursor: pointer;
}
span.minus {
  background: none;
  font-weight: bold;
  cursor: pointer;
}

.category {
  display: block;
  padding-bottom: 20px;
}
.category div:nth-child(4n) {
  margin-right: 0;
}
.cate-box {
  float: left;
  width: 228px;
  border: solid 1px #64AE48;
  margin: 0 10px 10px 0;
  height: 65px;
}

.cate-box div {
  display: table-cell; 
  vertical-align: middle; 
  height: 65px;
  width: 228px;
}

.cate-box a {
  display: block;
  background: url(../images/i_ya_g_s.gif) no-repeat 0 9px;
  background-size: 7px;
  padding: 10px;
  margin: 0 0 0 10px;
  color: #007A47;
  font-size: 1.1em;
  line-height: 1.1em;
}
.cate-box a:hover {
  text-decoration: none;
}

.cate-box a span.cap {
  font-size: 0.75em;
}

.cate-box:hover {
  background-color: #F1FBD3;
}

#products {
}

#products h2 {
  text-align: center;
  font-size: 1.2em;
  padding: 20px 0 30px;
  line-height: 1.2em;
  text-align: left;
}

#products h3 {
  font-size: 1.25em;
  padding-bottom: 10px;
}

#products-spec, #products-spec2 {
  float: left;
  width: 450px;
}

#products-photo, #products-photo2 {
  float: right;
  width: 460px;
  text-align: center;
}

#products-photo img, #products-photo2 img {
  margin-bottom: 20px;
}

.products-more {
  padding-top: 20px;
  padding-bottom: 10px;
}

a.online01 {
  display: block;
  color: #F1F9D2;
  font-size: 1.3em;
  border: solid 1px #71C54F;
  border-radius: 5px;
  text-decoration: none;
  width: 75%;
  margin: 0 auto;
  background: rgb(113,197,79);
  background: -moz-linear-gradient(top,  rgb(113,197,79) 1%, rgb(0,122,71) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgb(113,197,79)), color-stop(100%,rgb(0,122,71)));
  background: -webkit-linear-gradient(top,  rgb(113,197,79) 1%,rgb(0,122,71) 100%);
  background: -o-linear-gradient(top,  rgb(113,197,79) 1%,rgb(0,122,71) 100%);
  background: -ms-linear-gradient(top,  rgb(113,197,79) 1%,rgb(0,122,71) 100%);
  background: linear-gradient(to bottom,  rgb(113,197,79) 1%,rgb(0,122,71) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#71c54f', endColorstr='#007a47',GradientType=0 );

}
a.online01 span {
  display: block;
  background: url(../products/images/i_shop.png) no-repeat 10px 4px;
  background-size: 26px;
  padding: 10px 0 10px 20px;
  margin: 0 10px 0 20px;
}
a:hover.online01 {
  background: rgb(18,155,55);
  background: -moz-linear-gradient(top,  rgb(18,155,55) 2%, rgb(0,89,44) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(2%,rgb(18,155,55)), color-stop(100%,rgb(0,89,44)));
  background: -webkit-linear-gradient(top,  rgb(18,155,55) 2%,rgb(0,89,44) 100%);
  background: -o-linear-gradient(top,  rgb(18,155,55) 2%,rgb(0,89,44) 100%);
  background: -ms-linear-gradient(top,  rgb(18,155,55) 2%,rgb(0,89,44) 100%);
  background: linear-gradient(to bottom,  rgb(18,155,55) 2%,rgb(0,89,44) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#129b37', endColorstr='#00592c',GradientType=0 );
}
a.online02 {
  display: block;
  color: #333;
  border: solid 1px #C3A34C;
  border-radius: 5px;
  font-size: 1.3em;
  padding: 10px 0 8px;
  text-decoration: none;
  width: 75%;
  margin: 0 auto;
  background: rgb(255,230,161);
  background: -moz-linear-gradient(top,  rgb(255,230,161) 1%, rgb(247,201,71) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgb(255,230,161)), color-stop(100%,rgb(247,201,71)));
  background: -webkit-linear-gradient(top,  rgb(255,230,161) 1%,rgb(247,201,71) 100%);
  background: -o-linear-gradient(top,  rgb(255,230,161) 1%,rgb(247,201,71) 100%);
  background: -ms-linear-gradient(top,  rgb(255,230,161) 1%,rgb(247,201,71) 100%);
  background: linear-gradient(to bottom,  rgb(255,230,161) 1%,rgb(247,201,71) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffe6a1', endColorstr='#f7c947',GradientType=0 );

}
a:hover.online02 {
  background: rgb(255,207,76);
  background: -moz-linear-gradient(top,  rgb(255,207,76) 1%, rgb(244,187,29) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgb(255,207,76)), color-stop(100%,rgb(244,187,29)));
  background: -webkit-linear-gradient(top,  rgb(255,207,76) 1%,rgb(244,187,29) 100%);
  background: -o-linear-gradient(top,  rgb(255,207,76) 1%,rgb(244,187,29) 100%);
  background: -ms-linear-gradient(top,  rgb(255,207,76) 1%,rgb(244,187,29) 100%);
  background: linear-gradient(to bottom,  rgb(255,207,76) 1%,rgb(244,187,29) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffcf4c', endColorstr='#f4bb1d',GradientType=0 );
}
a.brand {
  display: block;
  color: #007946;
  border: solid 1px #8CD070;
  border-radius: 5px;
  font-size: 1.3em;
  padding: 10px 0 8px;
  text-decoration: none;
  width: 75%;
  margin: 0 auto;
}
a:hover.brand {
  background: rgb(205,235,139);
  background: -moz-linear-gradient(top,  rgb(205,235,139) 0%, rgb(205,235,139) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(205,235,139)), color-stop(100%,rgb(205,235,139)));
  background: -webkit-linear-gradient(top,  rgb(205,235,139) 0%,rgb(205,235,139) 100%);
  background: -o-linear-gradient(top,  rgb(205,235,139) 0%,rgb(205,235,139) 100%);
  background: -ms-linear-gradient(top,  rgb(205,235,139) 0%,rgb(205,235,139) 100%);
  background: linear-gradient(to bottom,  rgb(205,235,139) 0%,rgb(205,235,139) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cdeb8b', endColorstr='#cdeb8b',GradientType=0 );
}
a.brandOr {
  display: block;
  color: #F1F9D2;
  font-size: 1.3em;
  border: solid 1px #D05300;
  border-radius: 5px;
  text-decoration: none;
  width: 75%;
  margin: 0 auto;
  background: rgb(247,143,72);
  background: -moz-linear-gradient(top,  rgb(247,143,72) 1%, rgb(172,74,9) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgb(247,143,72)), color-stop(100%,rgb(172,74,9)));
  background: -webkit-linear-gradient(top,  rgb(247,143,72) 1%,rgb(172,74,9) 100%);
  background: -o-linear-gradient(top,  rgb(247,143,72) 1%,rgb(172,74,9) 100%);
  background: -ms-linear-gradient(top,  rgb(247,143,72) 1%,rgb(172,74,9) 100%);
  background: linear-gradient(to bottom,  rgb(247,143,72) 1%,rgb(172,74,9) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F78F48', endColorstr='#BC5209',GradientType=0 );

}
a.brandOr span {
  display: block;
  background: url(../products/images/i_brand.png) no-repeat 10px 4px;
  background-size: 25px;
  padding: 10px 0 10px 20px;
  margin: 0 10px 0 20px;
}
a:hover.brandOr {
  background: rgb(241,102,10);
  background: -moz-linear-gradient(top,  rgb(241,102,10) 2%, rgb(172,74,9) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(2%,rgb(241,102,10)), color-stop(100%,rgb(172,74,9)));
  background: -webkit-linear-gradient(top,  rgb(241,102,10) 2%,rgb(172,74,9) 100%);
  background: -o-linear-gradient(top,  rgb(241,102,10) 2%,rgb(172,74,9) 100%);
  background: -ms-linear-gradient(top,  rgb(241,102,10) 2%,rgb(172,74,9) 100%);
  background: linear-gradient(to bottom,  rgb(241,102,10) 2%,rgb(172,74,9) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F1660A', endColorstr='#AC4A09',GradientType=0 );
}

.spec div {
  padding-bottom: 10px;
}

.spec table {
  border-top: solid 1px #73C552;
  border-right: solid 1px #73C552;
  margin-bottom: 20px;
}

.spec table.kome {
  margin-bottom: 5px;
}

.spec th, .spec td {
  border-bottom: solid 1px #73C552;
  border-left: solid 1px #73C552;
  padding:3px  5px;
  text-align: center;
}

.price p {
  border-bottom: dashed 1px #71C54F;
  margin-bottom: 20px;
}

#products .price h3 {
  padding-bottom: 3px;
}

.spec h3 span {
  font-size: 0.8em;
}

.price h3 span.tax {
  font-size: 0.8em;
}
#g-contents .price p {
  font-size: 0.85em;
  padding-bottom: 5px;
  line-height: 1.1em;
}
.price h3 span.size2 {
  display: block;
  padding-bottom: 3px;
}
.stitle {
  font-size: 1.3em;
  border-bottom: solid 1px #03934D;
  padding: 10px 5px;
  margin-bottom: 30px;
  font-weight: bold;
  line-height: 1.2em;
}



@media only screen and (max-width: 1024px) {
  
#g-contents h1.br2 {
  padding: 6px 0;
  line-height: 1.1em;
}

#news {
  width: 385px;
}
#ba {
  width: 360px;
}

.ba-box {
  width: 170px;
  margin-left: 10px;
}
  
.top-cate-box {
  margin-right: 40px;
}

.top-category div:nth-child(4n) {
  margin-right: 40px;
}
  
.top-category div:nth-child(3n) {
  margin-right: 0;
}

.prd-box {
  width: 140px;
  margin-right: 10px;
  clear: none;
}


#prd-list div:nth-of-type(n) {
  clear: none;
  margin-right: 10px;
}

#prd-list div:nth-of-type(5n) {
  margin-right: 0;
}
#prd-list div:nth-of-type(5n+1) {
  clear: left;
}
.cate-box {
  width: 177px;
  border: solid 1px #81C9A6;
  margin: 0 10px 10px 0;
  height: 65px;
}
.cate-box div {
  width: 177px;
}


#products-spec, #products-spec2 {
  float: none;
  clear: left;
  width: auto;
}

#products-photo, #products-photo2 {
  float: none;
  clear: right;
  width: auto;
  margin-bottom: 20px;
}

a.online01 {
  width: 50%;
}

a.online02 {
  width: 50%;
}

a.brand {
  width: 50%;
}

a.brandOr {
  width: 50%;
}

.spec {
  float: left;
  width: 445px;
}
.price {
  float: right;
  width: 295px;
}

#products .price h3 {
  padding-bottom: 5px;
}

.price h3 span.size {
  display: block;
  padding-bottom: 3px;
}

}
@media only screen and (max-width: 768px) {
  
#g-contents h1.br1, #g-contents h1.br2 {
  padding: 22px 0;
  line-height: 1.1em;
}

#slide div img {
  margin-top: 0;
}

#news {
  float: none;
  clear: left;
  width: auto;
}

#news h2 {
  background: none;
  background-color: #73C552;
  border-bottom: solid 2px #03934D;
  padding: 5px;
  color: #fff;
}

#news dl {
  background-color: #D1F16C;
  margin-top: 0;
  padding-top: 5px;
}

#news dd {
  border-bottom: solid 1px #fff;
  padding: 0 5px 5px 5px;
}

#news dt {
  padding: 5px;
}

#news dt:nth-of-type(n+6), #news dd:nth-of-type(n+6) {
  display: none;
}

#ba {
  float: none;
  clear: left;
  width: auto;
  margin: 20px 0 30px 0;
}
.ba-box {
  width: 40%;
  margin: 0 15px;
}


#prd-list {
}

#btn-all a {
  font-size: 1.4em;
  display: block;
  background-position: 35px 5px;
  padding: 18px 15px 15px 70px;
}

.top-cate-box {
  width: 48%;
  height: 120px;
  margin: 0 10px 10px 0;
  background-position: 93% 50%;
  background-size: auto 110px;
}
.top-cate-box a {
  font-size: 1.15em;
  line-height: 1.2em;
}
.top-cate-box a span.sub {
  font-size: 0.75em;
  line-height: 1.1em;
}
.top-category div:nth-child(3n) {
  margin-right: 10px;
}
  
.top-category div:nth-child(2n) {
  margin-right: 0;
}

.prd-box {
  width: 22%;
}

#prd-list div:nth-of-type(n) {
  margin-right: 10px;
  clear: none;
}
#prd-list div:nth-of-type(6n+1), #prd-list div:nth-of-type(5n+1){
  clear: none;
}

#prd-list div:nth-of-type(6n), #prd-list div:nth-of-type(5n) {
  margin-right: 10px;
}
#prd-list div:nth-of-type(4n+1) {
  clear: left;
}

#prd-list div:nth-of-type(4n) {
  margin-right: 0;
}
span.plus {
  display: block;
  background: url(../products/images/i_plus.png) no-repeat 99% 0;
  background-size: 16px 16px;
  padding-bottom: 2px;
  font-weight: bold;
}
span.minus {
  display: block;
  background: url(../products/images/i_minus.png) no-repeat 99% 0;
  background-size: 16px 16px;
  font-weight: bold;
}
.category {
  display: none;
}
.cate-box {
  float: none;
  clear: left;
  width: 100%;
  border: solid 1px #81C9A6;
  margin: 0 10px 10px 0;
  height: 65px;
  display: table;
}
.cate-box div {
  width: 100%;
}

#products h2 {
  padding-top: 0;
  font-size: 1.15em;
}

a.online01 {
  width: 60%;
}

a.online02 {
  width: 60%;
}

a.brand {
  width: 60%;
}

a.brandOr {
  width: 60%;
}


.spec {
  float: none;
  clear: left;
  width: auto;
}
.price {
  float: none;
  clear: right;
  width: auto;
}

}

@media only screen and (max-width: 480px) {
.prd-box {
  margin-right: 10px;
}
#btn-all {
  width: 280px;
}
#btn-lineup {
  width: 280px;
}

#btn-all a {
  background: url(../products/images/i_all.gif) no-repeat 20px 5px;
  background-size: 38px;
  padding: 15px 15px 15px 70px;
}

.top-cate-box {
  width: 47%;
  background-position: 95% 80%;
  background-size: auto 80px;
}

.sm {
  background-size: auto 70px;
}

.top-cate-box a {
  margin-left: 5px;
  padding-left: 8px;
}

.cate-box {
}

.prd-box {
  width: 30%;
  clear: none;
}

#prd-list div:nth-of-type(n) {
  margin-right: 10px;
  clear: none;
}
#prd-list div:nth-of-type(6n+1), #prd-list div:nth-of-type(5n+1), #prd-list div:nth-of-type(4n+1) {
  clear: none;
}

#prd-list div:nth-of-type(6n), #prd-list div:nth-of-type(5n), #prd-list div:nth-of-type(4n) {
  margin-right: 10px;
}

#prd-list div:nth-of-type(3n+1) {
  clear: left;
}

#prd-list div:nth-of-type(3n) {
  margin-right: 0;
}
a.online01 {
  width: 90%;
  font-size: 1.1em;
}
a.online01 span {
  background: url(../products/images/i_shop.png) no-repeat 10px 4px;
  background-size: 26px;
  padding: 10px 0 10px 27px;
  margin: 0 10px 0 8px;
}

a.online02 {
  width: 90%;
  font-size: 1.1em;
}

a.brand {
  width: 90%;
  font-size: 1.1em;
}

a.brandOr {
  width: 90%;
  font-size: 1.1em;
}
a.brandOr span {
  background: url(../products/images/i_brand.png) no-repeat 10px 4px;
  background-size: 25px;
  padding: 10px 0 10px 27px;
  margin: 0 10px 0 8px;
}

}

