/* *****************************************************************************

  トップページ用CSS

***************************************************************************** */

/* =========================================================
  【共通】メインコンテンツヘッダー
========================================================= */

.home #main header {
	display: grid;
	color: var(--text-color-outline);
}

/* -----------------
  見出し レベル1
----------------------------------------------- */

.home #main header h1 {
	z-index: 1;
	grid-area: 1 / 1;
	font-family: var(--font-family-title-ja);
	font-weight: 500;
}

/* -----------------
  テキスト
----------------------------------------------- */

.home #main header p {
	z-index: 1;
	grid-area: 2 / 1;
}

/* -----------------
  メインビジュアル
----------------------------------------------- */

.home #main header > :where(img:not(.border-text), picture, ul.main-visuals) {
	grid-area: 1 / 1 / span 2 / 1;
}

/* =========================================================
  【PC】メインコンテンツヘッダー
========================================================= */

@media screen and (min-width: 641px) {
	.home #main header {
		grid-template-rows: 1fr auto;
		align-items: end;
		gap: 14px 0;
	}

	/* -----------------
	  見出し レベル1
	----------------------------------------------- */

	.home #main header h1 {
		margin: 0 calc(100vw / var(--base-width) * 80);
		font-size: calc(100vw / var(--base-width) * 33);
		line-height: 1.7em;
	}

	/* -----------------
	  テキスト
	----------------------------------------------- */

	.home #main header p {
		margin: 0 calc(100vw / var(--base-width) * 80) calc(100vw / var(--base-width) * 136);
		line-height: var(--line-height);
	}

	/* -----------------
	  境界線テキスト
	----------------------------------------------- */
	.home #main header .border-text {
		width: 100vw;
	}
}

/* =========================================================
  【SP】メインコンテンツヘッダー
========================================================= */

@media screen and (max-width: 640px) {
	.home #main header {
		grid-template-rows: auto 1fr;
		align-items: start;
	}

	/* -----------------
	  見出し レベル1
	----------------------------------------------- */

	.home #main header h1 {
		margin: calc(100vw / var(--base-width) * 85) calc(100vw / var(--base-width) * 34) 0;
		font-size: calc(100vw / var(--base-width) * 22);
		line-height: var(--line-height);
	}

	/* -----------------
	  テキスト
	----------------------------------------------- */

	.home #main header p {
		z-index: 1;
		grid-area: 2 / 1;
		margin: 9px calc(100vw / var(--base-width) * 34) 0;
		font-size: calc(100vw / var(--base-width) * 11);
		line-height: 1.8em;
	}
}

/* =========================================================
  【共通】メインコンテンツボディ
========================================================= */

/* -----------------
  見出し レベル2
----------------------------------------------- */

.home #main section h2 span:first-child {
	letter-spacing: 0.3em;
}

/* -----------------
  背面画像
----------------------------------------------- */

.home #main section .bg-image {
	display: inline-block;
	z-index: -1;
}

/* =========================================================
  【PC】メインコンテンツボディ
========================================================= */

@media screen and (min-width: 641px) {
	/* -----------------
	  見出し レベル2
	----------------------------------------------- */

	.home #main section h2 span:first-child {
		font-size: calc(100vw / var(--base-width) * 18);
	}

	.home #main section h2 span:last-child {
		font-size: calc(100vw / var(--base-width) * 33);
		line-height: 1.7em;
	}

	/* -----------------
	  テキスト
	----------------------------------------------- */

	.home #main section .text {
		width: calc(100vw / var(--base-width) * 400);
		font-size: calc(100vw / var(--base-width) * 18);
		line-height: 2.1em;
	}
}

/* =========================================================
  【SP】メインコンテンツボディ
========================================================= */

@media screen and (max-width: 640px) {
	/* -----------------
	  見出し レベル2
	----------------------------------------------- */

	.home #main section h2 {
		font-weight: normal;
	}

	.home #main section h2 span:first-child {
		font-size: calc(100vw / var(--base-width) * 14);
	}

	.home #main section h2 span:last-child {
		line-height: 1.6em;
	}

	/* -----------------
	  テキスト
	----------------------------------------------- */

	.home #main section .text {
		font-size: calc(100vw / var(--base-width) * 13);
		line-height: var(--line-height);
	}

	/* -----------------
	  詳細はこちら（ボタン風リンク）リンク
	----------------------------------------------- */

	.home #main section .read-more a {
		display: inline-block;
		padding: 10px 34px;
		background-color: #fff;
	}
}

