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


/*新着・おすすめ*/
a{
	text-decoration: none;
	color:#161616;
}
.section-new{
	margin-top:30px;
}
.section-new h2{
	background-color:#fd9c2a;
	color:#fff;
	padding:10px 0;
	font-size:1.6rem;
}
.section-new__img{
	position:relative;
}
.section-new__title{ 
	position:absolute;
	top:4%;
	left:2%;
	text-align:left;
	background-color:rgba(255,255,255,0.84);
	padding:8px;
	font-size:1.4rem;
	color:#161616;
	text-align: center;
	font-weight:700;
}

@media(min-width:650px){
	.section-new h2{
		padding:8px 0;
		font-size:2.4rem;
	}
	.section-new__title{ 
		top:4%;
		left:5%;
		padding:20px 30px;
		font-size:clamp(20px, 3vw, 30px);
	}
}

/*カテゴリー*/

/*準備中
.item-img{
	background-color:rgb(112, 112, 112);
    display:inline-block;
	position:relative;
}
.item-img img{
	opacity: 0.5;
    display:block;
}
.item-img:after{
	content:"準備中";
    position:absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	font-size: 3.0rem;
	font-weight:700;
    color:rgb(255, 255, 255);
}
*/

.section-category{
	padding:100px 30px;
	background-image : linear-gradient(to right, #000, #000 2px, transparent 5px, transparent 8px);  /* 幅2の線を作る */
	background-size: 8px 1px;          /* グラデーションの幅・高さを指定 */
	background-position: left bottom;  /* 背景の開始位置を指定 */
	background-repeat: repeat-x;       /* 横向きにのみ繰り返す */
}
.section-category li{
	list-style: none;
}
.category-list{
	display:flex;
	flex-direction: column;
	margin-top:-80px;
}
.category-list__item{
	margin-top:80px;
}
.category-list__item img{
	max-width:420px;
}
.category-list__item h2{
	font-size: clamp(15px, 5vw, 20px);
	margin-top:20px;
}
@media(min-width:800px){
	.section-category{
		padding:0px 20px 80px;
	}
	.category-list{
		flex-direction:row;
		justify-content: space-between;
		flex-wrap: wrap;
		max-width:1300px;
		margin:0 auto;
	}
	.category-list:after {
		content: "";
		width:calc( (100% - 40px)/ 3 );
		display: block;
	}
	.category-list__item{
		width:calc( (100% - 40px)/ 3 );
	}
	.category-list__item img{
		max-width:380px;
	}
	.category-list__item h2{
		font-size:clamp(16px, 2vw, 24px);
		margin-top:20px;
	}
}