@charset "utf-8";
/* CSS Document */

/* reset */

.reset div, .reset section, .reset article, .reset nav, .reset header, .reset footer, .reset aside, .reset dl, .reset dl dt, .reset dl dd, .reset ul, .reset ol, .reset ul li, .reset ol li, .reset h1, .reset h2, .reset h3, .reset h4, .reset p, .reset blockquote, .reset th, .reset td, .reset img, .reset figure, .reset figcaption {
  margin: 0 auto;
  padding: 0;
  border: 0;
  box-sizing: border-box;
}

.reset table {
  border-collapse: collapse;
  border-spacing: 0;
}

.reset img {
  width: 100%;
  border: 0;
  vertical-align: middle;
}

.reset em, .reset strong, .reset th {
  font-style: normal;
  font-weight: normal;
}

.reset ol, .reset ul,.reset li {
  list-style: none;
}

.reset a {
  text-decoration: none;
}

.reset h1, .reset h2, .reset h3, .reset p, .reset th, .reset td, .reset figcaption {
  text-align: left;
  font-size: 100%;
  font-weight: normal;
}

/* clear */

.cf:after {
  display: block;
  clear: both;
  content: "";
}

article.reset, section.reset, div.reset {
  width: 100%;
  color: #454545;
  font-family: SF Pro JP, SF Pro Text, SF Pro Icons, AOS Icons, Hiragino Kaku Gothic Pro, "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Helvetica Neue, Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 22.4px;
  letter-spacing: 0.1em;
  overflow: hidden;
}

/* 画像拡大 */

.reset figure a {
  display: block;
  position: relative;
}

.reset figure a:hover::after {
  content: url("https://ic4-a.wowma.net/mi/w/1280/h/1280/q/90/dist.joshinweb.jp/img/system/PC/home/zoom40.gif");
  position: absolute;
  opacity: 0.65;
  right: 10px;
  bottom: 10px;
}

.reset figure figcaption a {
  position: static;
}

.reset figure figcaption a:hover::after {
  content: none;
  position: static;
}


/*movie*/

.video_box {
  position: relative;
}

.video_box a:after,
.reset .video_box a:hover::after {
  content: url("https://ic4-a.wowma.net/mi/w/1280/h/1280/q/90/dist.joshinweb.jp/contents/report/part/movie_on.png");
  width: 100px;
  height: 100px;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}


/* item_box */

div.item_box {
  max-width: 1280px;
}

.item_box ul {
  width: 100%;
}

.item_box li {
  float: left;
}

.item_box ul li figure {
  margin-bottom: 1em;
}

.item_box figure figcaption {
  text-align: center;
  margin: .5em 0 1em;
}

/*li 2,3,4並び */

.item_box .box2 li,
.item_box .box2t li {
  width: 49%;
}

.item_box .box2 li:nth-child(2n),
.item_box .box2t li:nth-child(2n) {
  margin-left: 2%;
}

.item_box .box3 li {
  width: 32%;
  margin-right: 2%;
}

.item_box .box3 li:nth-child(3n) {
  margin-right: 0;
}

.item_box .box4 li {
  width: 24%;
  margin-right: 1.3%;
}

.item_box .box4 li:nth-child(4n) {
  margin: 0;
}

@media screen and (max-width:480px) {
  /* item_box */
.item_box ul li, .item_box .box2 li, .item_box .box2 li:nth-child(2n), .item_box .box2t li, .item_box .box2t li:nth-child(2n), .item_box .box3 li, .item_box .box3 li:nth-child(3n), .item_box .box4 li, .item_box .box4 li:nth-child(2n){
 	float: none;
    max-width: 480px;
    width: 98%;
    margin: 0 auto;
  }
}

@media screen and (min-width:481px) and (max-width:768px) {
.item_box .box2t li,
.item_box .box2t li:last-child{max-width:768px; width:80%; margin:0 10%;}

.item_box .box4 li{max-width:768px; width:49%; margin:0;}
.item_box .box4 li:nth-child(2n){ margin-left: 2%;}


}