@charset "UTF-8";


/*Garamond semibold*/
.btn-menu-close a{
  font-family: "Cormorant Garamond", serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}
.gnav-info h2,
.gnav-info .gnav-info-time{
  font-family: "Shippori Mincho", serif;
  font-weight: 500;
  font-style: normal;
}
/*noto semibold*/
.gnav-info-tel{
  font-family: "Noto Serif JP", serif;
  font-weight: 600;
  font-style: normal;	
}
.gnav-layer{
	visibility: hidden;
	opacity: 0;
	transition: opacity 800ms ease,visibility 800ms ease;
}
.is-nav-open .gnav-layer{
	visibility: visible;
	opacity: 1;
	z-index: 10000;
}
.gheader-logo a{
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
}
.gheader-logo a img{
	position: absolute;
	top: 0;
	left: 0;
	transition: opacity 600ms ease;
}
.gheader-logo a img.logo-br{
	opacity: 0;
}
.is-on-header .gheader-logo a img.logo-br{
	opacity: 1;
}
.is-on-header .gheader-logo a img.logo-wh{
	opacity: 0;
}

a.btn-menu .wave-bk{
	display: none;
}
.is-on-header a.btn-menu .wave-bk{
	display: block;
}
.is-on-header a.btn-menu .wave-wh{
	display: none;
}



