@charset "UTF-8";
/* ********************************************************************** */
/* For Neighborhood Page */
/* ********************************************************************** */

/* ---------------------------------------------------------------------- */
/* PC */
/* ---------------------------------------------------------------------- */

/* neighborhood_items */
.neighborhood_items{
	display: flex;
	flex-wrap: wrap;
}
.neighborhood_items .item{
	width: 30.90909%;
	display: flex;
	flex-direction: column;
	margin: 100px 3.63636% 0 0;
	padding-bottom: 1.625rem;
	border-bottom: #777777 1px solid;
}
.neighborhood_items .item:nth-child(-n+3){
	margin-top: 0;
}
.neighborhood_items .item:nth-child(3n){
	margin-right: 0;
}
.neighborhood_items .photo{
	height: 240px;
}
.neighborhood_items .ch4,
.neighborhood_items .address,
.neighborhood_items .text,
.neighborhood_items .link_detail{
	margin-top: 1.625rem;
}
.neighborhood_items .address{
	flex: 1;
}
.neighborhood_items .link_detail{
	justify-content: flex-end;
}

#neighborhood_sightseeing .link_detail .mark::before,
#neighborhood_sightseeing .link_detail .mark::after,
#neighborhood_ramen .link_detail .mark::before,
#neighborhood_ramen .link_detail .mark::after {
	border-bottom: 1px solid #2D281D;
}
#neighborhood_sightseeing .link_detail:hover .mark::before,
#neighborhood_sightseeing .link_detail:hover .mark::after,
#neighborhood_ramen .link_detail:hover .mark::before,
#neighborhood_ramen .link_detail:hover .mark::after {
	border-color: #C4972F;
}

/* ramen */
.ramen_about{
	justify-content: space-between;
	align-items: center;
}
.ramen_about .photo{
	width: 50%;
}
.ramen_about .content{
	/* width: 45.454545%; */
	width: 100%;
}
.ramen_about .text{
	/* line-height: 1.375; */
	line-height: 1.75;
}
.ramen_about .link_detail{
	justify-content: flex-end;
	margin-top: 1.5em;
}

/* ramen_items */
.ramen_items{
	flex-wrap: wrap;
	margin-top: 20px;
}
.ramen_items .item{
	width: 29.63636%;
	margin: 55px 5.454545% 0 0;
}
.ramen_items .item:nth-child(3n){
	margin-right: 0;
}
.ramen_items .ch4{
	display: flex;
	align-items: center;
	letter-spacing: 0.1em;
}
.ramen_items .ch4::after{
	content: "";
	flex: 1;
	height: 1px;
	background: #fff;
	margin-left: 1.5rem;
}
.ramen_items dl{
	margin-top: 22px;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
}
.ramen_items dt{
	margin: 10px 20px 0 0;
	width: 72px;
	border: 1px solid #fff;
	padding: 0.1em;
	font-size: 14px;
	text-align: center;
}
.ramen_items dd{
	margin-top: 10px;
	width: calc(100% - 92px);
}

#neighborhood_leisure {
	border-bottom: 1px solid #777777;
}


/* End PC */
/* ---------------------------------------------------------------------- */

/* ---------------------------------------------------------------------- */
/* SP */
/* ---------------------------------------------------------------------- */
@media (max-width: 1000px) {

	/* neighborhood_items */
	.neighborhood_items .item{
		width: 100%;
		display: flex;
		flex-direction: column;
		margin: 10vw 0 0 0;
		padding-bottom: 1.625rem;
		border-bottom: #777777 1px solid;
	}
	.neighborhood_items .item:nth-child(-n+3){
		margin-top: 10vw;
	}
	.neighborhood_items .item:nth-child(1){
		margin-top: 0;
	}
	.neighborhood_items .photo{
		position: relative;
		width: 80vw;
		/* height: 40vw; */
		height: 55vw;
		left: -6.6667vw;
	}
	.neighborhood_items .item:nth-child(2n) .photo{
		text-align: right;
		left: auto;
		right: -16.6667vw;
	}

	/* ramen */
	.ramen_about{
		justify-content: space-between;
		align-items: center;
	}
	.ramen_about .photo{
		width: 100%;
	}
	.ramen_about .content{
		width: 100%;
	}
	.ramen_about .text{
		margin-top: 1.5rem;
	}

	/* ramen_items */
	.ramen_items{
		flex-wrap: wrap;
		margin-top: 10vw;
	}
	.ramen_items .item{
		width: 100%;
		margin: 10vw 0 0 0;
	}
	.ramen_items .ch4::after{
		margin-left: 1rem;
	}
	.ramen_items dl{
		margin-top: 0.5rem;
	}
	.ramen_items dt{
		margin: 0.5rem 0.8rem 0 0;
		width: 5rem;
		padding: 0.1rem;
		font-size: 0.84615rem;
	}
	.ramen_items dd{
		margin-top: 0.5rem;
		width: calc(100% - 5.8rem);
	}

}
/* End @media (max-width:1000px) */
