/*===============================================================================
ヘッダー上：ロゴとツール
================================================================================*/
.siteHeader{
	position: fixed;
	top: 0;
	left: 0;
	z-index: 2001;
	background-color: transparent;
	box-shadow: none;
	transition: var(--ani-t--normal) ease-out;
}
.siteHeader :has(#vk-mobile-nav-menu-btn.menu-open){
	filter: drop-shadow(0px 0px 8px rgba(207, 175, 112, 0.2));
}
@media (min-width: 992px){
	.siteHeader{
		position: relative;
	}
}
.siteHeader .container{
	max-width: 100vw;
	padding: 0;
}

.navbar-header{
	position: relative;
	z-index: 1;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1.25rem 0;
	padding: var(--header-vertical-gap) var(--header-side-gap);
	background: rgba(34, 32, 30, 0.8);
	backdrop-filter: blur(20px);
}
@media (min-width: 1200px){
	.navbar-header{
		justify-content: center;
	}
}

/*===============================
* ロゴ
* =================================*/
.siteHeader_logo{
	width: fit-content;
	margin: 0;
	padding: 0;
	background: var(--c-gradient--text);
	background: -webkit-var(--c-gradient--text);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-size: var(--logo-size);
	font-family: var(--ff-bask);
}

/*===============================
* ツール
* =================================*/
.header-tools{
	display: flex;
	gap: 1.25rem;
}
@media (min-width: 992px){
	.header-tools{
		position: absolute;
		top: var(--header-vertical-gap);
		right: var(--header-side-gap);
	}
}
.header-tools__btn.c-Btn{
	display: none;
	max-width: 10em;
	font-size: 1rem;
}
@media (min-width: 992px){
	.header-tools__btn.c-Btn{
		display: inline-block;
	}
}


/*===============================================================================
ヘッダー下：グロナビ
================================================================================*/
#gMenu_outer{
	display: none;
	width: 100%;
	min-height: auto;
	padding: 0px 1.25rem;
	background: rgba(76, 74, 69, 0.2);
	backdrop-filter: blur(20px);
}
@media (min-width: 992px){
	#gMenu_outer{
		display: block;
	}
}

/* グロナビ：nav */
#gMenu_outer nav{
	display: block;
	width: 100%;
	height: 100%;
	padding: 0;
}

/* グロナビ：ul */
#gMenu_outer .gMenu{
	display: flex;
	justify-content: center;
	width: 100%;
}

/* グロナビ：li */
#gMenu_outer .gMenu>li{
	flex: 1;
	padding: 0;
	border: 0;
}
#gMenu_outer .gMenu>li:before{
	content: none;
}

/* グロナビ：リンク */
#gMenu_outer .gMenu>li>a{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	padding: 1.2em 1em;
	line-height: var(--lh-md);
	font-size: 1rem;
	color: var(--c-main--light);
	transition: var(--ani-t--normal) ease-out;
}
#gMenu_outer .gMenu>li>a:is(:hover, :focus),
#gMenu_outer .gMenu .current-menu-item a:not([href*="#"]){
	background: var(--c-brown--light);
	color: var(--c-main);
}

