@charset "utf-8";
/**------------------------------------
** NEWS --Index
------------------------------------**/
.newsLists{
	width: 100%;
	margin-bottom:50px;
}
.newsList{
	width: 100%;
	padding: 0 0 0 4.174%;
	border-bottom: 1px solid var(--color-gray);
}
.newsList__link{
	color: #FFF;
	padding: min(4.3558%, 48px) calc(112px + 4.3558%) min(4.3558%, 48px) 0;
	display: block;
	position: relative;
	text-decoration: none;
}
.newsList__detail{
	display: flex;
    line-height: 1;
    align-items: center;
    text-decoration: none;
    color: #FFF;
}
.newsList__date{
	flex-shrink: 0;
	font-family: var(--font-eng);
	font-size: 20px;
	letter-spacing: 0.1em;
	display: inline-block;
	padding: 12px 36px 12px 0;
}

.newsList__title{
	position: relative;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
	position: relative;
	padding: 5px 0 0;
}
.newsList__title span{
	display: inline-block;
	line-height: 2;
}
.newsList__title:after{
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	height: 1px;
	width: 100%;
	background: linear-gradient(#FFF,#FFF) no-repeat right center / 0 100%;
	transition: background-size .6s ease 0s;
}
.newsList__link:hover .newsList__title:after{
	background-position: left center;
	background-size: 100% 100%;
}

.newsList__link:after{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	height: 1px;
	width: 36px;
	margin: auto 0;
	background-color: var(--color-gray);
}

@media screen and (max-width: 767px){
	.newsList{
		padding: 0;
	}
	.newsList__link{
		padding: 5.7143%;
	}
	.newsList__detail{
		align-items: unset;
		flex-direction: column;
		line-height: 2.25;
	}
	.newsList__date{
		padding: 0;
		line-height: 1;
		font-size: var(--sp-size-24);
		padding-bottom: var(--sp-size-16);
	}
	.newsList__title{
		font-size: var(--sp-size-24);
		white-space: normal;
		text-overflow: unset;
		padding: 0;
		overflow: hidden;
		position: relative;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
	}
	.newsList__title span{
		display: inline;
		background: linear-gradient(#FFF, #FFF) right bottom/ 100% var(--sp-size-2) no-repeat;
	}
	.newsList__title:after{
		content: unset;
	}
	.newsList__link:after{
		content: unset;
	}
}

.newsList__linkCircle{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 36px;
	margin: auto 0;
	z-index: 2;
}

.newsList__linkCircle .com_linkCircle{
	height: 100%;
}

.newsList__linkCircle .com_linkCircle_out,
.newsList__linkCircle .com_linkCircle_in{
	margin: auto 0 auto auto;
	bottom: 0;
	transform-origin: left center;
}
.newsList__linkCircle .com_linkCircle_txt{
	padding-top: 0;
	height: 100%;
}

/* hover */
.newsList__link:hover .com_linkCircle_out {
    width: 72px;
    height: 72px;
	transition-delay: .5s;
}
.newsList__link:hover .com_linkCircle_in{
	width: 72px;
	height: 72px;
	opacity: 0;
	transition-delay: .5s;
}
.newsList__link:hover .com_linkCircle_txt span {
    opacity: 1;
    transform: scale(100%);
    transition-delay: .6s;
}

@media screen and (max-width: 767px){
	.newsList__linkCircle{
		display: none;
	}
}


/**------------------------------------
** NEWS --Detail
------------------------------------**/
/* NewsTitle */
.newsTitleWrap{
	display: flex;
}
.newsDate{
	flex-shrink: 0;
	font-family: var(--font-eng);
	font-size: 20px;
	letter-spacing: 0.1em;
	padding-right: 36px;
}
.newsTitle{
	padding: 5px 0 0;
	line-height: 2;
}

@media screen and (max-width: 767px){
	.newsTitleWrap{
		display: block;
		line-height: 2.25;
	}
	.newsDate{
		line-height: 1;
		font-size: var(--sp-size-24);
		padding-right: 0;
		padding-bottom: var(--sp-size-16);
	}
	.newsTitle{
		font-size: var(--sp-size-24);
		padding: 0;
	}
}