.ue{
margin-top:130px;
}
.title{

font-size:18px;
    font-family: 'Oswald', sans-serif;
}
.syohin{
width:20%;

}
.syohin img{
width:100%;
}
.syohinname{
font-size:12px;
    display: -webkit-box;
  -webkit-line-clamp: 2; /* 表示する最大行数 */
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.price{
 font-weight:bold; 
}

@media (min-width: 2000px) {
  
  .syohin{
width:11%;

}
}

@media (max-width: 768px) {
  .syohin{
width:50%;
}
  .price{
 font-weight:bold; 
    font-size:14px;
}
}

/* ソートボックス全体 */
.sort-box {
  display: flex;
  align-items: center;
  gap: 3px;

  font-size: 14px;
  color: #333;
  font-family: "Helvetica Neue", sans-serif;
  
}

/* ラベル */
.sort-box label {
  width: 70px;
  font-weight: bold;
  color: #555;
}

/* セレクトボックス */
.sort-box select {
  width:120px;
  border: 1px solid #ccc;
  border-radius: 6px;
  background-color: #f7f7f7;
  color: #333;
  font-size: 14px;


}
sort-select
/* hover時 */
.sort-box select:hover {
  background-color: #eaeaea;
}
.sort-container select {
  height: 140px; /* ここで高さを調整 */
}

/* focus時 */
.sort-box select:focus {
  outline: none;
  border-color: #999;
  background-color: #fff;
}
@media screen and (max-width: 768px) {
  .ue{
margin-top:150px;
}
  .sort-box {
    flex-direction: column;
    align-items: flex-start;
  }
.sort-box label {
  width: 100px;
  font-weight: bold;
  color: #555;
}
  .sort-box select {
    width: 100%;
      font-size: 20px;
  }
  select, [type="file"] {
    height: 50px;

}
}