.tab-switch {
  --cstm-tab-color: #222;
  display: flex;
  flex-wrap: wrap;
  max-width: 100%;
  margin-inline: auto;
  gap: 0 5px;
}

/* ラジオ非表示 */
.tab-switch input {
  display: none;
}

/* タブ */
.tab-switch label {
  padding: .7em 1em;
  cursor: pointer;
  order: -1;
  text-align: center;
  flex: 1;
  border-bottom: 2px solid transparent;
  color: #222;
  transition: border-color .6s ease, color .6s ease;
}

.tab-switch input:checked + label {
  border-bottom-color: var(--cstm-tab-color);
  color: #222;
}

/* コンテンツ */
.tab-content{
  width:100%;
  padding:1.5em 0;
  display:none;
}

.tab-content.is-active{
  display:block;
}