#cat-btnlist{
  position: relative;
  z-index: 999;
}
#cat-btnlist:after{
  content: '';
  background-color: #000;
  width: 100vw;
  height: 60px;
  position: absolute;
  top:0;
  left:calc((100% - 100vw)/2);
  z-index: -1;
}
#cat-btnlist ul{
  display: grid;
  grid-template-columns: repeat(3,1fr);
  border-right: 1px solid #fff;
}
#cat-btnlist ul li{
  text-align: center;
  border-left: 1px solid #fff;
}
#cat-btnlist ul li a{
  display: block;
  height: 60px;
  background-color: #000;
  color: #fff;
  font-family: "Times New Roman", 游明朝, "Yu Mincho", 游明朝体, YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", HiraMinProN-W3, HGS明朝E, "ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-size: 20px;
  padding-top: 13px;
  box-sizing: border-box;
}
#cat-btnlist ul li a small{
  display: block;
  font-size: 36%;
  margin-bottom: 5px;
  opacity: 0.5;
}
#cat-btnlist ul li a:hover{
  background-color: #ff6900;
}
@media screen and (max-width: 768px) {
  #cat-btnlist:after{
    content: '';
    background-color: #000;
    width: 100vw;
    height: 100%;
    position: absolute;
    top:0;
    left:calc((100% - 100vw)/2);
    z-index: -1;
  }
  #cat-btnlist{
    width: 100vw;
    margin-left: calc((100% - 100vw)/2);
  }
  #cat-btnlist ul{
    display: grid;
    grid-template-columns: repeat(1,1fr);
    border-right: 0px solid #fff;
  }
  #cat-btnlist ul li{
    border-left: 0px solid #fff;
    border-bottom: 1px solid #fff;
  }
  #cat-btnlist ul li a{
    height: 60px;
    font-size: 15px;
    padding-top: 13px;
  }
  #cat-btnlist ul li a:hover{
    background-color: #000;
  }
}