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

/*-------------------------------------------------------------
 *
 *						style_top.css
 *
 *-------------------------------------------------------------*/

		#globalMenu .submenu			{ top: 80px; }
		#globalMenu li.submenu-trigger:hover .submenu	{ top:100%; }
	
	/* ---------- ---------- ---------- ---------- ----------
	 *					common
	 * ---------- ---------- ---------- ---------- ---------- */
		#mainContents					{ padding-top: 204px; font-size: clamp(15px, calc(100vw* 16 / 1400), 16px); line-height: 1.8; background:url("./../images/bg_marble.png") no-repeat top right; }
		.width1300						{ max-width: 1300px; margin: 0 auto; }
		#mainContents img				{ width: 100%; max-width: fit-content; height: auto; }
		.right-870						{ max-width: 870px; width: 100%; }
		#mainContents .btn				{ margin-left: 0; }
		.movOpen:hover					{ opacity: 0.8; }

	/* ---------- ---------- ---------- ---------- ----------
	 *					fv
	 * ---------- ---------- ---------- ---------- ---------- */
	 	#fv								{ width: min(93%, 1300px); max-width: 1300px; margin: 0 auto; }
		#fv #fvCatch					{ display: flex; font-size: clamp(21px, calc(100vw* 24 / 1400), 24px);  justify-content: space-between; align-items: end; margin-bottom: 20px; }
		#fv #fvCatch section.colBrown	{ font-size: clamp(70px, calc(100vw* 90 / 1300), 90px); line-height: 0.89; }
		#fv .fvImgArea					{ position: relative; }
		#fv .fvImgArea img				{ position: relative; z-index: -1; }
		#fv .btn						{ position: absolute; bottom: 6.5%; left: 2.5%; }
						
	/* ---------- ---------- ---------- ---------- ----------
	 *					importantTopics
	 * ---------- ---------- ---------- ---------- ---------- */
	 	#importantTopics					{ max-width: 1000px; margin: 100px auto 0; border-color: #a98667; border-style: solid; border-width: 1px 0; width: min(93%, 1000px); }
		#importantTopics a					{ display: block;  padding: 14px 0; }
		#importantTopics a + a				{ border-top: 1px solid #a98667; }
		#importantTopics a:hover.notLink  	{ color: #a98667; text-decoration: none; cursor: default; }
		#importantTopics a:hover  			{ color: #a98667; }

	/* ---------- ---------- ---------- ---------- ----------
	 *					nikkei-business
	 * ---------- ---------- ---------- ---------- ---------- */
		#nikkei-business				{ max-width: 1000px; box-sizing: border-box; margin: 70px auto; display: flex; justify-content: space-between; width: min(93%, 1000px); }
		#nikkei-business > a			{ border:  1px #a88567 solid; border-radius: 50px; padding: 34px 30px 27px; max-width: 500px; box-sizing: border-box; display: flex; flex-direction: column; justify-items: center; align-items: center; position: relative; width: calc((100% / 3) - 18px ); }
		#nikkei-business > a b 			{ margin-top: 13px; display: block; text-align: center; font-size: 16px; font-weight: 400; color: #000; line-height: 1.5; }
		/* #nikkei-business a img			{ width: auto; } */
		#nikkei-business > a:hover 		{ text-decoration: none; }	

		.hover-mask { width: 100%; height: 100%; border-radius: 50px; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(139, 95, 53, 0.3); opacity: 0; display: flex; align-items: center; text-align: center; }
		.hover-parent:hover .hover-mask { opacity: 1; }	
	

	/* ---------- ---------- ---------- ---------- ----------
	 *					topMov
	 * ---------- ---------- ---------- ---------- ---------- */
		#topMov								{ width: min(93%, 1000px); max-width: 1000px; margin: 70px auto 100px; }
		#topMov img							{ width: 100%; max-width: fit-content; height: auto; }
	 
	/* ---------- ---------- ---------- ---------- ----------
	 *					top news
	 * ---------- ---------- ---------- ---------- ---------- */
	 	#areaTopics							{ margin: 0 20px; }
		#areaTopics > div.width1300			{ max-width: 1300px; margin: 0 auto; display: flex; padding: 60px 0 0; }
		#areaTopics .btn 					{ margin-top: 42px; }

	/* ---------- ---------- ---------- ---------- ----------
	 *					topSolutions
	 * ---------- ---------- ---------- ---------- ---------- */
		#topSolutions						{ border-top: 2px solid #a98667; margin: 0 20px 90px; }
		#topSolutions > div					{ margin: 0 auto; display: flex; padding: 40px 0; }

		.topSolutions-cardArea				{ display: flex; flex-wrap: wrap; gap: 33px; }
	 	.topSolutions-cardArea .card		{ max-width: 411px; display: flex; flex-direction: column; }
		.topSolutions-cardArea .card .cardTexts	{ border-color: #a98667; border-style: solid; border-width: 0 1px 1px 1px; border-radius: 0 0 55px 55px; box-sizing: border-box; padding: 20px 29px 25px; display: flex; flex-direction: column; flex-grow: 1; }
		.topSolutions-cardArea .card .colBrown	{ font-size: clamp(16px, calc(100vw* 20 / 1300), 20px); }
		.topSolutions-cardArea .card div.description	{ font-size: 14px; margin-bottom: 85px; margin-top: 8px; }
		.topSolutions-cardArea .card .btn		{ margin-top: auto; }


	/* ---------- ---------- ---------- ---------- ----------
	 *					products
	 * ---------- ---------- ---------- ---------- ---------- */
		#topProducts						{ border-top: 2px solid #a98667; margin: 0 20px 90px; }
		#topProducts > div.width1300:first-child		{ margin: 0 auto; display: flex; padding: 40px 0 20px; justify-content: center; }
		#topProducts .topProducts_list 		{ font-size: 14px; margin-bottom: 50px; justify-content: center; }
		#topProducts .topProducts_list li	{ padding: 0 20px; }
		#topProducts .topProducts_list .colBrown		{ font-size: clamp(18px, calc(100vw* 20 / 1300), 20px); line-height: 1.2; margin: 4px 0; }

	/* ---------- ---------- ---------- ---------- ----------
	 *					wafkuFuture
	 * ---------- ---------- ---------- ---------- ---------- */
	 	#wakuFuture							{ background: rgba(136, 86, 43, 0.7); padding: 36px 0 108px; position: relative; }
		#wakuFuture *						{ color: #fff; }
		#wakuFuture .bgImg					{ position: absolute; z-index: -1; right: 0; top: -60px; }

		#wakuFuture > .width1300			{ margin: 0 auto; width: min(93%, 1300px); }

		#wakuFuture #futureMessage        	{ padding: 35px 0 62px; }
		#wakuFuture #futureMessage p      	{ font-size: clamp(16px, calc(100vw* 20 / 1300), 20px); line-height: 1.7; }

		#wakuFuture .childFlex            	{ display: flex; justify-content: space-between; flex-direction: row-reverse; border: 1px solid #fff; border-radius: 70px; padding: 32px; }
		#wakuFuture .childFlex p.childIndex { font-size: clamp(40px, calc(100vw* 48 / 1300), 48px); margin: 0; line-height: 1; }
		#wakuFuture .childFlex > div > article 			{ margin-top: 15px; font-size: 14px; }
		#wakuFuture .childFlex > div > article + img   	{ margin-left: auto; display: block; margin-top: 50px; }
		#wakuFuture .childFlex > div > span    			{ display: block; font-size: 14px; }
		#wakuFuture .movOpen:hover						{ opacity: 0.8; }
		#wakuFuture .childFlex > div + div     			{ margin-right: 40px; }

		#wakuFuture .btn								{ margin-top: 40px; }
		#wakuFuture .btn a								{ color: #a98667!important; }

		#mainContents #wakuFuture img					{ width: auto; }

	/* ---------- ---------- ---------- ---------- ----------
	 *		 	company / recruit
	 * ---------- ---------- ---------- ---------- ---------- */
		#com-rec-set						{ padding: 90px 0; }
		#com-rec-set .width1300				{ width: min(93%, 1300px); display: flex; flex-wrap: wrap; justify-content: space-between; }
		#com-rec-set .areaMsg				{ width: calc(100% / 2);  display: flex; flex-direction: column; }
		#com-rec-set .infoCom				{ padding-right: 49px; box-sizing: border-box; }
		#com-rec-set .infoRec				{ border-left: 2px solid #a98667; padding-left: 49px; box-sizing: border-box; }
		#com-rec-set #titleArea				{ flex: initial; margin-bottom: 25px; }
		#com-rec-set .areaImg				{ margin-bottom: 25px; }

		#com-rec-set .areaMsg p:not(.sub-title)				{ font-size: 14px; margin-bottom: 20px; line-height: 1.7; }
		#com-rec-set .btn					{ margin-top: auto; }
	

	/* ---------- ---------- ---------- ---------- ----------
	 *					bottom_marble_advantage
	 * ---------- ---------- ---------- ---------- ---------- */
	 	#bottom_marble_advantage			{ position: relative; }
		#bottom_marble_advantage > img		{ width: 100%; max-width: initial; }
		#bottom_marble_advantage .message	{ font-size: clamp(16px, calc(100vw* 20 / 1400), 20px); display: flex; justify-content: space-between; align-items: center; position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); width: 1100px; line-height: 2.1; width: min(93%, 1100px); }
		#bottom_marble_advantage .message p + p	{ margin-top: 30px; }

		
		#bottom_marble_advantage .width1300	{ max-width: 1300px; margin: 0 auto; margin-bottom: 100px; width: min(93%, 1300px); }
		#bottom_marble_advantage .btn		{ margin-left: 0; margin-top: -150px; }


	/* ---------- ---------- ---------- ---------- ----------
	 *					areaContact
	 * ---------- ---------- ---------- ---------- ---------- */
		#areaContact						{ border-top: 0; }


	@media screen and (min-width: 1101px) {
		#headerContents.cbp-af-header.cbp-af-header-shrink > div {
			padding-bottom: 7px;
			box-shadow: rgba(0, 0, 0, 0.1) 0px 5px 10px 0px;
		}
	}