/* =========================================================
  【PC】ABOUT BORECA
========================================================= */

@media screen and (min-width: 641px) {
	.home #main #about-boreca {
		display: grid;
		grid-template: "heading image" "text image" "link image" 1fr / 1fr auto;
		align-items: start;
		gap: calc(100vw / var(--base-width) * 32) calc(100vw / var(--base-width) * 120);
		padding:
			calc(100vw / var(--base-width) * 195)
			calc(100vw / var(--base-width) * 120)
			calc(100vw / var(--base-width) * 136 * 1.2);
	}

	/* -----------------
	  見出し レベル2
	----------------------------------------------- */

	.home #main #about-boreca h2 {
		grid-area: heading;
		font-weight: 500;
	}

	.home #main #about-boreca h2 span:last-child {
		margin-top: 32px;
	}

	/* -----------------
	  テキスト
	----------------------------------------------- */

	.home #main #about-boreca .text {
		grid-area: text;
	}

	.home #main #about-boreca .link {
		grid-area: link;
	}

	/* -----------------
	  図形
	----------------------------------------------- */

	.home #main #about-boreca .bg-image {
		grid-area: image;
	}

	.home #main #about-boreca .bg-image img {
		width: calc(100vw / var(--base-width) * 538);
	}
}

/* =========================================================
  【SP】ABOUT BORECA
========================================================= */

@media screen and (max-width: 640px) {
	.home #main #about-boreca {
		padding: 55px var(--base-horizontal-margin) 40px;
	}

	/* -----------------
	  見出し レベル2
	----------------------------------------------- */

	.home #main #about-boreca h2 span:last-child {
		margin-top: 20px;
		font-size: calc(100vw / var(--base-width) * 20);
		line-height: var(--line-height);
	}

	/* -----------------
	  テキスト
	----------------------------------------------- */

	.home #main #about-boreca .text {
		margin-top: 20px;
	}

	/* -----------------
	  リンク
	----------------------------------------------- */

	.home #main #about-boreca :not(.read-more) a {
		margin-top: 28px;
	}

	/* -----------------
	  図形
	----------------------------------------------- */

	.home #main #about-boreca .bg-image img {
		display: block;
		margin: 32px auto 0;
		padding-inline: calc(56px - var(--base-horizontal-margin));
	}
}

/* =========================================================
  【PC】RELAXATION
========================================================= */

@media screen and (min-width: 641px) {
	.home #main #relaxation {
		position: relative;
		display: grid;
		grid-template-rows: auto auto 1fr;
		padding-right: calc(100vw / var(--base-width) * 188);
		color: var(--text-color-outline);
	}

	/* -----------------
	  見出し レベル2
	----------------------------------------------- */

	.home #main #relaxation h2 {
		grid-area: 1 / 1;
		margin: calc(100vw / var(--base-width) * 120) calc(100vw / var(--base-width) * 120) 0;
		font-weight: 500;
	}

	.home #main #relaxation h2 span:last-child {
		font-size: calc(100vw / var(--base-width) * 50);
	}

	/* -----------------
	  テキスト
	----------------------------------------------- */

	.home #main #relaxation .text {
		grid-area: 2 / 1;
		margin: calc(100vw / var(--base-width) * 24) calc(100vw / var(--base-width) * 120) 0;
		width: calc(100vw / var(--base-width) * 420);
	}

	/* -----------------
	  詳細はこちらリンク
	----------------------------------------------- */

	.home #main #relaxation .read-more {
		grid-area: 3 / 1;
		margin: calc(100vw / var(--base-width) * 40) calc(100vw / var(--base-width) * 120) 0;
	}

	/* -----------------
	  背面画像
	----------------------------------------------- */

	.home #main #relaxation .bg-image {
		grid-area: 1 / 1 / span 3 / 1;
	}

	.home #main #relaxation .bg-image img {
		width: 100%;
	}

	/* -----------------
	  イメージ
	----------------------------------------------- */

	.home #main #relaxation .images {
		position: absolute;
		top: calc(100% - calc(100vw / var(--base-width) * 80));
		left: calc(100vw / var(--base-width) * 160);
		right: 0;
		display: flex;
		gap: 0 calc(100vw / var(--base-width) * 34);
	}

	/* キャプション */
	.home #main #relaxation .images p {
		margin-top: calc(100vw / var(--base-width) * 10);
		line-height: var(--line-height);
		letter-spacing: 0.32em;
		color: var(--color-main);
	}
}

