:root{
	--header-copy: 20px;
	--header-height-sp: 80px;
	--header-height-sp-sc: 50px;
	--header-height-pc: 80px;
	--header-height-pc-sc: 80px;
	--gNav-main-height-sp: 56px;
	--gNav-main-height-pc: 48px;
	--gNav-main-2-height-pc: 0;
	--gNav-sub-height-sp: 48px;
	--gNav-sub-height-pc: 36px;
	--iconMenu-size: 24px;
	--page-title-height-sp:256px;
	--page-title-height-pc:50vw;
}

.anchor{
	position: relative;
	top:calc(var(--header-height-sp-sc) + 14);
	display:block;
	visibility:hidden;
}

/********** Header **********/
#header{
	transition:all .4s ease-in-out;
	z-index:110;
	#headerMain{
		height:var(--header-height-sp);
		#logoArea{
			height:120%;
			clip-path: ellipse(120% 100% at 50% 0%);
			#logoImg{
				background:#fff;
				transition:all .4s ease-in-out;
				max-width:256px;
			}
		}
	}
}
#sub-column{
}
.stickyPos3 #sub-column{
}

#top_button{
	z-index:120;
	top:1em;
	right:1em;
}
#top_res,
#top_insta{
	width:56px;
	height:56px;
}

/********** Page Title **********/
#pageTitleWrap{
	height:var(--page-title-height-sp);
	max-height:440px;
	clip-path: ellipse(140% 100% at 50% 0%);
}
#pageTitleInner{padding-top:2em;}
#pageTitle,
#pageTitleSub{
	z-index:2
}

/********** Navigation **********/
/** #navToggle **/
#navToggle{
	width:56px;
	height:56px;
	cursor:pointer;
	#iconMenu{
		top:-4px;
		vertical-align:middle;
		width:var(--iconMenu-size);
		height:var(--iconMenu-size);
		.line{
			left:0;
			width:100%;
			height:2px;
			opacity:1;
			will-change:transform;
			-webkit-backface-visibility: hidden;
			backface-visibility: hidden
		}
		.line-1{top:4px;}
		.line-2{top:calc(50% - 1px);}
		.line-3{bottom:3px;}

	}
}
.menu_text_on,
.menu_text_off{
	bottom:4px;
}
.menu_text_off{
	opacity:0;
}

/** #gNavWrap **/
#gNavWrap{
	top:0;
	right:0;
	z-index:100;
	width:100%;
	height:100vh;
	padding:88px 1em 1em;
	overflow-y:auto;
	visibility:hidden;
	transition:all .4s ease-in-out,padding .4s ease-in-out;
	transform:translateX(100%);
	will-change:transform;
	-webkit-overflow-scrolling:touch;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	#glovalNav{
		height:100%;
		padding:1em 0;
		.menu-item-has-children.isActive::after{
			content:"\f0d8";
		}
		.menu-item{
			display:block;
			&>a{
				display:flex;
				align-items:center;
				padding:0 .8em;
				border-bottom:1px dotted #bbb;
			}
			.sub-menu{
				padding:0;
				>.menu-item>a,
				>.menu-item-has-children::after{
					background:var(--color-w);
					height:0;
					line-height:0;
					opacity:0;
				}
				.menu-item{
					&a{
						border-bottom:1px dotted #ddd;
					}
				}
				>.menu-item{
					&>a{
						padding:0 0 0 1.6em;
					}
				}
				.menu-item-has-children a{
					padding-right:calc(var(--gNav-sub-height-sp) + .2em);
				}
				.menu-item-has-children::after{
					width:var(--gNav-sub-height-sp);
					font-size:1.2em;
				}
			}
		}
		>.menu-item{	/** 第1階層のみ **/
			&>a{
				height:var(--gNav-main-height-sp);
				line-height:1;
			}
			&>a::before{
				content:"\f0da";
				padding-right:.4em;
			}
		}
		>.menu-item-has-children{
			&>a{
				padding-right:var(--gNav-main-height-sp);
			}
		}
		.menu-item-has-children::after{
			content:"\f0d7";
			position:absolute;
			z-index:2;
			top:0;
			right:0;
			cursor:pointer;
		}
		>.menu-item-has-children::after{
			width:var(--gNav-main-height-sp);
			height:calc(var(--gNav-main-height-sp) - 1px);
			line-height:1;
			font-size:1.2em
		}
	}
}
#gNavWrap.isVisible{
	visibility:visible;
	transform:translateX(0);
}
.headerType-h2 #gNavWrap{
	top:calc(var(--header-height-sp) + var(--header-copy));
}

