@charset "UTF-8";
/* CSS Document */

.tab_area{
	margin-bottom: 50px; 
	overflow: hidden;
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	gap: 10px;
}

.tab_area label{
	flex: 0 0 calc((100% - 20px) / 3); /* 基本は3等分で上段に3つ並ぶ */
	display:block; 
	color:#FFFFFF; 
	background:#0098dd; 
	text-align:center; 
	cursor:pointer; 
	transition:ease 0.2s opacity;
	border-radius: 3px;
	font-weight: bold;
	font-size: 14px;
}
/* 4つ目以降のボタンにだけ幅を調整（4等分） */
.tab_area label:nth-child(n+4) {
  flex: 0 0 calc((100% - 30px) / 4);
}

.tab_area label a{
	color: #FFFFFF;
	width: 100%;
	height: 100%;
	display: block;
	text-decoration: none;
	padding:15px 0; 
}

.tab_area label:hover,.tab_area label.active{color:#0098dd; background:#ffe100; }
.tab_area label:hover a,.tab_area label.active a{color:#0098dd; opacity: 1;}


.news_list li{
	padding: 30px 20px;
	border-bottom: 1px solid #DCDCDC;
}

.news_list li a{
	text-decoration: none;
	display: -webkit-flex;
	display: flex;
}


.news_list li span{
	font-family: "Futura Std Medium", "Futura XBlk BT", "FuturaBlack BT",'Hind', sans-serif;
	color: #0096e0;
	width: 130px;
	display: block;
}

.news_list li b{text-decoration: underline;display: block; width: calc(100% - 130px);}
.news_list li b:hover{text-decoration: none;}

@media screen and (max-width: 700px){
	.news_list li{padding: 20px 10px;}
	.news_list li a{display: block!important;}
	.news_list li span{width: 100%;}
	.news_list li b{width: 100%;}
}


/* ページャー */
.news_pager{
	margin: 60px 0;
	text-align: center;
}

.news_pager li{
	list-style: none;
	display: inline-block;
	margin: 0 3px;
}

.news_pager li a{
	border-radius: 5px;
	text-decoration: none;
	background: #0096e0;
	color: #FFFFFF;
	padding:5px 10px;
}

.news_pager li a:hover,.news_pager li a.active{
	background: #fee100;
	color: #0096e0;
}

.news_pager li a.next,.news_pager li a.prev{
	background: #FFFFFF;
	color: #0096e0;
	font-weight: bold;
}

.news_pager li a.next:hover,.news_pager li a.prev:hover{
	background: #FFFFFF;
	color: #0096e0;
	opacity: 0.6;
}