ul#hashlist{
  display: flex;
  list-style: none;
}
#hashlist > li {
    margin-left:8px;
}
.shelf{
  display: grid;
  grid-template-rows: 384px;
  grid-template-columns: repeat(auto-fit,244px);
  grid-gap: 18px 18px;
  justify-content: center;
  overflow: hidden;
}

.product{
    width: 240px;
    height: 380px;
    border: solid 1px #AAA;
    border-radius: 4px;
    background: #f0f2f8;
    overflow: hidden;
}
.product > .thumbnail{
    width: 220px;
    height: 220px;
    margin: 8px auto 0;
    overflow: hidden;
}
.product > .thumbnail > img{
    width: 220px;
    height: 220px;
    border-radius: 8px;
}
.product > .product-info{
    position: relative
}
.product-info > .title{
    position: absolute;
    top: 2px;
    left: 8px;
    font-size: 0.95rem;
    width: 220px;
    font-weight: bold;
    text-align: left;
    color: #222;
    z-index: 10;
}
.product-info > .price{
    padding:40px 10px 0;
    font-size: 1.05rem;
    height: 40px;
    text-align: right;
}
.product-info > .button-area{
    padding: 25px 10px 0px 0px;
    text-align: right;
}
.button{
    padding: 0.4rem 1rem;
    border-radius: 4px;
    border: none;
    font-size: 1.05rem;
    font-weight: bold;
    color: #222;
    background: #FEFEFE;
    box-shadow: 0px 0px 2px #222;
}
.bt-primary{
    color: #FEFEFE;
    background: #1585ed;
}
.bt-secondly{
    color: #222;
    background: #FEFEFE;
}



/*メディアクエリ　タブレット・スマホ*/
@media screen and (max-width:920px) {

} /*メディアクエリ終わり*/