:root{
	--header-copy: 20px;
	--header-height-sp: 50px;
	--header-height-sp-sc: 50px;
	--header-height-pc: 72px;
	--header-height-pc-sc: 44px;
	--gNav-main-height-sp: 48px;
	--gNav-main-height-pc: 32px;
	--gNav-main-2-height-pc: 0;
	--gNav-sub-height-sp: 48px;
	--gNav-sub-height-pc: 36px;
	--iconMenu-size: 70%;
	--page-title-height-sp:40vw;
	--page-title-height-pc:30vw;
}

.anchor{
	position: absolute;
	margin-top:-72px;
	padding-top:72px;
	display:inline-block;
	visibility:hidden;
	height:0;
}

/********** Header **********/
#header{
	background:var(--color-w);
	transition:all .4s ease-in-out;
	z-index:120;
	#headerCopy{
		height:var(--header-copy);
		line-height:var(--header-copy);
	}
	#headerMain{
		height:var(--header-height-sp);
		#logoArea{
			z-index:120;
			height:90%;
			#logoImg{
				max-width:148px;
			}
		}
	}
}
#sub-column{
}
.stickyPos3 #sub-column{
}
/********** Page Title **********/
#pageTitleWrap{
	height:var(--page-title-height-sp);
	max-height:360px;
	position: relative;
	background: #fff;
	padding:0 .4em;
}
#pageTitleWrap::before,
#pageTitleWrap::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  z-index: 1;
}

#pageTitleWrap::before {
  bottom: 0;
  right: 0;
  border-width: 0 0 6svw 16svw;
  border-color: transparent transparent #fff transparent;
}

#pageTitleWrap::after {
  top: 0;
  left: 0;
  border-width: 6svw 16svw 0 0;
  border-color: #fff transparent transparent transparent;
}

#pageTitle,
#pageTitleSub{
	z-index:2
}

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

	}
}
/** #gNavWrap **/
#gNavWrap{
	top:0;
	right:0;
	z-index:50;
	width:100%;
	height:100%;
	overflow-y:auto;
	visibility:hidden;
	transition:all .6s ease-in-out,padding .6s ease-in-out;
	transform:translateX(-100%);
	will-change:transform;
	-webkit-overflow-scrolling:touch;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	display:flex;
	align-items:center;
	justify-content:center;
		padding:50px 0 0;
	#glovalNav{
		.menu-item-has-children.isActive::after{
			content:"\f0d8";
		}
		.menu-item{
			display:block;
			&>a{
				display:flex;
				align-items:center;
				justify-content:center;
				text-align:center;
				padding:0 .8em;
				border-bottom:1px solid var(--color-w);
			}
			.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:0 solid var(--bg-alpha-0);
					}
				}
				>.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);
					border-left:1px solid var(--color-02);
					font-size:1.2em;
				}
			}
		}
		>.menu-item{	/** 第1階層のみ **/
			&>a{
				height:var(--gNav-main-height-sp);
				line-height:1;
			}
		}
		>.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;
			border-left:1px solid var(--color-w);
			font-size:1.2em
		}
	}
}
#gNavWrap.isVisible{
	visibility:visible;
	transform:translateX(0);
}
.headerType-h2 #gNavWrap{
	top:calc(var(--header-height-sp) + var(--header-copy));
}

@media all and (min-width:768px),print{
	#gNavWrap{
		max-width:50%
	}
}
@media all and (min-width:992px),print{

	.anchor{
		margin-top:-84px;
		padding-top:84px;
	}

/********** Header **********/
	#header{
		#headerMain{
			height:var(--header-height-pc);
			#logoArea{
				#logoImg{
					height:60%;
					max-width:192px;
				}
			}
		}
	}
	.stickyPos3 #header{
		background:none;
	}
	#sub-column #logoImg_2{
		transition:all .4s ease-in-out;
		width:100%;
		height:auto;
	}

/********** Page Title **********/
#pageTitleWrap{
	height:var(--page-title-height-pc);
}
/** #gNavWrap **/
	#gNavWrap{
		top:var(--header-height-pc);
		transition:all .4s ease-in-out;
		max-width:360px;
		border:none;
		border-left:1px solid var(--color-01);
		padding:0;
	}
	#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{
			>.menu-item{
				&>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:1400px),print{
	#pageTitleWrap::before {
		border-width: 0 0 12svw 20svw;
	}	
	#pageTitleWrap::after {
		border-width: 12svw 20svw 0 0;
	}
	#gNavWrap.pos-lg-sticky #glovalNav{
		border-right:1px solid var(--color-w)
	}
	#wrapper.container #gNavWrap.pos-lg-sticky #glovalNav{
		border-right:none
	}

}