/*--------------------------------------
ページャー
--------------------------------------*/
.pagenation {
	text-align: center;
}
.pagenation ul {
	margin: 0;
	padding-left: 0;
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
	flex-wrap: wrap;
}
.pagenation li {
    list-style: none;
	position: relative;
}
.pagenation li a {
    display: block;
    text-decoration: none;
	color: #000;
	transition: .3s;
	width: 100%;
	height: 100%;
	padding-right: 0.8rem;
	padding-left: 0.8rem;
}
.pagenation li a:hover {
	opacity: 0.6;
	color: #000;
}
/*ellipsis*/
.ellipsis{
	padding-right: 0.8rem;
	padding-left: 0.8rem;
}
/*prev next*/
.pagenation li.pagenation-prev a{
	padding-right: 3.2rem;
	padding-left: 0;
}
.pagenation li.pagenation-next a{
	padding-right: 0;
	padding-left: 3.2rem;
}
/*active*/
.pagenation li.active {
    cursor: not-allowed;
	margin-right: 0.8rem;
	margin-left: 0.8rem;
}
.pagenation li.active::after{
	content: " ";
	width: 0.8rem;
	height: 1px;
	background-color: rgba(0,0,0,0.60);
	position: absolute;
	bottom: 0;
	left: calc(50% - 0.4rem);
	display: block;
}
/*投稿ごとのpt*/
.pagination-wrap{
	padding-top: 3.2rem;
}
.archive-event-wrap+.pagination-wrap{
	padding-top: 0;
	padding-bottom: 3.2rem;
}
.common-archive-wrap+.pagination-wrap,.archive-voice-wrap+.container-small-small .pagination-wrap{
	padding-top: 0;
}
@media screen and (max-width: 1199px){
	.common-archive-wrap+.pagination-wrap,.archive-voice-wrap+.container-small-small .pagination-wrap{
		padding-bottom: 7rem;
	}
}
@media screen and (min-width: 1200px){
	.common-archive-wrap+.pagination-wrap,.archive-voice-wrap+.container-small-small .pagination-wrap{
		padding-bottom: 12.4rem;
	}
}

/*--------------------------------
PREV NEXT
---------------------------------*/
#prev_next{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
}
.prev-next-item{
	width: 50%;
}
.prev-next-item a{
	position:relative;
	text-decoration:none;
	align-items: center;
	color: #000;
}
.prev-next-item a:hover{
	color: #000;
}
.prev-next-item a .common-arrow{
	margin-right: auto;
	margin-left: auto;
}
/*btn*/
.pn-all-btn{
	width: 100%;
}
.pn-all-btn .common-normal-btn{
	margin-right: auto;
	margin-left: auto;
}
@media screen and (max-width: 575px){
	.pn-img{
		margin-bottom: 1.4rem;
	}
}
@media screen and (min-width: 576px){
	.prev-next-item a{
		display: flex;
	}
	.pn-img{
		width: 42.30769230769231%;
	}
	.pn-txt-wrap{
		width: 57.69230769230769%;
	}
	#prev .pn-img{
		order: 2;
	}
	#prev .pn-txt-wrap{
		order: 1;
	}
}
@media screen and (max-width: 991px){
	#prev_next{
		margin-right: -1.2rem;
		margin-left: -1.2rem;
	}
	.prev-next-item{
		padding-right: 1.2rem;
		padding-left: 1.2rem;
	}
	#prev{
		order: 2;
	}
	#next{
		order: 3;
	}
	/*btn*/
	.pn-all-btn{
		padding-right: 1.2rem;
		padding-left: 1.2rem;
		order: 1;
		width: 100%;
		margin-bottom: 5rem;
	}
}
@media screen and (min-width: 992px){
	.prev-next-item{
		max-width: 26rem;
	}
}
@media screen and (min-width:992px) and (max-width:1199px){
	/*btn*/
	.pn-all-btn{
		max-width: 32rem;
	}
}
@media screen and (max-width: 1199px){
	#prev_next{
		padding-top: 8rem;
		padding-bottom: 8rem;
	}
	.pn-ttl{
		font-size: 1.5rem;
		margin-bottom: 0.2rem;
	}
	.pn-txt-wrap .pc-fsize-14{
		margin-bottom: 1.6rem;
	}
	/*btn*/
	.pn-all-btn .common-normal-btn{
		max-width: 26rem;
	}
}
@media screen and (min-width: 1200px){
	#prev_next{
		padding-top: 6.8rem;
		padding-bottom: 6.8rem;
	}
	.pn-ttl{
		font-size: 1.8rem;
		margin-bottom: 0;
		line-height: 1.6;
	}
	.pn-txt-wrap .pc-fsize-14{
		margin-bottom: 2rem;
	}
	/*btn*/
	.pn-all-btn{
		max-width: 48rem;
	}
	.pn-all-btn .common-normal-btn{
		max-width: 30rem;
	}
}

