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

/*==============================*/
/* タブメニュー */
/*==============================*/
ul.tab {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	margin-bottom: 48px;
}

ul.tab li{
	width: calc(calc(100% - 20px * 4) / 5);
	list-style-type: none!important;
	padding: 11px 0px 12px 0px;
	text-align: center;
	background: #9EA4B5;
	color: #fff;
	font-size: 15px;
	line-height: 1.414em;
	cursor: pointer;
}
ul.tab li.active,
ul.tab li:hover{ background: #3F496C!important;}

	/* ======= TB =======*/
	@media screen and (min-width: 768px) and (max-width: 1024px) {
		ul.tab {
			gap: 12px;
			margin-bottom: 32px;
		}
		ul.tab li{
			width: calc(calc(100% - 12px * 3) / 4);
		}
	}
	/* ======= SP =======*/
	@media (max-width: 767px) {
		ul.tab {
			gap: 8px;
			margin-bottom: 32px;
		}
		ul.tab li{
			width: calc(calc(100% - 8px * 1) / 2);
		}
	}

/*-- 
------------------------- */
.tab_menu .area{
	display: none;
	width: 100%;
}

	/* ======= SP =======*/
	@media (max-width: 767px) {
	}


/*==============================*/
/* 活動トピックス */
/*==============================*/
div.activityTopics{
	display: flex; display: -webkit-flex;
	flex-wrap: wrap; -webkit-flex-wrap: wrap;
	margin-bottom: 100px;
	gap :24px;
}
div.activityTopics > div{
	position: relative;
	box-sizing: border-box;
	width: calc(calc(100% - 24px) / 2);
	display: flex; display: -webkit-flex;
	align-items: center; -webkit-align-items: center;
	justify-content: space-between; -webkit-justify-content: space-between;
	border: 1px solid #ccc;
	padding-right: 28px;
}
div.activityTopics > div:hover{
	background: #F5F5F5;
}
div.activityTopics > div::after{
	position: absolute; top: 50%; right: 20px;
	content: "";
	width: 12px;
	height: 12px;
	border-top: 1px solid #6E6E6E;
	border-right: 1px solid #6E6E6E;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	margin-top: -6px;
}
div.activityTopics a{
	position: absolute; top: 0; left: 0;
	width: 100%; 
	height: 100%;
}
div.activityTopics > div figure{ width: 160px;}
div.activityTopics > div div{
	width: calc(100% - 160px);
	padding-left: 20px;
}
div.activityTopics > div div p{
	margin-bottom: 6px;
	color: #444444;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.3em;
	letter-spacing: 0.03em;
}
div.activityTopics > div div h4{
	font-size: 19px;
	line-height: 1.3em;
	font-weight: 500;
	color: #3F496C;
}
	 /* ======= TB =======*/
	@media screen and (min-width: 768px) and (max-width: 1024px) {
		div.activityTopics{
		margin-bottom: 100px;
		gap : 20px;
	}
		div.activityTopics > div{ width: calc(calc(100% - 20px) / 2); padding-right: 24px;}
		div.activityTopics > div::after{ position: absolute; top: 50%; right: 12px;}
		div.activityTopics > div div h4{ font-size: 18px;}
	}

	/* ======= SP =======*/
	@media (max-width: 767px){
		div.activityTopics{
			flex-direction: column; -webkit-flex-direction: column;
			margin-bottom: 100px;
			gap : 16px 0;
		}
		div.activityTopics > div{ width: 100%;}
		div.activityTopics > div::after{ position: absolute; top: 50%; right: 16px;}
		div.activityTopics > div figure{ width: 120px;}
		div.activityTopics > div figure img{
			object-fit: cover;
			height: 96px;
		}
		div.activityTopics > div div{
			width: calc(100% - 120px);
			padding-left: 12px;
		}
		div.activityTopics > div div h4{ font-size: 17px;}
	}