/*----------------------------------------------------------------------------*/
/*	Header MENU 共通構造 01 CSS								 	     */
/*----------------------------------------------------------------------------*/
@charset "utf-8";
/* CSS Document */

	header {
		overflow-x: hidden;		/* ★ 横方向はみ出した部分を非表示にする */
		overflow-y: hidden;		/* ★ 縦方向はみ出した部分を非表示にする */
	}

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

		header {
			z-index:999999;
		}
		.SP_header {
			display:block;
		}
		.PC_header {
			display:none;
		}
	}

	header {
		position: fixed;
		width: 100%;
		height: 60px;	/* SP height★ */
		padding:0;
		background-color:rgba( 255,255,255,0.98 ); 	/*  White  透過98% */
	}
	body.menuOpen header{
		position: fixed;
		top:0;
		width: 100%;
	}
	header .headerTop{
		width :100%;
		position:relative;
/*		padding:20px;	*/
		padding:inherit;
	}
	header .siteTitle {			/*  LOGO */
		margin-top:12px;
		margin-left:3px;
		width : 154px;
		height: 32px;
		display	: block;
		text-indent: -99999px;	/* テキスト非表示 */
		border	: 0px;
	}
	header .siteTitle a{
		overflow: hidden;	 /* 内容を非表示にする。*/
		width : 154px;
		height: 0 !important;
		height /**/:32px;
		padding-top: 32px;
		display	: block;
		background	: url("../images/com/logo02.svg") no-repeat;
		background-size:384px 79px;
		background-size:154px 32px;	/* 40% */
		background-position: center center;
	}
	header .siteTitle a:hover{
		display	: block;
		background	: url("../images/com/logo02.svg") no-repeat;
		background-size:154px 32px;	/* 40% */
		background-position: center center;
	}
	header .headerTop .blbtn {	/* bilingual button */
		position:absolute;
		top:8px;
		right:14%;
	}
	header .headerTop .bilingual {
		float:left;
		padding-right:5px;
	}
	header .headerTop p.fc {
	}
	header .headerTop .bilingual a {
		display:block;
	}

	.overlay {
		display: none;
		background-color:rgba( 38,38,38,0.6 ); 	/*  DrarkGray  透過60% */
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
	}
	.navDrawrBtnSP  {
		position: absolute;
		position: fixed;
		top: 5px;
		right:2px;
		display: block;
		width: 23px;
		height: 23px;
		width: 50px;
		height: 50px;
		background-color:rgba( 245,245,245,0.00 ); 	/*  baseGray  透過80% */
		cursor: pointer;
		z-index:99999999;
	}
	.navDrawrBtnSP .line {
		position: absolute;
		top: 0;
		left: 13px;
		display: block;
		text-align:center;
		width: 23px; 			/* 横幅 */
		height: 2px;				/* 1本辺りの高さ */
		background: #8d6d2b;	/* 線の色 */
			/* 適用するプロパティ、変化する時間、変化する速度 */
			-webkit-transition: all 0.3s ease-out;
			transition: all 0.3s ease-out;
	}
	/* 3本線の各線の位置を指定 ---------------------- */
	.navDrawrBtnSP .line_01 { top: 10px; }
	.navDrawrBtnSP .line_02 { top: 18px; }
	.navDrawrBtnSP .line_03 { top: 26px; }

	/* 最上部の線のスタイル ---------------------- */
	.navDrawrBtnSP.is-active .line_01 {
		top: 18px; /* 上から2番目の線の位置に変更 */

		/* 線を45度回転 */
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	/* 上から2番目の線のスタイル ---------------------- */
	.navDrawrBtnSP.is-active .line_02 {
		 opacity: 0; /* 不透明度を下げて線を消す */
	}

	/* 最下部の線のスタイル ---------------------- */
	.navDrawrBtnSP.is-active .line_03 {
		 top: 18px; /* 上から2番目の線の位置に変更 */

	  /* 線を135度回転 */
	  	-webkit-transform: rotate(135deg);
	  	transform: rotate(135deg);
	}

	/* 最上部の線のスタイル ---------------------- */
	.navDrawrBtnSP.is-deactive .line_01 {
		top: 10px; /* 上から2番目の線の位置に変更 */
		/* 線を45度回転 */
			-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
	}

	/* 上から2番目の線のスタイル ---------------------- */
	.navDrawrBtnSP.is-deactive .line_02 {
		top: 18px;
		 opacity: 1; /* 線の不透明度元に戻す */
	}

	/* 最下部の線のスタイル ---------------------- */
	.navDrawrBtnSP.is-deactive .line_03 {
		 top: 26px; /* 上から2番目の線の位置に変更 */

	  /* 線を135度回転 */
		  	-webkit-transform: rotate(-135deg);
		  	transform: rotate(-135deg);
	}
	.navDrawrBtnSP p {
		position: absolute;
		bottom: 0;
		left: 5px;
		display: block;
		text-align:center;
		font-size:11px;
		color:#8d6d2b;
		letter-spacing: 0.12em;
	}
	.navDrawrSP {
		background-color:rgba( 38,38,38,0.6 ); 		/*  DrarkGray  透過60% */
		position: fixed;
		width: 100%;		/* ◆ */
		top: 60px;
		bottom: 0;
		right: -100%;		/* ◆ */
		overflow: auto;
		-webkit-overflow-scrolling: touch;
	}
	.navDrawrSP a {
		display: block;
		width: 100%;
		font-size: 14px;
		font-weight:normal;
		color: #8d6d2b;
		text-decoration: none;
		padding: 15px;
		padding-left: 35px;
		background-color:rgba( 38,38,38,0.6 ); 		/*  DrarkGray  透過60% */
		background-color:rgba( 255,255,255,1.0 ); 	/*  White  透過98% */
		padding: 10px;
		position: relative;
	}
	.navDrawrSP a::after {
		position: absolute;
		top: 60%;
		margin-top: -9px;
		right: 15px;
		font-weight:normal;
		font-size:8px;
		font-family: FontAwesome;
		content: "\f054";	/* ◇ FontAwesome  →  ◇ */
	}
	.navDrawrSP a .open::after {
		position: absolute;
		top: 60%;
		margin-top: -9px;
		right: 15px;
		font-weight:normal;
		font-size:8px;
		font-family: FontAwesome;
	}
	.navDrawrSP>dl>dl {
		display:block;
	}
	.navDrawrSP>dl>dt {
		display:block;
		font-size: 12px;
		border-bottom: 1px solid #EEE;
		position: relative;
	}
	.navDrawrSP>dl>dd {
		display:block;
	}
	.navDrawrSP>dl>dt>a {
		text-align: left;
		border-right: none;
	}
	.navDrawrSP>dl>dt>a::after{
		position: absolute;
		top: 0;
		margin-top: 13px;
		right: 15px;
		font-weight:normal;
		font-size:8px;
		font-family: FontAwesome;
		color:#8d6d2b;
	}
	.navDrawrSP dt#spmenuex a {
		font-size: 12px;
	}
	.navDrawrSP>dl>dd>a {
		text-align: left;
		border-right: none;
	}
	.navDrawrSP .downmenu dd {
		float: none;
		width: auto;
		position: relative;
	}
	.navDrawrSP>ul:after {
		content: ".";
		display: block;
		clear: both;
		height: 0;
		visibility: hidden;
	}
	.navDrawrSP>ul>li {		/* ◆20231122 */
		width: 100%;
		position: relative;
	}
	.navDrawrSP .sub li:last-child a {
		border: none;
	}
	.navDrawrSP>ul>li>a {
		display:block;	/* ◆20231122 */
		width: 100%;
	}
	.navDrawrSP>ul>li>a:hover {
		background: #1FAF93;
		background-color:rgba( 178,178,178,0.80 ); 	/*  LightGray  透過90% */
	}
	.navDrawrSP .spmenu02 {
	}
	.navDrawrSP .spmenu02 a {
		background-color:rgba( 255,255,255,1.00 ); 	/*  WHITE  透過100% */
		color:#8d6d2b;
		border-bottom: 1px solid #EEE;
	}
	.navDrawrSP .spmenu02 a .fa{
		color:#A4946C; /* Gold01 */
		font-size: 17px;
	}
	.navDrawrSP .spmenu02 a::after {
		position: absolute;
		top: 60%;
		margin-top: -17px;
		margin-top: -10px;
		right: 15px;
		font-weight:normal;
		font-size:8px;
		font-family: FontAwesome;
		content: "\f054";
		color:#8d6d2b;
	}
	.navDrawrSP .spmenu02 a img {
		width: 15px;
	}
	/* □ SP GlobalNavMenu */
	.navDrawrSP a {
	}
	.navDrawrSP .downmenu dt a::after{
		font-family: FontAwesome;
		content: none;
	}
	.navDrawrSP a .spsbt {
		position: absolute;
		top: 60%;
		margin-top: -11px;
		right: 30px;
		font-size: 12px;
		color:#444;
		color:#A4946C; /* Gold01 */
		text-align:right;
		padding-right:20px;
	}
	.navDrawrSP .downmenu ul.sub {
		position: static;
		display: block!important;
	}
	.navDrawrSP .sub {
		position: absolute;
		left: 0;
		right: 0;
		z-index: 9999;
	}
	.navDrawrSP .sub a {
		display:block;	/* ◆20231010-01 */
		background-color:rgba(141,109,43,1); 		/*  Gray  透過85% */
		padding: 15px 10px 15px 20px;		/* ★★ */
		font-family: FontAwesome;
		content: "\f054";	/* ◇ FontAwesome  →  ◇ */
		font-size: 12px;
		color:#fff;
		border-bottom: 1px dotted #EEE;
	}
	.navDrawrSP .sub a:hover {
		font-family: FontAwesome;
		content: "\f054";
		background: #179079;
		background-color:rgba( 51,51,51,0.50 ); 		/*  Gray  透過50% */
		background-color:rgba( 178,178,178,0.5 ); 	/*  LightGray  透過90% */
	}

	.navDrawrSP dl.downmenu dt {
	}
	.navDrawrSP dl.downmenu dt a::after{
		content: "\f078";	/* ◇ FontAwesome  ↓  ◇ */
	}
	.navDrawrSP dl.downmenu dt .open a::after{
		content: "\f077";	/* ◇ FontAwesome  ↑ ◇ */
	}
	.navDrawrSP dl.downmenu dt a .fa{
		color:#A4946C; /* Gold01 */
	}
	.navDrawrSPdl.downmenu dd > ul li {
		width: auto;
		height: auto;
	}
	.navDrawrSP dl.downmenu dd>ul>li a {
		display:block;	/* ◆20231010-01 */
		width: 100%;
		height:auto;
	}

	/* Tablet Layout ◇ */
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		.navDrawrBtnSP p {
			position: absolute;
			bottom: 0px;
			left: 8px;
			left: 5px;
			display: block;
			text-align:center;
			font-size:11px;
			color:#8d6d2b;
			letter-spacing: 0.12em;
		}

	}

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

		header .headerTop p {
			position:absolute;
			top:8px;
			left:38%;
			font-size:11px;
		}
		.navDrawrSP a {
			padding-left: 15px;
		}
	}

	@media only screen and (min-width:992px) {	/*■ PC Layout  ■ */

		header {
			position: fixed;
			width: 100%;
			height: auto;
			padding:0;
			background-color: transparent;
			z-index:999;
				-moz-box-sizing: border-box;
				-o-box-sizing: border-box;
				-ms-box-sizing: border-box;
				box-sizing: border-box;
				overflow: inherit;
		}
		.SP_header {
			display:none;
		}
		.PC_header {
			display:block;
		}

		nav.pc .inner>ul {
			margin: 0 auto 0 auto;
			width:100%;
			text-decoration:none;
		}
		nav.pc .inner>ul li {	/* MENU ITEM ◆ */
			float:left;
			font-size:15px;
			font-display: swap;
			padding-top:5px;
		}

		nav .inner02 .hmenu-contact a {		/* MENU ITEM ◆ */
			display:block;
			width : 100%;
			height:90px;
			padding-top:36px;
			padding-left:25px;
			font-size:15px;
			text-align:center;
			font-display: swap;
			color:white;
			border: 0px;
			background	: url("../images/icon/emails.png") no-repeat;
			background-size:23px 19px;
			background-position: 35px 33px;
		}
		nav .inner02 .hmenu-contact a:hover {
			color:#F5F5F5;
			background-color:#CCC;		/* bf-Base01 */
		}

		header .g-nav02 {
			margin: 0 auto 0 auto;
			position: relative;
			width:100%;
			height:70px;		/* ★PC 02 height */
			padding:0;
			z-index: 10;
			background-color:rgba( 255,255,255,0.98 ); 	/*  White  透過98% */
				box-shadow: 1px 1px 5px 1px #aaa;
				-webkit-box-shadow: 1px 1px 5px 1px #aaa;
				-moz-box-shadow: 1px 1px 5px 1px #aaa;
		}
		.g-nav02 #h1logo02 {			/*  LOGO */
			position: absolute;
			top: 6px;
			left:2%;
			width :261px;
			height: 55px;
			display	: block;
			text-indent: -99999px;	/* テキスト非表示 */
			border	: 0px;
			z-index:11;
		}
		.g-nav02  #h1logo02 a{
			overflow: hidden;	 /* 内容を非表示にする。*/
			width : 261px;
			height: 0 !important;
			height /**/:55px;
			padding-top: 55px;
			display	: block;
			background	: url("../images/com/logo02.svg") no-repeat;
			background-size:261px 50px;
			background-position: center top 3px;
		}
		.g-nav02  #h1logo02 a:hover{
			display	: block;
			background	: url("../images/com/logo02.svg") no-repeat;
			background-size:261px 50px;
			background-position: center top 3px;
		}
		nav.g-nav02 .inner>ul li {
			width: auto;
			color:#444;
			padding-top:0px;
		}
		nav.g-nav02 .inner>ul li:first-child {
			width: auto;
		}
		nav.g-nav02 .inner>ul li:nth-child(2) {
			width: auto;
		}
		nav.g-nav02 .inner>ul li:nth-child(3) {
			width: auto;
		}
							/* ◇ hover:アンダーライン　→　中心から広がるアニメーション */
		nav.g-nav02 .inner>ul  {
			font-size: 0;
			box-sizing: border-box;
			list-style: none;
			text-align: center;
		}
		nav.g-nav02 .inner>ul >li {
			margin: 0 0;
			display: inline-block;
			padding-bottom:0;
		}
		nav.g-nav02 .inner>ul >li:hover {
			background-color:rgba( F5,F5,F5,0.7 ); 	/* bf-Base02   透過70% */
		}
		nav.g-nav02 .inner>ul >li .subt {
			color: #A4946C;		/* Gold01 */
		}
		nav.g-nav02 .inner>ul >li:hover .subt {
			color: #C6C6C6;
		}
		nav.g-nav02 .inner>ul >li>a {
			text-decoration: none;
			padding: 0 25px;
			font-weight:bold;
			font-display: swap;
			color: #333;		/* ◆MENU item color */
			display: block;
			position: relative;
		}
		nav.g-nav02 .inner>ul >li>a:before {
			content: '';
			width: 0;
			left: 50%;
			bottom: -5px;
			transition: all 0.3s ease;
			border-bottom: 2px solid #8d6d2b;	/* sopv-brown01 */
			position: absolute;
			display: block;
		}
		nav.g-nav02 .inner>ul >li>a:hover:before {
			width: 50%;
			border-bottom: 2px solid #8d6d2b;	/* sopv-brown01 */
		}
		nav.g-nav02 .inner>ul >li>a:after {
			content: '';
			width: 0;
			right: 50%;
			bottom: -5px;
			transition: all 0.3s ease;
			border-bottom: 2px solid #8d6d2b;	/* sopv-brown01 */
			position: absolute;
			display: block;
		}
		nav.g-nav02 .inner>ul >li>a:hover:after {
			width: 50%;
			border-bottom: 2px solid #8d6d2b;		/* sopv-brown01 */
		}
		nav.g-nav02 .inner>ul li  a p {
			color:#8d6d2b;
			padding-top:0px;
			font-weight:bold;
			font-display: swap;
			letter-spacing: 0.1em;
		}
		nav.g-nav02 .inner>ul li  a p:hover {
			color:#dfc77d;
		}
		.g-nav02 .inner02 {		/* bilingual ◆ */
			position: absolute;
			top: 27px;
			left:80%;
			width: 15%;
			display: flex;
			justify-content:space-between;
			align-items: center;
			flex-wrap: wrap;
		}

		/* サブメニュー ------------------------*/

