@charset "EUC-JP";
@import url(https://use.fontawesome.com/releases/v5.12/css/all.css);
/*タブ切り替え全体のスタイル*/
/*タブのスタイル*/
.tab_item{
	width:150px;
	height:50px;
	box-sizing: border-box;
	background-color:#ccc;
	font-family: 'Noto Sans JP', sans-serif;
	font-size:1.8rem;
	font-weight:900;
	color:#000;
	display:inline-block;
	text-align:center;
	cursor:pointer;
	margin: 0px 2px 0px 2px;
	padding:15px 30px 15px 30px;
	border-radius:7px 7px 0px 0px;
	cursor:pointer;
}
.tab_item:hover{
	background-color: #3388C9;
	color:#fff;
}
.qa_company,.qa_works,.qa_kyuyo,.qa_fukuri,.qa_kankyo,.qa_oubo{
	background-color:#94C9D9;
    width: 30%;
    box-sizing: border-box;
    position: relative;
    padding: 30px 50px 50px;
    margin: 1%;
	color:#fff;
	text-shadow:2px 2px 2px #999;
	vertical-align: top;
}
.qa_company:before,.qa_works:before,.qa_kyuyo:before,.qa_fukuri:before,.qa_kankyo:before,.qa_oubo:before{
	content:"";
	background-image: url(../images/qa_icon.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size:100% auto;
	width:32px;
	height:36px;
	position:absolute;
	top:0px;
	left:12px;
}
.qa_company:hover,.qa_works:hover,.qa_kyuyo:hover,.qa_fukuri:hover,.qa_kankyo:hover,.qa_oubo:hover{
	background-color: #ccc;
}
/*ラジオボタンを全て消す*/
input[name="tab_item"]{
	display: none;
}
input:checked + .tab_item{
	background-color: #3388C9;
	color:#fff;
	cursor: pointer;
}
input:checked + .qa_company,
input:checked + .qa_works,
input:checked + .qa_kyuyo,
input:checked + .qa_fukuri,
input:checked + .qa_kankyo,
input:checked + .qa_oubo{
	background-color: #ccc;
	color:#fff;
	cursor: pointer;
}
/*タブ切り替えの中身のスタイル*/
.tab_content{
	display: none;
	padding:60px;
	background-color:#F4EFE6;
	text-align:center;
	clear: both;
	overflow: hidden;
	font-family: 'Noto Sans JP', sans-serif;
}
/*選択されているタブのコンテンツのみを表示*/
#chintai:checked ~ div#chintai_content,
#baibai:checked ~ div#baibai_content,
#kanri:checked ~ div#kanri_content,
#reform:checked ~ div#reform_content,
#qa_company:checked ~ div#qa_company_content,
#qa_works:checked ~ div#qa_works_content,
#qa_kyuyo:checked ~ div#qa_kyuyo_content,
#qa_fukuri:checked ~ div#qa_fukuri_content,
#qa_kankyo:checked ~ div#qa_kankyo_content,
#qa_oubo:checked ~ div#qa_oubo_content{
	display: block;
	position:relative;
}
#qa_company_content,
#qa_works_content,
#qa_kyuyo_content,
#qa_fukuri_content,
#qa_kankyo_content,
#qa_oubo_content{
	background-color:#fff;
	text-align:left;
	padding:60px 20px;
}
@media screen and (max-width:912px){
	#qa_company_content,
	#qa_works_content,
	#qa_kyuyo_content,
	#qa_fukuri_content,
	#qa_kankyo_content,
	#qa_oubo_content{
		padding:60px 0px;
	}
}
@media screen and (max-width:820px){
	.qa_company,.qa_works,.qa_kyuyo,.qa_fukuri,.qa_kankyo,.qa_oubo{
		width: 47%;
	}
}
@media screen and (max-width:640px){
	.tab_content{
		padding:20px 0px 80px 0px;
	}
	#qa_company_content,
	#qa_works_content,
	#qa_kyuyo_content,
	#qa_fukuri_content,
	#qa_kankyo_content,
	#qa_oubo_content{
		padding:0px 0px;
	}
	.tab_item{
		width: 47%;
		margin-bottom:10px;
	}
}
@media screen and (max-width:480px){
	.tab_content {
		padding:20px 0px 50px 0px;
	}
	
}
@media screen and (max-width:428px){
	.qa_company:before,.qa_works:before,.qa_kyuyo:before,.qa_fukuri:before,.qa_kankyo:before,.qa_oubo:before{
		display:none;
	}
	.qa_company,.qa_works,.qa_kyuyo,.qa_fukuri,.qa_kankyo,.qa_oubo{
		padding: 15px 10px;
		font-size: 1.6rem;
		line-height: 130%;
	}
}