@charset "utf-8";
.newsContent{
	width: 100%;
}

/*-----------------------------------------------
 * NEWS - lists
-------------------------------------------------*/
.newsLists{
	position:relative;
}
.newsList{
	width:100%;
	position:relative;
	z-index:2;
}
.newsList:after{
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	border-bottom: 2px solid var(--color-main-brown);
}
.newsList:first-child:before{
	content:'';
	position:absolute;
	top: 0;
	left: 0;
	right:0;
	border-bottom:2px solid var(--color-main-brown);
	z-index: 1;
}
.newsList__link{
	width: 100%;
	min-height: min(calc(80 / var(--vw-min) * 100vw), 80px);
	position: relative;
	display: flex;
	align-items: center;
	text-decoration: none;
	line-height: 1;
	background-color: var(--color-white);
}
.newsList__date{
	display: block;
	line-height: 1;
	width: min(calc(120 / var(--vw-min) * 100vw), 120px);
	background-color: var(--color-main-brown);
	font-family:var(--font-en);
	font-size: min(calc(12 / var(--vw-min) * 100vw), 12px);
	padding: min(calc(6 / var(--vw-min) * 100vw), 6px) min(calc(16 / var(--vw-min) * 100vw), 16px);
	color: var(--color-white);
	text-align: center;
	position: relative;
	z-index: 1;
	flex-shrink: 0;
}
.newsList__title{
	width: 100%;
	padding:min(calc(20 / var(--vw-min) * 100vw), 20px) min(calc(72 / var(--vw-min) * 100vw), 72px) min(calc(20 / var(--vw-min) * 100vw), 20px) min(calc(44 / var(--vw-min) * 100vw), 44px);
	line-height: 1;
	position: relative;
}
.newsList__title--txt{
	display: block;
	line-height: 1.5;
	color: #222;
}
.newsList__title:after{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	margin-top: auto;
	margin-bottom: auto;
	margin-right: min(calc(16 / var(--vw-min) * 100vw), 16px);
	width: min(calc(13 / var(--vw-min) * 100vw), 13px);
	height: min(calc(32 / var(--vw-min) * 100vw), 32px);
	-webkit-mask: url(../img/common/arrow_r.svg) no-repeat center / contain;
	mask: url(../img/common/arrow_r.svg) no-repeat center / contain;
	background-color: var(--color-main-red);
}

@media (hover:hover) and (pointer:fine){
	.newsList__link:before{
		content: '';
		position: absolute;
		inset: 0;
		background: linear-gradient(var(--color-main-red), var(--color-main-red)) right center / 0 100% no-repeat;
		opacity: 30%;
		transition: background-size .4s ease;
	}
	.newsList__link:hover::before{
		background-position: left bottom;
		background-size: 100% 100%;
	}
	.newsList__title:after{
		transition: .3s ease;
	}
	.newsList__link:hover .newsList__title:after{
		transition-delay: .2s;
		transform: translateX(50%);
	}
}

@media screen and (max-width: 768px){
	#news .contentIn{
		margin-top: min(calc(48 / var(--min-ww) * 100vw), 48px);
		padding: 0 6.4%;
	}
	.newsList__link{
		min-height: min(calc(140 / var(--vw-min) * 100vw), 140px);
	}
	.newsList__date{
		width: min(calc(100 / var(--vw-min) * 100vw), 100px);
		font-size: min(calc(20 / var(--vw-min) * 100vw), 20px);
		line-height: 1.2;
		padding: min(calc(10 / var(--vw-min) * 100vw), 10px) min(calc(16 / var(--min-ww) * 100vw), 16px);;
	}
	.newsList__title{
		padding-top: min(calc(20 / var(--vw-min) * 100vw), 20px);
		padding-right: calc(72 / var(--vw-min) * 100vw);
		padding-bottom: min(calc(20 / var(--vw-min) * 100vw), 20px);
		padding-left: calc(24 / var(--vw-min) * 100vw);
	}
	.newsList__title:after{
		width: var(--sp-size-20);
		height: var(--sp-size-48);
		margin-right: var(--sp-size-24);
	}
}



