@charset "utf-8";

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,p,blockquote,th,td,main,figure{margin:0;padding:0}table{font-size:100%;font-family:inherit}fieldset,img{border:0}img,svg,video{vertical-align:middle}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%}q:before,q:after{content:''}abbr,acronym{border:0}select,input,textarea{font-size:100%}header,footer,nav,main,section,article,figure,aside,picture{display:block}.clearfix:after,.row:after{content:"";display:table;clear:both}.c-fl{float:left}.c-fr{float:right}@media screen and (min-width: 744px),print{.c-pc_fl{float:left}.c-pc_fr{float:right}}@media screen and (max-width: 743px){.c-sp_fl{float:left}.c-sp_fr{float:right}}.c-tal{text-align:left!important}.c-tac{text-align:center!important}.c-tar{text-align:right!important}@media screen and (min-width: 744px),print{.c-pc_tal{text-align:left!important}.c-pc_tac{text-align:center!important}.c-pc_tar{text-align:right!important}}@media screen and (max-width: 743px){.c-sp_tal{text-align:left!important}.c-sp_tac{text-align:center!important}.c-sp_tar{text-align:right!important}}


/* 変数
====================================================================== */
:root {
	--color-base: #113055;
	--color-white: #fff;
	--color-theme: #0086ce;
	--color-navy: #153057;
	--color-peach: #eba088;
	--bg-base: #fbddcd;
	/* --border: #d9d9d9; */
	--base-width: 110rem;
	--pc-min-window: 1180;
	--pc-base-padding: 4rem;
	--sp-base-padding: 3rem;
	--font-family-jp: "Noto Sans JP", sans-serif;
	--font-family-title: "momochidori", var(--font-family-jp);
	--font-family-en: "monotalic", sans-serif;
	--font-family-num: "Arimo", sans-serif;
	--font-weight-reg: 400;
	--font-weight-medium: 500;
	--font-weight-semi: 600;
	--font-weight-bold: 700;
	--font-weight: var(--font-weight-medium);
	--ls: .02em;
	--white-filter: brightness(0) invert(1);
	--transition-duration: .3s;
	--transition: var(--transition-duration) ease-in-out;
	--body-transition: opacity 1s linear;
	--target-margin: 3rem;
	--header-height: 11rem;
	@media screen and (max-width: 743px) {
		--target-margin: 2rem;
		--header-height: 5.6rem;
	}
}


/* ========================================================
	template.css => テンプレート用CSS
======================================================== */
html {
	position: relative;
	font-size: 62.5%;
	scroll-behavior: smooth;
	@media screen and (min-width: 744px), print {
		font-size: min(calc(10px - ((var(--pc-min-window) * 1px) - 100vw) * (10 / var(--pc-min-window))), 10px);
	}
	@media screen and (max-width: 743px) {
		font-size: calc((10 / 390) * 100vw);
	}
}
html.no-scroll-behavior {
	scroll-behavior: auto;
}
body {
	background-color: var(--bg-base);
	font-size: 2rem;
	line-height: 2.4;
	color: var(--color-base);
	word-wrap: break-word;
	overflow-wrap: break-word;
	font-family: var(--font-family-jp);
	font-weight: var(--font-weight);
	font-optical-sizing: auto;
	/* font-feature-settings: "palt"; */
	font-feature-settings: "pkna";
	-webkit-font-smoothing: antialiased;
	font-style: normal;
	-webkit-text-size-adjust: none;
	text-size-adjust: none;
	@media screen and (max-width: 743px) {
		font-size: 1.8rem;
	}
}
* {
	letter-spacing: var(--ls);
}
*,
*::before,
*::after {
	box-sizing: border-box;
}
:where(address,caption,cite,code,dfn,em,th,var) {
	font-style: normal;
	font-weight: var(--font-weight);
}
:where(h1,h2,h3,h4,h5,h6) {
	font-weight: var(--font-weight-bold);
}
:where(img) {
	max-width: 100%;
	width: 100%;
	height: auto;
	/* image-rendering: -webkit-optimize-contrast;
	image-rendering: crisp-edges; */
}
:where(iframe) {
	max-width: 100%;
	vertical-align: middle;
}
:where(sup) {
	vertical-align: super;
	font-size: 60%;
}
:where(table) {
	border-collapse: collapse;
	border-spacing: 0;
	line-height: inherit;
}
:where(a[href], a[data-modal]) {
	--a-color: var(--color-base);
	color: var(--a-color);
	text-decoration-line: underline;
	text-decoration-style: solid;
	text-decoration-thickness: 1px;
	text-decoration-color: var(--a-color);
	text-underline-offset: .3em;
	outline: none;
	cursor: pointer;
}
:where(a[href].u-a-reverse,.u-a-reverse a[href]) {
	text-decoration-color: color-mix(in srgb, var(--a-color) 0%, transparent);
}
:where(a[href^="tel:"]) {
	@media screen and (min-width: 744px), print {
		text-decoration: none;
	}
}
@media (hover) {
	:where(a,button,.u-basic_trs,.-hl),
	:where(a,button,.u-basic_trs,.-hl)::before,
	:where(a,button,.u-basic_trs,.-hl)::after {
		transition: color var(--transition), background var(--transition), border var(--transition), opacity var(--transition), text-decoration-color .2s ease-in-out;
	}
	:where(a svg, button svg) {
		transition: fill var(--transition);
	}
	:where(a[href]:hover, a[data-modal]:hover) {
		text-decoration-color: color-mix(in srgb, var(--a-color) 0%, transparent);
	}
	:where(a[href].u-a-reverse, a[data-modal].u-a-reverse, .u-a-reverse a[href], .u-a-reverse a[data-modal]):hover {
		text-decoration-color: var(--a-color);
	}
	:where(a[href].u-a-reverse.-hvw),
	:where(.u-a-reverse.-hvw a[href]) {
		text-decoration-color: rgba(255,255,255,0);
	}
	:where(a[href].u-a-reverse.-hvw):hover,
	:where(.u-a-reverse.-hvw a[href]):hover {
		text-decoration-color: #fff;
	}
	:where(a[href].u-a-reverse.-hvbk),
	:where(.u-a-reverse.-hvbk a[href]) {
		text-decoration-color: color-mix(in srgb, var(--a-color) 0%, transparent);
	}
	:where(a[href].u-a-reverse.-hvbk):hover,
	:where(.u-a-reverse.-hvbk a[href]):hover {
		text-decoration-color: var(--a-color);
	}
	:where(a[href] .u-a-reverse) {
		text-decoration-line: underline;
		text-decoration-style: solid;
		text-decoration-thickness: 1px;
		text-decoration-color: color-mix(in srgb, var(--a-color) 0%, transparent);
		text-underline-offset: .3em;
	}
	:where(a[href] .u-a-reverse) {
		transition: text-decoration-color .2s ease-in-out;
	}
	:where(a[href]:hover .u-a-reverse) {
		text-decoration-color: var(--a-color);
	}
	:where(a[href] .u-hl) {
		text-decoration-line: underline;
		text-decoration-style: solid;
		text-decoration-thickness: 1px;
		text-decoration-color: color-mix(in srgb, var(--a-color) 0%, transparent);
		text-underline-offset: .3em;
	}
	:where(a[href]:hover .u-hl) {
		text-decoration-color: var(--a-color);
	}
}

:where(label) {
	cursor: pointer;
}
:where(input, select, textarea, button) {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	max-width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	border-radius: 0;
	vertical-align: middle;
	font-family: inherit;
	font-weight: inherit;
	font-feature-settings: inherit;
	color: var(--color-base);
	outline: none;
	font-size: 100%;
}
::placeholder {
	font-weight: var(--font-weight-reg);
	color: #ccc;
}
:where(button) {
	cursor: pointer;
}

.hidden {
	display: none;
}
.slick-slider * {
	outline: none;
}

#top {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
}

/* pc / sp
====================================================================== */
@media screen and (min-width: 744px), print {
	.u-only-sp {
		display: none !important;
	}
	.u-pc-break {
		position: relative;
		display: block;
		height: 0;
		overflow: hidden;
	}
	.u-pc-hidden {
		position: relative;
		overflow: hidden;
		display: block;
		height: 0;
	}
}
@media screen and (max-width: 743px) {
	.u-only-pc {
		display: none !important;
	}
	.u-sp-break {
		position: relative;
		display: block;
		height: 0;
		overflow: hidden;
	}
}

/* color
====================================================================== */
.u-c-base {
	color: var(--color-base) !important;
}
.u-c-theme {
	color: var(--color-theme) !important;
	--a-color: var(--color-theme) !important;
}
.u-c-navy {
	color: var(--color-navy) !important;
}

/* font
====================================================================== */
.u-ff-en {
	font-family: var(--font-family-en);
	font-weight: 700;
	font-style: normal;
	--ls: 0.05em;
}
.u-ff-title {
	font-family: var(--font-family-title);
	font-weight: 700;
	font-style: normal;
	color: var(--color-navy);
	&.-white {
		color: #fff;
	}
}
.u-fwn {
	font-weight: var(--font-weight);
}
.u-fwr {
	font-weight: var(--font-weight-reg);
}
.u-fwm {
	font-weight: var(--font-weight-medium);
}
.u-fwb {
	font-weight: var(--font-weight-bold);
}
.u-fzs {
	font-size: 1.4rem;
	line-height: calc(26 / 14);
	@media screen and (max-width: 743px) {
		font-size: 1.2rem;
		line-height: calc(25 / 12);
	}
}
.u-wsnw {
	white-space: nowrap;
}
@media screen and (min-width: 744px), print {
	.u-pc_wsnw {
		white-space: nowrap;
	}
}
@media screen and (max-width: 743px) {
	.u-sp_wsnw {
		white-space: nowrap;
	}
}

/* display
====================================================================== */
.u-db {
	display: block;
}
.u-dib {
	display: inline-block;
}
.u-dfcc {
	display: flex !important;
	justify-content: center;
	align-items: center;
}
@media screen and (min-width: 744px), print {
	.u-pc_dib {
		display: inline-block;
	}
	.u-pc_dfcc {
		display: flex !important;
		justify-content: center;
		align-items: center;
	}
}
@media screen and (max-width: 743px) {
	.u-sp_dib {
		display: inline-block;
	}
	.u-sp_dfcc {
		display: flex !important;
		justify-content: center;
		align-items: center;
	}
}

/* object-fit
====================================================================== */
img.u-of {
	width: 100%;
	height: 100%;
	object-fit: cover;
	&.-abs {
		position: absolute;
		top: 0;
		left: 0;
	}
	&.-bg {
		pointer-events: none;
		user-select: none;
		z-index: -1;
	}
	&.-top {
		object-position: 50% 0;
	}
	&.-bottom {
		object-position: 50% 100%;
	}
	&.-contain {
		object-fit: contain;
	}
	@media screen and (min-width: 744px), print {
		&.-pc_none {
			object-fit: none;
		}
		&.-pc_top {
			object-position: 50% 0;
		}
		&.-pc_bottom {
			object-position: 50% 100%;
		}
	}
	@media screen and (max-width: 743px) {
		&.-sp_top {
			object-position: 50% 0;
		}
		&.-sp_bottom {
			object-position: 50% 100%;
		}
	}
}
@media screen and (min-width: 744px), print {
	img.u-pc_of {
		width: 100%;
		height: 100%;
		object-fit: cover;
		&.-abs {
			position: absolute;
			top: 0;
			left: 0;
		}
		&.-bg {
			pointer-events: none;
			user-select: none;
			z-index: -1;
		}
		&.-top {
			object-position: 50% 0;
		}
		&.-none {
			object-fit: none;
		}
	}
}
@media screen and (max-width: 743px) {
	img.u-sp_of {
		width: 100%;
		height: 100%;
		object-fit: cover;
		&.-abs {
			position: absolute;
			top: 0;
			left: 0;
		}
		&.-bg {
			pointer-events: none;
			user-select: none;
			z-index: -1;
		}
		&.-top {
			object-position: 50% 0;
		}
	}
}

/* hover
====================================================================== */
@media (hover) {
	a[href] .u-hv-op {
		transition: opacity var(--transition);
	}
	a:is([href], [data-modal]).u-hv-op:hover,
	a[href]:hover .u-hv-op,
	button.u-hv-op:hover,
	.u-hv-op a[href]:hover,
	.u-hv-op button:hover {
		opacity: 0.7;
	}
	a[href].u-hv-op.-a50:hover,
	a[href]:hover .u-hv-op.-a50,
	.u-hv-op.-a50 a[href]:hover {
		opacity: 0.5;
	}
	a[href].u-hv-op.-a20:hover,
	a[href]:hover .u-hv-op.-a20,
	.u-hv-op.-a20 a[href]:hover {
		opacity: 0.8;
	}
	a[href].u-hv-op.-a10:hover,
	a[href]:hover .u-hv-op.-a10,
	.u-hv-op.-a10 a[href]:hover {
		opacity: 0.9;
	}
}

.u-hv-zoom {
	position: relative;
	display: block;
	overflow: hidden;
	& > * {
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		background-repeat: no-repeat;
		background-position: 50%;
		background-size: cover;
	}
	&.-static > * {
		position: relative;
	}
}
@media (hover) {
	a[href].u-hv-zoom > *,
	a[href] .u-hv-zoom > * {
		transition: transform 0.5s, opacity .3s;
	}
	a[href]:hover .u-hv-zoom.-s > * {
		transform: scale(1.03);
	}
	a[href]:hover .u-hv-zoom.-l > * {
		transform: scale(1.1);
	}
	a[href]:hover.u-hv-zoom > *,
	a[href]:hover .u-hv-zoom > * {
		transform: scale(1.05);
	}
}


/* _target
====================================================================== */
.u-target {
	display: block;
	scroll-margin-top: var(--target-margin);
}
:where([id]:not(style):not(script)) {
	scroll-margin-top: var(--target-margin);
}
:where([id].u-scroll-margin-top0, #top) {
	scroll-margin-top: 0 !important;
}
:where([id].u-scroll-margin-top-fit) {
	scroll-margin-top: 0;
}

