@charset "UTF-8";
/*--------------------------------------------
HTML
---------------------------------------------*/
@media screen and (max-width: 750px){
	html{
		font-size : calc( 10 * 100vw / 750 );
	}
}
@media print,screen and (min-width: 751px){
	html{
		font-size : 10px;
	}
}
/*--------------------------------------------
BODY
---------------------------------------------*/
@media screen and (max-width: 750px){
	body{
		font-size : 2.2rem;
		padding-top : calc( 120 * 100vw / 750 );
	}
}
@media print,screen and (min-width: 751px){
	body{
		min-width : 1120px;
		font-size : 1.6rem;
	}
}
/*--------------------------------------------
WRAPPER
---------------------------------------------*/
@media print,screen and (min-width: 751px){
	.wrap{
		width : 1120px;
		margin-left : auto;
		margin-right : auto;
		padding-left : 20px;
		padding-right : 20px;
	}
}
/*--------------------------------------------
HEADER
---------------------------------------------*/
#header .wrap{
	display : flex;
	align-items : center;
}
#header .logo{
	display : block;
}
#header .tel:before{
	content : "";
	display : block;
	background-position : 0 0;
	background-size : contain;
	background-repeat : no-repeat;
}
@media screen and (max-width: 750px){
	#header{
		position : fixed;
		top : 0;
		left : 0;
		width : 100%;
		z-index : 10;
		background-color : #000;
	}
	#header .wrap{
		height : calc( 120 * 100vw / 750 );
		padding-left : 0;
		padding-right : 0;
	}
	#header .logo{
		padding-left : calc( 22 * 100% / 750 );
	}
	#header .logo img{
		height : calc( 45 * 100vw / 750 );
	}
	#header .tel{
		margin-left : calc( 100 * 100% / 750 );
	}
	#header .tel:before{
		width : calc( 55 * 100vw / 750 );
		height : calc( 40 * 100vw / 750 );
		margin-left : auto;
		margin-right : auto;
		background-image : url("../images/ui/icon/tel_sp.svg");
	}
	#header .tel .is-sp{
		display : block;
		color : #c3944c;
		font-size : 2.6rem;
		margin-top : calc( 10 * 100vw / 750 );
	}
}
@media print,screen and (min-width: 751px){
	#header{
		position : absolute;
		left : 0;
		top : 0;
		width : 100%;
		z-index : 1;
	}
	#header .wrap{
		height : 56px;
		width : inherit;
	}
	#header .logo img{
		height : 37px;
	}
	#header .tel{
		display : flex;
		align-items : baseline;
	}
	#header .tel:before{
		width : 28px;
		height : 20px;
		background-image : url("../images/ui/icon/tel_pc.svg");
	}
	#header .tel span{
		color : #a1804c;
		margin-left : .25em;
		font-weight : 900;
		font-size : 3rem;
	}
}
/*--------------------------------------------
MENU BUTTON
---------------------------------------------*/
@media screen and (max-width: 750px){
	body.is-open{
		overflow : hidden;
	}
	body.is-open [data-aos^=fade]{
		opacity : 1!important;
	}
	@media screen and (max-width: 750px){
		body.is-open #nav{
			max-height : 100vh;
		}
	}
	@media screen and (max-width: 750px){
		body.is-open #drawerPanel{
			position : fixed;
			z-index : -1;
			width : 100%;
		}
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(1){
		transform : translateY( calc( 10 * 100vw / 768 ) ) scale(0);
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(2){
		transform : rotate(-45deg);
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(3){
		transform : rotate(45deg);
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(4){
		transform : translateY( calc( -10 * 100vw / 768 ) ) scale(0);
	}
	@media screen and (max-width: 750px) and (-ms-high-contrast:none){
		body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(1){
			transform : translateY( 10px ) scale(0);
		}
		body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(4){
			transform : translateY( -10px ) scale(0);
		}
	}
	#menuBtn{
		z-index : 11;
		position : absolute;
	}
	#menuBtn span{
		font-size : 0;
	}
	#menuBtn > span:nth-of-type(1){
		width : 100%;
		height : 100%;
		position : relative;
		display : block;
	}
	#menuBtn span span{
		display : block;
		position : absolute;
		left : 0;
		transition : all .4s;
		width : 100%;
	}
	#menuBtn span span:nth-of-type(1){
		top : 0;
	}
	#menuBtn span span:nth-of-type(4){
		bottom : 0;
	}
}
#menuBtn{
	z-index : 11;
	position : absolute;
}
#menuBtn span{
	font-size : 0;
}
#menuBtn > span:nth-of-type(1){
	width : 100%;
	height : 100%;
	position : relative;
	display : block;
}
#menuBtn span span{
	display : block;
	position : absolute;
	left : 0;
	transition : all .4s;
	width : 100%;
}
#menuBtn span span:nth-of-type(1){
	top : 0;
}
#menuBtn span span:nth-of-type(4){
	bottom : 0;
}
@media screen and (max-width: 750px){
	#menuBtn{
		width : calc( 120 * 100% / 750 );
		height : calc( 120 * 100vw / 750 );
		right : 0;
		top : 0;
		padding-top : calc( 36 * 100vw / 750 );
		padding-bottom : calc( 36 * 100vw / 750 );
		padding-left : calc( 32 * 100% / 750 );
		padding-right : calc( 32 * 100% / 750 );
		background-color : #c3944c;
	}
	#menuBtn span span{
		height : calc( 4 * 100vw / 750 );
		background-color : #000;
	}
	#menuBtn span span:nth-of-type(2) , #menuBtn span span:nth-of-type(3){
		top : calc( 22 * 100vw / 750 );
	}
}
@media screen and (max-width: 750px){
	body.is-open #menuBtn{
		background-color : transparent;
	}
	body.is-open #menuBtn span span{
		background-color : #c3944c;
	}
}
/*--------------------------------------------
NAV
---------------------------------------------*/
@media screen and (max-width: 750px){
	#nav{
		position : fixed;
		left : 0;
		width : 100%;
		z-index : 10;
		transition : max-height .5s ease-in;
		backface-visibility : hidden;
		will-change : max-height;
		max-height : 0;
		overflow : hidden;
		overflow-y : scroll;
		top : 0;
		height : 100vh;
		background-color : #000;
	}
	#nav .scroll{
		padding-top : calc( 63 * 100vw / 750 );
		padding-bottom : calc( 63 * 100vw / 750 );
	}
}
@media print,screen and (min-width: 751px){
	#nav{
		margin-left : auto;
	}
}
/*--------------------------------------------
NAV GLOBAL
---------------------------------------------*/
#navGlobal > li > a , #navGlobal > li > span{
	font-family : "DM Serif Display", serif;
	font-weight : 400;
}
#navGlobal li li a span:nth-of-type(1){
	font-weight : 600;
}
@media screen and (max-width: 750px){
	#navGlobal > li:first-child{
		margin-bottom : calc( 64 * 100vw / 750 );
	}
	#navGlobal > li:first-child a{
		display : block;
		text-align : center;
	}
	#navGlobal > li:first-child a img{
		height : calc( 161 * 100vw / 750 );
	}
	#navGlobal > li:not(:first-child) + li{
		margin-top : calc( 70 * 100vw / 750 );
	}
	#navGlobal > li:not(:first-child) > a{
		display : block;
		text-align : center;
		font-size : 3.2rem;
		color : #fff;
	}
	#navGlobal > li > span{
		color : #666;
		display : block;
		text-align : center;
		font-size : 3.2rem;
	}
	#navGlobal ul{
		margin-top : calc( 24 * 100vw / 750 );
	}
	#navGlobal li li + li{
		margin-top : calc( 54 * 100vw / 750 );
	}
	#navGlobal li li a{
		color : #d2b98e;
	}
	#navGlobal li li a span{
		display : block;
		text-align : center;
	}
	#navGlobal li li a span:nth-of-type(1){
		font-size : 2.8rem;
	}
	#navGlobal li li a span:nth-of-type(2){
		margin-top : calc( 4 * 100vw / 750 );
		font-size : 3.2rem;
	}
}
@media print,screen and (min-width: 751px){
	#navGlobal{
		display : flex;
		align-items : center;
	}
	#navGlobal.white > li > a , #navGlobal.white > li > span{
		color : #fff;
	}
	#navGlobal > li{
		position : relative;
	}
	#navGlobal > li > a , #navGlobal > li > span{
		font-size : 1.4rem;
		width : 100px;
		display : flex;
		align-items : center;
		justify-content : center;
		text-align : center;
		height : 56px;
	}
	#navGlobal ul{
		overflow : hidden;
		max-height : 0;
		transition : max-height .3s ease-in;
		backface-visibility : hidden;
		will-change : max-height;
		position : absolute;
		top : 100%;
		left : 0;
		width : 140px;
		background-color : rgba(0,0,0,.7);
	}
	#navGlobal ul:before{
		content : "";
		display : block;
		width : 100%;
		height : 1px;
		background-color : #fff;
		position : absolute;
		left : 0;
		top : 0;
	}
	#navGlobal > li:hover ul{
		max-height : 180px;
	}
	#navGlobal li li a{
		color : #af8d7d;
		width : 100%;
		height : 60px;
		display : flex;
		flex-direction : column;
		align-items : center;
		justify-content : center;
		text-align : center;
		transition : background-color .3s ease-in;
		backface-visibility : hidden;
		will-change : background-color;
	}
	#navGlobal li li a:hover{
		background-color : rgba(102,102,102,.7);
	}
	#navGlobal li li a span:nth-of-type(1){
		font-size : 1.2rem;
	}
	#navGlobal li li a span:nth-of-type(2){
		font-size : 1.4rem;
		margin-top : 9px;
	}
}
@media print, screen and (min-width: 1200px){
	#navGlobal > li > a , #navGlobal > li > span{
		width : 140px;
	}
}
/*--------------------------------------------
FOOTER
---------------------------------------------*/
#footer{
	background-color : #000;
}
#footer a , #footer p{
	color : #fff;
	text-align : center;
}
#footer a{
	display : block;
}
@media screen and (max-width: 750px){
	#footer .wrap{
		padding-top : calc( 54 * 100vw / 750 );
		padding-bottom : calc( 40 * 100vw / 750 );
	}
	#footer a{
		font-size : 3rem;
	}
	#footer p{
		font-size : 2.8rem;
		margin-top : calc( 20 * 100vw / 750 );
	}
}
@media print,screen and (min-width: 751px){
	#footer .wrap{
		padding-top : 53px;
		padding-bottom : 58px;
	}
	#footer a{
		font-size : 1.4rem;
	}
	#footer p{
		font-size : 1.2rem;
		margin-top : 14px;
	}
}