@charset "utf-8";
/* CSS Document */
/* ===============================
	site utility
 =============================== */
/* body *{font-family: 'Noto Sans JP', serif;}
body {margin: 0;}
a {transition: 0.4s;}
a:hover {transition: 0.4s; opacity: 0.7;} */

/* ----------------------------------------
	area
----------------------------------------- */
.area_name {
	display: flex;
	justify-content: center;
	flex-direction: column;
	background: url(../imgs/area/area_bg.webp) no-repeat center bottom;
	background-size: contain;
  margin-top: 53px;
}
#area .jp {
	font-size: 67px;
	font-weight: 500;
	font-family: var(--F-fm);
	color: var(--C-Dblue);
	letter-spacing: normal;
	line-height: 1;
	text-align: center;
	display: inline-block;
	min-width: 175px;
	border: 1px solid var(--C-Dblue);
	border-radius: 45em;
	margin: 0 auto;
	padding: 0.3vw 15px 1.1vw;
}
#area .en {
	display: block;
	text-align: center;
	font-size: 22px;
	font-weight: 500;
  color: var(--C-Dblue);
	letter-spacing: 0.309em;
}
@media screen and (max-width: 750px) {
  .area_name {
    margin-top: 7.066vw;
  }
	#area .jp {
		font-size: 8.933vw;
		min-width: 23.333vw;
		padding: 0 2vw 0.933vw;
	}
	#area .en {
		font-size: 2.933vw;
	}
}
/* ----------------------------------------
	pickup
----------------------------------------- */
#pickup h2 {
	position: relative;
	letter-spacing: 0.063em;
}
#pickup h2::after {
	content: '';
	width: 100%;
	height: 200px;
	display: block;
	background: #fff;
}
.pickup_list {
	background: #ff7483;
	padding: 0 33px;
}
.pickup_list > ul {
	position: relative;
	margin-top: -200px;
	z-index: 9;
	display: flex;
	flex-direction: column;
}
.event_item {
	background: #fff;
	border-radius: 10px;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.3);
	margin-bottom: 40px;
}
.event_item * {
	color: var(--C-Dblue);
	font-weight: 500;
}
.event_item img {
	border-radius: 10px 10px 0 0;
  width: 100%;
}
.event_item_data {
	padding: 35px 30px 45px;
}
.event_item_data dt {
	font-size: 44px;
	font-weight: bold;
	letter-spacing: 0.05em;
  line-height: 1.05;
  margin-bottom: 10px;
}
.event_item_data dd .day,
.event_item_data dd address {
	font-size: 30px;
}
.event_item_data .tags {
	/* display: flex;
	flex-wrap: wrap; */
	gap: 5px 15px;
	font-size: 33px;
	line-height: 1.142647;
	/* margin-bottom: 30px; */
}
.event_item_data .tags li {
	display: inline;
}
.event_item_data .tags li::before {
	content: '＃';
}
@media screen and (max-width: 750px) {
	#pickup h2::after {
		height: 26.666vw;
	}
	.pickup_list {
		padding: 0 4.4vw;
	}
	.pickup_list > ul {
		position: relative;
		margin-top: -26.666vw;
	}
	.event_item {
		margin-bottom: 5.333vw;
	}
	.event_item_data {
		padding: 4.666vw 4vw 5.866vw;
	}
	.event_item_data dt {
		font-size: 5.866vw;
    margin-bottom: 2vw;
	}
	.event_item_data dd .day,
	.event_item_data dd address {
		font-size: 4vw;
	}
	.event_item_data .tags {
		gap: 0.666vw 2vw;
		font-size: 4.4vw;
		/* margin-bottom: 4.666vw; */
	}
}
/* ----------------------------------------
	search
----------------------------------------- */
.search_wrap {
	padding: 0 8%;
	margin-bottom: 8%;
}
.search_title {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 12px;
}
.search_title h3 {
  line-height: 1;
}
.search_btns {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	row-gap: 15px;
}
.search_list {
    padding: 0 25px;
}
.search_count {
	font-size: 28px;
	color: var(--C-Dblue);
	padding: 0 8%;
	margin-bottom: 40px;
}
.search_list > ul {
	display: flex;
	flex-direction: column;
}
.search_list .event_item {
	display: flex;
	background: #fff;
	border-radius: 10px;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.3);
	margin-bottom: 40px;
}
.search_list .event_item a {
	display: flex;
	width: 100%;
}
.search_list .event_item_img {
	width:  410px;
}
.search_list .event_item_img img {
	width: 100%;
	/* height: 100%;
	object-fit: cover; */
	border-radius: 10px 0 0 10px;
}
.search_list .event_item_data {
	width: calc(100% - 410px);
	padding: 22px 24px;
	display: flex;
	flex-direction: column;
	height: 100%;
}
.search_list .event_item_data dt {
	width: 100%;
	max-height: 2lh;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 2;
	font-size: 29px;
	line-height: 1.24;
}
.search_list .event_item_data dd .day,
.search_list .event_item_data dd address {
	font-size: 18px;
}
.search_list .event_item_data dd address {
	margin-bottom: 7px;
}
.search_list .event_item_data .tags {
	font-size: 20px;
	line-height: 1.05;
}
.search_list .detail_btn {
	width: 234px;
  height: 47px;
	font-size: 17px;
  border-radius: 7px;
	margin-top: auto;
}
.search_list .detail_btn::after {
  width: 6px;
  height: 11px;
	top: 0;
	bottom: 0;
	right: 4.7%;
}
@media screen and (max-width: 750px) {
	.search_wrap {
		padding: 0 8%;
		margin-bottom: 8%;
	}
	.search_wrap.--date .search_title img  {
		width: 48.666vw;
	}
	.search_wrap.--area .search_title img  {
		width: 45.866vw;
	}
	.search_wrap.--tag .search_title img  {
		width: 42vw;
	}
	.search_title {
		margin-bottom: 1.6vw;
	}
	.search_title img  {
		vertical-align: baseline;
	}
	.search_btns {
		row-gap: 2vw;
	}
	.search_list {
			padding: 0 3.333vw;
	}
	.search_count {
		font-size: 3.733vw;
		padding: 0 8%;
		margin-bottom: 5.333vw;
	}

	.search_list .event_item {
		margin-bottom: 5.333vw;
	}
	.search_list .event_item_img {
		width:  54.666vw;
	}
	.search_list .event_item_data {
		width: calc(100% - 54.666vw);
		padding: 2.933vw 3.2vw;
	}
	.search_list .event_item_data dt {
		font-size: 3.866vw;
		margin-bottom: 1.333vw;
	}
	.search_list .event_item_data dd .day,
	.search_list .event_item_data dd address {
		font-size: 2.4vw;
	}
	.search_list .event_item_data dd address {
		margin-bottom: 0.9333;
	}
	.search_list .event_item_data .tags {
		font-size: 2.666vw;
	}
	.search_list .detail_btn {
		width: 31.2vw;
    height: 6.133vw;
		font-size: 2.266vw;
    border-radius: 0.933vw;
	}
	.search_list .detail_btn::after {
		width: 0.8vw;
		height: 1.4666vw;
		right: 3.5%;
	}
}
/* ----------------------------------------
	button
----------------------------------------- */
.detail_btn {
	width: 472px;
  height: 95px;
  display: flex;
	justify-content: center;
	align-items: center;
  background: #ff5a00;
  color: #fff !important;
  font-size: 34px;
  font-weight: bold;
	line-height: 0;
	letter-spacing: 0.063em;
  text-align: center;
  position: relative;
	/* padding: 8px 5.3363% 12px 0; */
	padding: 1.694% 5.3363% 2.1175% 0;
	border-radius: 14px;
	margin: 35px auto 0;
}
.detail_btn::after {
  content: '';
  display: block;
  width: 12px;
  height: 21px;
  background: url('../imgs/common/icon_btn.svg') no-repeat center;
  /* background-size: cover; */
	position: absolute;
	top: 0;
	bottom: 0;
	right: 5%;
	margin: auto;
}
@media screen and (max-width: 750px) {
	.detail_btn {
		width: 62.933vw;
    height: 12.666vw;
		font-size: 4.4vw;
		padding: 1.333vw 0 1.4vw;
		border-radius: 1.866vw;
		margin: 4.666vw auto 0;
	}
	.detail_btn::after {
		width: 1.6vw;
		/* height: 2.133vw; */
		height: 2.8vw;
		right: 3.5%;
	}
}