/**
* scrAni - set
**/
.newsLists{
	opacity:0;
	transition:.4s ease;
}
.newsList__title{
	opacity:0;
	transform:translateY(10%);
	transition:.4s ease;
}
/* scrAni - ani */
.content.is-ani .newsLists{
	opacity:1;
	transition-delay:1s;
}
.content.is-ani .newsList__title{
	opacity:1;
	transform:translateY(0%);
	transition-delay:1.41s;
}
.wp-pagenaviWrap{
	opacity:0;
	transform:translateY(10%);
	transition:.4s ease;
}
.content.is-ani .wp-pagenaviWrap{
	opacity:1;
	transform:translateY(0%);
	transition-delay:1.41s;
}
/*-----------------------------------------------
 * NEWS - detail
-------------------------------------------------*/
.articleTitle{
	width: 100%;
	display: flex;
	align-items: center;
	padding-top: min(calc(22 / var(--vw-min) * 100vw), 22px);
	padding-right: min(calc(40 / var(--vw-min) * 100vw), 40px);
	padding-bottom: min(calc(22 / var(--vw-min) * 100vw), 22px);
	background-color: #fff;
	position: relative;
}
.articleTitle:before{
	content: '';
	position: absolute;
	inset: 0;
	border-top: 2px solid var(--color-main-brown);
	border-bottom: 2px solid var(--color-main-brown);
}
.articleTitle__title{
	width: calc(100% - min(calc(120 / var(--vw-min) * 100vw), 120px));
	padding-left: min(calc(44 / var(--vw-min) * 100vw), 44px);
	font-size: min(calc(20 / var(--vw-min) * 100vw), 20px);
	line-height: 2;
}
.articleTitle__date{
	order: -1;
	flex-shrink: 0;
	display: block;
	width: min(calc(120 / var(--vw-min) * 100vw), 120px);
	text-align: center;
	padding: min(calc(8 / var(--vw-min) * 100vw), 8px) min(calc(12 / var(--vw-min) * 100vw), 12px);
	font-family: var(--font-en);
	font-size: min(calc(12 / var(--vw-min) * 100vw), 12px);
	color: var(--color-white);
	line-height: 0.6667;
	background-color: var(--color-main-brown);
}

