@charset "UTF-8";


/*access
----------------------------------------*/
.access {
	margin: 12rem 0 15rem;
}
.access_inner {
	width: 132rem;
	margin: 0 auto;
	position: relative;
}
.access_map {
	width: 100%;
}
.access_map iframe {
	width: 100%;
	filter: grayscale(1) contrast(1.05);
}
.access_ttl {
	margin-top: 3rem;
	margin-bottom: 13rem;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}
.access_ttl h2 {
	font-size: 2.6rem;
	font-weight: 500;
	letter-spacing: 0.05em;
	color: #6A9383;
	margin-bottom: 3rem;
	line-height: 1.1538;
}
.access_ttl p {
	font-size: 1.4rem;
	font-weight: 500;
	margin-bottom: 3rem;
	line-height: 1.5714;
	letter-spacing: 0.05em;
}
.access_ttl .access_btn {
	position: relative;
	display: inline-block;
	padding-left: 2.3rem;
}
.access_ttl .access_btn a {
	display: inline-block;
	border-bottom: 1px solid;
	padding-bottom: .5rem;
	font-family: YuGothic, "Yu Gothic medium", "sans-serif";
	font-size: 1.2rem;
	letter-spacing: 0.01em;
}
.access_ttl .access_btn::before {
	content: "";
	position: absolute;
	width: 1.3rem;
	height: 1.9rem;
	background-image: url(../../img/access/icon_pin.svg);
	background-size: 1.3rem 1.9rem;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
}
.access_ttl_box h3 {
	font-size: 2rem;
	font-weight: 500;
	letter-spacing: .05em;
	line-height: 1.3;
	margin-bottom: 3rem;
}
.access_ttl_box p {
	font-size: 1.4rem;
	letter-spacing: .05em;
	line-height: 1.5714;
}
@media only screen and (max-width: 768px) {
	.access {
		margin: 7rem 0 11rem;
	}
	.access_inner {
		width: 34rem;
	}
	.access_map iframe {
		height: 30rem;
	}
	.access_ttl {
		margin-bottom: 11rem;
		display: block;
	}
	.access_ttl h2 {
		margin-bottom: 2rem;
	}
	.access_ttl p {
		margin-bottom: 2rem;
	}
	.access_ttl_box {
		margin-top: 4rem;
	}
}


/*howto
----------------------------------------*/
.howto {
	padding: 0 0 15rem;
}
.howto_inner {
	width: 132rem;
	margin: 0 auto;
}
.howto_ttl {
	margin-bottom: 4rem;
}
.howto_ttl h2 {
	font-size: 2.6rem;
	font-weight: 500;
	color: #6A9383;
	padding-bottom: 3rem;
	border-bottom: 1px solid #C9C7C7;
}
.howto_inner h3 {
	letter-spacing: 0.05em;
	font-size: 2rem;
	font-weight: 500;
	margin-bottom: 3rem;
}
.howto_inner hr {
	border: none;
	border-bottom: 1px solid #C9C7C7;
	margin: 5rem 0;
}
@media only screen and (max-width: 768px) {
	.howto {
		padding: 0 0 15rem;
	}
	.howto_inner {
		max-width: 34rem;
		display: block;
	}
	
	.howto_ttl {
		margin-bottom: 2rem;
	}
	.howto_ttl h2 {
		padding-bottom: 3rem;
	}
	.howto_inner h3 {
		margin-bottom: 2rem;
	}
	.howto_inner hr {
		margin: 5rem 0 3rem;
	}

	.howto_detail_btn {
		display: block;
		width: 100%;
		background: #6A9383;
		color: #fff;
		text-align: left;
		padding: 2.5rem 2rem;
		font-size: 1.4rem;
		font-weight: 500;
	}
	.howto_detail_btn::before {
		content: "";
		position: absolute;
		width: 1.5rem;
		height: 1px;
		background: #fff;
		top: 0;
		bottom: 0;
		right: 2rem;
		margin: auto;
	}
	.howto_detail_btn::after {
		content: "";
		position: absolute;
		width: 1px;
		height: 1.5rem;
		background: #fff;
		top: 0;
		bottom: 0;
		right: 2.75rem;
		margin: auto;
	}
	.howto_detail_btn.open::after {
		display: none;
	}
	.howto_detail_btn:not(:first-child) {
		margin-top: 1rem;
		text-align: left;
	}

	.howto_detail_box {
		background: #fff;
		padding: 3.4rem;
	}

	.howto_detail_list dt {
		padding-left: 2.5rem;
		font-size: 1.4rem;
		font-weight: 500;
		line-height: 1.23;
		color: #333333;
	}
	.howto_detail_list dt::before {
		content: "";
		position: absolute;
		width: .4rem;
		height: .4rem;
		border-radius: 50%;
		background: #6A9383;
		left: 0;
		top: .7rem;
		z-index: 1;
	}
	
	.howto_detail_list dd {
		padding-left: 2.5rem;
		color: #6E6963;
		font-size: 1.4rem;
		line-height: 1;
		padding-top: 1rem;
	}
	
	.howto_detail_list dd:not(:last-child) {
		padding-bottom: 3rem;
	}
	.howto_detail_list dd:not(:last-child)::before {
		content: "";
		position: absolute;
		width: 1px;
		height: calc(100% + 1.4rem);
		background: #D6D6D6;
		left: 1.55px;
		top: -.7rem;
		z-index: 0;
	}
}