@charset "utf-8";

/* PC ======================================================*/
.hamburger { 
  display: none;
}
.nav_wrap {
  position: relative;
  z-index: 100;
  margin-top: 18px;
}
.gnav {
	width: 100%;
	display: flex;
	font-weight: 600;
	font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
	font-size: 1.6rem;
}
.gnav ul {
	list-style: none;
	display: flex;
	justify-content: flex-start;
	justify-content: center;
}
.gnav ul li {
	position: relative;
	margin-right: 28px;
	margin-bottom: 10px;
}
.gnav ul li:last-child {
	margin-right: 28px;
}
.gnav ul li a {
	display: block;
	position: relative;
	padding-bottom: .3em;
	color: #444;
	text-decoration: none;
	letter-spacing: .05em;
}
.gnav ul li a::after {
	position: absolute;
	bottom: 0;
	left: 0;
	content: '';
	width: 100%;
	height: 2px;
	background: #50ADE5;
	transform: scale(0, 1);
	transform-origin: left top;
	transition: transform .3s;
}
.gnav ul li a:hover {
	opacity:1;
}
.gnav ul li a:hover::after {
	transform: scale(1, 1);
}
.gnav .btn_contact {
	display: block;
	height: 36px;
	line-height: 36px;
	text-align: center;
	padding: 0 28px;
	border: 2px solid #50ADE5;
	border-radius: 18px;
	color: #fff;
	margin-top: -8px;
	transition: all  0.3s ease;
	text-decoration: none;
	background: #50ADE5;
}
.gnav .btn_contact:hover {color: #50ADE5; text-decoration: none; background: #fff;}

/* タブレット調整 ======================================================*/
@media screen and (max-width: 1329px) {
	.gnav {
		font-size: 1.5rem;
	}
	.gnav ul li {
		margin-right: 2rem;
	}
}

/* スマホ ======================================================*/
@media screen and (max-width: 979px) {
	body.is-open{
		position: fixed;
		width: 100%;
		inline-size: 100%;
		block-size: 100%;
		overflow: hidden;
	}
	/*ハンバーガー*/
	.hamburger {
		display : block;
		position: fixed;
		z-index : 9999;
		right : 14px;
		top   : 14px;
		width : 42px;
		height: 42px;
		cursor: pointer;
		text-align: center;
	}
	.hamburger span {
		display : block;
		position: absolute;
		width   : 30px;
		height  : 2px ;
		left    : 6px;
		background : #555;
		-webkit-transition: 0.3s ease-in-out;
		-moz-transition   : 0.3s ease-in-out;
		transition        : 0.3s ease-in-out;
	}
	.hamburger span:nth-child(1) {top: 10px;}
	.hamburger span:nth-child(2) {top: 20px;}
	.hamburger span:nth-child(3) {top: 30px;}

	.hamburger.active span:nth-child(1) {
		top : 16px;
		left: 6px;
		background :#555;
		-webkit-transform: rotate(-45deg);
		-moz-transform   : rotate(-45deg);
		transform        : rotate(-45deg);
	}
	.hamburger.active span:nth-child(2),
	.hamburger.active span:nth-child(3) {
		top: 16px;
		background :#555;
		-webkit-transform: rotate(45deg);
		-moz-transform   : rotate(45deg);
		transform        : rotate(45deg);
	}
	/*ハンバーガー展開時*/
	.gnav {display: none;}
	.gnav.open {
		display: block;
		padding: 100px 3rem 0;
		position: fixed;
		left: 0;
		top: 0;
		background: #F3F2F1;
		width: 100%;
		height: 100%;
		overflow-x: hidden;
		overflow-y: auto;
		z-index: 2;
		overscroll-behavior: contain; /* iOSでの引っ張りを抑制 */
	}
	.gnav ul {
		display: block;
		width: 100%;
		font-size: 1.5rem;
		border-left :none;
	}
	.gnav ul li {margin: 0;}

	.gnav ul li a {
		width: 100%;
		height: 50px;
		line-height: 50px;
		text-align: left;
		padding-left: 1em;
		border-right: none;
		border-bottom:1px solid #555;
		text-decoration: none;
		color: #333;
	}

	.gnav ul > li a::after {/*下線打ち消し*/
		position: static;
	}
	.gnav .btn_contact {/*ご予約・お問い合わせ*/
		display: block;
		height: 40px;
		line-height: 40px;
		padding: 0 1.1em;
		border: none;
		border-radius: 20px;
		color: #fff;
		margin-top: 40px;
		background: #50ADE5;
		text-align: center;
		font-size: 1.5rem;
		color: #fff;
		text-decoration: none;
	}
}