@media screen and (min-width: 768px) and (max-width: 1024px) {
#contents {
width: 70%;
　}
}
.title1 {
  font-size: 2rem;
}
@media screen and (max-width: 767px) { 
.title1 {
  margin-top: 20px;
 font-size: 1.4rem;
}
}

.product-list {
 display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 767px) { 
.product-list {
  justify-content: space-between;
　}
}

.product-item {
 width: calc(90%/4);
margin: 10px 10px 30px 10px;
}
@media screen and (max-width: 767px) { 
.product-item {
 width: calc(90%/2);
margin: 10px 5px;
　}
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
.product-item {
 width: calc(90%/3);
margin: 10px 5px;
　}
}


.item-image {
 width: 100%;
  height: 200px!important;
  object-fit: cover;
  margin: 10px auto;
  text-align: center;
}

.item-name {
 width: 100%;
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
.item-image {
  height: 160px!important;
　}
}

.item-price {
  margin-top: 10px;
font-weight: bold;
 text-align: right;
}

.soldout {
  text-align: right;
 color: red;