@charset "utf-8";

/************************************************************
	タブ機能
*************************************************************/
/*タブ切り替え全体のスタイル*/
.tabs {
  margin-top: 5rem;
  padding-bottom: 4rem;
  width: 100%;
  max-width:1200px;
  margin: 0 auto;
}

/*タブのスタイル*/
.tab_item {
    width: calc(60%/3);
    height: 5rem;
    background: #f5f5f5;
    line-height: 5rem;
    font-size: 1.8rem;
    text-align: center;
    color: #333;
    display: block;
    float: left;
    text-align: center;
    font-weight: bold;
    transition: all 0.2s ease;
	margin: 0 0.5%!important;
    border-color: #CCC;
    border-width: 1px 1px 0 1px;
    border-style: solid;
    box-sizing: border-box;
}
.tab_item:hover {
  opacity: 0.75;
}
	@media only screen and (max-width: 767px){
		.tab_item {
			width: calc(100%/3 - 1rem);
			height: 3rem;
			line-height: 3rem;
			font-size: 1.2rem;
		}
	}
	@media only screen and (max-width: 350px){
		.tab_item {
			font-size: 1rem;
		}
	}

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

/*タブ切り替えの中身のスタイル*/
.tab_content {
	display: none;
	padding: 4rem 2rem 0;
	clear: both;
	overflow: hidden;
    border-top: 1px solid #CCC;
}
	@media only screen and (max-width: 767px){
		.tab_content {
			padding: 3rem 1.5rem 0;
		}
	}


/*選択されているタブのコンテンツのみを表示*/
#explain:checked ~ #explain_content,
#detail:checked ~ #detail_content,
#note:checked ~ #note_content {
  display: block;
}

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

/*タブコンテンツ*/
.tab_content_description {
	font-size:1.4rem;
}
.tab_content_description table {
	width:100%;
}
.tab_content_description table {
	width:100%;
}
.tab_content_description table th,
.tab_content_description table td {
	padding:1rem;
}
.tab_content_description table th {
	color:#669933;
	font-weight:bold;
}
.tab_content_description table td {
}