/*お知らせなどのsingleページネーション*/
.common-single-prev-next-wrap .prev-next-item{
	max-width: initial;
}
.common-single-prev-next-wrap .pn-txt-wrap{
	width: 100%;
		display: flex;
		align-items: center;
}
.common-single-prev-next-wrap .pn-ttl{
	flex: 1;
}
	.common-single-prev-next-wrap .pn-txt-wrap .common-arrow{
		margin-right: 0;
		margin-left: 0;
	}
.common-single-prev-next-wrap #next .pn-txt-wrap .pn-ttl{
	padding-right: 8%;
	text-align: right;
}
.common-single-prev-next-wrap #prev .pn-txt-wrap .pn-ttl{
	order: 2;
	padding-left: 8%;
}
.common-single-prev-next-wrap #prev .pn-txt-wrap .common-arrow{
	order: 1;
}
@media screen and (max-width: 575px){
	.common-single-prev-next-wrap .prev-next-item{
		width: 100%;
	}
	.common-single-prev-next-wrap .pn-ttl{
		margin-bottom: 0;
	}
	.common-single-prev-next-wrap #next{
		margin-top: 2.4rem;
	}
}
@media screen and (min-width:992px) and (max-width:1199px){
	.common-single-prev-next-wrap .prev-next-item{
		width: calc((100% - 32rem) / 2);
	}
}
@media screen and (max-width: 1199px){
	.common-single-prev-next-wrap .pn-ttl{
		font-size: 1.3rem;
	}
}
@media screen and (min-width: 1200px){
	.common-single-prev-next-wrap .prev-next-item{
		width: calc((100% - 48rem) / 2);
	}
	.common-single-prev-next-wrap .pn-ttl{
		font-size: 1.5rem;
	}
}

/* Margin and Paddings 
----------------------------------------------------------------------------------------------------*/
.m10 {
	margin: 10px;
}
.m20 {
	margin: 20px;
}
.m40 {
	margin: 40px;
}
.m10-top {
	margin-top: 10px;
}
.m20-top {
	margin-top: 20px;
}
.m30-top {
	padding-top: 30px;
}
.m40-top {
	margin-top: 40px;
}
.m60-top {
	margin-top: 60px;
}
.m80-top {
	margin-top: 80px;
}
.m10-right {
	margin-right: 10px;
}
.m20-right {
	margin-right: 20px;
}
.m40-right {
	margin-right: 40px;
}
.m10-bottom {
	margin-bottom: 10px;
}
.m20-bottom {
	margin-bottom: 20px;
}
.m30-bottom {
	margin-bottom: 30px;
}
.m40-bottom {
	margin-bottom: 40px;
}
.m60-bottom {
	margin-bottom: 60px;
}
.m80-bottom {
	margin-bottom: 80px;
}
.m10-left {
	margin-left: 10px;
}
.m20-left {
	margin-left: 20px;
}

.m40-left {
	margin-left: 40px;
}
.p10 {
	padding: 10px;
}
.p20 {
	padding: 20px;
}
.p40 {
	padding: 40px;
}
.p10-top {
	padding-top: 10px;
}
.p20-top {
	padding-top: 20px;
}

.p40-top {
	padding-top: 40px;
}
.p10-right {
	padding-right: 10px;
}
.p20-right {
	padding-right: 20px;
}
.p40-right {
	padding-right: 40px;
}
.p10-bottom {
	padding-bottom: 10px;
}
.p20-bottom {
	padding-bottom: 20px;
}
.p40-bottom {
	padding-bottom: 40px;
}
.p60-bottom {
	padding-bottom: 60px;
}
.p10-left {
	padding-left: 10px;
}
.p20-left {
	padding-left: 20px;
}
.p40-left {
	padding-left: 40px;
}