/* グロナビ：アイコン */
#gMenu_outer .gMenu>li>a::before{
	content: '';
	display: block;
	width: 1.25em;
	aspect-ratio: 1 / 1;
	transition: var(--ani-t--normal) ease-out;
}
#gMenu_outer .gMenu>#menu-item-18>a::before {
	background: var(--hdr-icon-home) center center/contain no-repeat;
}
#gMenu_outer .gMenu>#menu-item-19>a::before {
	background: var(--hdr-icon-schedule) center center/contain no-repeat;
}
#gMenu_outer .gMenu>#menu-item-20>a::before {
	background: var(--hdr-icon-twitter) center center/contain no-repeat;
}
#gMenu_outer .gMenu>#menu-item-21>a::before {
	background: var(--hdr-icon-therapist) center center/contain no-repeat;
}
#gMenu_outer .gMenu>#menu-item-22>a::before {
	background: var(--hdr-icon-price) center center/contain no-repeat;
}
#gMenu_outer .gMenu>#menu-item-23>a::before {
	background: var(--hdr-icon-access) center center/contain no-repeat;
}
#gMenu_outer .gMenu>#menu-item-24>a::before {
	background: var(--hdr-icon-line) center center/contain no-repeat;
}
#gMenu_outer .gMenu>#menu-item-18>a:is(:hover, :focus)::before,
#gMenu_outer .gMenu>#menu-item-18.current-menu-item a:not([href*="#"])::before{
	background: var(--hdr-icon-home-hover) center center/contain no-repeat;
}
#gMenu_outer .gMenu>#menu-item-19>a:is(:hover, :focus)::before,
#gMenu_outer .gMenu>#menu-item-19.current-menu-item a:not([href*="#"])::before{
	background: var(--hdr-icon-schedule-hover) center center/contain no-repeat;
}
#gMenu_outer .gMenu>#menu-item-20>a:is(:hover, :focus)::before,
#gMenu_outer .gMenu>#menu-item-20.current-menu-item a:not([href*="#"])::before{
	background: var(--hdr-icon-twitter-hover) center center/contain no-repeat;
}
#gMenu_outer .gMenu>#menu-item-21>a:is(:hover, :focus)::before,
#gMenu_outer .gMenu>#menu-item-21.current-menu-item a:not([href*="#"])::before{
	background: var(--hdr-icon-therapist-hover) center center/contain no-repeat;
}
#gMenu_outer .gMenu>#menu-item-22>a:is(:hover, :focus)::before,
#gMenu_outer .gMenu>#menu-item-22.current-menu-item a:not([href*="#"])::before{
	background: var(--hdr-icon-price-hover) center center/contain no-repeat;
}
#gMenu_outer .gMenu>#menu-item-23>a:is(:hover, :focus)::before,
#gMenu_outer .gMenu>#menu-item-23.current-menu-item a:not([href*="#"])::before{
	background: var(--hdr-icon-access-hover) center center/contain no-repeat;
}
#gMenu_outer .gMenu>#menu-item-24>a:is(:hover, :focus)::before,
#gMenu_outer .gMenu>#menu-item-24.current-menu-item a:not([href*="#"])::before{
	background: var(--hdr-icon-line-hover) center center/contain no-repeat;
}

#gMenu_outer .gMenu_name{
	font-size: 1em;
}


/*===============================================================================
ハンバーガーメニュー
================================================================================*/
/*===============================
* ハンバーガーメニュー：ボタン
* =================================*/
#vk-mobile-nav-menu-btn{
	position: static;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	align-self: center;
	gap: .5rem;
	width: 1.5rem;
	border: 0;
	background: none;
	border-radius: 0;
	overflow: visible;
}
@media (min-width: 992px){
	#vk-mobile-nav-menu-btn{
		display: none;
	}
}
#vk-mobile-nav-menu-btn span{
	--rotate: 39deg;
	--scale: 1.36;
	width: 100%;
	height: 2px;
	border-radius: 100vmax;
	background: var(--c-main);
	transition: var(--ani-t--normal) ease-out;
}
#vk-mobile-nav-menu-btn span:nth-of-type(1){
	transform-origin: top left;
}
#vk-mobile-nav-menu-btn span:nth-of-type(3){
	transform-origin: bottom left;
}

/* open */
#vk-mobile-nav-menu-btn.menu-open span:nth-of-type(1){
	transform: scale(var(--scale)) rotate(var(--rotate));
}
#vk-mobile-nav-menu-btn.menu-open span:nth-of-type(2){
	transform: scalex(0);
}
#vk-mobile-nav-menu-btn.menu-open span:nth-of-type(3){
	transform: scale(var(--scale)) rotate(calc( var(--rotate) * -1 ));
}


/*===============================
* ハンバーガーメニュー内
* =================================*/
#vk-mobile-nav{
	padding-top: calc( var(--header-vertical-gap) * 2 + var(--logo-size) * 2.5 + var(--g-sec--md) );
	padding-bottom: 0;
	padding-right: var(--header-side-gap );
	padding-left: var(--header-side-gap );
	background: var(--c-bgc);
}
#vk-mobile-nav::before{
	position: absolute;
	top: 0;
	left: calc(50% - 50vw);
	z-index: -1;
	content: "";
	display: inline-block;
	width: 100%;
	height: 100%;
	background-image: url(/wp-content/uploads/back-img.jpg);
	background-repeat: no-repeat;
	background-attachment: fixed;
	opacity: .1;
}
/* 管理者のみに見えるアラート */
#vk-mobile-nav .alert-info{
	display: none;
}

#vk-mobile-nav .vk-mobile-nav-menu-outer{
	margin-bottom: var(--g-sec--md);
}

#vk-mobile-nav nav ul{
	--count: 2;
	--gap: 1em;
	display: flex;
	flex-wrap: wrap;
	gap: var(--gap);
	border: 0;
}
#vk-mobile-nav nav ul li{
	width: calc( ( 100% - var(--gap) * (var(--count) - 1) ) / var(--count) );
}
#vk-mobile-nav nav ul #menu-item-24 {
	display: none;
}