/* =========================================================
  【SP】RELAXATION
========================================================= */

@media screen and (max-width: 640px) {
	.home #main #relaxation {
		position: relative;
		display: grid;
		grid-template-rows: auto auto 1fr;
		color: var(--text-color-outline);
	}

	/* -----------------
	  見出し レベル2
	----------------------------------------------- */

	.home #main #relaxation h2 {
		grid-area: 1 / 1;
		margin: calc(100vw / var(--base-width) * 56) var(--base-horizontal-margin) 0;
	}

	.home #main #relaxation h2 span:last-child {
		margin-top: 22px;
		font-size: calc(100vw / var(--base-width) * 28);
	}

	/* -----------------
	  テキスト
	----------------------------------------------- */

	.home #main #relaxation .text {
		grid-area: 2 / 1;
		margin: 4px calc(var(--base-horizontal-margin)) 0 var(--base-horizontal-margin);
	}

	/* -----------------
	  詳細はこちらリンク
	----------------------------------------------- */

	.home #main #relaxation .read-more {
		grid-area: 3 / 1;
		margin: 36px var(--base-horizontal-margin) 0;
	}

	/* -----------------
	  背面画像
	----------------------------------------------- */

	.home #main #relaxation .bg-image {
		grid-area: 1 / 1 / span 3 / 1;
	}

	.home #main #relaxation .bg-image img {
		width: 100%;
	}

	/* -----------------
	  イメージ
	----------------------------------------------- */

	.home #main #relaxation .images {
		position: absolute;
		inset: calc(100% - 20px) var(--base-horizontal-margin) 0;
		display: flex;
		gap: 0 calc(100vw / var(--base-width) * 7);
	}

	.home #main #relaxation .images .image {
		flex: 1 1 auto;
	}

	.home #main #relaxation .images .image img {
		width: 100%;
	}

	/* キャプション */
	.home #main #relaxation .images p {
		margin-top: 5px;
		font-size: calc(100vw / var(--base-width) * 8);
		line-height: var(--line-height);
		letter-spacing: 0.32em;
		color: var(--color-main);
	}
}

/* =========================================================
  【PC】FITNESS
========================================================= */

@media screen and (min-width: 641px) {
	.home #main #fitness {
		position: relative;
		display: grid;
		grid-template-rows: auto auto 1fr;
		margin-top: calc(100vw / var(--base-width) * 524);
		padding-right: calc(100vw / var(--base-width) * 188);
		color: var(--text-color-outline);
	}

	/* -----------------
	  見出し レベル2
	----------------------------------------------- */

	.home #main #fitness h2 {
		grid-area: 1 / 1;
		margin: calc(100vw / var(--base-width) * 120) calc(100vw / var(--base-width) * 120) 0;
	}

	.home #main #fitness h2 span:last-child {
		font-size: calc(100vw / var(--base-width) * 50);
	}

	/* -----------------
	  テキスト
	----------------------------------------------- */

	.home #main #fitness .text {
		grid-area: 2 / 1;
		margin: calc(100vw / var(--base-width) * 24) calc(100vw / var(--base-width) * 120) 0;
	}

	.home #main #fitness .read-more {
		grid-area: 3 / 1;
		margin: calc(100vw / var(--base-width) * 40) calc(100vw / var(--base-width) * 120) 0;
	}

	/* -----------------
	  背面画像
	----------------------------------------------- */

	.home #main #fitness .bg-image {
		grid-area: 1 / 1 / span 3 / 1;
	}

	.home #main #fitness .bg-image img {
		width: 100%;
	}

	/* -----------------
	  イメージ
	----------------------------------------------- */

	.home #main #fitness .image-01 {
		position: absolute;
		top: calc(100vw / var(--base-width) * 140 * -1);
		right: 0;
	}

	.home #main #fitness .image-01 img {
		width: calc(100vw / var(--base-width) * 297);
	}

	.home #main #fitness .image-02 {
		position: absolute;
		top: calc(100% - calc(100vw / var(--base-width) * 127));
		right: calc(100vw / var(--base-width) * 80);
	}

	.home #main #fitness .image-02 img {
		width: calc(100vw / var(--base-width) * 706);
	}

	/* キャプション */
	.home #main #fitness .image-02 p {
		margin-top: calc(100vw / var(--base-width) * 10);
		color: var(--color-main);
	}
}

