input[name="tab-radios"] {
  display: none;
}



/*タブ切り替え全体のスタイル*/
.tabs {
  margin-top: 20px;
  padding-bottom: 40px;
  background-color: #ffffff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  width: 95%;
  margin: 0 auto;}

/*タブのスタイル*/
.panel-label {
  width: calc(100%/2);/*横幅をタブの数で均等割り*/
  height: 40px;
  border-bottom: 3px solid #5959AB;
  background-color: #d9d9d9;
  line-height: 40px;
  font-size: 18px;
  text-align: center;
  color: #5959AB;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
}
.panel-label:hover {
  opacity: 0.75;
}



/*ラジオボタンを全て消す*/
input[name="tab-radios"] {
  display: none;
}



/*タブ切り替えの中身のスタイル*/
.contentsgroup {
  display: none;
  padding: 0px 30px 0;
  clear: both;
  overflow: hidden;
}


/*選択されているタブのコンテンツのみを表示*/
#choice1:checked ~ #choice1_content,
#choice2:checked ~ #choice2_content
 {
  display: block;
}

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .panel-label {
  background-color: #5959AB;
  color: #ffffff;
}