/*-------------------------------------------------------------
 *
 *						style_top.css(ver.SP)
 *
 *-------------------------------------------------------------*/

 @media screen and ( max-width:1350px ) {
	/* ---------- ---------- ---------- ---------- ----------
	 *					topSolutions
	 * ---------- ---------- ---------- ---------- ---------- */

    	.topSolutions-cardArea		{ gap: 28px; justify-content: space-between; }
		.topSolutions-cardArea .card	{ width: calc(100% / 3 - 20px); }

	/* ---------- ---------- ---------- ---------- ----------
	 *					products
	 * ---------- ---------- ---------- ---------- ---------- */
		#topProducts .topProducts_list li { width: calc(100% / 4); padding-bottom: 30px; }

	/* ---------- ---------- ---------- ---------- ----------
	 *					bottom_marble_advantage
	 * ---------- ---------- ---------- ---------- ---------- */

		#bottom_marble_advantage > img		{ width: auto; }

 }

 @media screen and ( max-width:1200px ) {
	#nikkei-business a img			{ width: 100%; }

    #wakuFuture .childFlex div 		{ width: 50%; }
	#mainContents #wakuFuture img	{ width: 100%; }

	/* ---------- ---------- ---------- ---------- ----------
	 *					bottom_marble_advantage
	 * ---------- ---------- ---------- ---------- ---------- */
	#bottom_marble_advantage .message > article	{ width: calc(100% / 2 - 20px);  }

 }

 @media screen and ( max-width:900px ) {
	/* ---------- ---------- ---------- ---------- ----------
	 *					topSolutions
	 * ---------- ---------- ---------- ---------- ---------- */
	.topSolutions-cardArea .card	{ width: calc(100% / 2 - 20px); }
	.topSolutions-cardArea .card div.description	{ margin-bottom: 40px; }

	/* ---------- ---------- ---------- ---------- ----------
	 *					products
	 * ---------- ---------- ---------- ---------- ---------- */
	 #topProducts .topProducts_list li { width: calc(100% / 2); }

 }
	

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

	/* ---------- ---------- ---------- ---------- ----------
	 *					top image
	 * ---------- ---------- ---------- ---------- ---------- */
		#mainContents						{ background-size: 110%; }

	 	#fv #fvCatch						{ display: block; }
		#fv #fvCatch section.colBrown		{ margin-bottom: 20px; }		

	/* ---------- ---------- ---------- ---------- ----------
	 *					importantTopics
	 * ---------- ---------- ---------- ---------- ---------- */
		#importantTopics					{ margin: 50px auto; }
		#importantTopics a					{ font-size: 14px; padding: 8px 10px; }

	/* ---------- ---------- ---------- ---------- ----------
	 *					nikkei-business
	 * ---------- ---------- ---------- ---------- ---------- */
		#nikkei-business	{ display: block; }
		#nikkei-business > article + article	{ margin-top: 25px; }
		#nikkei-business > a					{ padding: 25px 30px 15px; width: 100%; margin: 0 auto; }
		#nikkei-business > a + a				{ margin-top: 20px; }
		#nikkei-business > a b					{ font-size: 14px; }
   

	/* ---------- ---------- ---------- ---------- ----------
	 *					top news
	 * ---------- ---------- ---------- ---------- ---------- */
		#areaTopics > div.width1300			{ display: block; }
		#areaTopics .btn					{ margin-right: 0; margin-left: auto; margin-top: -50px; }
		#areaTopics #topicsList				{ margin-top: 40px; }

	/* ---------- ---------- ---------- ---------- ----------
	 *					topSolutions
	 * ---------- ---------- ---------- ---------- ---------- */
		#topSolutions > div					{ display: block; }
		#topSolutions .right-870			{ margin-top: 20px; }
		#topSolutions > div + div			{ padding-top: 0; }

		.topSolutions-cardArea .card .colBrown	{ font-size: 21px; }


	/* ---------- ---------- ---------- ---------- ----------
	 *					products
	 * ---------- ---------- ---------- ---------- ---------- */
		#topProducts > div.width1300:first-child 	{ display: block; }
		#topProducts .right-870						{ margin-top: 20px; }
		#topProducts .topProducts_list				{ justify-content: left; }
		#topProducts .topProducts_list li			{ line-height: 1.4; }


	/* ---------- ---------- ---------- ---------- ----------
	 *					wafkuFuture
	 * ---------- ---------- ---------- ---------- ---------- */
	 	#wakuFuture						{ padding-top: 90px; }
		#wakuFuture .bgImg				{ top: 0; }

		#wakuFuture .childFlex          { display: block; }
		#wakuFuture .childFlex div 		{ width: 100%; }
		#wakuFuture .childFlex > div > article + img    { margin-top: 20px; }
	
		#wakuFuture .childFlex > div + div     { margin-right: 0; margin-top: 30px; }



	/* ---------- ---------- ---------- ---------- ----------
	 *		 	infoGray / company / recruit
	 * ---------- ---------- ---------- ---------- ---------- */
	 	#com-rec-set							{ padding-top: 50px; padding-bottom: 50px; }
		#com-rec-set .width1300					{ display: block; }
		#com-rec-set .areaMsg					{ width: 100%; }
		#com-rec-set .infoCom					{ padding-right: 0; margin-bottom: 50px; }
		#com-rec-set .infoRec					{ padding-left: 0; border-left: none; border-top: 2px solid #a98667; padding-top: 50px; }
		#com-rec-set .areaImg					{ margin: 0 auto 25px; }


	/* ---------- ---------- ---------- ---------- ----------
	 *					bottom_marble_advantage
	 * ---------- ---------- ---------- ---------- ---------- */
	 	#bottom_marble_advantage						{ background:url("./../images/bottom_marble_advantage.jpg") no-repeat center center; padding: 100px 20px 30px; }
	 	#bottom_marble_advantage .message				{ display: block; position: relative; top: initial; left: initial; transform: initial; }
		#bottom_marble_advantage .message > article		{ width: 100%; }
		#bottom_marble_advantage .message > article	+ article	{ margin-top: 30px; }
		#bottom_marble_advantage .message p + p			{ margin-top: 20px; }

		#bottom_marble_advantage .width1300				{ width: initial; }
		#bottom_marble_advantage .btn					{ margin-top: 30px; }

 }

 @media screen and ( max-width:600px ) {
		.topSolutions-cardArea .card			{ width: 100%; margin: 0 auto; }

 }