#fixed_hour{
	z-index:50;
	bottom:0;
	right:0;
	width:420px;
	overflow: hidden;
}
#fixed_hour #fixed_hour_header {
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	border-radius: 1em 0 0 0;
	padding: .4em .8em;
	cursor: pointer;
	width:50%;
}
#fixed_hour.is-open #fixed_hour_header {
	width:100%;
}
#fixed_hour_header::after{
	content:"\2b";
}
#fixed_hour.is-open #fixed_hour_header::after{
	content:"\f068";
}

#fixed_hour_content {
	display: none; /* 初期状態で非表示 */
	border-left: 1px solid #ccc;
	background: #fff;
}


@media all and (min-width:992px),print{

	#pageTitleInner{padding-top:0;}

	.anchor{
		top:calc(var(--header-height-pc-sc) + 14);
	}

/********** Header **********/

	#header{
		#headerMain{
			height:var(--header-height-pc);
			#logoArea{
				height:140%;
			}
		}
	}
	.stickyPos3 #header{
		background:none;
	}
	#sub-column #logoImg_2{
		transition:all .4s ease-in-out;
		width:100%;
		height:auto;
	}

	#top_button{
		top:1.6em;
		right:1.6em;
	}

/********** Page Title **********/

	#pageTitleWrap{
		height:var(--page-title-height-pc);
	}

/** #gNavWrap **/
	#gNavWrap{
		top:0;
		padding:108px 1em 1em;
		transition:all .4s ease-in-out;
		max-width:440px;
		border:none;
		border-left:1px solid var(--color-01);
		scrollbar-width:none;
		-ms-overflow-style: none;
	}
	#gNavWrap.pos-lg-sticky,
	#gNavWrap.pos-lg-sticky.isVisible,
	#gNavWrap.pos-lg-sta,
	#gNavWrap.pos-lg-sta.isVisible{
		visibility:visible;
		transform:translateX(0);
		overflow-y:visible;
		max-width:100%;
		border:none;
		#glovalNav{
			padding:0;
			>.menu-item{
				padding:0;
				&>a{
					-ms-flex-direction:column!important;
					flex-direction:column!important;
					-ms-flex-pack:center!important;
					justify-content:center!important;
					border-bottom:none;
				}
				&>a::before{
					content:none;
					padding:0;
				}
				>.sub-menu{
					position:absolute!important;
					left:0!important;
					width:200px!important;
					min-width:calc(100% + 1px);
				}
			}
			.menu-item-has-children>a{
					padding-right:2em;
			}
			.menu-item-has-children::after{
				border:none;
				width:2em;
				line-height:1;
				font-size:1em;
			}
		}
	}
	#gNavWrap.pos-lg-sticky,
	#gNavWrap.pos-lg-sticky.isVisible{
		top:var(--header-height-pc);
		#glovalNav{
			>.menu-item>a,
			>.menu-item-has-children::after{
				height:var(--gNav-main-height-pc);
			}
			>.menu-item{
				>a{
					border-left:1px solid var(--color-w);
				}
			}
		}
	}
	#wrapper.container #gNavWrap.pos-lg-sticky,
	#wrapper.container #gNavWrap.pos-lg-sticky.isVisible,
	#wrapper.container #gNavWrap.pos-lg-sta,
	#wrapper.container #gNavWrap.pos-lg-sta.isVisible{
		#glovalNav{
			>.menu-item:first-child{
				>a{
					border-left:none;
				}
			}
		}
	}
	#gNavWrap.pos-lg-sta,
	#gNavWrap.pos-lg-sta.isVisible,
	#gNavWrap.pos-lg-sta #glovalNav>.menu-item,
	#gNavWrap.pos-lg-sta #glovalNav>.menu-item>a,
	#gNavWrap.pos-lg-sta #glovalNav>.menu-item-has-children::after{
		width:auto!important;
		height:32px
	}
	.stickyPos3 #gNavWrap,
	.stickyPos3 #gNavWrap.isVisible{
		position:static!important
	}
	#gNavWrap.pos-lg-sta #glovalNav>.menu-item-has-children::after{
		padding-right:.8em;
	}
	.stickyPos3 #gNavWrap{
		visibility:visible;
		transform:translateX(0);
		overflow-y:visible;
		max-width:100%;
		border:none;
		border-top:1px solid var(--color-02);
	}
	.headerType-h2 #gNavWrap{
		top:calc(var(--header-height-pc) + var(--header-copy));
	}
}

@media all and (min-width:1200px),print{

	#navToggle,
	#top_res,
	#top_insta{
		width:80px;
		height:80px;
	}
	#gNavWrap{
		padding:134px 1em 1em;
		#glovalNav{
			padding:0;
		}
	}

}