@charset "utf-8";
/* CSS Document */

/*
==============================================================================*/
/* 変数 */
:root {

	--color-accentColor: var(--color-GRgreen, #009944);;


	--color-cat-bg: white;
	--color-cat-border: #e8eaeb;
	--color-cat-text: black;

	--color-cat-bg--active: white;
	--color-cat-border--active: var(--color-accentColor);
	--color-cat-text--active: var(--color-accentColor);

}


/*============================================================================*/


section.GeneralList.GeneralList_listPage {}




section.GeneralList.GeneralList_listPage .GeneralList_categoryList {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 0.7rem;
	margin-bottom: 1.8rem;
	font-size: 1.6rem;
}
section.GeneralList.GeneralList_listPage .GeneralList_categoryList > li > a {
	display: flex;
	justify-content: center;
	align-items: center;
	border: 1px solid var(--color-cat-border);
	border-radius: 2rem;
	transition-property: color, border;
	padding: 0.32rem 1.6rem;
	color: var(--color-cat-text);
	background-color: var(--color-cat-bg);
}
section.GeneralList.GeneralList_listPage .GeneralList_categoryList > li > a,
section.GeneralList.GeneralList_listPage .GeneralList_categoryList > li > a *,
section.GeneralList.GeneralList_listPage .GeneralList_categoryList > li > a::after {transition: .3s ease;}

section.GeneralList.GeneralList_listPage .GeneralList_categoryList > li.active > a {
	color: var(--color-cat-text--active);
	border-color: var(--color-cat-border--active);
	background-color: var(--color-cat-bg--active);
}








section.GeneralList_listPage {}
section.GeneralList_listPage > .GeneralList_list {}
section.GeneralList_listPage > .GeneralList_list li {
	position: relative;
}

section.GeneralList_listPage > .GeneralList_list li.is-new::before {
	position: absolute;
	content: '';
	display: block;
	width: 1rem;
	height: 1rem;
	background: var(--color-GRgreen, #009944);
	border-radius: 100%;
	top: 3.3rem;
	left: 1.4rem;
	z-index: 1;
}
@media only screen and (max-width: 767px) {
	section.GeneralList_listPage > .GeneralList_list li.is-new::before {
		top: 2.2rem;
		left: .9rem;
	}
}

section.GeneralList_listPage > .GeneralList_list li:nth-child(n+2) {
	margin-top: -1px;
}

section.GeneralList_listPage > .GeneralList_list li > * {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	font-size: 1.6rem;
	border-top: 1px solid #eaeaea;
	border-bottom: 1px solid #eaeaea;
	padding: 2.5rem 3.8rem 2.6rem;
}
section.GeneralList_listPage > .GeneralList_list a,
section.GeneralList_listPage > .GeneralList_list a *,
section.GeneralList_listPage > .GeneralList_list a::after {transition: .3s ease;}



@media only screen and (min-width: 768px) {
	section.GeneralList_listPage > .GeneralList_list a {
		transition-property: background, padding;
	}

	section.GeneralList_listPage > .GeneralList_list a:hover {
		background: #e8eaeb;
		padding-right: 6.4rem;
		opacity: 1;
	}

	section.GeneralList_listPage > .GeneralList_list a::before {
		pointer-events: none;
		position: absolute;
		content: '';
		display: block;
		width: 0;
		border-top: 1px solid #000;
		border-bottom: 1px solid #000;
		top: -1px;
		bottom: -1px;
		left: 0;
		transition: width .3s ease;
		z-index: 1;
	}

	section.GeneralList_listPage > .GeneralList_list a:hover::before {
		width: 100%;
	}

	section.GeneralList_listPage > .GeneralList_list a::after {
		position: absolute;
		content: '';
		display: block;
		width: .45rem;
		height: .8rem;
		background: url(/-/media/Project/globeride/globeride_cojp/common/img/arrow-right.svg) center center / 100% auto no-repeat;
		top: 3.4rem;
		right: 1.4rem;
		transition: .3s ease;
		transition-property: right, opacity;
		opacity: 0;
	}

	section.GeneralList_listPage > .GeneralList_list a:hover::after {
		right: 4rem;
		opacity: 1;
	}
}
@media only screen and (max-width: 767px) {
	section.GeneralList_listPage > .GeneralList_list li > * {
		display: block;
		font-size: 1.4rem;
		padding: 1.5rem 3rem 1.7rem;
	}
}

section.GeneralList_listPage > .GeneralList_list .title {
	font-weight: 400;
}

section.GeneralList_listPage > .GeneralList_list .date {
	display: inline-block;
	/* font-family: var(--ff-en); */
	font-size: 1.4rem;
	margin-top: .3rem;
}
@media only screen and (max-width: 767px) {
	section.GeneralList_listPage > .GeneralList_list .date {
		display: block;
		font-size: 1.2rem;
		text-align: right;
		margin-top: .8rem;
	}
}
section.GeneralList_listPage > .GeneralList_list a > .bgImage {display: none;}
section.GeneralList_listPage > .GeneralList_list a > .category {
	background: var(--color-cat-bg--active);
	color: var(--color-cat-text--active);
	border-radius: 1.5em;
	padding: .3em 1.5em;
	margin: 0 auto -1rem 1.5rem;
	border: 1px solid var(--color-cat-border--active);
	width: fit-content;
	font-size: 1.2rem;
}
section.GeneralList_listPage > .GeneralList_list a > .title {
}
section.GeneralList_listPage > .GeneralList_list a > .date {
	margin-left: 2rem;
}







/* ページネーション */
section.GeneralList.GeneralList_listPage > .pagination {
	display: flex;
	justify-content: center;
	align-items: center;
	grid-gap: 2rem;
	margin-top: 4rem;
	margin-bottom: 6rem;
	flex-wrap: wrap;
}
section.GeneralList.GeneralList_listPage > .pagination a,
section.GeneralList.GeneralList_listPage > .pagination span.prev,
section.GeneralList.GeneralList_listPage > .pagination span.next {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 6rem;
	height: 6rem;
	/* font-family: var(--ff-en); */
	font-size: 1.8rem;
	font-weight: bold;
	border: 1px solid var(--color-accentColor, black);
	border-radius: 100%;
	color: var(--color-accentColor, black);
}
section.GeneralList.GeneralList_listPage > .pagination .arrow.noArrow {opacity: 0;}
section.GeneralList.GeneralList_listPage > .pagination .arrow > a,
section.GeneralList.GeneralList_listPage > .pagination .arrow > span.prev,
section.GeneralList.GeneralList_listPage > .pagination .arrow > span.next {
	font-size: 2.7rem;
	border: none;
	font-weight: normal;
	padding-bottom: 0.2em;
}
section.GeneralList.GeneralList_listPage > .pagination > li.arrow {
	margin-right: -1em;
	margin-left: -1em;
}
section.GeneralList.GeneralList_listPage > .pagination .is-current a {
	color: #fff;
	border-color: var(--color-accentColor, black);
	background: var(--color-accentColor, black);
}


/*============================================================================*/
/* Unique ID/Class */

/*============================================================================*/




/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
@media screen and (max-width: 767px) {/* // Mobile // */
/*============================================================================*/


section.GeneralList.GeneralList_listPage {
	margin-top: 5rem;
	margin-left: auto;
	margin-right: auto;
}


section.GeneralList_listPage {}
section.GeneralList_listPage > .GeneralList_list {width: 33.5rem;}
section.GeneralList_listPage > .GeneralList_list a {
	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-rows: repeat(2, auto);
	grid-column-gap: 0;
	grid-row-gap: .8rem;
}
section.GeneralList_listPage > .GeneralList_list a > .category {
	grid-area: 2 / 1 / 3 / 2;
	margin: 0;
	font-size: 1rem;
	padding: 0.3em 1.5em;
}
section.GeneralList_listPage > .GeneralList_list a > .title {
	grid-area: 1 / 1 / 2 / 3;
}
section.GeneralList_listPage > .GeneralList_list a > .date {
	grid-area: 2 / 2 / 3 / 3;
	align-self: center;
	margin: 0 0 0 3rem;
}




section.GeneralList.GeneralList_listPage .GeneralList_categoryList {
	gap: 1rem;
	margin-bottom: 4rem;
	justify-content: flex-start;
	font-size: 1.4rem;
}
section.GeneralList.GeneralList_listPage .GeneralList_categoryList > li {
	width: calc( calc( 100% - 1rem * 1 ) / 2 );
}
section.GeneralList.GeneralList_listPage .GeneralList_categoryList > li > a {}


/*============================================================================*/
/* Unique ID/Class */

/*============================================================================*/
}




/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
@media screen and (min-width: 768px) {/* // PC // */
/*============================================================================*/


section.GeneralList.GeneralList_listPage {
	margin-top: 7rem;
	margin-left: auto;
	margin-right: auto;
}




section.GeneralList_listPage {}


section.GeneralList_listPage > .GeneralList_list a > .category {
	order: 20;
}
section.GeneralList_listPage > .GeneralList_list a > .title {
	order: 10;
}
section.GeneralList_listPage > .GeneralList_list a > .date {
	order: 30;
}




section.GeneralList.GeneralList_listPage .GeneralList_categoryList {font-size: 1.4rem;}



/*============================================================================*/
}




/* - - - - - - - - - - - - - - - - - - -
um9B0A6A34
/-/media/Project/globeride/General/common/css/general_list_textLay-v2-css.css
- - - - - - - - - - - - - - - - - - - */