.sortable{ margin:3% auto; float: left; width:100%}
.card{ width:88%; margin:0 auto;
  /*
  border-radius: 6px;
  box-shadow: 0px 2px 6px rgba(0, 0, 0, .1);
  display: flex;
  flex-direction: column;
  transition: box-shadow .2s ease-in-out;
  */
}
.card__picture{
  display: block;
  width: 100%;
  height: auto;
}
.card-infos{
  padding:3% 0 10%;
  background: #fff;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius:6px;
}
.card__title{
  font-size:1.85em;
  line-height:1.4em;
  margin:3% auto; color:#111;
   /*这里要显示的设置宽度*/
width:100%;  
overflow:hidden;  /*溢出隐藏*/
white-space:nowrap;  /*溢出不换行*/
text-overflow:ellipsis;  /*文字超出宽度则显示ellipsis省略号*/
}
.card__text,.card-infos p{
  font-size: 1.1em; line-height:1.5em;
  color: #818181; margin:0 auto 5.5%
}

.card__text--high{
  font-weight: 600;
}

a:hover .card__title{ color:#af1e23}
.card-img{ width:100%; overflow:hidden; position:relative}
.card img{width:100%;transition: all 0.6s;}
.card a:hover img{   
    -webkit-transform: scale(1.1);
    transform: scale(1.1);}

.product_list .card__title{ font-size:1.35em; margin:2% auto 1.5%}
.product_list .card-infos{ text-align:center}
.product_list .sortable_li{ border-bottom:solid 2px #f2f2f2; border-right:solid 2px #f2f2f2; overflow:hidden}

.product_list .sortable_li:nth-child(3),.product_list .sortable_li:nth-child(6),.product_list .sortable_li:nth-child(9){ border-right:none}
.product_list .card{margin:6% auto 0; width:80%}




.header{
  background: var(--main-bg-color);
  height: 160px;
  display: flex;
}
.header__title{
  margin: auto;
  font-weight: 300;
  font-size: 3.2rem;
  color: #fff;
}
.header__title--high{
  font-weight: 600;
}

.sortable__nav{
  display: flex;
  justify-content: center;
  margin-bottom: 20px;
}
.nav__link{
  padding: 0 20px 4px;
  color: #fff;
  font-size: 1.4rem;
  font-weight: 300;
  display: block;
  border-bottom: 2px solid transparent;
}
.nav__link.is-active{
  border-color: var(--main-bg-color);
}

.footer__list.list{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.list__item.item{
  display: flex;
}
.item__link.link{
  margin: 0;
}
.item__link.link:not(:first-child){
  margin-left: 20px;
}
.link__icon{
  height: 2rem;
  width: 2rem;
}
@media(max-width:1366px) {
    .card__title{font-size: 1.35em; margin:1% auto 2%}

    .product_list .card__title{ font-size:1.2em;}
    .card__text, .card-infos p{ font-size:1em}





}
@media(max-width:768px) {
    .card-infos{padding: 3% 0 5%;}

}