#item-list {
  width: 95%;
}

#item-list ul{
  margin:-1%;/*１カラムのpadding分マイナスマージン*/
  overflow:hidden;
  background-color:transparent;
}

#item-list ul li {

  list-style-type:none;
  float:left; /*floatで横並びに*/
  padding:1%;/*カラム間のガター*/
  margin-right: 1%;
  margin-bottom:5px;
  text-align:center;
  font-size: 90%;
}

#item-list ul.cols-1 li {width: 100%;}
#item-list ul.cols-2 li {width: 45%;}
#item-list ul.cols-3 li {width: 29%;}



.inner{ /*カラムの内側*/
  margin:0 auto;
  height:100%;
  background:white;
}



@media only screen and (max-width: 767px) {
#item-list   ul.cols-4 li,ul.cols-5 li,ul.cols-6 li,ul.cols-7 li,ul.cols-8 li{
    width: 33%;/*４列以上は３列に*/
  }
  #item-list   ul.cols-2 li{
    width:95%;/*３列は２列に*/
  }
    ul
 #item-list  ul.cols-3 li{
    width:95%;/*３列は２列に*/
  }
  #item-list   ul.cols-12 li{
    width:95%;/*３列は２列に*/
  }
}

@media only screen and (max-width: 479px) {
 #item-list  ul[class*='cols-'] > li{
    width: 95%;/*すべて１列に*/
 }
 }