/* ハンバーガーメニュー内：リンク */
#vk-mobile-nav nav ul li a{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	padding: 1em;
	background-color: var(--c-brown--light);
	border: 0;
	border-radius: var(--bd-r--xs);
	overflow: hidden;
	line-height: var(--lh-md);
	font-size: 1rem;
	color: var(--c-main);
	transition: var(--ani-t--normal) ease-out;
}
#vk-mobile-nav nav ul li a:is(:hover, :focus){
	color: var(--c-main--light);
	opacity: .7;
}

/* グロナビ：アイコン */
#vk-mobile-nav nav ul li a::before{
	content: '';
	display: block;
	width: 2em;
	aspect-ratio: 1 / 1;
	transition: var(--ani-t--normal) ease-out;
}
#vk-mobile-nav nav ul #menu-item-18 a::before {
	background: var(--hdr-icon-home-hover) center center/contain no-repeat;
}
#vk-mobile-nav nav ul #menu-item-19 a::before {
	background: var(--hdr-icon-schedule-hover) center center/contain no-repeat;
}
#vk-mobile-nav nav ul #menu-item-20 a::before {
	background: var(--hdr-icon-twitter-hover) center center/contain no-repeat;
}
#vk-mobile-nav nav ul #menu-item-21 a::before {
	background: var(--hdr-icon-therapist-hover) center center/contain no-repeat;
}
#vk-mobile-nav nav ul #menu-item-22 a::before {
	background: var(--hdr-icon-price-hover) center center/contain no-repeat;
}
#vk-mobile-nav nav ul #menu-item-23 a::before {
	background: var(--hdr-icon-access-hover) center center/contain no-repeat;
}
#vk-mobile-nav nav ul #menu-item-18 a:is(:hover, :focus)::before{
	background: var(--hdr-icon-home) center center/contain no-repeat;
}
#vk-mobile-nav nav ul #menu-item-19 a:is(:hover, :focus)::before{
	background: var(--hdr-icon-schedule) center center/contain no-repeat;
}
#vk-mobile-nav nav ul #menu-item-20 a:is(:hover, :focus)::before{
	background: var(--hdr-icon-twitter) center center/contain no-repeat;
}
#vk-mobile-nav nav ul #menu-item-21 a:is(:hover, :focus)::before{
	background: var(--hdr-icon-therapist) center center/contain no-repeat;
}
#vk-mobile-nav nav ul #menu-item-22 a:is(:hover, :focus)::before{
	background: var(--hdr-icon-price) center center/contain no-repeat;
}
#vk-mobile-nav nav ul #menu-item-23 a:is(:hover, :focus)::before{
	background: var(--hdr-icon-access) center center/contain no-repeat;
}

/*===============================
* ハンバーガーメニュー内：CTA
* =================================*/
.vk-mobile-nav-widget:has(.hmbg-cta){
	margin-bottom: 0;
}
.hmbg-cta{
	display: flex;
	flex-direction: column;
	gap: var(--g-sec--md);
}
/* メイン */
.hmbg-cta-future{
	text-align: center;
}
.hmbg-cta-future__btn{
	margin-bottom: .5rem;
}
.hmbg-cta-future__note{
	justify-content: center;
	font-size: .75rem;
	font-family: var(--ff-m);
}

/* 情報 */
.hmbg-cta-info{
	display: flex;
	flex-direction: column;
	gap: 1.75rem;
}
.hmbg-cta-info__data{
	display: flex;
	align-items: center;
	gap: .5em;
	font-family: var(--ff-m);
	font-size: 1.5rem;
	color: var(--c-light);
}
.hmbg-cta-info__icon{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 1.6em;
	aspect-ratio: 1;
	background: var(--c-brown--light);
	border-radius: 50%;
	overflow: hidden;
}
.hmbg-cta-info__icon img{
	width: 1em;
}
.hmbg-cta-info__holiday{
	font-size: 1rem;
}

/* SNS */
.hmbg-cta-sns{
	position: relative;
	padding: 4rem 0;
}
.hmbg-cta-sns__bgi{
	position: absolute;
	top: 0;
	left: calc( 50% - 50vw );
	z-index: -1;
	max-width: 100vw;
	width: 100vw;
	height: 100%;
	object-fit: cover;
	opacity: .2;
}
.hmbg-cta-sns__lead{
	margin-bottom: .75rem;
	text-align: center;
	color: var(--c-light);
	font-family: var(--ff-m);
}
.hmbg-cta-sns__links{
	display: flex;
	gap: 1rem;
	max-width: fit-content;
	margin-inline: auto;
}
.hmbg-cta-sns__link{
	width: 2.5rem;
	transition: var(--ani-t--normal) ease-out;
}
.hmbg-cta-sns__link:is(:hover, :focus){
	opacity: .7;
}