/*-----
* archive-layout.css ver1.0.0
* For archive page(アーカイブページ用)
-----*/
/***** breadcrumb-box *****/
.breadcrumb-box{
	width: 100%;
	position: relative;
}
.breadcrumb-box>.inner{
	width: 100%;
	max-width: 1200px;
	margin: auto;
	padding: 0.5rem 2%;
}
.breadcrumb-box .list-box{
	
}
.breadcrumb-box .list-box>ul{
	display: flex;
	flex-direction: row;
}
.breadcrumb-box .list-box>ul>li{
	font-size: 0.9rem;
}
.breadcrumb-box .list-box>ul>li:not(:last-child){
	white-space: nowrap;
}
.breadcrumb-box .list-box>ul>li>a:hover{
	text-decoration: underline;
	-webkit-text-decoration: underline #000;
}
.breadcrumb-box .list-box>ul>li>a>span{
	
}
@media screen and (max-width:768px){
	.breadcrumb-box .list-box>ul>li{
		font-size: 13px;
	}
}
/***** sort-box *****/
.sort-box{
	margin-bottom: 1rem;
}
.sort-box>.wrap{
	width: 100%;
	max-width: 1200px;
	margin: auto;
	display: flex;
	justify-content: flex-end;
	padding: 0 6%;
}
.sort-box>.wrap>select{
	font-size: 12px;
}
.sort-box>.wrap>select>option{
	
}
@media screen and (max-width:768px){
	
}
/***** archive-box *****/
.archive-box{
	
}
.archive-box>.inner{
	padding: 0rem 2% 2rem;
}
.archive-box .list-box{
	background-color: var(--bg-color);
	min-height: 50vh;
	width: 90%;
    margin: auto;
    border-radius: 12px;
	padding: 24px 32px;
}
.archive-box .list-box>.post-list{
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
}
.archive-box .list-box>.post-list>li{
	border-bottom: 1px solid var(--border-color);
	padding: 12px 0;
}
.archive-box .list-box>.post-list>li>div{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
}
.archive-box .list-box>.post-list>li>div>.t1{
	flex: 1;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
}
.archive-box .list-box>.post-list>li>div>.t1>.t1-1{
	font-size: 15px;
	font-weight: 400;
	margin-right: 12px;
}
.archive-box .list-box>.post-list>li>div>.t1>.t1-2{
	font-size: 14px;
	background-color: var(--bg-color);
	color: var(--key-color-4);
	line-height: 1;
	border: 2px solid var(--key-color-4);
	border-radius: 9px;
	padding: 4px 12px;
}
.archive-box .list-box>.post-list>li>div>.t1>.t1-2.co1{
	background-color: var(--key-color-4);
	color: #fff;
}
.archive-box .list-box>.post-list>li>div>.t2{
	flex: 3;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
}
.archive-box .list-box>.post-list>li>div>.t2>.text{
	flex: 8;
	padding-right: 32px;
}
.archive-box .list-box>.post-list>li>div>.t2>.text>a{
	font-size: 16px;
	line-height: 1.6;
	transition: opacity 200ms 0s ease;
}
.archive-box .list-box>.post-list>li>div>.t2>.text>a:hover{
	opacity: 0.5;
}
.archive-box .list-box>.post-list>li>div>.t2>.image{
	flex: 2;
	border-radius: 6px;
	overflow: hidden;
}
.archive-box .list-box>.post-list>li>div>.t2>.image>img{
	display: block;
	height: 50px;
}
@media screen and (max-width:768px){
	.basic-box.archive-box>.inner{
		padding: 0rem 2% 2rem;
	}
	.archive-box .list-box{
		width: 100%;
	}
	.archive-box .list-box>.post-list>li>div{
		flex-direction: column;
		gap: 9px;
	}
	.archive-box .list-box>.post-list>li>div>.t1>.t1-1{
		font-size: 13px;
	}
	.archive-box .list-box>.post-list>li>div>.t1>.t1-2{
		font-size: 12px;
	}
	.archive-box .list-box>.post-list>li>div>.t2>.text{
		flex: 7;
		padding-right: 16px;
	}
	.archive-box .list-box>.post-list>li>div>.t2>.text>a{
		font-size: 15px;
	}
	.archive-box .list-box>.post-list>li>div>.t2>.image{
		flex: 4;
	}
	.archive-box .list-box>.post-list>li>div>.t2>.image>img{
		object-fit: cover;
	}
}
/***** archive pagination *****/
.archive-prev-next{
	padding-top: 2rem;
}
.archive-prev-next .nav-links{
	display: flex;
	justify-content: center;
}
.archive-prev-next .nav-links>span,
.archive-prev-next .nav-links>a{
	line-height: 1em;
	padding: 0.3em 0.3em 0.2em;
	margin: 0 0.3em;
}
.archive-prev-next .nav-links>span{
	text-decoration: underline;
	-webkit-text-decoration: underline #000;
}
.archive-prev-next .nav-links>a:hover{
	text-decoration: underline;
	-webkit-text-decoration: underline #000;
}
@media screen and (max-width:768px){
	
	
}
/***** single-box *****/
.single-box{
	
}
.single-box>.inner{
	padding: 2rem 5% 3rem;
}
.single-box>.inner>.text-box{
	min-height: 50vh;
}
.single-box>.inner>.text-box>.dafault-single{
	
}
.single-box>.inner>.text-box>.dafault-single>.block1{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	gap: 12px;
	margin-bottom: 6px;
}
.single-box>.inner>.text-box>.dafault-single>.block1>.cat{
	font-size: 12px;
	background-color: var(--bg-color);
	color: var(--key-color-4);
	line-height: 1;
	border: 1px solid var(--key-color-4);
	border-radius: 4px;
	padding: 4px 12px;
}
.single-box>.inner>.text-box>.dafault-single>.block1>.date{
	font-size: 15px;
	font-weight: 300;
}
.single-box>.inner>.text-box>.dafault-single>.block2{
	margin-bottom: 24px;
}
.single-box>.inner>.text-box>.dafault-single>.block2>.title{
	font-size: 24px;
	font-weight: 600;
}
.single-box>.inner>.text-box>.dafault-single>.content{
	font-size: 15px;
	line-height: 2;
}
.single-box>.inner>.text-box>.dafault-single>.content h2{
	line-height: 1.4;
	margin-bottom: 16px;
}
.single-box>.inner>.text-box>.dafault-single>.content img{
	margin: 16px 0;
}
@media screen and (max-width:768px){
	.single-box>.inner{
		padding: 2rem 3% 3rem;
	}
	.single-box>.inner>.text-box{
		min-height: 30vh;
	}
	.single-box>.inner>.text-box>.dafault-single>.block2>.title{
		font-size: 21px;
	}
	.single-box>.inner>.text-box>.dafault-single>.content h2{
		font-size: 1.3em;
	}
}
/***** single pagination *****/
.single-prev-next{
	width: 50%;
	margin: auto;
	padding-top: 2rem;
}
.single-prev-next>div{
	width: 100%;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}
.single-prev-next>div>div{
	width: 50%;
}
.single-prev-next>div>.next{
	display: flex;
	justify-content: flex-end;
}
.single-prev-next>div>div>a{
	font-size: 15px;
	font-weight: 300;
}
.single-prev-next>div>div>a:hover{
	text-decoration: underline;
	-webkit-text-decoration: underline #000;
}
@media screen and (max-width:768px){
	.single-prev-next{
		width: 100%;
	}
}