/* =========================================================
  【SP】FITNESS
========================================================= */

@media screen and (max-width: 640px) {
	.home #main #fitness {
		position: relative;
		display: grid;
		grid-template-rows: auto auto 1fr;
		margin-top: calc(100vw / var(--base-width) * 292);
		color: var(--text-color-outline);
	}

	/* -----------------
	  見出し レベル2
	----------------------------------------------- */

	.home #main #fitness h2 {
		grid-area: 1 / 1;
		margin: calc(100vw / var(--base-width) * 56) var(--base-horizontal-margin) 0;
	}

	.home #main #fitness h2 span:last-child {
		margin-top: 22px;
		font-size: calc(100vw / var(--base-width) * 28);
	}

	/* -----------------
	  テキスト
	----------------------------------------------- */

	.home #main #fitness .text {
		grid-area: 2 / 1;
		margin: 4px var(--base-horizontal-margin) 0;
	}

	.home #main #fitness .text br {
		display: none;
	}

	/* -----------------
	  詳細はこちらリンク
	----------------------------------------------- */

	.home #main #fitness .read-more {
		grid-area: 3 / 1;
		margin: 36px var(--base-horizontal-margin) 0;
	}

	/* -----------------
	  背面画像
	----------------------------------------------- */

	.home #main #fitness .bg-image {
		grid-area: 1 / 1 / span 3 / 1;
	}

	.home #main #fitness .bg-image img {
		width: 100%;
	}

	/* -----------------
	  イメージ
	----------------------------------------------- */

	.home #main #fitness .image-01 {
		position: absolute;
		top: -76px;
		right: 18px;
	}

	.home #main #fitness .image-02 {
		position: absolute;
		top: calc(100% - 44px);
		left: 18px;
	}

	/* キャプション */
	.home #main #fitness .image-02 p {
		margin-top: 5px;
		font-size: calc(100vw / var(--base-width) * 10);
		line-height: var(--line-height);
		color: var(--color-main);
	}
}

/* =========================================================
  【PC】CAFE LOUNGE
========================================================= */

@media screen and (min-width: 641px) {
	.home #main #cafe-lounge {
		position: relative;
		display: grid;
		grid-template-rows: auto auto auto 1fr;
		margin-top: calc(100vw / var(--base-width) * 505);
		padding-right: calc(100vw / var(--base-width) * 188);
		color: var(--text-color-outline);
	}

	/* -----------------
	  見出し レベル2
	----------------------------------------------- */

	.home #main #cafe-lounge h2 {
		grid-area: 1 / 1;
		margin: calc(100vw / var(--base-width) * 120) calc(100vw / var(--base-width) * 120) 0;
	}

	.home #main #cafe-lounge h2 span:last-child {
		font-size: calc(100vw / var(--base-width) * 50);
	}

	/* -----------------
	  テキスト
	----------------------------------------------- */

	.home #main #cafe-lounge .text {
		grid-area: 2 / 1;
		margin: calc(100vw / var(--base-width) * 24) calc(100vw / var(--base-width) * 120) 0;
	}

	/* -----------------
	  設備
	----------------------------------------------- */

	.home #main #cafe-lounge .facilities {
		display: flex;
		align-items: center;
		gap: 0 calc(100vw / var(--base-width) * 28);
		grid-area: 3 / 1;
		margin: 27px calc(100vw / var(--base-width) * 120) 0;
	}

	.home #main #cafe-lounge .facilities li {
		display: flex;
		align-items: center;
		gap: 0 10px;
	}

	/* -----------------
	  詳細はこちらリンク
	----------------------------------------------- */

	.home #main #cafe-lounge .read-more {
		grid-area: 4 / 1;
		margin: calc(100vw / var(--base-width) * 40) calc(100vw / var(--base-width) * 120) 0;
	}

	/* -----------------
	  背面画像
	----------------------------------------------- */

	.home #main #cafe-lounge .bg-image {
		grid-area: 1 / 1 / span 4 / 1;
	}

	.home #main #cafe-lounge .bg-image img {
		width: 100%;
	}

	/* -----------------
	  イメージ
	----------------------------------------------- */

	.home #main #cafe-lounge .image-01 {
		position: absolute;
		top: calc(100vw / var(--base-width) * 153);
		right: calc(100vw / var(--base-width) * 40);
		width: calc(100vw / var(--base-width) * 287);
	}

	.home #main #cafe-lounge .image-02 {
		position: absolute;
		top: calc(100% - calc(100vw / var(--base-width) * 106));
		left: calc(100vw / var(--base-width) * 188);
		width: calc(100vw / var(--base-width) * 517);
	}
}

