.friend-box-row{
  margin-top:14px;
  padding-top:24px;
  border-top: dashed 1px #dadada;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
}
.friend-box{
  display:flex;
  flex:1;
  justify-content:center;
  align-items:flex-start;
  margin-left:20px;
}
.friend-box:first-of-type{
  margin-left:0;
}
.friend-box-inner{
  display:flex;
  align-items:flex-start;
}
.friend-title{
  height:24px;
  margin:0 auto;
  display:block;
  flex:none;
}
.friend-box-list{
  width:100%;
  display:flex;
  /*justify-content:center;*/
  flex:1;
  flex-wrap:wrap;
}
.friend-box-list-unit{
  font-size:14px;
  margin-left:10px;
  flex:none;
  line-height:24px;
}
body .page-footer{
  margin-top:22px;
}
@media (max-width:1400px){
  /*.friend-title{
    width: 8vw;
  }*/
  .friend-box-list-unit{
    font-size: 1.1vw;
    margin-left:1.5vw;
  }
}
@media (max-width:1099px){
  .friend-box-list-unit{
    font-size: 1.4vw;
  }
}
@media (max-width:767px){
  .friend-box{
    margin-top: 2vw;
    padding-top: 4vw;
    width:100%;
    justify-content: flex-start;
    margin-left:0;
  }
  .friend-box:first-of-type{
    margin-top: 0;
    padding-top: 0;
  }
  .friend-box-row{
    margin-top: 2vw;
    padding-top: 4vw;
    display: block;
  }
  .friend-title{
    height:5vw;
  }
  .friend-box-list-unit{
    font-size:3.2vw;
    margin-left:2vw;
    line-height:5vw;
  }
  body .page-footer{
    margin-top:5vw;
  }
  .friend-box-list{
    flex-wrap:wrap;
  }
}