@charset "utf-8";
/**
 * @author https://www.cosmosfarm.com
 */

/* list */
#kboard-default-list .product-list ul{
	padding: 0;
	list-style: none;
	display: grid; gap: 1px;
	grid-template-columns: repeat(4, 1fr);
	 grid-auto-rows: auto; 
}
#kboard-default-list .product-list ul li.prd-pin{
	grid-column: span 2;
  	grid-row: span 2; 
}
#kboard-default-list .product-list ul li.prd-pin p{
	color:#fff !important;
}
#kboard-default-list .product-list ul li{
	background: #fff;
	position: relative;
	box-sizing: border-box;
	outline: 1px solid var(--gray-col);
}
#kboard-default-list .product-list ul li a{
	display: block; position: relative;
	width: 100%; height: 100%;
}
#kboard-default-list .product-list ul li a .prd-list-img{
	height: 100%; position: relative;
}
#kboard-default-list .product-list ul li.prd-pin .prd-list-img::before{
	content:""; display: block; width: 100%; height: 200px;
	background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%, rgba(0,0,0,.2) 100%);
	position: absolute; left: 0; bottom: 0;
}
#kboard-default-list .product-list ul li a img{
	width: 100%; height: 100%; object-fit: cover;
}
#kboard-default-list .product-list ul li a .prd-list-bottom{
	position: absolute; left: 0; bottom: 0;
	width:100%; 
	padding:0 11% 10%;
}
#kboard-default-list .product-list ul li.prd-pin a .prd-list-bottom{
	padding: 0 40px 40px;
}
#kboard-default-list .product-list ul li a .prd-list-bottom .prd-category{
	font-size: clamp(12px, 1.6vw, 16px); color: #888;
	padding-bottom: 8px;
}
#kboard-default-list .product-list ul li a .prd-list-bottom .prd-title{
	font-size: clamp(14px, 1.5vw, 18px);
}

/* control */
#kboard-default-list .product-list ul li .list-control{
	position: absolute; right: 5px; top: 5px;
	display: flex; justify-content: center; gap: 5px;
}

@media screen and (max-width:1280px){
	#kboard-default-list .product-list ul li a .prd-list-img{
		aspect-ratio: 70 / 100;
	}
	#kboard-default-list .product-list ul li a .prd-list-bottom{
		padding: 0 8% 8%;
	}
	#kboard-default-list .product-list ul li.prd-pin a .prd-list-bottom{
		padding: 0 4% 4%;
	}
}

@media screen and (max-width:1024px) {
	#kboard-default-list .product-list ul{
		grid-template-columns: repeat(3, 1fr);
	}
	#kboard-default-list .product-list ul li a .prd-list-bottom .prd-category{
		padding-bottom: 3px;
	}
}

@media screen and (max-width:768px){
	#kboard-default-list .product-list ul{
		grid-template-columns: repeat(2, 1fr);
	}
	#kboard-default-list .product-list ul li a .prd-list-bottom,
	#kboard-default-list .product-list ul li.prd-pin a .prd-list-bottom{
		padding: 0 7% 6%;
	}
	#kboard-default-list .product-list ul li.prd-pin{
		grid-row: span 1;
		grid-column: span 1;
	}
	#kboard-default-list .product-list ul li a .prd-list-img{
		aspect-ratio: auto;
	}
}

@media screen and (max-width: 600px) {
	#kboard-default-list .product-list ul li a .prd-list-img{
		aspect-ratio: 128 / 226;
	}
	#kboard-default-list .product-list ul li a .prd-list-bottom .prd-category{
		padding-bottom: 0;
	}
	#kboard-default-list .product-list ul li a .prd-list-bottom, 
	#kboard-default-list .product-list ul li.prd-pin a .prd-list-bottom{
		padding: 0 10px 11px;
	}
}