.tab5 {
  width: 100%;/*横幅はここで設定します。100%にすれば可変になります。*/
  min-width: 320px;
  margin: 10px auto;
}
.tab5 .tab-content {
  margin: 0 10px 10px 0;
}
.tab5 label {
  display: inline-block;
  margin: 0;
  padding: 0;
}
.tab5 label {
  display: inline-block;
  width: 150px;
  padding: 10px;
  cursor: pointer;
  background: #ddd;
  color: #777;
  margin: 10px 0 10px 0;
  font-size: 110%;
  font-weight: bold;
  text-align: center;
}
.tab5 label:hover {
  background: #eee;
}
.tab5 input:checked + label {
  background: #6992c3;
  color: white;
  padding: 10px;
}
.tab5 input {
  display: none;
}
.tab5 #tab5-b1,
.tab5 #tab5-b2,
.tab5 #tab5-b3,
.tab5 #tab5-b4 {
  display: none;
  padding: 10px 0;
}
.tab5 #tab5-1:checked ~ #tab5-b1,
.tab5 #tab5-2:checked ~ #tab5-b2,
.tab5 #tab5-3:checked ~ #tab5-b3,
.tab5 #tab5-4:checked ~ #tab5-b4 {
  display: block;
}