*{
	outline: none;
}

#main {
  background-color: #fff;
}
.commodity {
  position: relative;
  padding-top: 6.7708vw;
}
.commodity .commodity_type {
  position: absolute;
  width: 53.5938vw;
  top: -10.7188vw;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  display: flex;
  justify-content: space-between;
  border-radius: 1.6667vw;
  box-shadow: 0 0.8854vw 3.3854vw 0 rgba(0, 0, 0, 0.05);
  background-color: #fff;
  padding: 1.0417vw 5.2083vw 1.0938vw;
}
.commodity .commodity_type .type {
  position: relative;
}
.commodity .commodity_type .type .type_img img {
  width: 3.8542vw;
}
.commodity .commodity_type .type .type_title {
  margin-top: 0.8333vw;
}
.commodity .commodity_type .type .type_title span {
  font-size: 1.25vw;
  color: #121328;
}
.commodity .commodity_type .type:nth-child(n + 2)::after {
  content: "";
  position: absolute;
  top: 50%;
  left: -4.0625vw;
  transform: translateY(-50%);
  width: 0.1042vw;
  height: 1.3021vw;
  background: linear-gradient(180deg, rgba(254, 157, 102, 0), #fe9d66 100%, rgba(254, 157, 102, 0) 100%);
}
.commodity .commodity_cont .commodity_box {
  padding-bottom: 5.2083vw;
}
.commodity .commodity_cont .commodity_box .commodity_title {
  display: flex;
  justify-content: space-between;
}
.commodity .commodity_cont .commodity_box .commodity_title .commodity_title_cont {
  font-size: 3.125vw;
  font-weight: 700;
  color: #121328;
}
.commodity .commodity_cont .commodity_box .commodity_title .commodity_load {
  width: 8.8021vw;
  height: 3.0208vw;
  line-height: 3.0208vw;
  text-align: center;
  background: #fe9d66;
  border-radius: 0.625vw;
  font-size: 0.8333vw;
  color: #fff;
}
.commodity .commodity_cont .commodity_box .commodity_title .commodity_load img {
  margin-left: 0.8854vw;
  width: 1.3542vw;
}
.commodity .commodity_cont .commodity_box .commodity_all_list {
  overflow: hidden;
}
.commodity .commodity_cont .commodity_box .commodity_list {
  margin-top: 2.8125vw;
  display: flex;
  justify-content: flex-start;
  transition: all 300ms;
  transform: translateX(0px);
}
.commodity .commodity_cont .commodity_box .commodity_list .merchandise {
  flex-shrink: 0;
  width: 24%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing {
  width: 100%;
 /*  height: 17.5vw; */
  background: #f4f4f4;
  border-radius: 1.4063vw;
  display: flex;
  align-items: center;
  justify-content: center;
}
.commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing img {
  width: auto;
    height: auto;
    max-width: 311px;
    max-height: 311px;
}
.commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_dec {
  margin-top: 1.5625vw;
  color: #a0a0a0;
  font-size: 1.25vw;
  font-weight: 400;
}
.commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_prc_grade {
  margin-top: 0.7813vw;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_prc_grade .clothing_prc {
  font-size: 0;
}
.commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_prc_grade .clothing_prc .current_prc {
  font-size: 1.3542vw;
  color: #121328;
  font-weight: 700;
}
.commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_prc_grade .clothing_prc .current_prc em {
  font-weight: 400;
  color: #fe9d66;
}
.commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_prc_grade .clothing_prc .last_prc {
  margin-left: 0.7292vw;
  font-size: 1.0417vw;
  color: #a8a8a8;
}
.commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_prc_grade .grade {
  display: flex;
}
.commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_prc_grade .grade img {
  margin-left: 0.1563vw;
  width: 0.6771vw;
}
.commodity .commodity_cont .commodity_box .toggle_commodity {
  position: relative;
  z-index: 3;
  margin-top: 3.6458vw;
  display: flex;
  justify-content: center;
}
.commodity .commodity_cont .commodity_box .toggle_commodity .right_arrow {
  margin-left: 1.0938vw;
}
.commodity .commodity_cont .commodity_box .toggle_commodity img {
  cursor: pointer;
  width: 2.4479vw;
}
@media screen and (max-width: 750px) {
  #main .commodity {
    position: relative;
    padding: 0 15px 0;
  }
  #main .commodity .commodity_type_box {
    position: relative;
  }
  #main .commodity .commodity_type {
    position: absolute;
    width: 100%;
    top: -110px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    display: flex;
    justify-content: space-between;
    border-radius: 24px;
    box-shadow: 0px 22.85px 35.84px 0px rgba(56, 56, 56, 0.1);
    background-color: #fff;
    padding: 16px 17px;
  }
  #main .commodity .commodity_type .type {
    position: relative;
  }
  #main .commodity .commodity_type .type .m_type_cont {
    text-align: center;
  }
  #main .commodity .commodity_type .type .type_img img {
    width: 38px;
  }
  #main .commodity .commodity_type .type .type_title {
    margin-top: 5px;
  }
  #main .commodity .commodity_type .type .type_title span {
    font-size: 14px;
    color: #121328;
  }
  #main .commodity .commodity_type .type:nth-child(n + 2)::after {
    content: "";
    position: absolute;
    top: 50%;
    left: -15px;
    transform: translateY(-50%);
    width: 1px;
    height: 17px;
    background: linear-gradient(180deg, rgba(254, 157, 102, 0), #fe9d66 100%, rgba(254, 157, 102, 0) 100%);
  }
  #main .commodity .commodity_cont {
    padding-top: 30px;
  }
  #main .commodity .commodity_cont .commodity_box {
    padding-bottom: 47px;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_title {
    display: flex;
    justify-content: space-between;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_title .commodity_title_cont {
    font-size: 18px;
    font-weight: 500;
    color: #012c44;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_title .commodity_load {
    width: 100px;
    height: 27px;
    line-height: 27px;
    text-align: center;
    background: #fe9d66;
    border-radius: 5px;
    font-size: 12px;
    color: #fff;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_title .commodity_load img {
    margin-left: 5px;
    width: 15px;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_list {
    margin-top: 28px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_list .merchandise {
    width: 48%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_list .merchandise:nth-child(n + 2) {
    margin-left: 0;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_list .merchandise:nth-child(n + 3) {
    margin-top: 31px;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing {
    width: 100%;
    height: auto;
    background: #f4f4f4;
    border-radius: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing>a {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing img {
    width: 80%;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_dec {
    margin-top: 14px;
    color: #a0a0a0;
    font-size: 12px;
    font-weight: 400;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_prc_grade {
    margin-top: 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_prc_grade .clothing_prc {
    font-size: 0;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_prc_grade .clothing_prc .current_prc {
    font-size: 16px;
    color: #121328;
    font-weight: 700;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_prc_grade .clothing_prc .current_prc em {
    font-weight: 400;
    color: #fe9d66;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_prc_grade .clothing_prc .last_prc {
    margin-left: 4px;
    font-size: 15px;
    color: #a8a8a8;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_prc_grade .grade {
    display: flex;
  }
  #main .commodity .commodity_cont .commodity_box .commodity_list .merchandise .clothing_text .clothing_prc_grade .grade img {
    margin-left: 3px;
    width: 10px;
  }
  #main .commodity .commodity_cont .commodity_box .toggle_commodity {
    display: none;
  }
}