@charset "UTF-8";

* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
figure {margin: 0;}

/* title */
article.intoro {background-color: #f9f7e0; padding: 30px 0;}
article.intoro header {text-align: center;}
article.intoro header img {width: 100%; max-width: 1024px;margin: 0 auto;}

section h1 {font-size: 1.5em;}
@media screen and (max-width : 767px){
  section h1 {font-size: 1.2em;}
}

article {padding: 40px 0;}
article section {margin-top: 40px;}
article .wrap {width: 90%; max-width: 1024px; margin: 0 auto;}
article section.lead {margin: 20px auto 80px; max-width: 700px; line-height: 1.6;}
article.items {margin-bottom: 80px;}

ul.col6 {
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  box-sizing: border-box;
  margin-bottom: 15px;
  list-style: none; padding: 0;
  }

#main img {width: 100%;}

del, ins {text-decoration: none;}
.price {margin-top: 5px; display: block; color: #000; font-size: 11px;}
.price .num {font-size: 14px; font-weight: bold; padding: 0 2px; font-family: "Helvetica","Lucida Grande", sans-serif;}
.price del {display: block; color: #999;}
.price del {*text-decoration: line-through;}
.price del:after {content:"→";}
.price ins {display: block; color: #7f0019; text-decoration: none;}
.price .num {font-size: 14px; font-weight: bold; padding: 0 2px; font-family: "Helvetica","Lucida Grande",sans-serif;}
.price del .num {font-size: 11px;}


.col6 li {width: 15%; margin-right: 2%;}
.col6 li:last-child {margin-right: 0;}
.col6 img {width: 100%; height: auto;}
.col6 span.name {display: block; margin-top: 5px; font-size: 12px;}
.col6 span.thumb {display: inline-block; padding: 15px;}
.col6 figure p {margin-top: 0;}
.col6 li a {display: block;}

@media screen and (max-width: 767px) {
  .col6 li {width: 32%;}
  .col6 li:nth-child(3) {margin-right: 0;}
  .col6 figure p {font-size: 13px;}
}
@media screen and (max-width: 480px) {
  .col6 li {margin: 0 3% 10px 0; vertical-align: top; width: 47%;}
  .col6 li:nth-child(3n) {margin-right: 3%;}
  .col6 li:nth-child(2n) {margin-right: 0;}
}

/* pageLink */
nav ul.pageLink {list-style-type: none; margin: 0; padding: 0; border-bottom: 1px solid #ccc; border-left: 1px solid #eee;}
nav ul.pageLink li {float: left; padding: 5px 20px; border-right: 1px solid #eee;}
nav ul.pageLink li.current {background-color: #eee;}
nav ul.pageLink li.current a:hover {cursor:default;}
@media only screen and (max-width: 438px){
  nav ul.pageLink li {font-size: 12px;}
}

.relatedLink {display: block; text-align: right; margin: 40px 5% 0 0;}
.relatedLink a {display: inline-block; background: url(/img/common/arrow_right.png) no-repeat 14px 50%; border: 1px solid #ccc; padding: 10px 15px 10px 30px; text-decoration: none;}
.relatedLink a:hover {border: 1px solid #191919;}
.relatedLink + .relatedLink {margin-top: 20px;}


/* clearfix */
.wrapper:after,
.pageLink:after,
section:after,
figure:after {content: ""; clear: both; display: block;}