.articleContentIn{
	margin-top: min(calc(40 / var(--vw-min) * 100vw), 40px);
	padding: min(calc(16 / var(--vw-min) * 100vw), 16px) 5.4055% min(calc(40 / var(--vw-min) * 100vw), 40px);
	line-height:2;
	word-break:break-all;
}
/* htag */
.articleContentIn h1,
.articleContentIn h2,
.articleContentIn h3,
.articleContentIn h4{
	font-size: min(calc(18 / var(--vw-min) * 100vw), 18px);
	font-weight: 900;
	position: relative;
	padding-bottom: min(calc(4 / var(--vw-min) * 100vw), 4px);
	line-height: 1.6;
	margin-top: min(calc(24 / var(--vw-min) * 100vw), 24px);
	color:var(--color-main-brown);
}
.articleContentIn h1 .htag_txt,
.articleContentIn h2 .htag_txt,
.articleContentIn h3 .htag_txt,
.articleContentIn h4 .htag_txt{
	position: relative;
	background: linear-gradient(0deg,rgba(var(--color-main-red-rgb),60%),rgba(var(--color-main-red-rgb),60%) 30%,transparent 30%);
}
.articleContentIn h5,
.articleContentIn h6{
	font-weight: 500;
	line-height: 1.6;
	margin-top: min(calc(24 / var(--vw-min) * 100vw), 24px);
}
.articleContentIn h5 .htag_txt,
.articleContentIn h6 .htag_txt{
	display: inline-block;
	position: relative;
	border: 2px solid var(--color-main-red);
	padding: 0.175em 0.5em;
}
/* pre */
.articleContentIn  pre{
	margin-top: min(calc(24 / var(--vw-min) * 100vw), 24px);
}
/* p */
.articleContentIn p{
	margin-top: min(calc(24 / var(--vw-min) * 100vw), 24px);
}
.articleContentIn p.center{
	text-align: center;
}
.articleContentIn p.right{
	text-align: right;
}
/* a */
.articleContentIn a{
	color: var(--color-main-red);
	font-weight: 700;
}
/* img */
.articleContentIn img{
	height: auto!important;
	max-width: 100%;
}
.articleContentIn img.aligncenter{
	display: block;
	margin: 0 auto;
}
.articleContentIn img.alignright{
	display: block;
	margin-left: auto;
}
/* youtube */
.youtubeWrap{
	max-width: 100%;
	margin: 0 auto;
}
.youtubeInWrap{
	display: block;
	width: 100%;
	position: relative;
	padding-top: 56.25%;
	margin: auto;
}
.youtubeWrap iframe[src*="youtube"]{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 768px){
	.articleContentIn{
		margin-top: var(--sp-size-48);
		padding:var(--sp-size-12) var(--sp-size-24) var(--sp-size-48);
	}
	.articleTitle{
		padding-top: min(calc(24 / var(--vw-min) * 100vw), 24px);
		padding-right: min(calc(24 / var(--vw-min) * 100vw), 24px);
		padding-bottom: min(calc(24 / var(--vw-min) * 100vw), 24px);
	}
	.articleTitle__title{
		width: calc(100% - min(calc(100 / var(--vw-min) * 100vw), 100px));
		font-size: min(calc(28 / var(--vw-min) * 100vw), 28px);
		padding-left: min(calc(24 / var(--vw-min) * 100vw), 24px);
	}
	.articleTitle__date{
		width: min(calc(100 / var(--vw-min) * 100vw), 100px);
		font-size: min(calc(20 / var(--vw-min) * 100vw), 20px);
		line-height: 1.2;
		padding: min(calc(10 / var(--vw-min) * 100vw), 10px) min(calc(16 / var(--min-ww) * 100vw), 16px);
	}

	.articleContentIn h1,
	.articleContentIn h2,
	.articleContentIn h3,
	.articleContentIn h4{
		font-size: var(--sp-size-26);
		margin-top: var(--sp-size-36);
	}
	.articleContentIn h5,
	.articleContentIn h6{
		margin-top: var(--sp-size-36);
	}
	.articleContentIn pre,
	.articleContentIn p{
		margin-top: var(--sp-size-36);
	}
}


.btn_linkWrap .btn_link{
	min-width: min(calc(200 / var(--vw-min) * 100vw), 200px);
}
@media screen and (max-width:768px){
	.btn_linkWrap .btn_link{
		min-width: min(calc(264 / var(--vw-min) * 100vw), 264px);
	}
}


/**
* scrAni - set
**/
.articleTitle{
	opacity:0;
	transition:.3s ease;
}
.articleContentIn{
	opacity:0;
	transform:scale(90%);
	transition:.6s ease;
	transform-origin:center top;
}
.articleContentIn__cont{
	opacity:0;
	transition:.4s ease;
}

.btn_linkWrap{
	opacity:0;
	transform:translateY(10%);
	transition:.4s ease;
}
/* scrAni - ani */
.content.is-ani .articleTitle{
	opacity:1;
	transition-delay:1s;
}

.content.is-ani .articleContentIn{
	transition-delay:1s;
	opacity:1;
	transform:scale(100%);
}
.content.is-ani .articleContentIn__cont{
	transition-delay:1.65s;
	opacity:1;
}
.content.is-ani .btn_linkWrap{
	opacity:1;
	transform:translateY(0%);
	transition-delay:1.3s;
}