/*		nav.pc .inner>ul >li:nth-child(n + 2):not(:nth-child(n + 6)){
			position:relative;
		}*/
		nav.pc .inner>ul >li {
			position: relative;
			display: flex;
			flex-wrap: wrap;
			justify-content: flex-end;
			align-items: center;
		}
		nav.g-nav02 .subm01 {		/* サブメニュー */
			position:absolute;
			left:0;
			top:28px;
			width : 100%;
			display:none;
			background-color:rgba(250, 248, 241,0.9); 		/* JP-Dgray */
				-webkit-box-sizing: border-box;
				-moz-box-sizing: border-box;
				-o-box-sizing: border-box;
				-ms-box-sizing: border-box;
				box-sizing: border-box;
			z-index: 8;
		}
		nav.g-nav02 .sub .gsubmenu {
			width:100%;
			padding: 10px;
		}
		nav.g-nav02 .sub .gsubmenu p {		/* サブメニュー項目 */
			width : 100%;
			height: 30px;
			text-align:left;
			line-height:30px;
			font-size:13px;
			color:#FFF;
				-webkit-box-sizing: border-box;
				-moz-box-sizing: border-box;
				-o-box-sizing: border-box;
				-ms-box-sizing: border-box;
				box-sizing: border-box;
			white-space: nowrap;
		}
		nav.g-nav02 .sub .gsubmenu p a {
			width : 100%;
			height: 30px;
			display	: block;
			text-decoration:none; 
			line-height:30px;
			font-weight:bold;
			font-display: swap;
			color:#8d6d2b;
				-webkit-box-sizing: border-box;
				-moz-box-sizing: border-box;
				-o-box-sizing: border-box;
				-ms-box-sizing: border-box;
				box-sizing: border-box;
					transition: 0.4s ease-in-out;
					-webkit-transition: 0.4s ease-in-out;	/* Ease in-out */
					-moz-transition: 0.4s ease-in-out;
					-o-transition: 0.4s ease-in-out;
		}
		nav.g-nav02 .sub .gsubmenu p a:hover {
			width : 100%;
			height: 30px;
			display	: block;
			font-size:13px;
			text-indent: 5px;
			line-height:30px;
			color:#8d6d2b;	
		}
		.fixed{					/* ◆ ヘッダ メニュー部固定 */
			position: fixed;
			top: 0;
			left: 0;
		}
	}
	@media only screen and (min-width: 1401px) {
		br.maxwidth { display: none; }
	}	
	@media only screen and (min-width: 993px) and (max-width: 1400px) {	/*◇ PC-S */

		.g-nav02 #h1logo02 {			/*  LOGO */
			position: absolute;
			top: 5px;
			left:20px;
			width :189px;
			height: 60px;
			display	: block;
			text-indent: -99999px;	/* テキスト非表示 */
			border	: 0px;
			z-index:11;
		}
		.g-nav02  #h1logo02 a{
			overflow: hidden;	 /* 内容を非表示にする。*/
			width : 189px;
			height: 0 !important;
			height /**/:60px;
			padding-top: 60px;
			display	: block;
			background	: url("../images/com/logo02.svg") no-repeat;
			background-size:189px 46px;	/* 40% */
			background-position: center top 3px;
		}
		.g-nav02  #h1logo02 a:hover{
			display	: block;
			background	: url("../images/com/logo02.svg") no-repeat;
			background-size:189px 46px;	/* 40% */
			background-position: center top 10px;
		}
		nav.g-nav02 .inner>ul li:nth-child(5) {
			width: auto;
		}
		@media screen and (min-width:1201px) {
			nav.g-nav02 .inner>ul li  a p {
				font-size:13px;
			}
			nav.g-nav02 .inner>ul {
				margin: 0 auto 0 0;
				width: 100%;
				display: flex;
				flex-wrap: nowrap;
				justify-content: space-around;
				justify-content: space-between;
				justify-content: flex-end;
				align-items: center;
				height: 70px;
			}
			.g-nav02 .inner{
				width: 80%;
				margin: 0 auto;
				position: absolute;
				right: 20px;
				top: 50%;
				transform: translateY(-50%);
				padding-top: 0;
				align-items: center;
				height: 70px;
			}
		}
		@media screen and (min-width:993px) and (max-width:1200px) {
			nav.g-nav02 .inner>ul li  a p {
				font-size:12px;
			}
			nav.g-nav02 .inner>ul {
				margin: 0 auto 0 0;
				width:100%;
				display:flex;
				flex-wrap:nowrap;
				justify-content: space-around;	/* 両端のアイテムも含めて、均等な間隔を空けて配置 */
				justify-content: space-between;	/* 両端のアイテムを余白を空けずに配置し、他の要素は均等に間隔を空けて配置 */
				justify-content: flex-end;
				align-items: center;
			}
			.g-nav02 .inner{
				margin: 0 auto;
				position: absolute;
				padding: 0;
				right: 20px;
				width: 75%;
			}
		}

	}
	/* Tablet Layout ◇ */
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		header {
			position: fixed;
			top:0px;
			width: 100%;
			height: 60px;	/* SP height★ */
			padding:0;
		}
	}