/* w
====================================================================== */
.u-w {
	position: relative;
	@media screen and (min-width: 744px), print {
		width: var(--base-width);
		margin-inline: auto;
	}
}
.u-pw {
	@media screen and (min-width: 744px), print {
		padding-inline: calc((100% - var(--base-width)) / 2);
	}
}

/* spパディング
====================================================================== */
@media screen and (max-width: 743px) {
	.u-sp-pd {
		padding-inline: var(--sp-base-padding) !important;
	}
	.u-sp-mg {
		margin-inline: var(--sp-base-padding) !important;
	}
	.u-sp-full {
		margin-inline: calc(var(--sp-base-padding) * -1) !important;
	}
	.u-sp-full_l {
		margin-left: calc(var(--sp-base-padding) * -1) !important;
	}
	.u-sp-full_r {
		margin-right: calc(var(--sp-base-padding) * -1) !important;
	}
	.u-sp-pd-l {
		padding-inline: 3rem !important;
	}
}

/* keyframes
====================================================================== */
@keyframes slide-loop {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}
@keyframes slide-loop-reverse {
	from {
		transform: translateX(-50%);
	}
	to {
		transform: translateX(0);
	}
}

/* btn
====================================================================== */
.c-tel-btn {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 25rem;
	height: 5.5rem;
	padding-top: 0.3rem;
	padding-left: 2rem;
	background-color: #fff;
	border-radius: 5.5rem;
	text-decoration: none;
	&::before {
		content: "";
		position: absolute;
		width: 2.8rem;
		height: 2.8rem;
		left: 2.6rem;
		top: 1.8rem;
		background: url(../img/ico-tel.svg) no-repeat 50%;
		background-size: 100%;
	}
	.label {
		font-size: 1.1rem;
		line-height: 1.2;
		color: var(--color-theme);
	}
	.number {
		margin-top: 0.3rem;
		font-size: 2.4rem;
		line-height: 1;
		font-family: var(--font-family-num);
		font-weight: 600;
		letter-spacing: 0;
	}
	&.-border {
		border: 1px solid var(--color-theme);
	}
	@media screen and (min-width: 744px), print {
		&.-l {
			width: 30rem;
			height: 6.6rem;
			&::before {
				transform-origin: 0 0;
				transform: scale(1.3);
			}
			.label {
				font-size: 1.3rem;
			}
			.number {
				margin-top: 0.5rem;
				font-size: 2.7rem;
			}
		}
	}
	@media screen and (max-width: 743px) {
		width: 33rem;
		height: 7.4rem;
		padding-top: 0.1rem;
		padding-left: 3rem;
		margin-inline: auto;
		&::before {
			width: 3.8rem;
			height: 3.8rem;
			left: 3.5rem;
			top: 2.2rem;
		}
		.label {
			font-size: 1.6rem;
		}
		.number {
			margin-top: 0.5rem;
			font-size: 3.1rem;
		}
	}
}
.c-reserve-btn {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 25rem;
	height: 5.5rem;
	background-color: var(--color-theme);
	border-radius: 5.5rem;
	text-decoration: none;
	color: #fff;
	&::before {
		content: "";
		position: absolute;
		width: 2.6rem;
		height: 2.6rem;
		left: 3rem;
		top: 0;
		bottom: 0;
		margin-block: auto;
		background: url(../img/ico-calendar-white.svg) no-repeat 50%;
		background-size: 100%;
	}
	&::after {
		content: "";
		position: absolute;
		width: 2rem;
		height: 2rem;
		right: 3.4rem;
		top: 0;
		bottom: 0;
		margin-block: auto;
		background: url(../img/ico-blank-white.svg) no-repeat 50%;
		background-size: 100%;
	}
	.label {
		font-size: 1.8rem;
		line-height: 1.2;
		color: #fff;
	}
	@media (hover) {
		&:hover {
			background-color: var(--color-peach);
		}
	}
	@media screen and (min-width: 744px), print {
		&.-l {
			width: 30rem;
			height: 6.6rem;
			&::before {
				left: 4rem;
				transform: scale(1.3);
			}
			&::after {
				right: 4rem;
				transform: scale(1.3);
			}
			.label {
				font-size: 2.1rem;
			}
		}
	}
	@media screen and (max-width: 743px) {
		width: 33rem;
		height: 7.4rem;
		margin-inline: auto;
		&::before {
			width: 3.6rem;
			height: 3.6rem;
			left: 4.8rem;
		}
		&::after {
			width: 3rem;
			height: 3rem;
			right: 4.8rem;
		}
		.label {
			font-size: 2.5rem;
		}
	}
}
.c-reserve-btn-large {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	height: 10rem;
	padding-bottom: 1rem;
	background-color: var(--color-theme);
	border-radius: 1.8rem;
	color: #fff;
	text-decoration: none;
	font-size: 2.2rem;
	line-height: 1.5;
	font-weight: var(--font-weight-bold);
	.notes {
		position: absolute;
		right: 0;
		left: 0;
		top: calc(50% + 1.5rem);
		font-size: 1.5rem;
		font-weight: var(--font-weight);
	}
	@media (hover) {
		&:hover {
			background-color: var(--color-peach);
		}
	}
	@media screen and (min-width: 744px), print {
		.txt {
			position: relative;
			padding-right: 3.4rem;
			&::after {
				content: "";
				position: absolute;
				width: 2.4rem;
				height: 2.4rem;
				right: 0;
				top: 0;
				bottom: 0;
				margin-block: auto;
				background: url(../img/ico-blank-white.svg) no-repeat 50%;
				background-size: 100%;
			}
		}
		&.-tall {
			height: 13rem;
		}
	}
	@media screen and (max-width: 743px) {
		height: 14rem;
		font-size: 1.9rem;
		line-height: calc(29 / 19);
		.notes {
			bottom: 3rem;
		}
		&::after {
			content: "";
			position: absolute;
			width: 2.4rem;
			height: 2.4rem;
			right: 1.5rem;
			top: 1.5rem;
			background: url(../img/ico-blank-white.svg) no-repeat 50%;
			background-size: 100%;
		}
		&.-tall {
			height: 16rem;
			padding-bottom: 3rem;
			.notes {
				top: calc(50% + 2rem);
			}
		}
	}
}

/* body fadein fadeout
====================================================================== */
body > * {
	opacity: 0;
	animation: fadein 1s linear forwards;
}
html.is-page-leaving body {
	animation: fadeout .3s linear forwards;
}
@keyframes fadein {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes fadeout {
	0% {opacity: 1;}
	100% {opacity: 0;}
}
#loading {
	position: absolute;
	inset: 0 0 auto;
	height: 100dvh;
	z-index: 2;
	visibility: visible;
	opacity: 1;
	z-index: -1;
	&::after {
		content: "";
		position: absolute;
		inset: 0;
		width: 6rem;
		height: 6rem;
		margin: auto;
		border-top: 1rem solid #f8c9b5;
		border-right: 1rem solid #f8c9b5;
		border-bottom: 1rem solid #f8c9b5;
		border-left: 1rem solid #ed8968;
		border-radius: 100%;
		transform: translateZ(0);
		animation: loading 1.1s infinite linear;
	}
}
#loading.is-hide {
	opacity: 0;
	transition: opacity .3s linear;
	pointer-events: none;
}

@keyframes loading {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(360deg);}
}



/* l-header
====================================================================== */
.l-header {
	position: fixed;
	inset: 0 0 auto;
	display: flex;
	align-items: center;
	height: var(--header-height);
	padding-right: 15.5rem;
	transition: transform .4s ease, var(--body-transition);
	z-index: 900;
	&.is-hide {
		transform: translateY(-100%);
	}
	.logo {
		width: 17.4rem;
	}
	.bnav {
		display: flex;
		margin-left: auto;
		gap: 1.8rem;
	}
	@media print {
		position: absolute;
	}
	@media screen and (min-width: 744px), print {
		padding-left: calc(60 / 1300 * 100%);
		.c-reserve-btn {
			width: 23rem;
		}
	}
	@media screen and (max-width: 743px) {
		padding-right: 6.2rem;
		.logo {
			width: 12rem;
			a {
				display: block;
				padding: .5rem 1rem;
			}
		}
		.bnav {
			display: flex;
			margin-left: auto;
			gap: 1rem;
			.c-tel-btn {
				width: 3.4rem;
				height: 3.4rem;
				span {
					display: none;
				}
				&::before {
					width: 100%;
					height: 100%;
					left: 0;
					top: 0;
					background-size: 55%;
				}
			}
			.c-reserve-btn {
				width: 11rem;
				height: 3.4rem;
				&::before {
					width: 1.6rem;
					height: 1.6rem;
					left: 1.5rem;
				}
				&::after {
					width: 1.4rem;
					height: 1.4rem;
					right: 1.5rem;
				}
				.label {
					display: block;
					position: relative;
					overflow: hidden;
					width: 100%;
					font-size: 1.2rem;
					text-indent: -999em;
					&::after {
						content: "予約";
						position: absolute;
						inset: 0;
						text-indent: 0;
						text-align: center;
					}
				}
			}
		}
	}
}


/* l-nav
====================================================================== */
.l-nav {
	position: fixed;
	right: 0;
	top: 0;
	z-index: 9990;
	.menu-btn {
		position: fixed;
		right: 0;
		top: 0;
		z-index: 9990;
		button {
			--ls: .1em;
			position: relative;
			display: block;
			width: 9rem;
			height: var(--header-height);
			padding-top: 4.2rem;
			padding-left: var(--ls);
			font-size: 1.4rem;
			line-height: 1;
			font-family: var(--font-family-num);
			font-weight: 600;
			color: #fff;
			span {
				overflow: hidden;
				position: relative;
				display: block;
				text-align: left;
				text-indent: -999em;
				&::before,
				&::after {
					position: absolute;
					right: 0;
					left: 0;
					top: 0;
					text-align: center;
					text-indent: 0;
					transition: transform var(--transition);
				}
				&::before {
					content: "menu";
				}
				&::after {
					content: "close";
					top: -1lh;
				}
			}
		}
		&::after,
		button::before,
		button::after {
			content: "";
			position: absolute;
			width: 4rem;
			height: .8rem;
			left: 0;
			right: 0;
			top: calc(50% - 1.1rem);
			margin-inline: auto;
			background: url(../img/ico-menu.svg) no-repeat 50%;
			background-size: 100%;
			pointer-events: none;
			transition: transform var(--transition), opacity var(--transition), clip-path var(--transition);
			z-index: 2;
		}
		button::before {
			transform: translateY(-1.2rem);
		}
		button::after {
			transform: translateY(1.2rem);
		}
	}
	.bg {
		position: fixed;
		right: -10rem;
		top: -4rem;
		width: 20rem;
		height: 15rem;
		z-index: 9970;
		svg {
			position: absolute;
			bottom: 0;
			left: calc((((1180 / 200) * 20rem) - 20rem) / 2 * -1);
			width: 20rem;
			height: 15rem;
			transform-origin: 50% 100%;
			fill: var(--color-navy);
			transition: fill var(--transition), transform .6s cubic-bezier(0.25, 1.2, 0.5, 1);
			width: calc((1180 / 200) * 20rem);
			height: calc((1180 / 200) * 15rem);
			transform: scale(calc(200 / 1180));
		}
	}
	@media (hover) {
		&:has(.menu-btn button:hover):not(.is-open) .bg {
			svg {
				transform: translate(-1rem, 1rem) scale(calc(200 / 1180));
				fill: var(--color-theme);
			}
		}
	}
	&.is-open {
		.menu-btn {
			&::after {
				opacity: 0;
			}
			button {
				&::before {
					transform: translateY(0rem) rotate(-45deg);
				}
				&::after {
					clip-path: inset(-1px);
					transform: translateY(0rem) rotate(45deg);
				}
				span {
					&::before,
					&::after {
						transform: translateY(1lh);
					}
				}
			}
		}
		.bg {
			svg {
				transition-duration: 0.8s;
				transition-timing-function: cubic-bezier(0.25, 1.3, 0.5, 1);
				transform: translate(10rem,37rem) scale(calc(1180 / 200)) rotate(-90deg);
				transform: translate(10rem,37rem) scale(1) rotate(-90deg);
			}
		}
	}
	.nav {
		position: fixed;
		top: 0;
		right: 0;
		width: 50rem;
		height: 100dvh;
		max-height: 95rem;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		padding-bottom: 10rem;
		overflow-y: auto;
		overscroll-behavior: contain;
		z-index: 9980;
		.logo {
			flex-shrink: 0;
			display: flex;
			align-items: center;
			width: 17.4rem;
			height: var(--header-height);
		}
		.gnav {
			a {
				display: block;
				padding-block: 2rem;
				color: #fff;
				text-decoration: none;
				font-size: 2.4rem;
				line-height: 1.5;
				font-weight: 700;
				@media (hover) {
					&:hover {
						color: var(--color-theme);
					}
				}
			}
		}
		.cnav {
			display: flex;
			flex-direction: column;
			gap: 6rem;
			margin-top: 3rem;
		}
	}

	.nav {
		opacity: 0;
		pointer-events: none;
		transform: translateX(2rem);
		transition: transform .1s ease-out, opacity .1s ease-out;
	}
	&.is-open {
		.nav {
			transition: transform .5s .2s cubic-bezier(0.25, 1.3, 0.5, 1), opacity  .3s .2s linear;
			transform: translateX(0);
			opacity: 1;
			pointer-events: auto;
		}
	}
	@media screen and (min-width: 744px), print {
		.nav {
			padding-bottom: clamp(6rem, calc(10rem - (90rem - 100dvh) * .2), 10rem);
			.gnav {
				a {
					padding-block: clamp(1.2rem, calc(2rem - (90rem - 100dvh) * .04), 2rem);
				}
			}
			.cnav {
				gap: clamp(2rem, calc(6rem - (90rem - 100dvh) * .2), 6rem);
			}
		}
	}
	@media screen and (max-width: 743px) {
		.menu-btn {
			button {
				width: 4.5rem;
				padding-top: 2.2rem;
				font-size: 1rem;
				line-height: 1;
			}
			&::after,
			button::before,
			button::after {
				width: 3rem;
				top: calc(50% - 1.1rem);
			}
			button::before {
				transform: translateY(-.7rem);
			}
			button::after {
				transform: translateY(.7rem);
			}
		}
		.bg {
			right: -6rem;
			top: -2rem;
			width: 12rem;
			height: 8rem;
			svg {
				left: calc((((1180 / 200) * 12rem) - 12rem) / 2 * -1);
				width: calc((1180 / 200) * 12rem);
				height: calc((1180 / 200) * 8rem);
			}
		}
		&.is-open {
			.bg {
				svg {
					transform: translate(28rem,28rem) scale(1.8) rotate(-90deg);
				}
			}
		}
		.nav {
			width: 100vw;
			height: 100dvh;
			max-height: 73rem;
			padding-bottom: 5rem;
			.logo {
				width: 12rem;
				height: auto;
				a {
					display: block;
					padding: .5rem 1rem;
				}
			}
			.gnav {
				a {
					padding: 1.8rem 4rem;
					font-size: 2rem;
					text-align: center;
					padding-block: clamp(1.2rem, calc(1.8rem - (73rem - 100dvh) * .06), 1.8rem);
				}
			}
			.cnav {
				gap: 2rem;
				margin-top: 3rem;
			}
		}
	}
}