/* =========================================================
  【SP】CAFE LOUNGE
========================================================= */

@media screen and (max-width: 640px) {
	.home #main #cafe-lounge {
		position: relative;
		display: grid;
		grid-template-rows: auto auto auto 1fr;
		margin-top: calc(100vw / var(--base-width) * 234);
		color: var(--text-color-outline);
	}

	/* -----------------
	  見出し レベル2
	----------------------------------------------- */

	.home #main #cafe-lounge h2 {
		grid-area: 1 / 1;
		margin: calc(100vw / var(--base-width) * 56) var(--base-horizontal-margin) 0;
	}

	.home #main #cafe-lounge h2 span:last-child {
		margin-top: calc(100vw / var(--base-width) * 22);
		font-size: calc(100vw / var(--base-width) * 28);
	}

	/* -----------------
	  テキスト
	----------------------------------------------- */

	.home #main #cafe-lounge .text {
		grid-area: 2 / 1;
		margin: 4px var(--base-horizontal-margin) 0;
	}

	/* -----------------
	  設備
	----------------------------------------------- */

	.home #main #cafe-lounge .facilities {
		display: flex;
		align-items: center;
		gap: 0 calc(100vw / var(--base-width) * 22);
		grid-area: 3 / 1;
		margin: 16px  var(--base-horizontal-margin) 0;
	}

	.home #main #cafe-lounge .facilities li {
		display: flex;
		align-items: center;
		gap: 0 10px;
	}

	.home #main #cafe-lounge .facilities li:nth-child(1) img {
		width: 18px;
	}

	.home #main #cafe-lounge .facilities li:nth-child(2) img {
		width: 16px;
	}

	.home #main #cafe-lounge .facilities li:nth-child(3) img {
		width: 15px;
	}

	/* -----------------
	  詳細はこちらリンク
	----------------------------------------------- */

	.home #main #cafe-lounge .read-more {
		grid-area: 4 / 1;
		margin: calc(100vw / var(--base-width) * 36) var(--base-horizontal-margin) 0;
	}

	/* -----------------
	  背面画像
	----------------------------------------------- */

	.home #main #cafe-lounge .bg-image {
		grid-area: 1 / 1 / span 4 / 1;
	}

	.home #main #cafe-lounge .bg-image img {
		width: 100%;
	}

	/* -----------------
	  イメージ
	----------------------------------------------- */

	.home #main #cafe-lounge .image-01 {
		display: none;
	}

	.home #main #cafe-lounge .image-02 {
		position: absolute;
		top: calc(100% - 33px);
		right: 18px;
	}
}

/* =========================================================
  【PC】NEWS
========================================================= */

@media screen and (min-width: 641px) {
	.home #main #news {
		margin-top: calc(100vw / var(--base-width) * 342);
		padding:
			var(--base-vertical-margin)
			var(--base-horizontal-margin)
			calc(100vw / var(--base-width) * 60);
		background-color: #fff;
	}

	/* -----------------
	  見出し レベル 2
	----------------------------------------------- */

	.home #main #news h2 span:first-child {
		font-size: calc(100vw / var(--base-width) * 22);
	}

	.home #main #news h2 span:last-child {
		margin-top: 22px;
		font-size: calc(100vw / var(--base-width) * 79);
		line-height: 1em;
		letter-spacing: 0.17em;
	}

	/* -----------------
	  一覧リンク
	----------------------------------------------- */

	.home #main #news .link {
		margin-top: 48px;
	}
}

