@charset "utf-8";

/*-------------------------------
	暮らしの声
-------------------------------*/

.Voice-block-wrap{
	margin-bottom: 7.6rem;
}
.Voice-block{
	border-bottom: 2px solid var(--subcolor);
}
.Voice-block a{
	width: 100%;
    padding: 3rem 2rem;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    opacity: 1 !important;
}
.Voice-block:first-child a{
	padding-top: 0;
}
.Voice-block__image{
	width: 31.6rem;
	overflow: hidden;
}
.Voice-block__image img{
	transition: var(--transition);
	width: 100%;
	aspect-ratio: 1 / .623;
	object-fit: cover;
}
.Voice-block__body{
	width: calc(100% - 31.6rem);
	/* padding: 1rem 9rem 1rem 3.5rem; */
	padding: 2.8rem 9rem 2.8rem 3.5rem;
	position: relative;
}
.Voice-block__category{
	border: 2px solid var(--subcolor);
	width: fit-content;
	height: 2.3rem;
	font-size: 1.4rem;
	margin-bottom: 1.8rem;
	padding-left: .6rem;
	padding-right: .6rem;
	display: block;
	line-height: 1.35;
	font-weight: 700;
}
.Voice-block__category span{
	line-height: 1;
}
.Voice-block__category span::before{
	line-height: 1;
	margin-left: -.3em;
}
.Voice-block__category-area + .Voice-block__category-age::before,
.Voice-block__category-area + .Voice-block__category-family::before{
	content: "/";
}
.Voice-block__category-age + .Voice-block__category-family::before{
	content: "・";
}
.Voice-block__title{
    line-height: calc(2.6 / 1.6);
	margin-bottom: 1.2rem;
    font-weight: 700;
}
.Voice-block__title span{
    line-height: calc(2.6 / 1.6);
}
.Voice-block__tag{
	width: 100%;
	margin-top: .8rem;
	display: flex;
	gap: .6rem;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
}
.Voice-block__tag-item{
	font-size: 1.2rem;
	padding: .6rem .9rem;
	line-height: 1;
	background: #e6e6e6;
	color: #666;
}
.Voice-block__tag-item::before{
	content: "#";
	line-height: 1;
}
.Voice-block__body .C-Arrow{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
}

.Voice-block a:hover .Voice-block__image img {
    transform: scale(1.1);
}

@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:1100px) and (min-width: 769px){

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

	.Voice-block__image{
		width: 25rem;
	}
	.Voice-block__body{
		width: calc(100% - 25rem);
	}

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

	.Voice-block-wrap{
		margin-bottom: 5rem;
	}
	.Voice-block:first-child a{
		padding-top: 0;
	}
	.Voice-block a{
		padding: 3rem 0;
	}
	.Voice-block__image{
		width: 13rem;
	}
	.Voice-block__image img{
		aspect-ratio: 1 / .9;
	}
	.Voice-block__body{
		width: calc(100% - 13rem);
		padding: 0 3.8rem 0 1.4rem;
	}
	.Voice-block__category{
		font-size: 1.1rem;
		height: 1.8rem;
		margin-bottom: .8rem;
		padding-left: .5rem;
		padding-right: .5rem;
	}
	.Voice-block__title{
		line-height: calc(2.1 / 1.3);
		max-height: calc((1em * (2.1 / 1.3)) * 3);
		overflow: hidden;
	}
    .Voice-block__tag{
        margin-top: .6rem;
        gap: .4rem;
    }
    .Voice-block__tag-item{
        font-size: .8rem;
        padding: .4rem .5rem;
	}
	.Voice-block__body .C-Arrow{
		width: 2.2rem;
		height: 2.2rem;
	}
	.Voice-block__body .C-Arrow::after{
		width: .8rem;
		height: .5rem;
	}

}