/*タブ切り替え全体のスタイル*/
.tabs {
width: 1366px;
margin: 2% auto 0;
}

/*タブのスタイル*/

.tab_item {
width: 33.33%;
height: 70px;
line-height: 70px;
font-size: 1.625rem;
letter-spacing: .1rem;
text-align: center;
color: #000;
display: block;
float: left;
text-align: center;
font-weight: nomal;
transition: all 0.2s ease;
padding: 0 16px;
border: 1px solid #051a10;
border-bottom:none;
background-image: linear-gradient(180deg, rgba(5, 26, 16, 1), rgba(200, 200, 200, 1) 60%);
}
.tab_item span {
	font-size: 75%;
}
.tab_item:hover {
opacity: 0.75;
}


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

/*タブ切り替えの中身のスタイル*/
.tab_content {
display: none;
padding: 0;
clear: both;
overflow: hidden;
width:100%;
padding: 80px 70px 70px;
background: #007265;
border: 1px solid #051a10;
border-top: none;
}

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

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
background-image: linear-gradient(180deg, rgba(112, 176, 169, 1), rgba(0, 114, 101, 1) 60%);
color: #fff;
position: relative;
display: inline-block;
}
.tabs input:checked + .tab_item:after {
content: '';
 position: absolute;
 left: 50%;
 bottom: 0;/*線の上下位置*/
 display: inline-block;
 width: 90%;/*線の長さ*/
 height: 1px;/*線の太さ*/
 -webkit-transform: translateX(-50%);
 transform: translateX(-50%);/*位置調整*/
 background-color: white;/*線の色*/
}

.tab_content h3 {
	text-align: center;
	font-size: 1.625rem;
	line-height: 1.5;
	letter-spacing: 0.2em;
	margin-bottom: 80px;
}
.tab_content_inner {
	background-color: #fff;
	padding: 80px;
	color: #000;
}


/* -------------------------------------------------------------------------------------------------------- */
/* 1366*/
/* -------------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 1366px) {

#sec2 {
	width: 95%;
}
.tabs {
width: 100%;
}
.tab_item {
font-size: 2.0833vw;
}
.tab_content_inner {
	padding: 60px 40px 40px;
}

}



/* -------------------------------------------------------------------------------------------------------- */
/* 1280*/
/* -------------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 1280px) {





}

/* -------------------------------------------------------------------------------------------------------- */
/* 950*/
/* -------------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 950px) {

.tab_content {
padding: 4.2105vw;
}
.tab_content h3 {
	font-size: 2.7368vw;
}
.tab_item {
height: 5.4688vw;
padding: 0 1.25vw;
font-size: 2.0833vw;
line-height: 5.4688vw;
letter-spacing: .05em;
}
.tab_content_inner {
	padding: 30px 20px 20px;
}



}


/* -------------------------------------------------------------------------------------------------------- */
/*  750 */
/* -------------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 750px) {

.tabs {
width: 100%;
}
.tab_item {
width:100%;
font-size: 3.75vw;
height: 10vw;
line-height: 10vw;
border:none;
margin-left:0;
margin-bottom:1.6vw;
}
.tabs input:checked + .tab_item:after {
	content: none;
}
.tab_item a {
display: block;
}
.tab_content {
border-top:none;
}
.tab_content h3 {
	margin-bottom: 5.3333vw;
}
.tab_content_inner {
	padding: 30px 20px 20px;
}


}