/* =========================================================
  【SP】NEWS
========================================================= */

@media screen and (max-width: 640px) {
	.home #main #news {
		margin-top: calc(100vw / var(--base-width) * 227);
		padding:
			var(--base-vertical-margin)
			var(--base-horizontal-margin)
			calc(100vw / var(--base-width) * 40);
		background-color: #fff;
	}

	/* -----------------
	  見出し レベル 2
	----------------------------------------------- */

	.home #main #news h2 span:last-child {
		margin-top: 6px;
		font-size: calc(100vw / var(--base-width) * 50);
		line-height: 1.2em;
		letter-spacing: 0.1em;
	}

	/* -----------------
	  一覧リンク
	----------------------------------------------- */

	.home #main #news .link {
		margin-top: 40px;
	}
}

/* =========================================================
  【PC】FAQ
========================================================= */

@media screen and (min-width: 641px) {
	.home #main #faq {
		padding:
			calc(100vw / var(--base-width) * 60)
			var(--base-horizontal-margin)
			var(--base-vertical-margin);
		background-color: #fff;
	}

	/* -----------------
	  見出し レベル2
	----------------------------------------------- */

	.home #main #faq h2 span:first-child {
		font-size: calc(100vw / var(--base-width) * 22);
	}

	.home #main #faq h2 span:last-child {
		margin-top: calc(100vw / var(--base-width) * 22);
		font-size: calc(100vw / var(--base-width) * 79);
		letter-spacing: 0.17em;
		line-height: 1em;
	}

	/* -----------------
	  一覧
	----------------------------------------------- */

	.home #main #faq .faq {
		margin-top: calc(100vw / var(--base-width) * 56);
	}

	/* -----------------
	  一覧リンク
	----------------------------------------------- */

	.home #main #faq .link {
		margin-top: calc(100vw / var(--base-width) * 48);
	}
}

/* =========================================================
  【SP】FAQ
========================================================= */

@media screen and (max-width: 640px) {
	.home #main #faq {
		padding:
			calc(100vw / var(--base-width) * 40)
			var(--base-horizontal-margin)
			var(--base-vertical-margin);
		background-color: #fff;
	}

	/* -----------------
	  見出し レベル2
	----------------------------------------------- */

	.home #main #faq h2 span:last-child {
		margin-top: 6px;
		font-size: calc(100vw / var(--base-width) * 50);
		line-height: 1.2em;
		letter-spacing: 0.1em;
	}

	/* -----------------
	  一覧リンク
	----------------------------------------------- */

	.home #main #faq .link {
		margin-top: 48px;
	}
}

/* =========================================================
  【PC】ACCESS
========================================================= */

@media screen and (min-width: 641px) {
	.home #main #access {
		position: relative;
		z-index: 1;
		display: grid;
		grid-template: "heading map" "location map" "link map" 1fr / 1fr auto;
		align-items: start;
		justify-content: space-between;
		gap: calc(100vw / var(--base-width) * 56) calc(100vw / var(--base-width) * 30);
		padding:
			var(--base-vertical-margin)
			calc(100vw / var(--base-width) * 200)
			var(--base-vertical-margin)
			var(--base-horizontal-margin);
	}

	/* -----------------
	  見出し レベル2
	----------------------------------------------- */

	.home #main #access h2 {
		grid-area: heading;
	}

	.home #main #access h2 span:first-child {
		font-size: calc(100vw / var(--base-width) * 22);
	}

	.home #main #access h2 span:last-child {
		margin-top: 22px;
		font-size: calc(100vw / var(--base-width) * 79);
		letter-spacing: 0.17em;
		line-height: 1em;
	}

	/* -----------------
	  所在地
	----------------------------------------------- */

	.home #main #access .location {
		grid-area: location;
		line-height: var(--line-height);
	}

	.home #main #access .location p:nth-child(n + 2) {
		margin-top: 1em;
	}

	.home #main #access .location b {
		margin-right: 1em;
	}

	/* -----------------
	  詳細はこちらリンク
	----------------------------------------------- */

	.home #main #access .link {
		grid-area: link;
	}

	/* -----------------
	  マップ
	----------------------------------------------- */

	.home #main #access iframe {
		grid-area: map;
		width: calc(100vw / var(--base-width) * 517);
		height: calc(100vw / var(--base-width) * 516);
	}

	/* -----------------
	  イメージ
	----------------------------------------------- */

	.home #main #access .image {
		position: absolute;
		top: calc(100vw / var(--base-width) * 50 * -1);
		right: calc(100vw / var(--base-width) * 80);
		z-index: -1;
	}

	.home #main #access .image img {
		width: calc(100vw / var(--base-width) * 360);
	}
}

