@charset "utf-8";
/* .mod_footer{
	background: #fff;
} */
#eat{
	@media (width <= 767px) {/* SP */
		padding-top: 3.2rem;
	}
	.pageCnt{
		margin: 20rem auto 0;

		@media (width > 767px) {/* PC */
			width: 120rem;
			padding-bottom: 16rem;
		}
		@media (width <= 767px) {/* SP */
			width: 33rem;
			margin-top: 8rem;
			padding-bottom: 8rem;
		}

		.pageHead{
			.ttlBlock{
				.ttl{
					letter-spacing: .12em;
					font-weight: 400;
					font-family: var(--ff-zen);
					text-align: center;
					line-height: 1.7;
					font-size: 3.2rem;
					@media (width <= 767px) {/* SP */
						font-size: 2.4rem;
					}
				}
				.enTxt{
					letter-spacing: .12em;
					text-align: center;
					line-height: 1;
					color: var(--cc-red);
					font-size: 1.4rem;
					margin-top: 1rem;
					@media (width <= 767px) {/* SP */
						font-size: 1.6rem;
					}
				}
			}
			.searchBlock{
				margin-top: 9.6rem;
				display: flex;
				gap: 2.4rem;
				@media (width > 767px) {/* PC */
					justify-content: center;
				}
				@media (width <= 767px) {/* SP */
					flex-direction: column;
					margin-top: 6.5rem;
					gap: 1.5rem;
				}
				.item{
					.select{
						border: 1px solid var(--cc-black-A);
						width: 36.6rem;
						height: 5.6rem;
						padding-left: 1.7rem;
						letter-spacing: .05em;
						font-size: 1.4rem;
						background: url(../images/common/ico-pulldown.svg) center right 1.6rem /1.2rem .6rem no-repeat;
						@media (width <= 767px) {/* SP */
							width: 100%;
						}
					}
				}
				.btn{
					display: flex;
					justify-content: center;
					align-items: center;
					color: var(--cc-white-A);
					background: var(--cc-red);
					line-height: 1;
					font-size: 1.5rem;

					width: 17.4rem;
					height: 5.6rem;
					@media (width > 767px) {/* PC */
						margin-left: .6rem;
					}
					@media (width <= 767px) {/* SP */
						width: 100%;
					}
				}
			}
		}
		.list{
			padding-top: 12rem;
			display: grid;
			grid-template-columns: repeat(3,1fr);
			gap: 6.4rem 12rem;
			@media (width <= 767px) {/* SP */
				grid-template-columns: repeat(1,1fr);
				gap: 5.6rem;
				padding-top: 5.6rem;
			}
			.th{
				.th__img{
					margin-bottom: 3.3rem;
					@media (width <= 767px) {/* SP */
						margin-bottom: 2.3rem;
					}
					img{
						width: 100%;
					}

				}
				.th__ttl{
					font-family: var(--ff-zen);
					font-weight: 600;
					letter-spacing: .1em;
					line-height: 1.6;
					font-size: 1.8rem;

				}
				.th__txt{
					text-align: justify;
					color: var(--cc-gray-text);
					letter-spacing: .1em;
					line-height: 1.8;
					font-size: 1.4rem;
					margin-top: 1.8rem;
					@media (width <= 767px) {/* SP */
						letter-spacing: .2em;
						line-height: 1.7;
					}
				}
			}
		}
		.pager{
			display: flex;
			justify-content: center;
			align-items: center;
			line-height: 1;
			margin-top: 16rem;
			gap: 3.9rem;
			@media (width <= 767px) {/* SP */
				gap: 2.4rem;
				margin-top: 8rem;
			}
			.prev,.next{
				width: 1rem;
				@media (width <= 767px) {/* SP */
					width: .7rem;
				}
				a{
					&:before{
						display: block;
						content: "";
						background: url(../images/common/ico-btn-arw-blk.svg) center center /cover no-repeat;
						width: 1rem;
						height: 1rem;
						@media (width <= 767px) {/* SP */
							width: .7rem;
							height: .9rem;
						}
					}
				}
			}
			.prev a:before{
				transform: rotate(180deg);
			}
			ul{
				display: flex;
				justify-content: center;
				gap: 3.3rem;
				font-size: 1.8rem;
				@media (width <= 767px) {/* SP */
					gap:1.8rem;
					font-size: 1.6rem;
				}
				.-cr{
					color: var(--cc-red);
					text-decoration: underline;
					text-decoration-color: var(--cc-red);
					text-underline-offset: 1rem;
					@media (width <= 767px) {/* SP */
						text-underline-offset: .2rem;
					}
				}
			}
		}
	}

	.noresult{
		text-align: center;
		font-family: var(--ff-zen);
		letter-spacing: .1em;
		line-height: 1.5;
		font-size: 2.2rem;
		margin-top: 16rem;
		@media (width <= 767px) {/* SP */
			margin-top: 8rem;
		}
	}

	.tagSec{
		background: var(--cc-back-gray);
		padding: 16rem 0;
		@media (width <= 767px) {/* SP */
			padding: 8rem 0;
		}
		.in{
			display: flex;
			flex-direction: column;
			margin: 0 auto;
			gap: 6.4rem;
			width: 120rem;
			@media (width <= 767px) {/* SP */
				width: 33rem;
			}
		}
		.secHead{
			margin-bottom: 8rem;
			@media (width <= 767px) {/* SP */
				margin-bottom: 7rem;
			}
			.ttl{
				letter-spacing: .12em;
				font-weight: 400;
				font-family: var(--ff-zen);
				text-align: center;
				line-height: 1.7;
				font-size: 3.2rem;
				@media (width <= 767px) {/* SP */
					font-size: 2.4rem;
				}
			}
			.enTxt{
				letter-spacing: .12em;
				text-align: center;
				line-height: 1;
				color: var(--cc-red);
				font-size: 1.4rem;
				margin-top: 1rem;
				@media (width <= 767px) {/* SP */
					font-size: 1.6rem;
				}
			}
		}
		.listBlock{
			.listTtl{
				color: var(--cc-red);
				border-bottom: solid 1px var(--cc-sen-gray);
				font-weight: 500;
				line-height: 1;
				padding-bottom: 1.6rem;
				font-size: 1.8rem;
				margin-bottom: 3.2rem;
				letter-spacing: .12em;
				@media (width <= 767px) {/* SP */
					padding-bottom: 2.4rem;
					margin-bottom: 3.1rem;
				}
			}
			.list{
				display:grid;
				grid-template-columns: repeat(5, 1fr);
				gap:3.2rem 4rem;
				@media (width <= 767px) {/* SP */
					gap:1.2rem;
					grid-template-columns: repeat(2, 1fr);
				}
				a{
					text-align: center;
					display: block;
					line-height: 1;
					border: solid 1px var(--cc-black-A);
					letter-spacing: .12em;
					padding: 1.5rem 0;
					font-size: 1.5rem;
					@media (width <= 767px) {/* SP */
						&.-spSml{
							letter-spacing: 0;
							padding-bottom: 1.6rem;
							font-size: 1.4rem;
						}
					}
				}
			}
		}
	}
}