/* footer
====================================================================== */
.l-footer {
	position: relative;
	.footer-info {
		position: relative;
		padding-bottom: 15rem;
		background-color: #fff;
		isolation: isolate;
		&::before,
		&::after {
			content: "";
			position: absolute;
			right: 0;
			left: 0;
			height: 8rem;
			background-repeat: no-repeat;
			background-size: max(100%, 130rem) 8rem;
			z-index: -1;
		}
		&::before {
			top: -.6rem;
			background-position: 50% 0%;
			background-image: url(../img/foot-bg-t.svg);
		}
		&::after {
			bottom: -2px;
			background-position: 50% 100%;
			background-image: url(../img/foot-bg-b.svg);
		}
		.logo {
			width: 15rem;
			margin-inline: auto;
			margin-bottom: 12rem;
		}
		.info {
			table {
				width: 100%;
				table-layout: fixed;
				font-size: 1.7rem;
				line-height: 1.5;
				th, td {
					height: 4rem;
					vertical-align: middle;
				}
				thead {
					th {
						font-size: 1.9rem;
						text-align: center;
						&:first-child {
							width: calc(130 / 500 * 100%);
							text-align: left;
							font-weight: var(--font-weight-bold);
							font-size: 2rem;
						}
					}
				}
				tbody {
					td {
						text-align: center;
						color: var(--color-theme);
						font-size: 120%;
					}
				}
			}
			.table-notes {
				margin-top: 2rem;
				font-size: 1.5rem;
				line-height: 1.6;
			}
			.btns {
				margin-top: 5rem;
			}
		}
		.access {
			iframe {
				width: 100%;
				height: 18.2rem;
				border-radius: 1.8rem;
			}
		}
		.sns {
			margin-top: 2rem;
			display: flex;
			justify-content: flex-end;
			a {
				display: block;
				width: 3rem;
			}
		}
		nav {
			a {
				color: var(--color-theme);
				text-decoration: none;
				@media (hover) {
					&:hover {
						color: var(--color-peach);
					}
				}
			}
		}
	}
	.footer-bottom {
		position: relative;
		margin-top: 2.5rem;
		padding-bottom: 9rem;
		.logo-mark {
			width: 15.5rem;
		}
		.copy {
			color: var(--color-theme);
			font-size: 2.6rem;
			line-height: 1.5;
		}
		.map {
			position: absolute;
			top: -1.6rem;
			left: 24.4rem;
			width: 12rem;
			z-index: -1;
		}
		small {
			color: var(--color-theme);
			font-size: 1.3rem;
			line-height: 1.5;
		}
	}
	@media screen and (min-width: 744px), print {
		.footer-info {
			.info-contents {
				max-width: var(--base-width);
				margin-inline: auto;
				display: flex;
				flex-wrap: wrap;
				justify-content: space-between;
			}
			.info {
				width: 50rem;
				.btns {
					display: flex;
					justify-content: space-between;
					.c-reserve-btn {
						width: 23rem;
					}
				}
			}
			.access {
				width: 50rem;
				dl {
					display: flex;
					align-items: center;
					gap: 5rem;
					margin-top: 2.5rem;
					font-size: 1.6rem;
					line-height: 1.6;
					dt {
						font-size: 2rem;
						font-weight: var(--font-weight-bold);
					}
				}
			}
			.sns {
				width: 100%;
			}
			nav {
				width: 100%;
				margin-top: 5rem;
				font-size: 1.5rem;
				line-height: 1.6;
				ul {
					display: flex;
					gap: 2em;
				}
			}
		}
		.footer-bottom {
			max-width: 106rem;
			margin-inline: auto;
			display: flex;
			align-items: center;
			gap: 3rem;
			small {
				position: absolute;
				top: 9rem;
				left: 33rem;
			}
		}
	}
	@media screen and (max-width: 743px) {
		.footer-info {
			padding-bottom: 12rem;
			&::before {
				background-position: 50% 0%;
				background-size: 100% 8rem;
			}
			&::after {
				background-position: 24% 100%;
				background-size: 130rem 8rem;
			}
			.logo {
				width: 13rem;
				margin-bottom: 5rem;
			}
			.info {
				padding-inline: 1.5rem;
				table {
					font-size: 1.3rem;
					th, td {
						height: 3rem;
					}
					thead {
						th {
							font-size: 1.4rem;
							&:first-child {
								font-size: 1.5rem;
							}
						}
					}
				}
				.table-notes {
					font-size: 1.4rem;
				}
				.btns {
					display: flex;
					flex-direction: column;
					gap: 3rem;
				}
			}
			.access {
				width: 33rem;
				margin-inline: auto;
				margin-top: 6rem;
				dl {
					margin-top: 2rem;
					font-size: 1.6rem;
					line-height: 1.5;
					dt {
						margin-bottom: 1rem;
						font-weight: var(--font-weight-bold);
					}
				}
			}
			.sns {
				width: 33rem;
				margin-inline: auto;
			}
			nav {
				width: 33rem;
				margin-inline: auto;
				margin-top: 1rem;
				a {
					display: block;
					padding-block: 1rem;
					font-size: 2rem;
				}
			}
		}
		.footer-bottom {
			margin-top: 2.5rem;
			padding-bottom: 10rem;
			.logo-mark {
				margin-inline: auto;
				margin-bottom: 10rem;
			}
			.copy {
				text-align: center;
			}
			.map {
				top: auto;
				bottom: 3rem;
				left: 8rem;
			}
			small {
				display: block;
				text-align: right;
				margin: 2rem 4rem 0;
			}
		}
	}
}
#c-pagetop {
	position: fixed;
	right: 7rem;
	bottom: 3rem;
	width: 7rem;
	opacity: 0;
	pointer-events: none;
	z-index: 100;
	&.-show {
		opacity: 1;
		pointer-events: auto;
	}
	@media screen and (max-width: 743px) {
		right: 3rem;
		bottom: 2rem;
	}
}


/* main
====================================================================== */
.l-main {
	position: relative;
	overflow: clip;
	padding-bottom: 12rem;
	@media screen and (max-width: 743px) {
		padding-bottom: 7rem;
	}
}


/* ===================================================================================================================

	パーツ

============================================================================= */

/* u-bg-pattern
====================================================================== */
.u-bg-pattern {
	position: relative;
	overflow: hidden;
	background-color: #f7c5b0;
	&.-light {
		background-color: #fbddcd;
	}
	&::after {
		content: "";
		position: absolute;
		inset: 0;
		background: url(../img/bg-pattern.jpg) 50%;
		background-size: 25rem;
		mix-blend-mode: overlay;
		-webkit-mask-image: linear-gradient(
			150deg,
			transparent 35%,
			#231815 100%
		);
		mask-image: linear-gradient(
			150deg,
			transparent 35%,
			#231815 100%
		);
	}
}

/* svg
====================================================================== */
.mask-move,
.mask-rotate,
.mask-scale {
	transform-box: fill-box;
	transform-origin: center;
	will-change: transform;
}
.mask-move {
	animation: maskMove 5s ease-in-out infinite;
	&.-s {
		animation: maskMove2 6s -2s ease-in-out infinite;
	}
}
.mask-rotate {
	animation: maskRotate 6s ease-in-out infinite;
	&.-s {
		animation: maskRotate2 8s -3s ease-in-out infinite;
	}
}
.mask-scale {
	animation: maskScale 4.5s ease-in-out infinite;
	&.-s {
		animation: maskScale2 5.5s -3s ease-in-out infinite;
	}
}
.shadow-shrink {
	transform-box: fill-box;
	transform-origin: center;
	transform: scale(0.985);
}
@keyframes maskMove {
	0%, 100% {
		transform: translate(-4px, 2px);
	}
	50% {
		transform: translate(3px, -3px);
	}
}
@keyframes maskRotate {
	0%, 100% {
		transform: rotate(-1.9deg);
	}
	50% {
		transform: rotate(2.1deg);
	}
}
@keyframes maskScale {
	0%, 100% {
		transform: scale(0.99, 1.02);
	}
	50% {
		transform: scale(1.01, 0.98);
	}
}
@keyframes maskMove2 {
	0%, 100% {
		transform: translate(-3px, 1px);
	}
	50% {
		transform: translate(2px, -2px);
	}
}
@keyframes maskRotate2 {
	0%, 100% {
		transform: rotate(-1.2deg);
	}
	50% {
		transform: rotate(1.1deg);
	}
}
@keyframes maskScale2 {
	0%, 100% {
		transform: scale(1, 1.01);
	}
	50% {
		transform: scale(1.01, 0.99);
	}
}

/* js-parallax
====================================================================== */
.js-parallax {
	--base-transform: translate3d(0, 0, 0);
	--parallax-y: 0px;
	--parallax-rotate: 0deg;

	transform: var(--base-transform) translate3d(0, var(--parallax-y), 0) rotate(calc(var(--parallax-rotate) * -1));
	will-change: transform;
}

/* .svg-text
====================================================================== */
.u-svg-text {
	position: absolute;
	height: auto;
	pointer-events: none;
	user-select: none;
	z-index: -1;
	.eng-path-text {
		font-size: 5.3rem;
		font-size: 53px;
		line-height: 1;
		letter-spacing: 0;
		fill: #fff;
		&.-c-peach {
			fill: #f2c2ad;
		}
	}
	.js-path-text-original {
		opacity: 0;
	}
}

/* u-link-arrow
====================================================================== */
.u-link-arrow {
	position: relative;
	display: block;
	width: 1.6rem;
	height: 1.6rem;
	border-radius: 100%;
	background-color: var(--color-navy);
	color: #fff;
	transition: background-color var(--transition), color var(--transition);
	&::after {
		content: "";
		position: absolute;
		top: 50%;
		right: 30%;
		width: 40%;
		height: 40%;
		border-right: 1px solid;
		border-top: 1px solid;
		transform-origin: 100% 0;
		transform: rotate(45deg);
	}
	&.-abs {
		position: absolute;
		right: 0;
		top: 0;
		bottom: 0;
		margin-block: auto;
	}
}

/* u-ico-blank
====================================================================== */
.u-ico-blank {
	position: relative;
	padding-right: 2rem;
	&::after {
		content: "";
		position: absolute;
		width: 2rem;
		height: 2rem;
		right: 0;
		top: 0;
		bottom: 0;
		margin-block: auto;
		background: url(../img/ico-blank.svg) no-repeat 50%;
		background-size: 100%;
	}
}

/* c-point-mask
====================================================================== */
.c-point-mask {
	position: absolute;
	z-index: -1;
	.point-bg {
		width: 100%;
		aspect-ratio: 35 / 45.6;
		background-color: #f7c5b0;
		-webkit-mask-image: url("../img/point-bean.svg");
		-webkit-mask-repeat: no-repeat;
		-webkit-mask-position: center;
		-webkit-mask-size: contain;
		mask-image: url("../img/point-bean.svg");
		mask-repeat: no-repeat;
		mask-position: center;
		mask-size: contain;
		&::after {
			content: "";
			position: absolute;
			inset: 0;
			background: url(../img/bg-pattern.jpg) 50%;
			background-size: 25rem;
			mix-blend-mode: overlay;
			-webkit-mask-image: linear-gradient(
				150deg,
				transparent 35%,
				#231815 100%
			);
			mask-image: linear-gradient(
				150deg,
				transparent 35%,
				#231815 100%
			);
		}
	}
}

