/**
 * ニュースブロックコンポーネント
 */

/*
======================================
news block - 共通スタイル
======================================
*/
.news-block {
	align-items: center;
	border-bottom: 1px solid var(--blue-background);
	box-sizing: border-box;
	display: flex;
	gap: 28px;
	padding: 20px 0;
	width: 100%;
}

.news-block__date {
	color: var(--blue-primary);
	flex-shrink: 0;
	font-family: var(--english-font-family);
	font-size: var(--font-size-l);
	font-weight: var(--font-weight-normal);
	letter-spacing: 1.8px;
	line-height: var(--line-height-none);
	text-transform: uppercase;
}

.news-block__title {
	color: var(--blue-primary);
	flex: 1 0 0;
	font-family: var(--main-font-family);
	font-size: var(--font-size-m);
	font-weight: var(--font-weight-medium);
	line-height: var(--line-height-relaxed);
	margin: 0;
	min-height: 1px;
	min-width: 1px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.news-block__button {
	align-items: center;
	background: none;
	border: none;
	border-bottom: 1px solid var(--blue-primary);
	cursor: pointer;
	display: inline-flex;
	flex-shrink: 0;
	gap: 18px;
	padding: 0 4px 8px;
	text-decoration: none;
	transition: var(--transition-animation);
}

.news-block__button:hover {
	opacity: 0.7;
}

.news-block__button-text {
	color: var(--blue-primary);
	font-family: var(--main-font-family);
	font-size: var(--font-size-s);
	font-weight: var(--font-weight-medium);
	line-height: var(--line-height-normal);
}

.news-block__button-arrow {
	background-image: url("../images/arrow_right.svg");
	background-repeat: no-repeat;
	background-size: contain;
	display: block;
	height: 7.505px;
	transition: var(--transition-animation);
	width: 8.75px;
}

.news-block__button:hover .news-block__button-arrow {
	transform: translateX(4px);
}

/*
======================================
news block - PC版
======================================
*/
.news-block--pc {
	max-width: 100%;
}

/*
======================================
news block - SP版
======================================
*/
.news-block--sp {
	border-bottom: 1px solid var(--blue-background);
	border-left: none;
	border-radius: 0;
	border-right: none;
	border-top: none;
	max-width: 100%;
	padding: 0;
}

.news-block__link {
	align-items: center;
	display: flex;
	gap: 28px;
	padding: 20px 0;
	text-decoration: none;
	transition: var(--transition-animation);
	width: 100%;
}

.news-block__link:hover {
	opacity: 0.7;
}

.news-block--sp .news-block__date {
	font-size: var(--font-size-xs);
	letter-spacing: 1.2px;
}

.news-block--sp .news-block__button {
	border-bottom: none;
	padding: 0;
}

/*
======================================
news block - 白色バリエーション
======================================
*/
.news-block--white {
	border-bottom-color: rgba(255, 255, 255, 0.3);
}

.news-block--white .news-block__date {
	color: var(--white);
}

.news-block--white .news-block__title {
	color: var(--white);
}

.news-block--white .news-block__button {
	border-bottom-color: var(--white);
}

.news-block--white .news-block__button-text {
	color: var(--white);
}

.news-block--white .news-block__button-arrow {
	background-image: url("../images/arrow_right_white.svg");
}

.news-block--white .news-block__link:hover {
	opacity: 0.7;
}

@media screen and (max-width:1024px) {
	.news-block__title{
		text-overflow: clip;
		white-space: wrap;
	}	
}