@charset "utf-8";
/* CSS Document */

/*-------------------------------------------------------------
 *
 *						layout.css
 *
 *-------------------------------------------------------------*/
	
	/* ---------- ---------- ---------- ---------- ----------
	 *					header
	 * ---------- ---------- ---------- ---------- ---------- */
		#headerContents					{ width:100%; position:fixed; z-index:998; }
		#headerContents > div			{ margin:0 auto; overflow:hidden; }
		#headLink						{ float:left; margin: 30px 0 0 45px; }
		#headerContents h1				{ display:none; }
		
		#headLink-globalMenu-set		{ overflow: hidden; }

	/*-------------------------------------------------------------
	 *						globalMenu
	 *-------------------------------------------------------------*/
		#globalMenu						{ float:right; }
		#globalMenu ul					{ float:left; margin-right: 30px; }
		#globalMenu ul li				{ text-align:center; font-weight:normal; z-index:1; }
		
		#globalMenu ul li:first-child:hover:after 	{ color: #003067; }
		#globalMenu ul li a				{ display:block; margin:59px -1px 15px; text-decoration:none; color: #231815; font-size: 14px; padding: 4px 15px; z-index: 1000; position: relative; }
		#globalMenu ul li a span		{ display:block; }
		#globalMenu ul li:hover a span	{ color: #a98667; }
		
		
		#globalMenu .submenu              { position: absolute; background-color: rgba(169, 134, 103, 0.95); padding: 10px; width: 100vw; margin: 0; justify-content: center; align-items: center; left: 0; top: 100px; opacity: 0; visibility: hidden; display: flex; pointer-events: none; transition: .4s; }
		#globalMenu li.submenu-trigger:hover .submenu     { top: 60%; visibility: visible; opacity: 1; pointer-events: auto; }
		#globalMenu .submenu  > ul				{ margin-right: 0; }
		#globalMenu .submenu  > ul li           { display: flex; max-width: 870px; flex-wrap: wrap; }
		#globalMenu .submenu  > ul li a         { color: #fff; margin: 5px 10px; padding: 10px 18px; }
		#globalMenu .submenu  > ul li a:hover	{ text-decoration: underline; }

		#spMenuOpen							{ display:none; }
	 
	 @media screen and ( min-width:1201px ) {
		 /*	menu on	*/
			 #globalMenu .menuOn > a, 
			 #globalMenu .menuOn > a span	{ color:#a98667; }
	 
		 /*	after scroll	*/
			 .cbp-af-header *			{ -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;  }

			 #headerContents.cbp-af-header.cbp-af-header-shrink	div	{ background: #fff; transition: none; }
			 #headerContents.cbp-af-header.cbp-af-header-shrink #globalMenu .submenu	{ background-color: rgba(169, 134, 103, 0.95); top: 100px; }
			 #headerContents.cbp-af-header.cbp-af-header-shrink	div #panNavi	{ padding-top: 0; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; margin-top: -4px; }
	 }

/*-------------------------------------------------------------
 *
 *						layout.css(ver.SP)
 *
 *-------------------------------------------------------------*/
 @media screen and ( max-width:1300px ) {
		#headLink		{ margin: 41px 0 0 26px; }
		#headLink img	{ width: 142px !important; }
}
 @media screen and ( max-width:1200px ) {
	/* ---------- ---------- ---------- ---------- ----------
	*					all container
	* ---------- ---------- ---------- ---------- ---------- */
		#allContainer > div		{ width:auto; }

	/* ---------- ---------- ---------- ---------- ----------
	*					header
	* ---------- ---------- ---------- ---------- ---------- */
		#headerContents			{ width:100% !important; position:static; }
		#headerContents > div	{ width:100%; }
		#headLink				{ position:fixed; z-index:103; background:rgba(255, 255, 255, 1); padding:11px 0 17px 12px; width:100%; margin:0; }
		#headLink img			{ width:111px !important; }

		#headerContents.cbp-af-header.cbp-af-header-shrink #headLink	{ border-bottom: 1px solid #c7c7c7; }

		
	/*-------------------------------------------------------------
	*						globalMenu
	*-------------------------------------------------------------*/
		#globalMenu						{ width:100%; margin:61px 0 0; position:fixed; z-index:102; top: 0; transition: all 0.4s; display: none; overflow: revert; }
		#globalMenu ul					{ margin-right: 0; width: 100%; }
		#globalMenu.setClass			{ display: block; }

		#globalMenu ul li				{ text-align:left; background:#a98667; border-bottom:1px solid rgba(255, 255, 255, 0.5); width:100%; line-height:0; }
		#globalMenu ul li a				{ padding:23px 20px; color:#fff; margin: 0; transform: initial; }
		#globalMenu ul li a span		{ transform: initial; font-size: 14px; }
		#globalMenu ul li:hover a span	{ color:#fff; }

		#globalMenu ul li.submenu-trigger a::after		{ content: ">"; color: #fff; position: absolute; right: 15px; transform: translateX(-50%) rotate(90deg); font-size: 17px; }
		#globalMenu ul li.submenu-trigger.active a::after		{ transform: translateX(-50%) rotate(270deg); }

		#globalMenu ul li a:hover				{ background:#ddcfc2; text-decoration:none; }

		
		#globalMenu .submenu          	{ display: none; flex-direction: column; align-items: flex-start; opacity: 1; visibility: initial; transition: none; }
		#globalMenu .submenu.active   	{ display: contents; }
		#globalMenu .submenu > ul li	{ padding: 0; display: block; line-height: 1; border-bottom: 0; width: auto; max-width: initial; }
		#globalMenu .submenu > ul li a	{ margin: 0; padding: 15px 20px 15px 30px; border-top:1px solid rgba(255, 255, 255, 0.5); display:block; box-sizing:border-box; width: 50%; float: left; font-size: 91%; }
		#globalMenu .submenu > ul li a:hover	{ text-decoration: none; }

		#globalMenu li.sonota div ul 	{ width: 100%; float: none; display: block; }
		#globalMenu li div ul li a:nth-child(2n)		{ border-left: 1px solid rgba(255, 255, 255, 0.5); }
		#globalMenu li.sonota .submenu > ul li a	{ font-size: 91%; padding-right: 0; padding-left: 10px; }
		
		#globalMenu li .submenu a::after{ display: none; }

		#globalMenu .submenu > ul li a.rinnji-border		{ width: 100%; }

		#spMenuOpen						{ display: inline-block; position:fixed; top:1px; right:13px; z-index:103; margin: 0; }
		#spMenuOpen	span,
		#spMenuOpen	span img			{ display: inline-block; }

 }


 @media screen and ( max-width:480px ) {
		#globalMenu ul li a				{ padding: 21px; }
 }

 @media screen and ( max-width:375px ) {
		#globalMenu ul li a								{ padding: 18px 20px; }
 }