@charset "UTF-8";

#container.backnumber.detail #main{
	width:100%;
}

ul.backnumber {
	padding: 50px 0% 50px;
	background: #F5F4E0;
	margin: 0 0%;
}
ul#List{
	margin: 0 -100%;
	padding: 50px 100% 80px;
	justify-content: center;
}
.label_area{
	width: auto;
	margin: 0 -100% 0px;
	background: #80B95B;
	padding:20px 0 20px;
}
	main > .label_area{
		margin-bottom:0px;
	}
	.detail main > .label_area{
		margin-bottom:65px;
	}
.label_area a{
	margin-right: 10px;
	font-size: 15px;
	width: 120px;
	padding: 5px 5px 5px;
	color: #645000;
	font-family:"丸フォーク M";
	border: 2px solid #80B95B;
}
	.label_area a:last-child{
		margin:0;
		white-space: nowrap;
	}
.label_area .all{background:#F5F4E0;}
.label_area .new, span.new{background:#aaf0ff;}
.label_area .activity, span.activity{background:#c4f000;}
.label_area .blooming, span.blooming{background:#ffed3c;}
.label_area .plate, span.plate{background:#ffafaf;}
.label_area .plate{
	font-size: 12px;
}
ul.backnumber li a {
    position: relative;
	margin: 0 0 0px 0;
	padding: 15px 20px;
	transition:.3s;
	display:block;
}
	.label_area a:hover{
		opacity:1;
		background:#80B95C;
		border-color:#F4F4E0;
		color:#fff;
	}
	.label_area a.new:hover{
		border-color:#aaf0ff;
	}
	.label_area a.activity:hover{
		border-color:#c4f000;
	}
	.label_area a.blooming:hover{
		border-color:#ffed3c;
	}
	.label_area a.plate:hover{
		border-color:#FF9BAE;
	}

.new_info_ttl{
	display: inline-block;
	margin-right: 0px;
	width:70%;
	vertical-align: middle;
	color:#000;
}

.Contents_Block{
	width:750px;
}

ul#List .label span{
	color:#645000;
	width:80px;
	padding:2px 0 0px;
	margin-right:10px;
}
	.win ul#List .label span{
		padding:0px 0 1px;
	}

ul.backnumber .text {
    margin: 10px 10px 0;
}

ul.backnumber a {
    position: relative
    margin: 0px 10px 0;
	display: inline-block;
}

.detail h2{
	margin-bottom:0;
}
h3.ttl_sub{
	margin-bottom:10px;
}
h2 .label_area{
	background: none;
	width: auto;
	padding: 0;
	margin: 0;
}
h2 .label_area span{
	min-width: 80px;
	color: #645000;
}
.detail time.new_info_date{
	font-size:16px;
	margin-bottom:15px;
	display: block;
}

.no_item{
	display: flex;
	justify-content: center;
	align-items: center;
}

.Contents_Block{
	margin-bottom:25px;
}
.button_area{
	display:flex;
}

.backnumber #main .Contents_Block h2{
	font-family: inherit;
	border: none;
	margin-bottom: 20px;
	font-size: 22px;
}

.detail .button_area{
	margin-top:60px;
	justify-content: center;
}
.button_area a{
	margin:0;
}
	.button_area a:first-child{
		margin-right:30px;
	}
	.button_area a:nth-child(2):after{
		content: "<";
		float: right;
		display: inline-block;
		position: relative;
		top: -3px;
		right: 10px;	
		transform: scale(-1,1);
	}
	.win .button_area a:nth-child(2):after{
		top:-1px;
	}


/* 896px以下 */
@media screen and (max-width: 896px) {
	
	.detail #box,
	#container.backnumber.detail #main,
	.Contents_Block{
		width:auto;
	}
	ul.backnumber li a{
		display:flex;
	}
	.new_info_ttl{
		width:100%;
		margin-right:10px;
	}
	
	main > .label_area{
		flex-wrap: wrap;
		margin:0 -20px 0;
		width: 100vw;
	}
	.label_area a{
		min-width: 16vw;
		font-size: 100%;
		max-width: 120px;
		width: auto;
	}
	h2 .label_area span{
		min-width:80px;
		width:auto;
	}
	
}
@media screen and (max-width: 480px) {
	
	.label_area{
		width:auto;
	}
	.label{
		background-position:center;
	}
	.label_area{
		width:300px;
		flex-wrap:wrap;
	}
	.backnumber .label_area a{
		margin-bottom:15px;
		width:30%;
		margin-right:10px;
		padding:5px;
	}
		.label_area a:nth-child(2n){
			margin-right:10px;
		}
		.label_area a:nth-child(3n){
			margin-right:0;
		}
		.label_area a:nth-child(4), .label_area a:nth-child(5){
			margin-bottom:0;
		}
	
	.button_area{
		margin-top:60px;
	}	
	
}