@charset "utf-8";

/*-------------------------------
	Community
-------------------------------*/

.Community {
	background:#ECF2F7;
	border-radius:0 5rem 5rem 5rem;
	position:relative;
}

.com_list {
	display: flex;
	flex-wrap:wrap;
	justify-content: space-between;
}

.com_list::after {
	content:"";
	width:31%;
	max-width:34rem;
}

.com_block {
	width:31%;
	max-width:34rem;
	border-radius: 1.5rem;
	box-shadow: 0 0 .6rem rgba(37,126,185,.1);
	overflow: hidden;
}
.com_block:not(:nth-last-of-type(-n+3)){
	margin-bottom: 4rem;
}

.com_link {
	display: flex;
	flex-direction: column;
	width:100%;
	height:100%;
	background:#fff;
	color:var(--blackcolor);
	position:relative;
	opacity:1!important;
}

.com_img {
	width:100%;
	height:27rem;
	overflow: hidden;
}

.com_img img {
	width:100%;
	height:100%;
	object-fit: cover;
	transition:var(--transition);
}

.com_txt {
	display: flex;
	flex-direction: column;
	flex-grow:1;
	padding:3.5rem 3.5rem 5.5rem;
}

.com_txt time {
	display: block;
	font-size:1.4rem;
	font-weight:700;
	line-height:1;
	margin-bottom:0.75em;
}

.com_txt h3 {
	flex-grow:1;
	min-height:calc(1.75 * 3em);
	font-size:2rem;
	font-weight:700;
	line-height:1.75;
	margin-bottom:1.25em;
}
.com_txt h3 span{
	font-weight: 700;
	line-height: 1.75;
	display: block;
}

.com_txt .Index-more {
	margin-left:auto;
	position:relative;
}

.com_link::before,
.com_link::after {
	content:"";
	display: block;
	height:.3rem;
	position:absolute;
	right:3.5rem;
	bottom:4rem;
}

.com_link::before {
	width:calc(100% - 7rem);
	background:#707070;
	opacity:.22;
}

.com_link::after {
	width:10rem;
	background:var(--maincolor);
}

.com_link:hover {
	color:var(--maincolor);
}

.com_link:hover .com_img img {
	transform:scale(1.1);
}

/*-------------------------------
	responsive
-------------------------------*/

@media screen and (max-width:960px){

.com_list::after {
	width:48.2%;
	max-width:100%;
}

.com_block {
	width:48.2%;
	max-width:100%;
}


} /* end 960px */


/*-------------------------------
	ver sp
-------------------------------*/

@media screen and (max-width:768px){


/*-------------------------------
	Community
-------------------------------*/

.com_list::after {
	display: none;
}

.com_block {
	width:100%;
	max-width:100%;
}
.com_block:not(:last-child){
	margin-bottom: 8rem;
}

.com_img {
	width:100%;
	height:53.8rem;
}

.com_txt {
	display: block;
	padding:6rem 6rem 9rem;
}

.com_txt time {
	font-size:2.8rem;
}

.com_txt h3 {
	min-height:auto;
	font-size:3.6rem;
}

.com_link::before,
.com_link::after {
	height:.6rem;
	position:absolute;
	right:6rem;
	bottom:6rem;
}

.com_link::before {
	width:calc(100% - 12rem);
}

.com_link::after {
	width:18rem;
}

} /* end 768px */