@charset "utf-8";

/*tabの形状*/
.tab {
}
@media all and (max-width: 768px) {
	.tab {
		display:flex;
		align-items:center;
	}
}
.tab_contents{
	display: flex;
	flex-wrap: wrap;
  }
  .tab_contents li {
	width: calc(100%/2);
	height: 50px;
	border-bottom: 3px solid #073190;
	background-color: #d9d9d9;
	line-height: 50px;
	font-size: 16px;
	text-align: center;
	color: #565656;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
    cursor: pointer;
  }
  .tab_contents li a{
	display: block;
	text-decoration:none;
  }
  /*liにactiveクラスがついた時の形状*/
  .tab_contents li.active a{
	background-color: #073190;
	color: #fff;
  }
  
  
  /*エリアの表示非表示と形状*/
  .area {
	display: none;/*はじめは非表示*/
	opacity: 0;/*透過0*/
	padding:50px 20px;
  }
  
  /*areaにis-activeというクラスがついた時の形状*/
  .area.is-active {
	  display: block;/*表示*/
	  animation-name: displayAnime;/*ふわっと表示させるためのアニメーション*/
	  animation-duration: 2s;
	  animation-fill-mode: forwards;
  }
  
  @keyframes displayAnime{
	from {
	  opacity: 0;
	}
	to {
	  opacity: 1;
	}
  }





/*タブ切り替え全体のスタイル*/
.tabs {
	margin-top: 50px;
	/*background-color: #fff;*/
	margin: 0 auto;}

/*タブのスタイル*/
.tab_item {
	width: calc(100%/2);
	height: 50px;
	border-bottom: 3px solid #073190;
	background-color: #d9d9d9;
	line-height: 50px;
	font-size: 16px;
	text-align: center;
	color: #565656;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
    cursor: pointer;
}
.border_label{border-right: #3a8dde solid 1px;}
.tab_item:hover {
	opacity: 0.75;
}

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

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


/*選択されているタブのコンテンツのみを表示*/
#info1:checked ~ #info1_content,
#info2:checked ~ #info2_content {
	display: block;
}
#tab01:checked ~ #tab01_content,
#tab02:checked ~ #tab02_content,
#tab03:checked ~ #tab03_content{
	display: block;
	padding-bottom: 2em
}

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
	background-color: #073190;
	color: #fff;
}