@media screen and (min-width: 768px) {

	.gheader{
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		padding: 0 30px;
		height: 100px;
		transition: background 600ms ease;
		z-index: 500;
	}
	.gheader-inner{
		position: relative;
		height: 100%;
	}
	.gheader-logo{
		position: absolute;
		margin: auto;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		width: 300px;
		height: 50px;
	}
	.nav-buttons{
		position: absolute;
		top: 50%;
		right: 0;
		transform: translateY(-50%);
	}
	.nav-buttons ul{
		display: flex;
		align-items: center;
	}
	.nav-buttons ul li + li{
		margin-left: 30px;
	}
	a.sns-insta:hover,
	a.sns-tiktok:hover{
		opacity: 0.7;
	}

	a.btn-menu{
		position: relative;
		display: block;
		width: 45px;
		height: 45px;
		overflow: hidden;
	}
	a.btn-menu span{
		position: absolute;
		margin: auto;
		top: 0;
		bottom: 0;
		display: block;
		width: 30px;
		height: 30px;
	}
	a.btn-menu span img{
		top: 0;
		left: 0;
		position: absolute;
	}


	.gheader a.sns-insta{
		display: block;
		width: 30px;
		height: 30px;
		background: url(../img/common/icon_insta_wh.svg) 0 0 no-repeat;
		background-size: 100% 100%;
		transition: opacity 600ms ease,background 600ms ease;
	}
	.gheader a.sns-tiktok{
		display: block;
		width: 27px;
		height: 30px;
		background: url(../img/common/icon_tiktok_wh.svg) 0 0 no-repeat;
		background-size: 100% 100%;
		transition: opacity 600ms ease,background 600ms ease;
	}

	.is-on-header .gheader{
		background: rgba(255,255,255,0.8);
	}
	.is-on-header .gheader a.sns-insta{
		background: url(../img/common/icon_insta_br.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}
	.is-on-header .gheader a.sns-tiktok{
		background: url(../img/common/icon_tiktok_br.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}



	/* nav
	==========================================================*/

	.gnav-layer{
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 5000;
		background-image: url(../img/nav/bg_nav.jpg);
		background-size: cover;
	}
	.gnav-main{
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100%;		
	}
	.gnav-layer-inner{
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100%;
	}
	.gnav-logo{
		margin: auto;
		width: 350px;
		height: 59px;
	}
	.gnav-logo a{
		display: block;
		width: 100%;
		height: 100%;
		background: url(../img/common/logo_br.svg) 50% 0 no-repeat;
		background-size: 100% 100%;
	}
	.gnav-info{
		margin: 120px 0 0;
		text-align: center;
	}
	.gnav-info h2{
		font-size: 14px;
	}
	.gnav-info-tel{
		margin: 12px 0 0;
		font-size: 30px;
	}
	.gnav-info-time{
		display: inline-block;
		margin: 15px 0 0;
		padding: 10px 15px 0;
		border-top: 1px solid #b2a5a0;
	}
	.gnav{
		padding: 50px 0 50px 80px;
		margin: 0 0 0 80px;
		border-left: 1px solid rgba(35,24,21,0.5);
	}
	.nav-primary li + li{
		margin-top: 32px;
	}
	.gnav-main li a{
		position: relative;
		display: flex;
		align-items: center;
	}
	.gnav-main li a span{
		position: relative;
		margin: 0 15px 0 0;
		display: inline-block;
		text-indent: -9999px;
	}
	.gnav-main li a em{
	}
	.gnav-main li a span:before,
	.gnav-main li a span:after{
		content: "";
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		transition: opacity 600ms ease;
	}
	.gnav-main li a span:after{
		opacity: 0;
	}
	.gnav-main li a:hover span:after{
		opacity: 1;
	}
	.gnav-main li a:hover span:before{
		opacity: 0;
	}

	.nav-top a span{
		width: 48px;
		height: 28px;		
	}
	.nav-top a span:before{
		background: url(../img/nav/top.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}
	.nav-top a span:after{
		background: url(../img/nav/top_on.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}

	.nav-chapel a span{
		width: 196px;
		height: 30px;
	}
	.nav-chapel a span:before{
		background: url(../img/nav/chapel.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}
	.nav-chapel a span:after{
		background: url(../img/nav/chapel_on.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}

	.nav-celemony a span{
		width: 203px;
		height: 29.5px;
	}
	.nav-celemony a span:before{
		background: url(../img/nav/celemony.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}
	.nav-celemony a span:after{
		background: url(../img/nav/celemony_on.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}

	.nav-plan a span{
		width: 58px;
		height: 22px;
	}
	.nav-plan a span:before{
		background: url(../img/nav/plan.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}
	.nav-plan a span:after{
		background: url(../img/nav/plan_on.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}

	.nav-fair a span{
		width: 56.5px;
		height: 20.5px;
	}
	.nav-fair a span:before{
		background: url(../img/nav/fair.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}
	.nav-fair a span:after{
		background: url(../img/nav/fair_on.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}

	.nav-logs a span{
		width: 177px;
		height: 30px;
	}
	.nav-logs a span:before{
		background: url(../img/nav/logs.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}
	.nav-logs a span:after{
		background: url(../img/nav/logs_on.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}



	.nav-social{
		margin-top: 38px;
		display: flex;
	}
	.nav-social li + li{
		margin-left: 25px;
	}
	.nav-social a.sns-insta{
		display: block;
		width: 30px;
		height: 30px;
		background: url(../img/common/icon_insta_br.svg) 0 0 no-repeat;
		background-size: 100% 100%;
		transition: opacity 600ms ease;
	}
	.nav-social a.sns-tiktok{
		display: block;
		width: 27px;
		height: 30px;
		background: url(../img/common/icon_tiktok_br.svg) 0 0 no-repeat;
		background-size: 100% 100%;
		transition: opacity 600ms ease;
	}


	.gnav-contact{
		margin: 0 0 0 55px;
	}
	.gnav-contact li + li{
		margin-top: 20px;
	}
	.gnav-contact li a{
		position: relative;
		display: flex;
		align-items: center;
		padding: 0 18px;
		width: 180px;
		height: 50px;
		background: #231815;
		color: #fff;
		font-size: 14px;
		font-weight: 600;
		transition: all 600ms ease;
	}
	.gnav-contact li a:after{
		content: "";
		position: absolute;
		margin: auto;
		top: 0;
		right: 18px;
		bottom: 0;
		display: block;
		width: 10px;
		height: 8px;
		background: url(../img/common/arrow_r_wh.svg) 0 0 no-repeat;
		background-size: 100% 100%;
		transition: transform 800ms ease;
	}
	.gnav-contact li a:hover:after{
		transform: translateX(10px);
		background: url(../img/common/arrow_r_br.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}
	.gnav-contact li a:hover{
		color: #231815;
		background: #fff;
	}



	.btn-menu-close{
		position: absolute;
		top: 15px;
		right: 15px;	
	}
	.btn-menu-close a{
		display: block;
	}
	.btn-menu-close a span{
		position: relative;
		padding: 0 0 0 18px;
		display: block;
	}
	.btn-menu-close a span:after{
		content: "";
		position: absolute;
		margin: auto;
		top: 0;
		left: 0;
		bottom: 0;
		display: block;
		width: 9px;
		height: 9px;
		background: url(../img/common/icon_close.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}

}


@media screen and (min-width: 768px) and (max-width: 980px) {

	.gnav-main{
		height: auto;
	}
	.gnav-layer-inner{
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		height: 100%;
	}
	.gnav-contact{
		margin: 0;
	}
	.gnav-contact ul{
		margin: 40px 0 0;
		display: flex;
	}
	.gnav-contact li + li {
		margin-top: 0;
		margin-left: 15px;
	}

}


@media screen and (max-width: 767px) {

	.gheader{
		position: fixed;
		width: 100%;
		padding: 0 15px;
		height: 60px;
		z-index: 500;
	}
	.gheader-inner{
		position: relative;
		height: 100%;
	}
	.gheader-logo{
		position: absolute;
		margin: auto;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		width: 180px;
		height: 30px;
	}
	.nav-buttons{
		position: absolute;
		top: 50%;
		right: 0;
		transform: translateY(-50%);
	}

	.nav-buttons ul li:nth-child(1),
	.nav-buttons ul li:nth-child(2){
		display: none;
	}
	a.sns-insta:hover,
	a.sns-tiktok:hover{
		opacity: 0.7;
	}

	a.btn-menu{
		display: block;
		width: 30px;
		height: 30px;
		background: url(../img/common/icon_menu.png) 50% 50% no-repeat;
		background-size: 30px 16px;
	}
	a.btn-menu span{
		display: none !important;
	}

	a.btn-menu{
		position: relative;
		display: block;
		width: 30px;
		height: 30px;
		overflow: hidden;
	}
	a.btn-menu span{
		position: absolute;
		margin: auto;
		top: 0;
		bottom: 0;
		display: block;
		width: 30px;
		height: 30px;
	}
	a.btn-menu span img{
		top: 0;
		left: 0;
		position: absolute;
	}


	.gheader a.sns-insta{
		display: block;
		width: 30px;
		height: 30px;
		background: url(../img/common/icon_insta_wh.svg) 0 0 no-repeat;
		background-size: 100% 100%;
		transition: opacity 600ms ease;
	}
	.gheader a.sns-tiktok{
		display: block;
		width: 27px;
		height: 30px;
		background: url(../img/common/icon_tiktok_wh.svg) 0 0 no-repeat;
		background-size: 100% 100%;
		transition: opacity 600ms ease;
	}


	.is-on-header .gheader{
		background: rgba(255,255,255,0.8);
	}
	.is-on-header .gheader a.sns-insta{
		background: url(../img/common/icon_insta_br.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}
	.is-on-header .gheader a.sns-tiktok{
		background: url(../img/common/icon_tiktok_br.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}
	.is-on-header a.btn-menu{
		background: url(../img/common/icon_menu_br.png) 50% 50% no-repeat;
		background-size: 30px 16px;
	}


	/* nav
	==========================================================*/

	.gnav-layer{
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 5000;
		padding: 90px 0;
		overflow: auto;
		background-image: url(../img/nav/bg_nav.jpg);
		background-size: cover;
	}
	.gnav-main{
		display: flex;
		flex-direction: column-reverse;
		height: 100%;		
	}
	.gnav-logo{
		margin: 65px auto 0;
		width: 220px;
		height: 34px;
	}
	.gnav-logo a{
		display: block;
		width: 100%;
		height: 100%;
		background: url(../img/common/logo_br.svg) 50% 0 no-repeat;
		background-size: 100% 100%;
	}
	.gnav-info{
		margin: 40px 0 0;
		text-align: center;
	}
	.gnav-info h2{
		font-size: 14px;
	}
	.gnav-info-tel{
		margin: 10px 0 0;
		font-size: 26px;
	}
	.gnav-info-time{
		display: inline-block;
		margin: 12px 0 0;
		padding: 5px 15px 0;
		border-top: 1px solid #b2a5a0;
		line-height: calc(24/14)
	}
	.gnav{
/*		padding: 95px 0 0;
*//*		padding: 50px 0 50px 80px;
		margin: 0 0 0 80px;*/
	}
	.nav-primary li + li{
		margin-top: 32px;
	}
	.gnav-main li a{
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.gnav-main li a span{
		position: relative;
		margin: 0 15px 0 0;
		display: inline-block;
		text-indent: -9999px;
	}
	.gnav-main li a em{
	}
	.gnav-main li a span:before,
	.gnav-main li a span:after{
		content: "";
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		transition: opacity 600ms ease;
	}
	.gnav-main li a span:after{
		display: none;
	}
	.nav-top a span{
		width: 42px;
		height: 25px;		
	}
	.nav-top a span:before{
		background: url(../img/nav/top.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}

	.nav-chapel a span{
		width: 170px;
		height: 27px;
	}
	.nav-chapel a span:before{
		background: url(../img/nav/chapel.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}

	.nav-celemony a span{
		width: 176px;
		height: 27px;
	}
	.nav-celemony a span:before{
		background: url(../img/nav/celemony.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}

	.nav-plan a span{
		width: 51px;
		height: 20px;
	}
	.nav-plan a span:before{
		background: url(../img/nav/plan.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}

	.nav-fair a span{
		width: 45px;
		height: 19px;
	}
	.nav-fair a span:before{
		background: url(../img/nav/fair.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}

	.nav-logs a span{
		width: 154px;
		height: 27px;
	}
	.nav-logs a span:before{
		background: url(../img/nav/logs.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}

	.nav-social{
		margin-top: 35px;
		display: flex;
		justify-content: center;
	}
	.nav-social li + li{
		margin-left: 25px;
	}
	.nav-social a.sns-insta{
		display: block;
		width: 30px;
		height: 30px;
		background: url(../img/common/icon_insta_br.svg) 0 0 no-repeat;
		background-size: 100% 100%;
		transition: opacity 600ms ease;
	}
	.nav-social a.sns-tiktok{
		display: block;
		width: 27px;
		height: 30px;
		background: url(../img/common/icon_tiktok_br.svg) 0 0 no-repeat;
		background-size: 100% 100%;
		transition: opacity 600ms ease;
	}


	.gnav-contact{
		position: fixed;
		margin: 20px 0 0;
		bottom: 0;
		width: 100%;
	}
	.gnav-contact ul{
		position: relative;
		display: flex;
		justify-content: center;
	}
	.gnav-contact ul:after{
		content: "";
		position: absolute;
		margin: auto;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		display: block;
		width: 1px;
		height: 30px;
		background: rgba(255,255,255,0.5);
	}
	.gnav-contact li a{
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0 18px;
		width: 180px;
		height: 50px;
		background: #231815;
		color: #fff;
		font-size: 14px;
		font-weight: 600;
	}
	.btn-menu-close{
		position: absolute;
		top: 15px;
		right: 15px;	
	}
	.btn-menu-close a{
		display: block;
		font-size: 14px;
	}
	.btn-menu-close a span{
		position: relative;
		padding: 15px 0 0;
		display: block;
	}
	.btn-menu-close a span:after{
		content: "";
		position: absolute;
		margin: auto;
		top: 0;
		left: 0;
		right: 0;
		display: block;
		width: 9px;
		height: 9px;
		background: url(../img/common/icon_close.svg) 0 0 no-repeat;
		background-size: 100% 100%;
	}



}


@media screen  and (max-width: 374px){


}