@charset "UTF-8";
#pants {
  font-family: 'Noto Sans JP' ,YuGothic, "游ゴシック", "ＭＳ Ｐゴシック", "MS P Gothic", "MS-PGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, arial, helvetica, sans-serif;
  font-weight: 400;
  width: 1024px;
  padding: 0 30px;
  margin: 0 auto;
  /* item */
  /* #item1 */
}

#pants #top_main {
  width: 100%;
  margin-bottom: 30px;
}

#pants #top_main h1 {
  margin: 0;
  padding: 0;
}

#pants #top_main img {
  width: 100%;
}

#pants .desc, #pants .movie, #pants #intro {
  width: 100%;
  margin-bottom: 60px;
}

#pants .desc img, #pants .movie img, #pants #intro img {
  width: 100%;
}

#pants #desc1, #pants #desc2 {
  position: relative;
}

#pants #desc1 .rec, #pants #desc2 .rec {
  position: absolute;
  top: -30px;
  left: -60px;
}

#pants #desc1 .rec img, #pants #desc2 .rec img {
  width: 120px;
  height: 120px;
}

#pants .item {
  background: url(../../../../img/usr/feature/silky/bg_stripe.png) repeat;
  padding: 15px;
  box-sizing: border-box;
  margin-bottom: 60px;
  /* item_img */
  /* item_desc */
}

#pants .item .item_img {
  display: block;
  display: flex;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  margin-bottom: 15px;
}

#pants .item .item_img .img1, #pants .item .item_img .img2 {
  -webkit-flex-basis: 50%;
  -ms-flex-basis: 50%;
  flex-basis: 50%;
}

#pants .item .item_img .img1 img, #pants .item .item_img .img2 img {
  width: 100%;
}

#pants .item .item_desc {
  width: 100%;
  display: table;
  background: #fff;
  padding: 15px;
}

#pants .item .item_desc .ttl {
  display: table-cell;
  vertical-align: middle;
  width: 38%;
  border-right: 2px solid #000;
}

#pants .item .item_desc .ttl h3 {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 18px;
  margin: 0;
  color:#444444;
}

#pants .item .item_desc .ttl h3 span {
  font-size: 16px;
}

#pants .item .item_desc .price {
  display: table-cell;
  vertical-align: middle;
  width: 47%;
  padding-left: 15px;
  color:#444444;
}

#pants .item .item_desc .price dl {
  display: inline-block;
}

#pants .item .item_desc .price dl dt, #pants .item .item_desc .price dl dd {
  display: inline-block;
}

#pants .item .item_desc .price dl dt {
  font-size: 16px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
}

#pants .item .item_desc .price dl dd {
  font-size: 19px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
}

#pants .item .item_desc .buy {
  display: table-cell;
  vertical-align: middle;
  width: 15%;
  background-color: #db4d94;
  position: relative;
  /*display: none;*//* 販売ページ完成まで非表示にしています */
}

#pants .item .item_desc .buy p {
  color: #fff;
  text-align: center;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 18px;
  line-height: 1.2em;
  letter-spacing: 0.1em;
}

#pants .item .item_desc .buy p a {
  color: #fff;
  text-decoration: none;
  display: block;
}

#pants .item .item_desc .buy p a:hover {
  filter: alpha(opacity=60);
  -moz-opacity: 0.6;
  opacity: 0.6;
  -webkit-transition: 0.2s ease-in-out;
  -moz-transition: 0.2s ease-in-out;
}

#pants .item .item_desc .buy img {
  position: absolute;
  bottom: 5px;
  right: 5px;
}

#pants #item1 .item_img .img2 {
  position: relative;
}

#pants #item1 .item_img .img2 .topic {
  position: absolute;
  left: -30px;
  top: 30px;
}

#pants #item1 .item_img .img2 .topic img {
  width: 120px;
  height: 120px;
}

/* tb   --------------------------------*/
@media screen and (min-width: 668px) and (max-width: 1024px) {
  #pants {
    width: 100%;
    padding: 0;
  }
  #pants #top_main h1 img {
    width: 100%;
  }
  #pants .desc, #pants .movie, #pants #intro {
    padding: 0 15px;
  }
  #pants .desc img, #pants .movie img, #pants #intro img {
    width: 100%;
  }
  #pants #desc1, #pants #desc2 {
    position: relative;
    padding: 0 15px;
  }
  #pants #desc1 .rec, #pants #desc2 .rec {
    position: absolute;
    top: -10px;
    left: 0px;
  }
  #pants #desc1 .rec img, #pants #desc2 .rec img {
    width: 70px;
    height: 70px;
  }
  /* #pants */
}

/* sp   --------------------------------*/
@media screen and (max-width: 667px) {
  #pants {
    width: 100%;
    padding: 0;
  }
  #pants #top_main h1 img {
    width: 100%;
  }
  #pants .desc, #pants .movie, #pants #intro {
    margin-bottom: 30px;
  }
  #pants .desc img, #pants .movie img, #pants #intro img {
    width: 100%;
  }
  #pants .movie {
    padding: 0 15px;
  }
  #pants .movie iframe {
    width: 100%;
    height: 250px;
  }
  #pants #desc1, #pants #desc2 {
    position: relative;
    padding: 0 15px;
  }
  #pants #desc1 .rec, #pants #desc2 .rec {
    position: absolute;
    top: -30px;
    left: 0px;
  }
  #pants #desc1 .rec img, #pants #desc2 .rec img {
    width: 45px;
    height: 45px;
  }
  #pants #intro {
    padding: 0 15px;
  }
  #pants .item .item_img {
    display: block;
  }
  #pants .item .item_img .img1, #pants .item .item_img .img2 {
    width: 100%;
    margin-bottom: 15px;
  }
  #pants .item .item_desc {
    display: block;
  }
  #pants .item .item_desc .ttl, #pants .item .item_desc .price, #pants .item .item_desc .buy {
    display: block;
    width: 100%;
    margin-bottom: 15px;
    text-align: center;
	color:#444444;
  }
  #pants .item .item_desc .ttl {
    border: none;
  }
  #pants .item .item_desc .ttl h3 {
    font-size: 14px;
	color:#444444;
  }
  #pants .item .item_desc .ttl h3 span {
    font-size: 12px;
  }
  #pants .item .item_desc .price {
    padding-left: 0;
  }
  #pants .item .item_desc .buy p a {
    padding: 10px 0;
  }
  #pants #item1 .item_img .img2 .topic {
    left: 0;
    top: 15px;
  }
  #pants #item1 .item_img .img2 .topic img {
    width: 90px;
    height: 90px;
  }
  /* #pants */
}