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

/*-------------------------------------------------------------
 *
 *							common.css
 *
 *-------------------------------------------------------------*/
	body { font-size: 14px; font-family: "Noto Sans JP",'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic ProN', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; line-height:1.672; -webkit-text-size-adjust:100%; color:#000; overflow-x: hidden; }
	.contentsBox	{ line-height: 1.9; }
	.yumincho		{ font-family :'Yu Mincho','YuMincho', sans-serif; }
	.kanit-light 	{ font-family: "Kanit", sans-serif; font-weight: 300; font-style: normal; color: #a98667; }
	
	a				{ color:#000; text-decoration:none; }
	a:hover			{ color:#000; text-decoration:underline; cursor: pointer; }
	
	/* ---------- ---------- ---------- ---------- ----------
	 *					h style
	 * ---------- ---------- ---------- ---------- ---------- */
		h1 { font-size:200%; }
		h2 { font-size:142%; }
		h3 { font-size:127.8%; font-weight:normal; }
		h4 { font-size:106.5%; font-weight:normal; }
		h5 { font-size:100%; }
		h6 { font-size:93%; }
		
	/* ---------- ---------- ---------- ---------- ----------
	 *					font style
	 * ---------- ---------- ---------- ---------- ---------- */
		/*	color	*/
			.colBrown						{ color: #a98667; }

		/* border */
			.border							{ border: 1px solid #a98667; }	
		
		/*	weight	*/
			.bold							{ font-weight: 400; }
		
	
	/* ---------- ---------- ---------- ---------- ----------
	 *					text position
	 * ---------- ---------- ---------- ---------- ---------- */
		.textRight							{ text-align:right !important; }
		.textLeft							{ text-align:left !important; }
		.textCenter							{ text-align:center !important; }
	
	/* ---------- ---------- ---------- ---------- ----------
	 *						title
	 * ---------- ---------- ---------- ---------- ---------- */
	 	#titleArea > *,
		.titleArea > *						{ color: #a98667; font-weight: 400; }
		#titleArea,
		.titleArea							{ margin-right: 50px; flex: 1; }
	 	.kanit-light						{ line-height: 1; }
	 	.kanit-light + .sub-title			{ font-size: clamp(13px, calc(100vw * 19 / 1300), 23px); letter-spacing: 1px; }
		/* 2階層、3階層以下 */
		#mainContents #titleArea > .kanit-light,
		#mainContents .titleArea > .kanit-light			{ font-size: clamp(40px, calc(100vw * 60 / 1300), 60px); letter-spacing: 1.1px; line-height: 1.1; }


	/* ---------- ---------- ---------- ---------- ----------
	 *						title
	 * ---------- ---------- ---------- ---------- ---------- */
		.btn								{ font-size: clamp(16px, calc(100vw* 17 / 1300), 17px); width: fit-content; margin: 0 auto; }
		.btn > *							{ color: #a88567; text-decoration: none; padding: 7px 30px 8px 25px; box-sizing: border-box; font-weight: 400;  width: 185px; border: 1px #a88567 solid; border-radius: 30px; position: relative; height: 50px; display: flex; flex-direction: column; justify-content: center; align-items: start; background-color: #fff; cursor: pointer; }
		.btn a::before,
		.btn button::before,
		.btn .input_wrap::before				{ right: 20px; width: 14px; height: 1px; background: #a88567; content: ""; position: absolute; top: 48%; }
		.btn a::after,
		.btn button::after,
		.btn .input_wrap::after					{ right: 20px; width: 8px; height: 8px; border-top: 1px solid #a88567; border-right: 1px solid #a88567; -webkit-transform: rotate(45deg); transform: rotate(45deg); content: ""; position: absolute; top: 39%; }
		.btn a:hover,
		.btn button:hover,
		.btn .input_wrap:hover					{ background-color: #ddcfc2; color: #a88567; text-decoration: none; }

	/* ---------- ---------- ---------- ---------- ----------
	 *					flaot style
	 * ---------- ---------- ---------- ---------- ---------- */
		.flowHidden							{ overflow:hidden; }
		.left								{ float:left; }
		.right								{ float:right; }
		.clearB								{ clear:both; }
	
	/* ---------- ---------- ---------- ---------- ----------
	 *					list style
	 * ---------- ---------- ---------- ---------- ---------- */
		dl, ul								{ display:flex; flex-wrap:wrap; }
		dt, dd, li							{ box-sizing:border-box; }
		
		/* news */
		.dlType01 dt						{ width:280px; }
		.dlType01 dd						{ margin:0 0 0 280px; }

		/* profile */
		.dlType02							{ display:block; overflow:hidden; }
		.dlType02 dt						{ float:left; width:199px; }
		.dlType02 dd						{ margin:0 0 0 199px; }

		/*	certification	*/
		.dlType03							{ display:block; overflow:hidden; }
		.dlType03 dt						{ float:left; width:1.2em; }
		.dlType03 dd						{ margin:0 0 0 1.2em; }

		.dlType06							{ display:block; overflow:hidden; }
		.dlType06 dt						{ float:left; width:1.7em; }
		.dlType06 dd						{ margin:0 0 0 1.7em; }

		/* solution  Trail Route View*/
		.dlType07							{ display:block; overflow:hidden; font-size: 13px; }
		.dlType07 dt						{ float:left; width:2.5em; }
		.dlType07 dd						{ margin:0 0 0 2.5em; }

		/* mynumber */
		.dlType08							{ display:block; overflow:hidden; }
		.dlType08 dt						{ float:left; }
		.dlType08 dd						{ margin-bottom: 30px; }


	/* ---------- ---------- ---------- ---------- ----------
	 *					pan navi
	 * ---------- ---------- ---------- ---------- ---------- *

		/*	pannavi	*/
		#panNavi 						{ margin:0 20px; font-size:12px; padding-bottom: 9px; padding-top: 36px; border-bottom: 2px solid #a98667; }
		#panNavi ul						{ margin-left: 30px; }
		#panNavi li						{ padding:0 9px 0 0; line-height:24px; }
		#panNavi li:before				{ content: '/'; margin:0 9px 0 0; }
		#panNavi li:first-child:before	{ content: ''; margin:0px; }


	/* ---------- ---------- ---------- ---------- ----------
	 *					top topics
	 * ---------- ---------- ---------- ---------- ---------- */
	 	#mainContents.topics #titleArea,
		#mainContents.topics .titleArea		{ flex: none; }
		#mainContents.topics .right-870		{ flex: 1; }

		#areaTopics dl						{ display: block; }
		#areaTopics dt					 	{ padding-top: 8px; position: relative; float: left; line-height: 1.8; }
		#areaTopics span.newsTag 			{ padding: 2px 2px 3px; font-size: 11px; position:absolute; right:50px; line-height: 1.3; background: #e5dbd1; text-align: center; width: 100px; box-sizing: border-box; bottom: 4px;
		}
		#areaTopics dd						{ padding: 8px 0 2px; line-height: 1.8; }
		#areaTopics dd:last-child			{ margin-bottom: 8px; }
		#areaTopics dd a					{ text-decoration: none; }
		#areaTopics dd a:hover				{ text-decoration: underline; }
		#areaTopics dd + .subTitle02		{ margin-top: 40px; }

		#areaTopics span.newsTag.event_seminar		{ background: #fee9b0; letter-spacing: -2.1px; }
		#areaTopics span.newsTag.fresh		{ background: #cbe9f0; }
		#areaTopics span.newsTag.media		{ background: #d9ecde; }
		#areaTopics span.newsTag.products	{ background: #e5d0f1; }


	/* ---------- ---------- ---------- ---------- ----------
	 *					table style		
	 * ---------- ---------- ---------- ---------- ---------- */
				
		/*	profile, history, etc	*/
			.table1 tr > *					{ padding:5px 0 15px; box-sizing:border-box; vertical-align:top; text-align:left; }
			.table1 th						{ font-weight:normal; width:170px; color: #a98667; }	

	
	/* ---------- ---------- ---------- ---------- ----------
	 *					display style
	 * ---------- ---------- ---------- ---------- ---------- */
		.dispNone, .printDisp				{ display:none; }

		.spDisp_1200						{ display:none !important; }
		.spDisp_1000						{ display:none !important; }
		.pcDisp								{ display:block; }

		.spDisp_767							{ display:none !important; }
		.pcDisp_767							{ display:block; }

		.spDisp_375							{ display:none !important; }
		.pcDisp_375							{ display:block; }

		.spDisp_320							{ display:none !important; }
		.pcDisp_320							{ display:block; }

		.width1100							{ max-width: 1100px; margin: 0 auto; }

	
	/* ---------- ---------- ---------- ---------- ----------
	 *					box style
	 * ---------- ---------- ---------- ---------- ---------- */
	
		/* 事業拠点 開発・導入実績 ソリューショントップ共通 */
		.three-boxList						{ width: calc(1300px + 35px); margin:0 auto; display: flex; flex-wrap: wrap; }
		.three-boxList > div				{ width: 406px; margin-right:35px; margin-bottom:35px; position:relative; box-sizing: border-box; border-radius: 50px; }
		.three-boxList a					{ text-decoration: none; }
		.three-boxList section				{ box-sizing:border-box; padding: 38px 45px 50px; height: 100%; }
		.three-boxList section:hover		{ background-color: #ddcfc2; border-radius: 50px;  }


	/* ---------- ---------- ---------- ---------- ----------
	 *			contactArea 
	 * ---------- ---------- ---------- ---------- ---------- */
		#areaContact					{ padding: 85px 0; text-align: center; clear: both; border-top: 2px solid #a98667; margin: 0 20px; }
		#areaContact #titleArea,
		#areaContact .titleArea			{ margin-right: 0; margin-bottom: 8px; }
		#areaContact #titleArea .kanit-light,
		#areaContact .titleArea .kanit-light	{ font-size: clamp(55px, calc(100vw * 60 / 1300), 60px); }
		#areaContact #titleArea .kanit-light + .sub-title,
		#areaContact .titleArea .kanit-light + .sub-title	{ font-size: clamp(14px, calc(100vw * 16 / 1300), 16px); }
		#areaContact .btn				{ margin: 24px auto 25px; font-size: clamp(17px, calc(100vw* 18 / 1300), 18px); }
 
	
/*-------------------------------------------------------------
 *
 *						common.css(ver.SP)
 *
 *-------------------------------------------------------------*/
 @media screen and ( max-width:1390px ) {

		.three-boxList					{ width: calc(100% + 25px); box-sizing: border-box; }
		.three-boxList > div			{ width: calc(100% / 3 - 25px); margin-right: 25px; }

 }

 @media screen and ( max-width:1200px ) {
		.spDisp_1200						{ display:block !important; }

		#panNavi							{ padding-top: 10px; }
		#panNavi ul							{ margin-left: 10px; }

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

	/*	pan navi	*/
		#panNavi 					{ margin:0 20px; width:auto; padding-bottom: 24px; }
		#panNavi ul					{ overflow:hidden; display: inline; }
		#panNavi li					{ display: inline; padding-right:13px; line-height: 1.4; }
		#panNavi li:before			{ margin-right:13px; }
 }
 
 @media screen and ( max-width:1000px ) {

		.spDisp_1000						{ display:block !important; }
		.pcDisp								{ display:none; }

		.three-boxList > div				{ width: calc(100% / 2 - 25px); }

 }


 @media screen and ( max-width:767px ) {
		body								{ font-size:85%; }
		h3 									{ font-size:117.8%; }

		.btnArea a, button.btnArea			{ padding: 8px 0; margin: 0 auto; }

		.spDisp_767							{ display:block !important; }
		.pcDisp_767							{ display:none; }

		.three-boxList						{ width: 100%; justify-content: center; }
		.three-boxList > div				{ width: 100%; margin-right: 0; max-width: 403px; }



	/* ---------- ---------- ---------- ---------- ----------
	 *						title
	 * ---------- ---------- ---------- ---------- ---------- */
	 	#titleArea,
		.titleArea							{ margin-right: 0; }
		.sub-title							{ font-size: 20px; line-height: 1.4; padding-top: 3px; }

		/* 2階層、3階層以下 */
		#mainContents .sub-title			{ font-size: 23px; }


	/* ---------- ---------- ---------- ---------- ----------
	 *					top topics
	 * ---------- ---------- ---------- ---------- ---------- */
		#areaTopics dt						{ float: none; }
		#areaTopics dd						{ border: none; padding-top: 0px; }
		#areaTopics span.newsTag			{ right: inherit; left: 125px; margin-left: 10px; }

			/* ---------- ---------- ---------- ---------- ----------
			*					list style
			* ---------- ---------- ---------- ---------- ---------- */
				.dlType01 dt				{ width: 100%; }
				.dlType01 dd				{ margin: 0; }

				.dlType02 dt				{ width:140px; }
				.dlType02 dd				{ margin:0 0 0 140px; }
		

				.dlType05 dt				{ width: 100%; }
				.dlType05 dd				{ margin: 0 0 20px 0; }
				.dlType05 dd:last-child		{ margin-bottom: 0; }
		
	 
 }

 @media screen and ( max-width:375px ) {
		.spDisp_375							{ display:block !important; }
		.pcDisp_375							{ display:none; }

 }

 @media screen and ( max-width:320px ) {
		.spDisp_320							{ display:block !important; }
		.pcDisp_320							{ display:none; }

	/* ---------- ---------- ---------- ---------- ----------
	 *					top topics
	 * ---------- ---------- ---------- ---------- ---------- */

		#areaTopics span.newsTag			{ margin: 0 0 0 10px; width: 150px; }

 }