/* c-page-heading
====================================================================== */
.c-page-heading {
	position: relative;
	height: 71rem;
	h1, .title {
		position: absolute;
		display: flex;
		align-items: center;
		justify-content: center;
		height: 42rem;
		top: 9rem;
		right: calc(50% + 37rem);
		font-size: 3.6rem;
		line-height: 1.5;
		writing-mode: vertical-rl;
		white-space: nowrap;
		&.-long {
			height: 46rem;
		}
	}
	.page-title-svg {
		position: absolute;
		top: 5.4rem;
		left: calc(50% - 30.4rem);
		width: 98.4rem;
		height: 78rem;
		 path {
			fill: #fff;
		}
	}
	.point {
		width: 35rem;
		top: 16.8rem;
		right: calc(50% + 16.2rem);
	}
	@media screen and (max-width: 743px) {
		height: 50rem;
		h1, .title {
			top: 5rem;
			height: 28rem;
			right: calc(50% + 12rem);
			font-size: 2.4rem;
			&.-long {
				height: 32rem;
			}
		}
		.page-title-svg {
			top: -9.4rem;
			left: calc(50% - 39.4rem);
			transform: scale(calc(400 / 884));
		}
		.point {
			top: 2.8rem;
			right: calc(50% - 6.8rem);
			transform: scale(calc(225 / 350));
		}
	}
	.page-title-img {
		position: absolute;
		pointer-events: none;
		user-select: none;
		&.-privacy {
			top: 10rem;
			width: 100rem;
			left: calc(50% - 19.6rem);
			@media screen and (max-width: 743px) {
				top: 16rem;
				width: 30rem;
				left: auto;
				right: 0;
			}
		}
		&.-sitemap {
			top: 16.6rem;
			width: 70rem;
			left: calc(50% - 16rem);
			z-index: -2;
			@media screen and (max-width: 743px) {
				top: 14rem;
				width: 30rem;
				left: auto;
				right: 0;
				z-index: 1;
			}
		}
		&.-contact {
			top: 15.2rem;
			width: 56rem;
			left: calc(50% - 13rem);
			@media screen and (max-width: 743px) {
				top: 11rem;
				width: 30rem;
				left: auto;
				right: 0;
			}
		}
		&.-info {
			top: 15.5rem;
			width: 75rem;
			left: calc(50% - 15.8rem);
			z-index: -2;
			@media screen and (max-width: 743px) {
				top: 10.4rem;
				width: 28rem;
				left: auto;
				right: 0;
				z-index: 1;
			}
		}
	}
	.title404 {
		position: absolute;
		inset: auto 0 4rem;
		width: 96rem;
		margin-inline: auto;
		pointer-events: none;
		user-select: none;
		@media screen and (max-width: 743px) {
			left: 50%;
			width: 64rem;
			transform: translateX(-50%);
		}
	}
}

/* c-breadcrumbs
====================================================================== */
.c-breadcrumbs {
	max-width: 102rem;
	margin-inline: auto;
	margin-bottom: 4rem;
	font-size: 1.4rem;
	line-height: 1.6;
	z-index: 2;
	ol {
		display: flex;
		li {
			position: relative;
			padding-inline: 1.5rem;
			a {
				--a-color: var(--color-peach);
			}
			&:first-child {
				padding-left: 0;
			}
			&:last-child {
				padding-right: 0;
				a {
					color: var(--color-base);
				}
			}
			& + li::before {
				content: "";
				position: absolute;
				top: 50%;
				left: 0;
				width: 0.8rem;
				height: 0.8rem;
				border-top: 1px solid var(--color-peach);
				border-right: 1px solid var(--color-peach);
				transform: translate(-50%, -50%) rotate(45deg);
			}
		}
	}
	@media screen and (max-width: 743px) {
		overflow-x: auto;
		white-space: nowrap;
		ol {
			padding-inline: 2rem;
			padding-bottom: 1rem;
			li:last-child {
				padding-right: 2rem;
			}
		}
		.c-bg-contents & {
			ol {
				padding-left: 5rem;
			}
		}
	}
}

/* main-eng
====================================================================== */
.c-main-eng {
	position: relative;
	pointer-events: none;
	user-select: none;
	height: 20rem;
	.u-svg-text {
		top: 0;
		left: calc(50% - 72rem);
		width: 126rem;
		z-index: 3;
	}
	@media screen and (max-width: 743px) {
		height: 8rem;
		.u-svg-text {
			left: -8rem;
			width: 49rem;
			.eng-path-text {
				font-size: 76px;
			}
		}
	}
}

/* c-bg-contents
====================================================================== */
.c-bg-contents {
	position: relative;
	padding-bottom: 15rem;
	&::before  {
		content: "";
		position: absolute;
		inset: -4rem 0 0;
		isolation: isolate;
		background-color: #fff;
		border-radius: 20rem 0 0 20rem;
		z-index: -1;
	}
	@media screen and (max-width: 743px) {
		padding-bottom: 12rem;
		&::before  {
			inset: -4rem 0 0;
			border-radius: 10rem 0 0 10rem;
		}
	}
}

/* title
====================================================================== */
.c-title-m {
	font-size: 3rem;
	line-height: 2.4;
	font-weight: var(--font-weight-bold);
	&.-mb {
		margin-bottom: 3rem;
	}
	@media screen and (max-width: 743px) {
		font-size: 2.2rem;
	}
}

/* c-page-lead
====================================================================== */
.c-page-lead {
	position: relative;
	max-width: 84rem;
	margin-inline: auto;
	& > * {
		position: relative;
		z-index: 4;
	}
	&.-center {
		.lead {
			text-align: center;
		}
	}
	@media screen and (min-width: 744px), print {
		&.-center {
			text-align: center;
		}
	}
	@media screen and (max-width: 743px) {
		margin-inline: var(--sp-base-padding);
	}
}

/* btn
====================================================================== */
.c-btn {
	position: relative;
	display: flex;
	width: 32.8rem;
	text-decoration: none;
	font-size: 1.8rem;
	line-height: 1.5;
	font-weight: var(--font-weight-bold);
	color: #fff;
	.txt {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 25.4rem;
		height: 8rem;
		padding-left: 1rem;
		background-color: var(--color-theme);
		border-radius: 4rem 1.5rem 1.5rem 4rem;
	}
	&::after {
		content: "";
		width: 6.4rem;
		height: 8rem;
		margin-left: auto;
		background: url(../img/btn-arrow.png) no-repeat 50%;
		background-size: 100%;
	}
	&.-center {
		margin-inline: auto;
	}
	&.-back {
		flex-direction: row-reverse;
		.txt {
			padding-left: 0;
			padding-right: 1rem;
			background-color: var(--color-peach);
			border-radius: 1.5rem 4rem 4rem 1.5rem;
		}
		&::after {
			margin-left: 0;
			margin-right: auto;
			transform: scaleX(-1);
		}
	}
	@media (hover) {
		.txt {
			transition: background-color var(--transition), opacity var(--transition);
		}
		&::after {
			transition: transform var(--transition);
		}
		&:hover {
			.txt {
				background-color: var(--color-peach);
			}
			&::after {
				transform: translateX(.5rem);
			}
		}
		&.-back {
			&:hover {
				.txt {
					opacity: 0.7;
				}
				&::after {
					transform: scaleX(-1) translateX(.5rem);
				}
			}
		}
	}
	@media screen and (min-width: 744px), print {
	}
	@media screen and (max-width: 743px) {
		width: 30rem;
		margin-inline: auto;
		font-size: 1.7rem;
		.txt {
			width: 23.3rem;
			height: 7.4rem;
		}
		&::after {
			width: calc((7.4 / 8) * 6.4rem);
			height: calc((7.4 / 8) * 8rem);
		}
	}
}

/* arrow-link
====================================================================== */
.c-arrow-link {
	display: flex;
	align-items: center;
	gap: 1em;
	text-decoration: none;
	color: var(--color-navy);
	font-size: 1.5rem;
	line-height: 1.5;
	@media (hover) {
		&:hover {
			color: var(--color-peach);
			.u-link-arrow {
				background-color: var(--color-peach);
			}
		}
	}
}

/* blank-link
====================================================================== */
.c-blank-link {
	position: relative;
	color: var(--color-theme);
	&::after {
		content: "";
		display: inline-block;
		width: 2.2rem;
		height: 2.2rem;
		margin-left: 0.4rem;
		background: url(../img/ico-blank.svg) no-repeat 50%;
		background-size: 100%;
		vertical-align: -.2em;
	}
}

/* inner-nav
====================================================================== */
.c-inner-nav {
	ul {
		display: flex;
		justify-content: center;
		gap: 2rem;
		a {
			position: relative;
			display: block;
			padding: 0.8rem 3rem;
			background-color: #fff;
			border-radius: 999rem;
			border: 1px solid var(--color-theme);
			color: var(--color-theme);
			font-size: 1.9rem;
			line-height: 1.5;
			text-decoration: none;
			@media (hover) {
				&:hover {
					background-color: var(--color-theme);
					color: #fff;
				}
			}
		}
		@media screen and (min-width: 744px), print {
		}
		@media screen and (max-width: 743px) {
			flex-direction: column;
			gap: 1.5rem;
			a {
				text-align: center;
				display: block;
				padding: 1rem 2rem 1rem 1rem;
				font-size: 2rem;
				&::after {
					content: "";
					position: absolute;
					right: 3rem;
					height: 1.8rem;
					width: 1.8rem;
					border-right: 2px solid;
					border-bottom: 2px solid;
					transform: rotate(45deg);
				}
			}
		}
	}
}

