@charset "UTF-8";
/*
店舗一覧ページ
*/

.shop-list-area {
	padding: 20px 0 20px;
}

.archive .shop-list-area h1 {
	margin: 0 0 15px;
	padding: 5px 0;
	background-color: #AD4246;
	color: #FFFFFF;
	font-size: 26px;
	font-weight: normal;
}

.term-food .shop-list-area h1 {
	background-color: #D2742C;
}

.term-shopping .shop-list-area h1 {
	background-color: #778239;
}

.term-fashion .shop-list-area h1 {
	background-color: #CD7668;
}

.term-medical .shop-list-area h1 {
	background-color: #3B949E;
}

.term-other .shop-list-area h1 {
	background-color: #7A6F8C;
}

.shop-list {
	display: flex;
	flex-wrap: wrap;
}

.shop-list-item {
	width: 360px;
	margin: 0 15px 30px 0;
	background-color: #e2b5b7;
	box-shadow: 0 1px 5px #AAA;
	color: #58504D;
}

.term-food .shop-list-item {
	background-color: #F8DDB4;
}

.term-shopping .shop-list-item {
	background-color: #EBF0B2;
}

.term-fashion .shop-list-item {
	background-color: #F8DED3;
}

.term-medical .shop-list-item {
	background-color: #C9E7E1;
}

.term-other .shop-list-item {
	background-color: #E2DDDF;
}

.shop-list-item:hover {
	text-decoration: none;
	transform: scale(1.02);
	box-shadow: 0 1px 10px #AAA;
}

.shop-list-item:active {
	transform: scale(0.98);
	box-shadow: none;
}

.shop-image img {
	width: 100%;
	height: 250px;
	object-fit: cover;
}

.shop-text {
	padding: 10px;
}

.shop-category {
	font-size: 17px;
}

.term-food .shop-category {
	color: #D07637;
}

.term-shopping .shop-category {
	color: #76863C;
}

.term-fashion .shop-category {
	color: #CB736C;
}

.term-medical .shop-category {
	color: #42959D;
}

.term-other .shop-category {
	color: #7A6C8B;
}

.shop-name {
	font-size: 24px;
}

.shop-pr {
	margin-top: 8px;
	font-size: 16px;
}

.not-found {
	margin: 50px 0;
	color: #58504D;
	font-size: 24px;
	text-align: center;
}

/* タブレット版 */
@media (min-width:768px) and (max-width:1049px) {
	.shop-list-item {
		margin: 0 6px 20px;
	}
}

/* スマホ版 */
@media (max-width:767px) {
	.archive .shop-list-area h1 {
		font-size: 22px;
		font-weight: bold;
	}

	.shop-list-item {
		width: calc(100% - 10px);
		margin: 0 auto 20px;
	}

	.shop-image img {
		height: 180px;
	}

	.shop-text {
		padding: 5px 10px;
	}

	.shop-category {
		font-size: 14px;
	}

	.shop-name {
		font-size: 20px;
		font-weight: bold;
	}

	.shop-pr {
		margin-top: 4px;
		font-size: 14px;
	}

	.not-found {
		font-size: 18px;
	}
}