/* =========================================================
  【SP】ACCESS
========================================================= */

@media screen and (max-width: 640px) {
	.home #main #access {
		position: relative;
		z-index: 1;
		display: flex;
		flex-direction: column;
		margin-top: calc(100vw / var(--base-width) * 143);
		padding: 0 var(--base-horizontal-margin) calc(100vw / var(--base-width) * 40);
	}

	/* 見出し レベル2 */
	.home #main #access h2 {
		order: 1;
	}

	.home #main #access h2 span:last-child {
		margin-top: 6px;
		font-size: calc(100vw / var(--base-width) * 50);
		line-height: 1.2em;
		letter-spacing: 0.1em;
	}

	/* -----------------
	  詳細はこちらリンク
	----------------------------------------------- */

	.home #main #access .link {
		order: 3;
		margin-top: calc(100vw / var(--base-width) * 40);
	}

	/* -----------------
	  所在地
	----------------------------------------------- */

	.home #main #access .location {
		order: 2;
		margin-top: calc(100vw / var(--base-width) * 32);
		font-size: calc(100vw / var(--base-width) * 13);
		line-height: var(--line-height);
	}

	.home #main #access .location p:nth-child(n + 2) {
		margin-top: 0.5em;
	}

	.home #main #access .location b {
		margin-right: 1em;
	}

	/* -----------------
	  マップ
	----------------------------------------------- */

	.home #main #access iframe {
		order: 4;
		margin: calc(100vw / var(--base-width) * 40) 0 0;
		width: calc(100% + (var(--base-horizontal-margin) * 2));
		height: calc(100vw / var(--base-width) * 253);
		translate: calc(var(--base-horizontal-margin) * -1);
	}

	/* -----------------
	  イメージ
	----------------------------------------------- */

	.home #main #access .image {
		position: absolute;
		bottom: calc(100% + 60px);
		right: 18px;
		z-index: -1;
	}
}

/* =========================================================
  【PC】RESERVE
========================================================= */

@media screen and (min-width: 641px) {
	.home #main #reserve {
		display: grid;
		justify-items: center;
		gap: calc(100vw / var(--base-width) * 64) 0;
	}

	/* -----------------
	  見出し レベル2
	----------------------------------------------- */

	.home #main #reserve h2 {
		font-size: calc(100vw / var(--base-width) * 38);
		grid-area: 1 / 1;
		align-self: end;
		color: var(--text-color-outline);
	}

	/* -----------------
	  リンク
	----------------------------------------------- */

	.home #main #reserve .links {
		grid-area: 2 / 1;
		align-self: start;
	}

	/* -----------------
	  背面画像
	----------------------------------------------- */

	.home #main #reserve .bg-image {
		grid-area: 1 / 1 / span 2 / 1;
	}

	.home #main #reserve .bg-image img {
		width: 100vw;
	}
}

/* =========================================================
  【SP】RESERVE
========================================================= */

@media screen and (max-width: 640px) {
	.home #main #reserve {
		display: grid;
		gap: calc(100vw / var(--base-width) * 32) 0;
		margin-top: calc(100vw / var(--base-width) * 20);
	}

	/* -----------------
	  見出し レベル2
	----------------------------------------------- */

	.home #main #reserve h2 {
		font-size: calc(100vw / var(--base-width) * 28);
		grid-area: 1 / 1;
		justify-self: center;
		align-self: end;
		color: var(--text-color-outline);
	}

	/* -----------------
	  リンク
	----------------------------------------------- */

	.home #main #reserve .links {
		grid-area: 2 / 1;
		align-self: start;
		margin: 0 calc(100vw / var(--base-width) * 32);
	}

	/* -----------------
	  背面画像
	----------------------------------------------- */

	.home #main #reserve .bg-image {
		grid-area: 1 / 1 / span 2 / 1;
	}
}