/* wave-box
====================================================================== */
.c-wave-box {
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, transparent var(--bg-offset), var(--wave-bg, #fff) var(--bg-offset), var(--wave-bg, #fff) calc(100% - var(--bg-offset)), transparent calc(100% - var(--bg-offset)));
	z-index: -1;
	&::before,
	&::after {
		content: "";
		position: absolute;
		inset: 0;
		height: var(--wave-height);
		background-position: 50%;
		background-repeat: no-repeat;
		background-size: var(--bg-size, max(130rem,100%)) var(--wave-height);
		z-index: -1;
	}
	&::before {
		bottom: auto;
	}
	&::after {
		top: auto;
	}
	&.-type1,
	&.-type3 {
		--wave-height: 30rem;
		--bg-offset: 28rem;
		&::before {
			background-image: url(../img/wave-bg1-top.svg);
		}
		&::after {
			background-image: url(../img/wave-bg1-bottom.svg);
		}
	}
	&.-type2 {
		--wave-height: 10rem;
		--bg-offset: 9rem;
		&::before {
			background-image: url(../img/wave-bg2-top.svg);
		}
		&::after {
			background-image: url(../img/wave-bg2-bottom.svg);
		}
	}
	&.-type-blue1 {
		--wave-height: 10rem;
		--wave-bg: var(--color-theme);
		--bg-offset: 9rem;
		&::before {
			background-image: url(../img/wave-bg-blue1-top.svg);
		}
		&::after {
			background-image: url(../img/wave-bg-blue1-bottom.svg);
		}
	}
	&.-shadow {
		filter: drop-shadow(0 .8rem 1.6rem rgba(228,156,133,.3));
	}
	&.-invert {
		transform: scaleX(-1);
	}
	@media screen and (max-width: 743px) {
		&.-type2,
		&.-type-blue1 {
			--wave-height: 3rem;
			--bg-offset: 2.5rem;
			--bg-size: 100%;
		}
		&.-type3 {
			--bg-offset2: 2.8rem;
			background: linear-gradient(to bottom, transparent var(--bg-offset), #fff var(--bg-offset), #fff calc(100% - var(--bg-offset2)), transparent calc(100% - var(--bg-offset2)));
			&::after {
				--wave-height: 3rem;
				--bg-size: 100%;
				background-image: url(../img/wave-bg2-bottom.svg);
				transform: scaleX(-1);
			}
		}
	}
}

/* acc
====================================================================== */
.c-acc {
	overflow: hidden;
	height: 0;
	transition: height var(--transition);
}


/* basic_dl_table
====================================================================== */
/*
.basic_dl_table {
	& > dl {
		display: flex;
		background-color: var(--bg-base);
		&:not(:last-child) {
			margin-bottom: 2px;
		}
		& > * {
			padding: 1.2rem 2.4rem;
		}
		& > dt {
			width: 24rem;
			display: flex;
			align-items: center;
			flex-shrink: 0;
			background-color: var(--color-lightblue);
			border-right: 2px solid #fff;
		}
		@media screen and (max-width: 743px) {
			& > * {
				padding: 1rem 1.6rem;
			}
			& > dt {
				@media screen and (max-width: 743px) {
					width: 11rem;
				}
			}
		}
	}
	&.-sp-vertical {
		@media screen and (max-width: 743px) {
			& > dl {
				display: block;
				& > * {
					padding: 1rem 2rem;
				}
				& > dt {
					width: auto;
				}
			}
		}
	}
}
*/

/* paragraph
====================================================================== */
.u-paragraph > * + * {
	margin-top: 1lh;
}
.u-paragraph.-m > * + * {
	margin-top: .7lh;
}

/* c-doctor-intro
====================================================================== */
.c-doctor-intro {
	position: relative;
	.doctor-svg-text {
		top: -15rem;
		right: 0;
		left: 2rem;
		width: 100.2rem;
		margin-inline: auto;
	}
	h2 {
		margin-bottom: 8rem;
		text-align: center;
		font-size: 3.4rem;
		line-height: 1.5;
	}
	.doctor-contents {
		max-width: 97rem;
		margin-inline: auto;
		.ph {
			position: relative;
			img {
				display: block;
				border-radius: 1.8rem 1.8rem 1.8rem 8rem;
				box-shadow: 0 .8rem 1.6rem rgba(228,156,133,.3);
			}
			.doctor-name {
				width: 34.2rem;
				left: -5rem;
				bottom: -5rem;
				z-index: 2;
				.eng-path-text {
					font-size: 26px;
				}
			}
		}
		.info {
			padding: 5rem 3rem;
			background-color: #fff;
			border-radius: 1.8rem 8rem 8rem 1.8rem;
			dl {
				display: grid;
				grid-template-columns: 8rem 1fr;
				gap: 3rem 0;
				dt {
					font-size: 2rem;
					line-height: 1.8;
				}
				dd {
					font-size: 1.5rem;
					line-height: calc(35 / 15);
					&.name {
						font-size: 2.7rem;
						font-weight: var(--font-weight-bold);
						line-height: 1.5;
						letter-spacing: 0.1em;
						.eng {
							margin-left: 1em;
							font-size: 1.5rem;
							font-weight: var(--font-weight);
						}
					}
				}
			}
		}
		.more {
			margin-top: 6rem;
		}
		.message {
			max-width: 76rem;
			margin-top: 5rem;
			margin-inline: auto;
			padding: 5rem 6rem 8rem;
			background-color: #fff;
			border-radius: 1.8rem 1.8rem 8rem 8rem;
			font-size: 1.7rem;
			line-height: calc(41 / 17);
			h3 {
				margin-bottom: 3rem;
				text-align: center;
				font-size: 2.2rem;
				line-height: 1.5;
			}
		}
	}
	.point {
		position: absolute;
		pointer-events: none;
		user-select: none;
		z-index: -1;
		&.-point1 {
			width: 66.1rem;
			top: 3rem;
			right: calc(50% - 14rem);
			opacity: 0.4;
		}
		&.-point2 {
			width: 27.6rem;
			top: 53rem;
			right: calc(50% + 5rem);
		}
	}
	@media screen and (min-width: 744px), print {
		.doctor-contents {
			display: flex;
			align-items: start;
			flex-wrap: wrap;
			.ph {
				width: 28rem;
				margin-left: 13rem;
			}
			.info {
				width: 51rem;
				margin-left: auto;
			}
			.more {
				width: 51rem;
				margin-left: auto;
			}
		}
	}
	@media screen and (max-width: 743px) {
		.doctor-svg-text {
			top: -9rem;
			right: -2rem;
			left: auto;
			width: 58.8rem;
			margin-inline: 0;
			.eng-path-text {
				font-size: 70px;
			}
		}
		h2 {
			margin-bottom: 5rem;
			font-size: 2.2rem;
		}
		.doctor-contents {
			.ph {
				width: 21rem;
				margin-inline: auto;
				margin-bottom: 3.5rem;
				img {
					border-radius: 1.5rem 1.5rem 1.5rem 5.2rem;
				}
				.doctor-name {
					width: calc(34.2 / 28 * 21rem);
					left: -4rem;
					bottom: -4rem;
				}
			}
			.info {
				padding: 5rem 3.5rem;
				dl {
					dd {
						font-size: 1.4rem;
						line-height: calc(32 / 14);
						&.name {
							.eng {
								display: block;
								margin-left: 0;
								margin-top: 0.5rem;
							}
						}
					}
				}
			}
			.more {
				margin-top: 18rem;
			}
			.message {
				margin-top: 3rem;
				padding: 4rem 2.3rem 8rem;
			}
		}
		.point {
			&.-point1 {
				width: 86rem;
				top: 12rem;
				right: -29.5rem;
			}
			&.-point2 {
				width: 16rem;
				top: auto;
				bottom: 8.5rem;
				right: calc(50% - 6.2rem);
			}
		}
	}
}


/* c-faq
====================================================================== */
.c-faq {
	max-width: 80rem;
	margin-inline: auto;
	.faq-list {
		display: flex;
		flex-direction: column;
		gap: 2rem;
		margin-top: 7rem;
		section {
			background-color: #fff;
			border-radius: 2rem;
			h3 {
				position: relative;
				display: flex;
				align-items: center;
				min-height: 10rem;
				background: url(../img/ico-faq-q.svg) no-repeat 2.4rem;
				background-size: 5.2rem;
				padding: 2rem 8rem 2rem 11rem;
				font-size: 2.1rem;
				line-height: 1.7;
				cursor: pointer;
				&::before,
				&::after {
					content: "";
					position: absolute;
					right: 2.5rem;
					top: calc(50% - .2rem);
					width: 2rem;
					border-top: .4rem solid;
				}
				&::after {
					transform: rotate(90deg);
					transition: transform var(--transition);
				}
				&.-open::after {
					transform: rotate(0deg);
				}
			}
			.a {
				padding: 1rem 6rem 4rem 11rem;
				font-size: 1.8rem;
				line-height: calc(32 / 18);
				background: url(../img/ico-faq-a.svg) no-repeat 2.4rem 1rem;
				background-size: 5.2rem;
			}
		}
	}
	.notes {
		margin-top: 6rem;
	}
	@media screen and (max-width: 743px) {
		margin-inline: var(--sp-base-padding);
		.faq-list {
			margin-top: 4rem;
			section {
				h3 {
					background-position: 1.5rem;
					background-size: 4.8rem;
					padding: 1.5rem 5rem 1.5rem 8rem;
					font-size: 1.7rem;
					line-height: calc(30 / 17);
					&::before,
					&::after {
						right: 1.8rem;
					}
				}
				.a {
					padding: .5rem 2rem 3rem;
					font-size: 1.6rem;
					background: none;
					&::before {
						content: "";
						width: 4.8rem;
						height: 4.8rem;
						background: url(../img/ico-faq-a.svg) no-repeat 50%;
						background-size: 100%;
						float: left;
						margin-left: -0.5rem;
						margin-right: 2rem;
					}
				}
			}
		}
		.notes {
			margin-top: 4rem;
		}
	}
}

/* wp-pagenavi
====================================================================== */
.wp-pagenavi {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 2rem;
	margin-top: 12rem;
	color: var(--color-theme);
	.page, .current {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 4.4rem;
		height: 4.4rem;
		background-color: #fff;
		border: 1px solid var(--color-theme);
		color: var(--color-theme);
		font-size: 2rem;
		text-decoration: none;
		border-radius: 100%;
	}
	.current {
		background-color: var(--color-theme);
		color: #fff;
	}
	.previouspostslink,
	.nextpostslink {
		overflow: hidden;
		position: relative;
		width: 4.4rem;
		height: 4.4rem;
		text-indent: -999em;
		text-decoration: none;
		&::after {
			content: "";
			position: absolute;
			top: 50%;
			right: 50%;
			width: 1.2rem;
			height: 1.2rem;
			transform-origin: 100% 0;
			transform: rotate(45deg);
			border-top: 2px solid var(--color-theme);
			border-right: 2px solid var(--color-theme);
		}
	}
	.previouspostslink {
		transform: scaleX(-1);
	}
	@media (hover) {
		.page:hover {
			background-color: var(--color-theme);
			color: #fff;
		}
		.previouspostslink:hover,
		.nextpostslink:hover {
			opacity: 0.5;
		}
	}
	@media screen and (max-width: 743px) {
		gap: 1rem;
		.page,
		.current,
		.previouspostslink,
		.nextpostslink {
			width: 4rem;
			height: 4rem;
		}
	}
}


/* ul / ol
====================================================================== */
.dot_li > li {
	position: relative;
	padding-left: 1em;
}
.dot_li > li::before {
	content: "・";
	position: absolute;
	top: 0;
	left: 0;
	font-feature-settings: normal;
}

.circle_li > li {
	position: relative;
	padding-left: 1.5em;
}
.circle_li > li::before {
	content: "●";
	position: absolute;
	top: 0;
	left: 0;
}

.parentheses_li > li {
	position: relative;
	padding-left: 2.8em;
}
.parentheses_li > li > span:first-child {
	position: absolute;
	top: 0;
	left: 0;
}

.parentheses_li_h > li {
	position: relative;
	padding-left: 1.6em;
}
.parentheses_li_h > li > span:first-child {
	position: absolute;
	top: 0;
	left: 0;
}
.parentheses_li_hh > li {
	position: relative;
	padding-left: 2.2em;
}
.parentheses_li_hh > li > span:first-child {
	position: absolute;
	top: 0;
	left: 0;
}

.point_li > li {
	position: relative;
	padding-left: 1.5em;
}
.point_li > li > span:first-child {
	position: absolute;
	top: 0;
	left: 0;
}

.square_li > li {
	position: relative;
	padding-left: 0.8em;
}
.square_li > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .8em;
	width: 5px;
	height: 5px;
	background-color: #14143c;
}
@media screen and (max-width: 743px) {
	.square_li > li::before {
		top: 0.6em;
	}
}

.num_li {
	margin-left: 1.8em;
	list-style: decimal;
}
.alphabet_li {
	margin-left: 1.8em;
	list-style: lower-latin;
}

.mt_li > li + li {
	margin-top: .8lh;
}
.mt_li_s > li + li {
	margin-top: .5lh;
}
@media screen and (max-width: 743px) {
	.sp_mt_li > li + li {
		margin-top: 0.8em;
	}
}

.inline_li > li {
	display: inline-block;
	margin-right: 0.3em;
}

@media screen and (min-width: 744px), print {
	.column_li {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.column_li > li {
		width: 48%;
	}
	.column_li > li:nth-child(n + 3) {
		margin-top: 0.25em;
	}
}
@media screen and (max-width: 743px) {
	.column_li > li + li {
		margin-top: 0.25em;
	}
}

.dl_table {
	display: table;
}
.dl_table > * {
	display: table-row;
}
.dl_table > * > * {
	display: table-cell;
}
.dl_table dt {
	white-space: nowrap;
}
.dl_table.-dt_pr dt {
	padding-right: 1em;
}


/* ============================================================================

	クリニックについて

============================================================================= */
.p-about-lead {
	.illust {
		position: absolute;
		z-index: -1;
		&.-illust1 {
			width: 32rem;
			top: calc(100% - 9rem);
			left: calc(50% - 10rem);
		}
		&.-illust2 {
			width: 31rem;
			top: -15rem;
			left: calc(50% + 32rem);
		}
		&.-illust3 {
			width: 27.5rem;
			top: 24rem;
			left: calc(50% + 25rem);
		}
		@media screen and (max-width: 743px) {
			transform: scale(.97);
			opacity: 0.6;
			&.-illust1 {
				top: calc(100% - 10rem);
				left: calc(50% - 27rem);
			}
			&.-illust2 {
				top: -4rem;
				left: calc(50% - 7rem);
			}
			&.-illust3 {
				top: 42rem;
				left: calc(50% - 6rem);
			}
		}
	}
}
.p-about-break {
	position: relative;
	margin-block: 13rem;
	height: 45.4rem;
	z-index: 2;
	ul {
		img {
			border-radius: 1.8rem;
		}
		li {
			position: relative;
			&.-ph1 {
				width: 23rem;
			}
			&.-ph2 {
				width: 34rem;
			}
			&.-ph3 {
				width: 23rem;
			}
		}
	}
	@media screen and (min-width: 744px), print {
		ul {
			display: flex;
			justify-content: space-between;
			max-width: 100rem;
			margin-inline: auto;
			padding-left: 4.8rem;
			li {
				&.-ph1 {
					top: -2rem;
				}
				&.-ph2 {
					top: 11rem;
					left: -.6rem;
				}
				&.-ph3 {
					top: 16rem;
				}
			}
		}
	}
	@media screen and (max-width: 743px) {
		margin-block: 18rem;
		height: 103rem;
		background-size: 100%;
		ul {
			padding-top: 1.5rem;
			li {
				position: relative;
				&.-ph1 {
					margin-inline: 3rem auto;
				}
				&.-ph2 {
					margin-top: 6rem;
					margin-inline: auto;
				}
				&.-ph3 {
					margin-top: 6rem;
					margin-inline: auto 3rem;
				}
			}
		}
	}
}
.p-about-doctor {
	margin-top: 27rem;
	&::before {
		content: "";
		position: absolute;
		top: -29rem;
		right: calc(50% + 22rem);
		width: 14.4rem;
		height: 14.4rem;
		background: url(../img/about/doctor-point.png) no-repeat 50%;
		background-size: 100%;
	}
	@media screen and (max-width: 743px) {
		margin-top: 25rem;
		&::before {
			top: -23rem;
			right: calc(50% + 8rem);
			width: 9.4rem;
			height: 9.4rem;
		}
	}
}

.p-about-story {
	position: relative;
	margin-top: 16.5rem;
	z-index: 1;
	.wave-wrap {
		position: relative;
		padding-bottom: 11rem;
	}
	.head {
		position: relative;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 70rem;
		margin-bottom: 2rem;
		.logo {
			width: 23.6rem;
		}
		.hand {
			position: absolute;
			width: calc(50% - 2rem);
			width: 63.1rem;
			&.-r {
				top: 6rem;
				left: max(calc(50% + 2rem), calc(100% - 63.1rem));
			}
			&.-l {
				bottom: 6rem;
				right: max(calc(50% + 2rem), calc(100% - 63.1rem));
				transform: rotate(180deg);
			}
			@media screen and (min-width: 1400px) {
				width: calc(50% - 2rem);
				&.-r {
					top: 6rem;
					left: calc(50% + 7rem);
				}
				&.-l {
					bottom: 6rem;
					right: calc(50% + 7rem);
					transform: rotate(180deg);
				}
			}
		}
	}
	.txt {
		max-width: 61rem;
		margin-inline: auto;
	}
	h2 {
		margin-bottom: 5rem;
		text-align: center;
	}
	.items {
		display: flex;
		.item {
			overflow: hidden;
			padding: 4rem 3rem;
			line-height: calc(38 / 20);
			h3 {
				position: relative;
				display: flex;
				justify-content: center;
				align-items: center;
				aspect-ratio: 35 / 45.6;
				width: 20.5rem;
				margin-inline: auto;
				margin-bottom: 3.5rem;
				font-size: 3.6rem;
				line-height: 1.5;
				color: var(--color-theme);
				z-index: 2;
				&::before {
					content: "";
					position: absolute;
					inset: 0 auto 0 .5rem;
					width: 100%;
					background: url(../img/point-bean.svg) no-repeat 50%;
					background-size: 100%;
					filter: var(--white-filter);
					z-index: -1;
				}
				span {
					writing-mode: vertical-rl;
				}
			}
			.lead {
				margin-bottom: 2.5rem;
				font-size: 2.5rem;
				line-height: 1.5;
				color: var(--color-theme);
				text-align: center;
			}
		}
	}
	.summary {
		position: relative;
		margin-top: 12rem;
		text-align: center;
		font-weight: var(--font-weight-bold);
		font-size: 2.4rem;
		line-height: 1.6;
		.map {
			position: absolute;
			inset: -8rem 0 auto 10rem;
			width: 19.1rem;
			margin-inline: auto;
			z-index: -1;
		}
	}
	.loop-img {
		overflow: hidden;
		display: flex;
		margin-top: 25rem;
		.loop, ul {
			display: flex;
		}
		li {
			width: 40rem;
			margin-right: 2rem;
			img {
				border-radius: 2rem;
			}
		}
	}
	@media screen and (min-width: 744px), print {
		.items {
			justify-content: space-between;
			max-width: var(--base-width);
			margin-inline: auto;
			margin-top: 18rem;
			.item {
				position: relative;
				width: 34rem;
				border-radius: 17rem 17rem 9rem 5rem;
				&.-item2 {
					top: -10rem;
				}
				&.-item3 {
					top: -20rem;
				}
			}
		}
	}
	@media screen and (max-width: 743px) {
		margin-top: 12rem;
		.wave-wrap {
			padding-bottom: 16rem;
		}
		.head {
			height: 54rem;
			margin-bottom: 0;
			.logo {
				width: 17.8rem;
			}
			.hand {
				width: 30.4rem;
				&.-r {
					top: 8.4rem;
					left: calc(50% + 1rem);
				}
				&.-l {
					bottom: 8.4rem;
					right: calc(50% + 1rem);
				}
			}
		}
		.txt {
			margin-top: -2rem;
			margin-inline: var(--sp-base-padding);
		}
		h2 {
			margin-bottom: 3rem;
		}
		.items {
			flex-direction: column;
			gap: 6rem;
			margin-top: 8rem;
			.item {
				width: 27.2rem;
				margin-inline: auto;
				padding: 3rem 2.5rem 4rem;
				border-radius: 14rem 14rem 6rem 4rem;
				h3 {
					width: 16.4rem;
					margin-bottom: 2.8rem;
					font-size: 2.9rem;
				}
				.lead {
					margin-bottom: 2rem;
					font-size: 2.2rem;
				}
			}
		}
		.summary {
			position: relative;
			margin-top: 6rem;
			font-size: 2.4rem;
			line-height: calc(70 / 24);
			.map {
				inset: 0 0 auto;
			}
		}
		.loop-img {
			margin-top: 15rem;
		}
	}
}


/* ============================================================================

	診療案内

============================================================================= */
.p-medical-lead {
	.c-inner-nav {
		margin-top: 8rem;
	}
	@media screen and (max-width: 743px) {
		.c-inner-nav {
			margin-top: 6rem;
		}
	}
}
.p-medical-intro {
	position: relative;
	margin-top: 9rem;
	padding-block: 14rem 20rem;
	h2 {
		margin-bottom: 2.5rem;
	}
	.treatment-list {
		margin-top: 8rem;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		gap: 7rem 0;
		line-height: 1.75;
		h3 {
			margin-block: 3rem;
			color: var(--color-theme);
			font-size: 2.6rem;
			line-height: 1.6;
		}
	}
	@media screen and (min-width: 744px), print {
		padding-inline: calc((100% - 80rem) / 2);
		.treatment-list {
			section {
				width: 36.3rem;
			}

		}
	}
	@media screen and (max-width: 743px) {
		margin-top: 10rem;
		padding-block: 9rem 8rem;
		padding-inline: var(--sp-base-padding);
		.treatment-list {
			margin-top: 7rem;
			flex-direction: column;
			gap: 6rem;
			line-height: 1.75;
			section {
				width: 30rem;
				margin-inline: auto;
				.img ~ * {
					margin-inline: 1rem;
				}
				h3 {
					margin-bottom: 2rem;
					font-size: 2.2rem;
				}
			}
		}
	}
}
.p-medical-contents {
	max-width: 102rem;
	margin-inline: auto;
	margin-top: 13rem;
	display: flex;
	flex-direction: column;
	gap: 13rem;
	section {
		position: relative;
		isolation: isolate;
		&::before {
			content: "";
			position: absolute;
			inset: 0;
			background-color: #f7c5b0;
			border-radius: 2rem;
			transform: translate(4rem, 4rem);
			z-index: -1;
		}
		.ph {
			display: flex;
			flex-wrap: wrap;
			gap: 2rem;
			li {
				width: calc(50% - 1rem);
				&:first-child {
					width: 100%;
				}
				img {
					border-radius: 2rem;
				}
			}
		}
		.contents {
			padding: 4rem 4rem 5rem;
			background-color: #fff;
			border-radius: 2rem;
			font-size: 1.6rem;
			line-height: calc(35 / 16);
			h2 {
				margin-bottom: 2.5rem;
				font-size: 2.7rem;
				line-height: 1.5;
			}
			.list {
				margin-top: 3rem;
				font-size: 1.5rem;
				li {
					position: relative;
					padding-left: 1.2em;
					&::before {
						content: "●";
						position: absolute;
						top: 0;
						left: 0;
					}
				}
			}
		}
	}
	@media screen and (min-width: 744px), print {
		section {
			display: flex;
			justify-content: space-between;
			width: 94.6rem;
			.ph {
				width: 40rem;
			}
			.contents {
				width: 51rem;
			}
			&:nth-child(2n + 1) {
				margin-left: auto;
				&::before, .contents {
					border-top-right-radius: 8rem;
					border-bottom-right-radius: 8rem;
				}
			}
			&:nth-child(2n) {
				flex-direction: row-reverse;
				&::before, .contents {
					border-top-left-radius: 8rem;
					border-bottom-left-radius: 8rem;
				}
				.contents {
					padding-left: 5rem;
				}
			}
		}
	}
	@media screen and (max-width: 743px) {
		margin-top: 10rem;
		gap: 10rem;
		section {
			&::before {
				border-radius: 1.8rem;
				transform: translateY(4rem);
			}
			.ph {
				width: 33rem;
				gap: 1.6rem;
				margin-bottom: 4rem;
				li {
					width: calc(50% - .8rem);
					img {
						border-radius: 1.8rem;
					}
				}
			}
			.contents {
				border-radius: 1.8rem;
				font-size: 1.8rem;
				line-height: calc(35 / 18);
				.list {
					font-size: 1.7rem;
				}
			}
			&:nth-child(2n + 1) {
				&::before {
					border-bottom-right-radius: 8rem;
				}
				.contents {
					border-bottom-right-radius: 8rem;
					border-top-right-radius: 8rem;
				}
			}
			&:nth-child(2n) {
				.ph {
					margin-left: auto;
				}
				&::before {
					border-bottom-left-radius: 8rem;
				}
				.contents {
					border-bottom-left-radius: 8rem;
					border-top-left-radius: 8rem;
				}
				.contents {
					padding-left: 5rem;
				}
			}
		}
	}
}
.p-medical-symptom {
	position: relative;
	margin-top: 28rem;
	.wave-wrap {
		position: relative;
		padding-block: 15rem 23rem;
		z-index: 2;
	}
	.img {
		position: absolute;
		top: -12.6rem;
		right: calc(50% + 15.4rem);
		width: 32rem;
		z-index: 3;
	}
	.symptom-list {
		display: flex;
		flex-wrap: wrap;
		gap: 3rem 3.6rem;
		margin-top: 8rem;
		dl {
			position: relative;
			width: calc((100% - 3.6rem * 2) / 3);
			padding: 4rem 3rem;
			border-radius: 5rem;
			&::before {
				content: "";
				display: block;
				width: 5.6rem;
				height: 5.6rem;
				margin-inline: auto;
				margin-bottom: 3rem;
				background: url(../img/medical/ico-check.svg) no-repeat 50%;
				background-size: 100%;
			}
			dt {
				margin-bottom: 2rem;
				margin-inline: -1rem;
				text-align: center;
				color: var(--color-theme);
				font-size: 2.8rem;
				line-height: 1.6;
			}
			dd {
				line-height: 1.9;
			}
		}
	}
	.summary {
		margin-top: -30rem;
		padding-block: 35rem 12rem;
		background-color: var(--color-navy);
		text-align: center;
		.lead {
			color: #fff;
			font-size: 2.6rem;
			line-height: calc(59 / 26);
		}
	}
	@media screen and (min-width: 744px), print {
		.wave-wrap {
			padding-inline: calc((100% - 110rem) / 2);
		}
		header {
			margin-left: 45.5rem;
		}
		.symptom-list {
			align-items: flex-start;
			dl {
				dd {
					min-height: 2lh;
				}
				&:nth-child(3n + 2) {
					margin-top: 6.8rem;
				}
			}
		}
		.summary {
			.btn {
				margin-top: 8rem;
				display: flex;
				justify-content: center;
				gap: 8rem;
			}
		}
	}
	@media screen and (max-width: 743px) {
		.wave-wrap {
			padding: 30rem var(--sp-base-padding) 16rem;
		}
		.img {
			top: -17rem;
			right: 7rem;
			width: 29rem;
		}
		h2 {
			margin-right: -1rem;
		}
		.symptom-list {
			gap: 2rem 1.6rem;
			margin-top: 6rem;
			margin-inline: -1rem;
			dl {
				width: calc((100% - 1.6rem * 1) / 2);
				padding: 3rem 1rem;
				border-radius: 3.4rem;
				&::before {
					width: 4.5rem;
					height: 4.5rem;
					margin-bottom: 2.4rem;
				}
				dt {
					font-size: 2.1rem;
					line-height: calc(28 / 21);
				}
				dd {
					font-size: 1.7rem;
					line-height: calc(30 / 17);
				}
				&:nth-child(2n) {
					position: relative;
					top: 6rem;
				}
			}
		}
		.summary {
			padding: 37rem var(--sp-base-padding) 11rem;
			text-align: left;
			.lead {
				font-size: 2.3rem;
				line-height: calc(53 / 23);
			}
			.btn {
				margin-top: 8rem;
				display: flex;
				flex-direction: column;
				gap: 4rem;
			}
		}
	}
}
.p-medical-facilities {
	max-width: 102rem;
	margin-inline: auto;
	margin-top: 13rem;
	.facilities-list {
		display: flex;
		flex-wrap: wrap;
		gap: 4rem 2rem;
		margin-top: 9rem;
		img {
			border-radius: 1.8rem;
		}
		figcaption {
			display: block;
			margin-top: 2rem;
			margin-inline: .5rem;
			font-size: 1.8rem;
			line-height: calc(29 / 18);
		}
	}
	.notes-box {
		position: relative;
		margin-top: 7rem;
		padding: 5rem 5rem 7rem;
		background-color: #fff;
		border-radius: 5rem;
		font-size: 1.7rem;
		left: calc(41 / 17);
		h3 {
			margin-bottom: 2rem;
			font-size: 2.1rem;
			line-height: 1.6;
		}
	}
	@media screen and (min-width: 744px), print {
		.facilities-list {
			margin-inline: -4rem;
			li {
				width: calc((100% - 2rem * 3) / 4);
			}
		}
		.notes-box {
			padding-right: 27rem;
			.logo {
				position: absolute;
				right: 6.6rem;
				top: 11rem;
				width: 16.8rem;
			}
		}
	}
	@media screen and (max-width: 743px) {
		margin-inline: var(--sp-base-padding);
		margin-top: 7rem;
		.facilities-list {
			flex-direction: column;
			gap: 4rem;
			margin-top: 7rem;
			figcaption {
				margin-top: 3rem;
				font-size: 2.2rem;
				line-height: calc(36 / 22);
			}
		}
		.notes-box {
			margin-top: 6rem;
			padding: 4rem 2rem 5rem;
			border-radius: 4rem;
			font-size: 1.8rem;
			left: calc(41 / 18);
			h3 {
				left: calc(40 / 16);
			}
			.logo {
				width: 17rem;
				margin-inline: auto;
				margin-top: 3rem;
			}
		}
	}
}
.p-medical-advanced {
	position: relative;
	margin-top: 12rem;
	padding-block: 10rem 14rem;
	color: #fff;
	.advanced-list {
		display: flex;
		gap: 4rem;
		margin-top: 5rem;
		section {
			width: 100%;
			padding: 4rem 6rem 7rem;
			background-color: #fff;
			color: var(--color-base);
			border-radius: 1.8rem;
			line-height: 1.75;
			h3 {
				margin-bottom: 2rem;
				text-align: center;
				font-size: 2.7rem;
				line-height: 1.5;
			}
			&:first-child {
				border-top-left-radius: 8rem;
				border-bottom-left-radius: 8rem;
			}
			&:last-child {
				border-top-right-radius: 8rem;
				border-bottom-right-radius: 8rem;
			}
		}
	}
	.notes {
		margin-top: 2.5rem;
		text-align: center;
		font-size: 1.8rem;
	}
	@media screen and (min-width: 744px), print {
		padding-inline: calc((100% - 102rem) / 2);
		.advanced-list {
			margin-inline: -3rem;
		}
	}
	@media screen and (max-width: 743px) {
		margin-top: 11rem;
		padding: 8rem var(--sp-base-padding) 8rem;
		.advanced-list {
			margin-inline: calc(var(--sp-base-padding) * -1);
			flex-direction: column;
			margin-top: 4rem;
			section {
				width: 100%;
				padding: 4rem 4rem 6rem;
				font-size: 2rem;
				h3 {
					margin-bottom: 2rem;
					font-size: 2.5rem;
				}
			}
		}
		.notes {
			margin-top: 4rem;
			margin-inline: calc(var(--sp-base-padding) * -1);
			font-size: 1.6rem;
		}
	}
}
.p-medical-clinic-notices {
	position: relative;
	max-width: 80rem;
	margin-inline: auto;
	margin-top: 13rem;
	.lead-notes {
		font-size: 1.5rem;
	}
	.notices-list {
		display: flex;
		flex-direction: column;
		gap: 2rem;
		margin-top: 8rem;
		section {
			background-color: #fff;
			border-radius: 2rem;
			font-size: 1.8rem;
			line-height: calc(32 / 18);
			h3 {
				position: relative;
				padding: 3rem;
				cursor: pointer;
				font-size: 2.1rem;
				line-height: 1.6;
				&::before,
				&::after {
					content: "";
					position: absolute;
					right: 2.5rem;
					top: calc(50% - .2rem);
					width: 2rem;
					border-top: .4rem solid;
				}
				&::after {
					transform: rotate(90deg);
					transition: transform var(--transition);
				}
				&.-open::after {
					transform: rotate(0deg);
				}
			}
			.c-acc-inner {
				padding: 0 3rem 3rem;
			}
		}
	}
	.sign {
		margin-top: 4rem;
		text-align: right;
		font-size: 1.8rem;
		line-height: calc(32 / 18);
	}
	@media screen and (max-width: 743px) {
		margin-inline: var(--sp-base-padding);
		margin-top: 8rem;
		.notices-list {
			margin-top: 6rem;
			section {
				border-radius: 1.8rem;
				font-size: 1.6rem;
				h3 {
					padding: 2rem;
					font-size: 1.9rem;
					line-height: 1.6;
					&::before,
					&::after {
						right: 2rem;
					}
				}
				.c-acc-inner {
					padding: 0 2rem 3rem;
				}
			}
		}
		.sign {
			margin-top: 4rem;
			text-align: right;
			font-size: 1.8rem;
			line-height: calc(32 / 18);
		}
	}
}



/* ============================================================================

	ウェブ予約

============================================================================= */
.p-reserve-lead {
	@media screen and (min-width: 744px), print {
		padding-right: 32rem;
		.img {
			position: absolute;
			right: -6rem;
			bottom: -4rem;
			width: 31.4rem;
		}
	}
	@media screen and (max-width: 743px) {
		.img {
			width: 23rem;
			margin-top: 2rem;
			margin-left: auto;
		}
	}
}
.p-reserve-merit {
	position: relative;
	margin-top: 9rem;
	padding-block: 13rem;
	h2 {
		margin-bottom: 6rem;
		text-align: center;
	}
	.merit-list {
		display: flex;
		justify-content: space-between;
		section {
			position: relative;
			width: 28rem;
			font-size: 1.6rem;
			line-height: calc(27 / 16);
			.num {
				position: absolute;
				right: 0;
				top: 20rem;
				font-size: 17rem;
				line-height: 1;
				color: var(--bg-base);
			}
			h3 {
				position: relative;
				margin-block: 3rem 2rem;
				font-size: 2.25rem;
				line-height: calc(36 / 23);
				color: var(--color-theme);
				z-index: 3;
			}
		}
	}
	.lead {
		margin-top: 10rem;
		display: flex;
		justify-content: center;
	}
	.btn {
		max-width: 63rem;
		margin: 6rem;
		margin-inline: auto;
	}
	@media screen and (min-width: 744px), print {
		padding-inline: calc((100% - 96rem) / 2);
	}
	@media screen and (max-width: 743px) {
		margin-top: 8rem;
		padding-block: 10rem;
		padding-inline: var(--sp-base-padding);
		.merit-list {
			flex-direction: column;
			gap: 5rem;
			section {
				margin-inline: auto;
			}
		}
		.lead {
			margin-top: 7rem;
		}
		.btn {
			max-width: 63rem;
			margin: 6rem;
			margin-inline: auto;
		}
	}
}

.p-reserve-movie {
	max-width: 80rem;
	margin-inline: auto;
	margin-top: 6rem;
	.lead-notes {
		font-size: 1.5rem;
	}
	.movie {
		margin-top: 5rem;
		iframe {
			width: 100%;
			height: auto;
			aspect-ratio: 16 / 9;
			border-radius: 2rem;
		}
	}
	@media screen and (max-width: 743px) {
		margin-inline: var(--sp-base-padding);
		.movie {
			margin-top: 4rem;
		}
	}
}
.p-reserve-app {
	position: relative;
	max-width: 110rem;
	margin-inline: auto;
	margin-top: 15rem;
	padding: 9rem 56rem 7rem 9rem;
	background-color: #fff;
	border-radius: 20rem 6rem 20rem 6rem;
	h2 {
		width: 26.4rem;
		margin-inline: auto;
		margin-bottom: 5rem;
	}
	.lead {
		color: var(--color-theme);
		font-size: 3.6rem;
		line-height: calc(65 / 36);
		font-weight: var(--font-weight-bold);
	}
	.dl-box {
		position: relative;
		margin-top: 4rem;
		.bnr {
			width: 31rem;
			font-size: 1.3rem;
			line-height: calc(20 / 13);
			font-weight: var(--font-weight-reg);
			ul {
				display: flex;
				justify-content: space-between;
				margin-bottom: 2rem;
				img {
					width: auto;
					height: 4.8rem;
				}
			}
		}
		.qr {
			position: absolute;
			top: -6rem;
			left: 33rem;
			width: 18rem;
		}
	}
	@media screen and (min-width: 744px), print {
		.img {
			position: absolute;
			right: 5rem;
			top: 50%;
			width: 44rem;
			transform: translateY(-50%);
		}
	}
	@media screen and (max-width: 743px) {
		margin-top: 12rem;
		padding: 6rem var(--sp-base-padding) 8rem;
		border-radius: 6rem 6rem 16rem 6rem;
		.lead {
			display: flex;
			justify-content: center;
			font-size: 3.2rem;
		}
		.dl-box {
			.bnr {
				margin-inline: auto;
			}
		}
		.img {
			margin: 2rem -3rem 0;
		}
	}
}
.p-reserve-faq {
	margin-top: 13rem;
	@media screen and (max-width: 743px) {
		margin-top: 8rem;
	}
}


/* ============================================================================

	アクセス

============================================================================= */
.p-access-lead {
	padding-bottom: 26rem;
	&::before {
		content: "";
		position: absolute;
		top: -14rem;
		left: calc(50% - 5.5rem);
		width: 66rem;
		aspect-ratio: 35 / 45.6;
		background: url(../img/point-bean.svg) no-repeat 50%;
		background-size: 100%;
		filter: var(--white-filter);
		opacity: 0.4;
		z-index: -1;
	}
	.map {
		position: relative;
		.pin {
			position: absolute;
			top: -10.5%;
			left: 44.5%;
			width: calc(256 / 668 * 100%);
			animation: blink 2.5s steps(1, end) infinite;
		}
	}
	@media screen and (min-width: 744px), print {
		.lead ~ p {
			max-width: 50rem;
		}
		.map {
			position: absolute;
			top: 11.6rem;
			left: calc(50% + 11.4rem);
			width: 33.4rem;
		}
	}
	@media screen and (max-width: 743px) {
		padding-bottom: 27rem;
		&::before {
			top: auto;
			bottom: 5rem;
			left: -8.4rem;
			width: 58.8rem;
		}
		.lead {
			--ls: 0;
			white-space: nowrap;
		}
		.map {
			width: 28.6rem;
			margin-top: 7rem;
			margin-left: 4.4rem;
		}
	}
}
@keyframes blink {
	0%, 10% {
		opacity: 1;
	}

	11%, 20% {
		opacity: 0;
	}

	21%, 30% {
		opacity: 1;
	}

	31%, 40% {
		opacity: 0;
	}

	41%, 100% {
		opacity: 1;
	}
}

.p-access-map {
	position: relative;
	padding-block: 13rem 19rem;
	z-index: 1;
	h2 {
		margin-bottom: 6rem;
		text-align: center;
	}
	.map {
		max-width: 58rem;
		margin-inline: auto;
		iframe {
			width: 100%;
			height: 42rem;
			border-radius: 1.8rem;
		}
		.info {
			margin-top: 2rem;
			display: grid;
			grid-template-columns: 13rem 1fr;
			gap: 2rem 0;
			dt {
				font-size: 2rem;
				line-height: 1.8;
				font-weight: var(--font-weight-bold);
			}
			dd {
				padding-top: .2em;
				font-size: 1.6rem;
				line-height: calc(27 / 16);
				&.name {
					font-size: 2.7rem;
					font-weight: var(--font-weight-bold);
					line-height: 1.5;
					letter-spacing: 0.1em;
					.eng {
						margin-left: 1em;
						font-size: 1.5rem;
						font-weight: var(--font-weight);
					}
				}
				a {
					display: inline-block;
				}
			}
		}
	}
	.access {
		max-width: 58rem;
		margin-inline: auto;
		margin-top: 10rem;
		display: flex;
		flex-direction: column;
		gap: 6rem;
		font-size: 1.6rem;
		line-height: calc(29 / 16);
		img {
			border-radius: 1.8rem;
		}
		.num {
			width: 5.2rem;
			height: 5.2rem;
			display: flex;
			justify-content: center;
			align-items: center;
			margin-bottom: 1rem;
			background-color: var(--color-peach);
			border-radius: 100%;
			font-size: 3rem;
			line-height: 1;
			color: #fff;
		}
	}
	@media screen and (min-width: 744px), print {
		.map {
			.info {
				a {
					margin-left: 1em;
				}
			}
		}
		.access {
			.item {
				display: grid;
				grid-template-columns: 36rem 1fr;
				gap: 3rem;
			}
		}
	}
	@media screen and (max-width: 743px) {
		padding: 7rem var(--sp-base-padding) 10rem;
		h2 {
			margin-bottom: 4rem;
		}
		.map {
			iframe {
				height: 30rem;
			}
			.info {
				grid-template-columns: 8rem 1fr;
				dt {
					font-size: 1.8rem;
				}
			}
		}
		.access {
			margin-top: 6rem;
			gap: 5rem;
			font-size: 1.8rem;
			img {
				border-radius: 1.8rem;
			}
			.num {
				margin-top: 2rem;
			}
		}
	}
}
.p-access-summary {
	margin-top: 8rem;
	display: flex;
	justify-content: center;
	@media screen and (max-width: 743px) {
		margin-inline: var(--sp-base-padding);
	}
}



/* ============================================================================

	プライバシーポリシー

============================================================================= */
.p-privacy-contents {
	max-width: 80rem;
	margin-inline: auto;
	margin-top: 8rem;
	section {
		margin-top: 2em;
		h2 {
			margin-bottom: .2em;
			color: var(--color-theme);
			font-size: 110%;
		}
		.circle_li {
			margin-left: 1em;
			margin-top: 1em;
			font-size: 90%;
			line-height: calc(34 / 18);
			li {
				margin-top: 1em;
			}
		}
	}
	@media screen and (max-width: 743px) {
		margin-top: 6rem;
		padding-inline: var(--sp-base-padding);
		font-size: 1.7rem;
		line-height: calc(42 / 17);
		section {
			h2 {
				font-size: 2rem;
			}
			.circle_li {
				font-size: 100%;
			}
		}
	}
}


/* ============================================================================

	サイトマップ

============================================================================= */
.p-sitemap-contents {
	max-width: 80rem;
	margin-inline: auto;
	margin-top: 8rem;
	.top {
		border-bottom: 1px solid var(--color-theme);
		a {
			display: flex;
			align-items: center;
			gap: 1rem;
			padding-block: 2rem;
			font-weight: var(--font-weight-bold);
			font-size: 2.4rem;
			line-height: 1.6;
		}
	}
	.column {
		margin-top: 7rem;
		margin-left: 7.5rem;
		font-weight: var(--font-weight-bold);
		font-size: 2.2rem;
		line-height: 1.6;
		a {
			display: block;
		}
		ul {
			display: flex;
			flex-direction: column;
		}
		& > ul {
			gap: 6rem;
			& > li {
				position: relative;
				padding-left: 1.5em;
				&::before {
					content: "●";
					position: absolute;
					top: 0;
					left: 0;
					color: var(--color-theme);
				}
			}
			ul {
				margin: 3rem 0 0 1em;
				gap: 3rem;
				font-size: 2rem;
				a {
					color: var(--color-theme);
				}
			}
		}
	}
	@media screen and (min-width: 744px), print {
		.column {
			display: flex;
			justify-content: space-between;
			& > * {
				width: 33.5rem;
			}
		}
		.btns {
			margin-top: 9rem;
			display: flex;
			justify-content: center;
			gap: 14rem;
		}
	}
	@media screen and (max-width: 743px) {
		margin-top: 6rem;
		padding-inline: var(--sp-base-padding);
		.column {
			display: flex;
			flex-direction: column;
			gap: 5rem;
			margin-top: 6rem;
			margin-left: 3rem;
			& > ul {
				gap: 5rem;
			}
		}
		.btns {
			margin-top: 6rem;
			display: flex;
			flex-direction: column;
			gap: 5rem;
		}
	}
}


/* ============================================================================

	お知らせ

============================================================================= */
.p-info-tab {
	max-width: 104rem;
	margin-inline: auto;
	margin-block: 8rem 11rem;
	ul {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		gap: 2rem;
		a {
			display: flex;
			align-items: center;
			justify-content: center;
			min-width: 18rem;
			height: 4.6rem;
			padding-inline: 4rem;
			padding-bottom: 0.2em;
			color: var(--color-theme);
			border: 1px solid var(--color-theme);
			text-decoration: none;
			font-size: 1.9rem;
			border-radius: 10rem;
			--ls: .1em;
			&.is-active {
				background-color: var(--color-theme);
				color: #fff;
			}
			@media (hover) {
				&:hover {
					background-color: var(--color-theme);
					color: #fff;
				}
			}
		}
	}
	@media screen and (max-width: 743px) {
		margin-inline: var(--sp-base-padding);
		margin-block: 8rem 8rem;
		.p-info-pickup + & {
			margin-top: 4rem;
		}
	}
}

.c-category-select {
	position: relative;
	display: block;
	&::after {
		content: "";
		position: absolute;
		bottom: calc(50% - 1rem);
		right: 3rem;
		width: 2rem;
		height: 2rem;
		border-bottom: 2px solid #fff;
		border-right: 2px solid #fff;
		transform-origin: 100% 100%;
		transform: rotate(45deg);
	}
	select {
		width: 100%;
		height: 6rem;
		padding: 0;
		background-color: var(--color-theme);
		border-radius: 3rem;
		font-size: 1.8rem;
		color: #fff;
		text-align: center;
		text-align-last: center;
	}
}

.p-info-pickup {
	max-width: 104rem;
	margin-inline: auto;
	margin-block: 8rem 11rem;
	a {
		position: relative;
		display: block;
		text-decoration: none;
		font-size: 1.6rem;
		line-height: 2;
		.pickup {
			position: absolute;
			top: -1.4rem;
			left: -3.6rem;
			width: 9rem;
			height: 7.2rem;
			display: flex;
			justify-content: center;
			align-items: center;
			color: #fff;
			padding-bottom: 1rem;
			padding-left: 0.5rem;
			background: url(../img/info/pickup-bg.png) no-repeat 50%;
			background-size: 100%;
			font-size: 2rem;
			line-height: calc(19 / 20);
			text-align: center;
			transform: rotate(-50deg)  translateZ(0);
			z-index: 2;
		}
		.ph {
			overflow: hidden;
			aspect-ratio: 560 / 400;
			border-radius: 1.8rem 1.8rem 1.8rem 8rem;
			&.-noimage {
				display: flex;
				justify-content: center;
				align-items: center;
				border: 1px solid #ddd;
				img {
					width: 50%;
				}
			}
		}
		.meta {
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			margin-bottom: 2.5rem;
			gap: .6rem;
			color: var(--color-theme);
			time {
				font-size: 1.7rem;
				line-height: 1.5;
				font-weight: 400;
				letter-spacing: 0;
			}
			.category {
				margin-left: auto;
				padding: 0.2em 1.5em;
				border: 1px solid;
				border-radius: 10rem;
				font-size: 1.5rem;
				line-height: 1.5;
			}
		}
		h3 {
			margin-bottom: 1.5rem;
			font-size: 2rem;
			font-weight: var(--font-weight);
			line-height: calc(31 / 18);
			color: var(--color-theme);
			--a-color: var(--color-theme);
		}
		.excerpt {
			overflow: hidden;
			display: -webkit-box;
			-webkit-box-orient: vertical;
			-webkit-line-clamp: 6;

		}
	}
	@media screen and (min-width: 744px), print {
		article {
			max-width: 80rem;
			margin-left: auto;
		}
		a {
			display: flex;
			align-items: flex-start;
			.ph {
				width: 46.2rem;
				flex-shrink: 0;
				margin-right: 5rem;
			}
		}
	}
	@media screen and (max-width: 743px) {
		margin-inline: var(--sp-base-padding);
		margin-block: 6rem 4rem;
		a {
			.pickup {
				transform-origin: 50% 26%;
				transform: scale(.8) rotate(-50deg)  translateZ(0);
			}
			.ph {
				margin-bottom: 3rem;
				border-radius: 1.8rem 1.8rem 1.8rem 6rem;
			}
			.meta {
				margin-bottom: 2.5rem;
				time {
					font-size: 1.9rem;
				}
			}
			.excerpt {
				-webkit-line-clamp: 5;
			}
		}
	}
}
.p-info-list {
	max-width: 104rem;
	margin-inline: auto;
	display: flex;
	flex-wrap: wrap;
	gap: 10rem 4rem;
	a {
		display: flex;
		flex-direction: column;
		height: 100%;
		text-decoration: none;
		--a-color: var(--color-theme);
		.ph {
			overflow: hidden;
			margin-bottom: 3rem;
			aspect-ratio: 560 / 400;
			border-radius: 1.8rem;
			&.-noimage {
				display: flex;
				justify-content: center;
				align-items: center;
				border: 1px solid #ddd;
				img {
					width: 50%;
				}
			}
		}
		h3 {
			margin-bottom: 2rem;
			font-size: 1.8rem;
			font-weight: var(--font-weight);
			line-height: calc(29 / 17);
			min-height: 3lh;
		}
		.meta {
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			gap: .6rem;
			margin-top: auto;
			time {
				font-size: 1.9rem;
				line-height: 1.5;
				font-weight: 400;
				letter-spacing: 0;
			}
			.category {
				margin-left: auto;
				padding: 0.2em 1.5em;
				border: 1px solid;
				border-radius: 10rem;
				font-size: 1.7rem;
				line-height: 1.5;
			}
		}
	}
	@media screen and (min-width: 744px), print {
		article {
			width: 32rem;
		}
	}
	@media screen and (max-width: 743px) {
		margin-inline: var(--sp-base-padding);
		flex-direction: column;
		gap: 6rem;
		a {
			.ph {
				margin-bottom: 2rem;
			}
			h3 {
				margin-bottom: 3rem;
				font-size: 2rem;
				line-height: calc(31 / 20);
				min-height: 0;
			}
			.meta {
				.category {
					font-size: 1.5rem;
				}
			}
		}
	}
}
.p-info-column {
	margin-top: 8rem;
	.info-heading {
		margin-bottom: 5rem;
		.meta {
			display: flex;
			align-items: center;
			margin-bottom: 3rem;
			gap: 4.6rem;
			time {
				font-size: 1.7rem;
				line-height: 1.5;
				font-weight: 400;
				letter-spacing: 0;
			}
			.category {
				padding: 0.2em 1.5em;
				border: 1px solid;
				border-radius: 10rem;
				font-size: 1.5rem;
				line-height: 1.5;
				color: var(--color-theme);
			}
		}
		h1 {
			font-size: 2.4rem;
			line-height: 1.6;
			color: var(--color-theme);
			font-weight: var(--font-weight-medium);
		}
	}
	.p-info-side-nav {
		ul {
			display: flex;
			flex-direction: column;
			gap: 3rem;
			a {
				width: fit-content;
				display: flex;
				align-items: center;
				justify-content: center;
				min-width: 18rem;
				height: 4.6rem;
				padding-inline: 4rem;
				padding-bottom: 0.2em;
				color: var(--color-theme);
				border: 1px solid var(--color-theme);
				text-decoration: none;
				font-size: 1.9rem;
				border-radius: 10rem;
				--ls: .1em;
				&.is-active {
					background-color: var(--color-theme);
					color: #fff;
				}
				@media (hover) {
					&:hover {
						background-color: var(--color-theme);
						color: #fff;
					}
				}
			}
		}
	}
	@media screen and (min-width: 744px), print {
		max-width: 102rem;
		margin-inline: auto;
		display: grid;
		grid-template-columns: 34rem 60rem;
	}
	@media screen and (max-width: 743px) {
		margin-top: 6rem;
		margin-inline: var(--sp-base-padding);
		.info-heading {
			margin-bottom: 5rem;
			.meta {
				gap: 0;
				time {
					font-size: 1.9rem;
				}
				.category {
					margin-left: auto;
				}
			}
			h1 {
				font-size: 2.2rem;
			}
		}
		.p-info-side-nav {
			margin-bottom: 6rem;
		}
	}
	.share-button {
		display: flex;
		justify-content: flex-end;
		gap: 2rem;
		margin-top: 12rem;
		li {
			position: relative;
			width: 4.5rem;
		}
		.share_copy_message {
			position: absolute;
			bottom: calc(100% + 2px);
			left: 50%;
			width: max-content;
			padding: .6rem 1rem;
			border-radius: .4rem;
			background: var(--color-base);
			color: #fff;
			font-size: 1.2rem;
			line-height: 1.4;
			opacity: 0;
			visibility: hidden;
			transform: translate(-50%, 5px);
			transition:
				opacity 0.2s,
				visibility 0.2s,
				transform 0.2s;
			pointer-events: none;
			@media screen and (max-width: 743px) {
				padding: .5rem 0.8rem;
				font-size: 1.1rem;
			}
		}
		.-copied .share_copy_message {
			opacity: 1;
			visibility: visible;
			transform: translate(-50%, 0);
		}
	}
	.back-btn {
		margin-top: 12rem;
	}
}

/* ============================================================================

	お問い合わせ

============================================================================= */
.p-form-contents {
	max-width: 80rem;
	margin-inline: auto;
	margin-top: 8rem;
	.form_head {
		margin-bottom: 8rem;
		.s {
			display: inline-block;
			font-size: 1.7rem;
		}
	}
	.form_item {
		margin-bottom: 4rem;
		line-height: 1.8em;
		dt {
			display: flex;
			align-items: center;
			gap: 1rem;
			font-weight: var(--font-weight-bold);
			font-size: 2.2rem;
			.hissu {
				padding: 0.2em 1em;
				background-color: var(--color-peach);
				border-radius: 10rem;
				color: #fff;
				font-size: 1.4rem;
				line-height: 1.5;
				font-weight: var(--font-weight-reg);
			}
		}
		.name-column {
			display: grid;
			gap: 2rem;
			grid-template-columns: repeat(2, 1fr);
		}
	}
	.privacy_check {
		margin-top: 8rem;
		justify-content: center;
		white-space: nowrap;
		a {
			font-weight: var(--font-weight-bold);
			--a-color: var(--color-theme);
		}
	}
	.confirm_text {
		color: var(--color-theme);
	}
	.submit_btn {
		margin-top: 9rem;
		display: flex;
		justify-content: center;
		gap: 10rem;
	}
	@media screen and (min-width: 744px), print {
		.form_item {
			display: grid;
			grid-template-columns: 30rem 1fr;
			align-items: start;
		}
		.-input dt {
			padding-top: 1rem;
		}
	}
	@media screen and (max-width: 743px) {
		margin-top: 6rem;
		padding-inline: var(--sp-base-padding);
		.form_item {
			dt {
				margin-bottom: 2rem;
			}
		}
		.privacy_check {
			margin-top: 4rem;
		}
		.submit_btn {
			flex-direction: column-reverse;
			gap: 6rem;
			.c-btn {
				margin-inline: auto 0;
				&.-back {
					margin-inline: 0 auto;
				}
			}
		}
	}

	input[type=text],
	input[type=email],
	input[type=tel],
	input[type=number],
	input[type=date],
	textarea,
	select {
		width: 100%;
		height: 6rem;
		padding: 0 1em;
		background-color: #fff;
		border: 1px solid var(--color-theme);
		border-radius: .8rem;
		font-size: 1.8rem;
		transition: box-shadow .2s, border .2s;
		&:not(:read-only):focus {
			border-color: #66afe9;
			outline: 0;
			box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,0.8);
		}
	}
	textarea {
		height: 24rem;
		padding-top: 0.8em;
		padding-bottom: 0.8em;
	}
	.select_wrap {
		position: relative;
		display: block;
		&::after {
			content: "";
			position: absolute;
			bottom: calc(50% - 1rem);
			right: 3rem;
			width: 2rem;
			height: 2rem;
			border-bottom: 2px solid var(--color-theme);
			border-right: 2px solid var(--color-theme);
			transform-origin: 100% 100%;
			transform: rotate(45deg);
		}
		select {
			padding-right: 7rem;
		}
	}


	input[type=checkbox],
	input[type=radio] {
		position: absolute;
		visibility: hidden;
	}
	label {
		position: relative;
		display: flex;
		align-items: center;
		input[type=radio] {
			& + .check {
				position: relative;
				flex-shrink: 0;
				width: 3.7rem;
				height: 3.7rem;
				margin-right: 2rem;
				background-color: #fff;
				border: 1px solid var(--color-theme);
				border-radius: 100%;
				&::after {
					content: "";
					position: absolute;
					top: .5rem;
					right: .5rem;
					left: .5rem;
					bottom: .5rem;
					background-color: var(--color-theme);
					opacity: 0;
					border-radius: 100%;
				}
			}
			&:checked {
				& + .check::after {
					opacity: 1;
				}
			}
		}
		input[type=checkbox] {
			& + .check {
				position: relative;
				flex-shrink: 0;
				width: 3.7rem;
				height: 3.7rem;
				margin-right: 2rem;
				background-color: #fff;
				border: 1px solid var(--color-theme);
				border-radius: 0.4rem;
				&::after {
					content: "";
					position: absolute;
					left: 1.1rem;
					top: 0.2rem;
					width: 1.4rem;
					height: 2.5rem;
					border-right: 0.5rem solid var(--color-theme);
					border-bottom: 0.5rem solid var(--color-theme);
					opacity: 0;
					transition: opacity .1s;
					transform: rotate(45deg);
				}
			}
			&:checked {
				& + .check::after {
					opacity: 1;
				}
			}
		}
	}
	@media screen and (max-width: 743px) {
		label {
			input[type=radio] {
				& + .check {
					margin-right: 1rem;
				}
			}
			input[type=checkbox] {
				& + .check {
					margin-right: 1rem;
				}
			}
		}
	}

	.form_error {
		margin-bottom: 6rem;
		color: #cc0000;
		font-weight: bold;
		text-align: center;
		font-size: 1.8rem;
		line-height: 1.8;
	}
	.form_error ul {
		margin-top: 1em;
	}
	.err {
		margin-top: .5rem;
	}
	.err strong {
		display: inline-block;
		padding: .4rem 1rem;
		background-color: #cc0000;
		border-radius: 4px;
		color: #fff;
		font-weight: bold;
		font-size: 1.4rem;
		line-height: 1.4;
	}
	.privacy_err {
		text-align: center;
	}
	@media screen and (max-width: 743px) {
		.form_error {
			font-size: 1.6rem;
		}
	}
}
.p-form-fin {
	max-width: 80rem;
	margin-inline: auto;
	margin-top: 8rem;
	.btn {
		margin-top: 10rem;
	}
	@media screen and (max-width: 743px) {
		margin-top: 6rem;
		padding-inline: var(--sp-base-padding);
	}
}


/* ============================================================================

	お知らせ

============================================================================= */
.p-404-contents {
	max-width: 80rem;
	margin-inline: auto;
	margin-top: 8rem;
	margin-bottom: 10rem;
	.c-title-m {
		margin-bottom: 4rem;
	}
	@media screen and (max-width: 743px) {
		margin-top: 6rem;
		margin-bottom: 6rem;
		padding-inline: var(--sp-base-padding);
	}
}