button {
	margin: 0;
	padding: 0;
	border: 3.2px solid var(--C-DDblue);
	border-radius: 6px;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	font-size: 28px;
	font-weight: 500;
	color: var(--C-Dblue);
	letter-spacing: 0.12em;
	line-height: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	cursor: pointer;
	background: #fff;
}
button.all {
	width: 165px;
	height: 56px;
}
button.active {
	background: var(--C-Dblue);
	color: #fff;
	border-color: var(--C-Dblue);
}
button.single {
	width: 305px;
	height: 72px;
	/* text-indent: 25px; */
	padding-left: 39px;
}
button.single::before {
	content: '';
	display: block;
	width: 40px;
	height: 40px;
	background: var(--C-gray);
	border-radius: 6px;
	position: absolute;
	top: 50%;
	left: 5%;
	transform: translateY(-50%);
}

button.single.active::after {
	content: '';
	display: block;
	width: 24px;
	height: 24px;
	background: url('../imgs/area/icon_check.svg') no-repeat center;
	background-size: cover;
	position: absolute;
	top: 50%;
	left: 7.8%;
	transform: translateY(-50%);
}
button.none {
	border-color: var(--C-gray);
	color: var(--C-gray);
	pointer-events: none;
	cursor: not-allowed;
}
@media screen and (max-width: 750px) {
	button {
		font-size: 3.733vw;
		border: 0.426vw solid var(--C-DDblue);
		border-radius: 0.8vw;
	}
	button.all {
		width: 22vw;
		height: 7.466vw;
	}
	button.single {
		width: 40.666vw;
		height: 9.6vw;
		/* text-indent: 4.333vw; */
		padding-left: 5.2vw;
	}
	button.single::before {
		width: 5.333vw;
		height: 5.333vw;
	}
	button.single.active::after {
		width: 3.2vw;
		height: 3.2vw;
	}
	button.single.active::after {
		width: 3.2vw;
		height: 3.2vw;
	}
}

/* ----------------------------------------
	footer
----------------------------------------- */
footer {
  padding-top: 40px;
}
@media screen and (max-width: 750px) {
	footer {
		padding-top: 4.533vw;
	}
}
