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

/*///////////////////////////////////////////////////////////////////////////////////////////////////*/
/*--- COPYRIGHT For You Planning Limited. ALL RIGHTS RESERVED. ------------*/
/*--- web site design : For You Planning Limited. https://www.fyp.jp/ ------*/

/*--- ▼tablet Layout : 320 px ～ 480 px ---*/
/*///////////////////////////////////////////////////////////////////////////////////////////////////*/

/*******************************/
/*------ whole structure ------*/
/*******************************/
* { margin: 0; padding: 0; border: 0; outline: 0; font-size: 98%; font-weight: normal; vertical-align: baseline; }
	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
	ul, ol { list-style: none; }		img { /* base */ }		 img.autoresize { /* base */ }

body { width: 100%; font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, sans-serif; font-size: 1.1em; letter-spacing: 0.1em; }
		/* web font { font-family: 'Open Sans Condensed', sans-serif; font-family: 'Montserrat', sans-serif; font-family: 'Noto Sans', sans-serif; font-family: 'Sawarabi Gothic', sans-serif; font-family: 'Noto Serif JP', serif; } */

ul, li { list-style: none; margin: 0; padding: 0; border: 0; }
	ul.numList li { list-style-type: decimal; }


p, form, h1, h2, h3, h4, h5 { margin: 0; padding: 0; }
	.left { text-align: left; }	.center { text-align: center; }	.rightposi { text-align: right; }


strong { font-weight: bold; }
	strong.normal { font-weight: normal; }


hr { display: none; }
	.reset { height: 10%; display: block; visibility: hidden; margin: 0px; padding: 0px; clear: both; }
	.hdmess { width: 100%; height: 10px; display: block; visibility: visible; margin: 0.8em auto; padding: 0; clear: both; border-bottom: 1px dotted #5ca1c1; }


.forprint { display: none; visibility: hidden; margin: 0px; padding: 0px; }

	/*------ character decoration ------*/
		.bolder { font-weight: bolder; }
		.letwhite { color: #fff }
		.letora { color: #f30; } .letblue { color: #348fbe; } .letpink { color: #ff5ba0; } .letgre { color: #7e9a74; }
		.larger { font-size: 120%; } .large { font-size: 150%; } .largeEx { font-size: 175%; }
		.smaller { font-size: 80%; } .small { font-size: 70%; } .smallEx { font-size: 60%; }

		.beltora { background: #fc6; padding: 0.5em 1.0em; } .beltblue { background: #39c; padding: 0.5em 0 0.5em 0.5em; color: #fff; line-height: 2.2em; } .beltgre { background: #a3a228; padding: 0.5em 1.0em; color: #fff; }
	/*------ character decoration end ------*/


	/*------ setup of links ------*/
		a:link, a:visited { color: #2b8eb2; text-decoration: none; }
		a:hover, a:active { color: #333; text-decoration: none; }

		a { /* transition */ transition: opacity 0.3s ease-out; -webkit-transition: opacity 0.3s ease-out; -moz-transition: opacity 0.3s ease-out; -ms-transition: opacity 0.3s ease-out; -o-transition: opacity 0.3s ease-out; }
		a:hover { opacity: 0.5; }
		/** a:hover img { filter: alpha(opacity=50); -moz-opacity: 0.5; -khtml-opacity: 0.5; opacity: 0.5; zoom: 1; } **/
	/*------ setup of links end ------*/


	/*------ clearfix ------*/
	.clearfix:after { content: ""; clear: both; display: block; }
	/*------ clearfix end ------*/


p#top { color: #fff; font-size: 70%; }

div#gridWrapper { /* base */ }
	div#gridWrapperSub { /* base */ }

/*------ whole structure end ------*/


/****************************/
/*------ Header start ------*/
/****************************/
div#Header { width: 100%; margin: 0; padding: 0; background: #fff; }

	div#Header div#gridHeaderBody { width: 96%; max-width: 460px; padding: 0.8em 0; overflow: hidden; }

		div#Header div#gridHeaderBody div#gridHeaderLeft { width: 100%; height: 100%; float: none; margin: 0; padding: 0; }
			div#Header div#gridHeaderBody div#gridHeaderLeft h1 { width: 100%; margin: 0; padding: 0; }
				div#Header div#gridHeaderBody div#gridHeaderLeft h1 a.title { width: 100%; height: 85px; margin: 0; padding: 0; display: block;
																													/* bg img replace >>>*/ text-indent: 100%; white-space: nowrap; overflow: hidden; background: url(../imgs/header-logo-smph.png) no-repeat top center; }
			div#Header div#gridHeaderBody div#gridHeaderLeft p { width: 96%; margin: 0 auto; padding: 0; text-align: center; color: #98a6bd; font-size: 64%; }

		div#Header div#gridHeaderBody div#gridHeaderRight { width: 100%; height: 100%; float: none; margin: 0px auto; padding: 0; text-align: center; }
/********** Header end **********/


/****************************/
/*------ Navigation start ------*/
/****************************/
div#gridGrobalNavi { width: 100%; height: auto; margin: 0; padding: 0; text-align: left; background: #fff; }

	div#gridGrobalNavi ul#navigation { width: 100%; margin: 0 auto; padding: 0; text-align: center; background: #014b85; position: relative; top: 0em; }
		div#gridGrobalNavi ul#navigation li { list-style-type: none; display: block; margin: 0; padding: 0; }

			div#gridGrobalNavi ul#navigation li.navWd01, div#gridGrobalNavi ul#navigation li.navWd02, div#gridGrobalNavi ul#navigation li.navWd03,
			div#gridGrobalNavi ul#navigation li.navWd04, div#gridGrobalNavi ul#navigation li.navWd05, div#gridGrobalNavi ul#navigation li.navWd06 { width: 100%; }


		div#gridGrobalNavi ul#navigation li a { width: 100%; height: auto; margin: 0; padding: 0.8em 0; display: block; text-decoration: none; /* web font */ font-family: 'Sawarabi Gothic', sans-serif; font-size: 78%; border-bottom: 1px solid #65a6b7; }
			div#gridGrobalNavi ul#navigation li a:link, div#gridGrobalNavi ul#navigation li a:visited { color: #fff; opacity: 1.0; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }
			div#gridGrobalNavi ul#navigation li a:hover, div#gridGrobalNavi ul#navigation li a:active { color: #9ff; background: #5ca1c1; opacity: 0.8; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }

		div#gridGrobalNavi ul#navigation li a.current { color: #fff; background: #ee3a80; }

/********** Navigation end **********/


/*------ breadcrumb start ------*/
	div#breadcrumb { width: 100%; margin: 0.3em 0; padding: 0; font-size: 80%; }
		div#breadcrumb ul { width: 96%; max-width: 460px; margin: 0 auto; padding: 0.3em; text-align: right; }
			div#breadcrumb ul li { width: auto; display: inline-block; margin: 0; padding: 0 0 0 2.1em; font-size: 80%; background: url(../imgs/bdcrumb-listmk.png) no-repeat 0px 2px; }
				div#breadcrumb ul li a { margin: 0; padding: 0; display: block; text-decoration: none; }
/*------ breadcrumb end ------*/



/****************************/
/*------ Mainvisual ------*/
/****************************/
	/*------ gridMainvisual start ------*/
	div#gridMainvisual { width: 100%; height: auto; min-height: 200px; margin: 0; padding: 0; text-align: center; overflow: hidden; position: relative;
						background: url(../imgs/mainvisual-top.jpg) no-repeat top center #fff;
						-webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;
						/* animation */ /* ---> base */
						}

		div#gridMainvisual div.gridMainvisbody { width: 88%; height: auto; min-height: 200px; margin: 1.2em 0 0 0; padding: 0; text-align: center; overflow: hidden; position: relative; left: 50%; margin-left: -44%; background: rgba(14,38,43,0.8); }

		div#gridMainvisual h2, div#gridMainvisual p { width: 88%; max-width: 320px; margin: 1.5em auto 0.5em auto; padding: 0 auto; text-align: center; letter-spacing: 0.05em; text-indent: -0.1em; /* web-font */ font-family: 'Noto Serif JP', serif; }
			div#gridMainvisual h2 { color: #fff; font-size: 1.4em; }
			div#gridMainvisual p { color: #fff; font-size: 0.8em; text-align: left; }
	/*------ gridMainvisual end ------*/

	/*------ gridMainvisualSub start ------*/
	div.gridPagevisualSub { width: 100%; height: auto; min-height: 200px; margin: 0; padding: 0; text-align: center; overflow: hidden; position: relative; border-bottom: 3px solid #ee3a80;}

			div#Pagevis02 { background: url(../imgs/pagevisual_bg02.jpg) no-repeat top center #08507e; }
			div#Pagevis03 { background: url(../imgs/pagevisual_bg03.jpg) no-repeat top center #08507e; }
			div#Pagevis04 { background: url(../imgs/pagevisual_bg04.jpg) no-repeat top center #08507e; }
			div#Pagevis05 { background: url(../imgs/pagevisual_bg05.jpg) no-repeat top center #08507e; }
			div#Pagevis06 { background: url(../imgs/pagevisual_bg06.jpg) no-repeat top center #08507e; }
			div#Pagevis07 { background: url(../imgs/pagevisual_bg07.jpg) no-repeat top center #08507e; }
			div#Pagevis08 { background: url(../imgs/pagevisual_bg08.jpg) no-repeat top center #08507e; }

		div.gridPagevisSubBody h2, div.gridPagevisSubBody p { width: 94%; max-width: 460px; margin: 1.7em auto 0.5em auto; padding: 0; text-align: left; letter-spacing: 0.15em; }
			div.gridPagevisSubBody h2 { margin: 2.8em auto 0.5em auto; padding: 0; color: #fff; font-size: 1.4em; }
			div.gridPagevisSubBody p { margin: 0.8em auto 0.5em auto; padding: 0; color: #08507e; font-size: 1.0em; }

/*------ Mainvisual end ------*/





/****************************/
/*------ gridContainer start ------*/
/****************************/
div#gridContainer { width: 100%; margin: 0 auto 0 auto; padding: 0 auto; overflow: hidden; text-align: center; background: url(../imgs/gridCover-bg-logo.png) no-repeat top #fff;-moz-background-size: cover; background-size: cover; }
	div#gridContainerNoneBg { width: 100%; margin: 0 auto 0 auto; padding: 0 auto; overflow: hidden; text-align: center; background: none; background: #fff;}

	/*------ gridCoverbox start ------*/
	div.gridCoverbox { width: 100%; max-width: 460px; height: auto; margin: 0.8em auto 0.3em auto; padding: 30px auto 0 auto; }
		.CoverDesignBgwhite { margin: 0; padding: 0; background: #fff; }

			h3.suiteHeading { margin: 1.2em 0 0.3em 0; padding: 0; color: #122d4e; font-size: 128%; /* web font */ font-family: 'Noto Serif JP', serif; }
				.mission { width: 92%; margin: 0 auto; padding: 0 auto; padding: 1.0em; font-size: 78%; text-align: justify;
							/* web font */ font-family: 'Noto Sans', sans-serif; }

	/*------ gridCoverbox end ------*/


		div.column { width: 100%; display: block; margin: 0; padding: 0; text-align: center; overflow: hidden; }
			div.columnBox { width: 30%; max-width: 460px; margin: 0 1%; padding: 0; display: inline-block; text-align: center; }
				div.columnBox figure { width: 100%; padding: 0; }
				div.columnBox figure img { width: auto; }


		div.CoRehabbox { width: 88%; max-width: 420px; margin: 0.5em auto; padding: 0; display: inline-block; text-align: center; background: #044e84; }	div.whity { background: #cef3f9; }
			div.CoRehabbox figure { width: 100%; padding: 0; }
				div.CoRehabbox figure img.RehabImg { width: 100%; max-width: 420px; }


		div.CoRehabbox figcaption { width: 100%; height: auto; padding: 0 0.3em; text-align: justify; font-size: 96%; }
			div.CoRehabbox figcaption p { width: 96%; margin: 0.6em 0; color: #ccc; letter-spacing: 0; font-size: 90%; }
			div.CoRehabbox figcaption span { /* web font */ font-family: 'Open Sans Condensed', sans-serif; color: #70b1e1; font-weight: bold; }
			div.CoRehabbox figcaption h3 { width: 96%; margin: 0.3em 0; padding: 0; text-align: left; }
			div.CoRehabbox figcaption h3 a:link, div.CoRehabbox figcaption h3 a:visited { color: #fff; text-decoration: none; }
			div.CoRehabbox figcaption h3 a:hover, div.CoRehabbox figcaption h3 a:active { color: #ffd300; text-decoration: none; }

		div.CoRehabbox figcaption span.spLetblue { /* web-font */ font-family: 'Open Sans Condensed', sans-serif; color: #145ca7; font-weight: bold; }


		/*------ contentnavi start ------*/
		div.contentnavi { width: 96%; margin: 2.8em auto; padding: 0 auto; text-align: left; text-decoration: none; border-bottom: 1px dotted #ccc; }

			div.contentnavi div.contentNavDiv { width: 100%; margin: 0; padding: 0.8em 0; text-decoration: none; }
				div.contentnavi div.contentNavDiv div.cnaviimg { width: 88%; float: none; margin: 0.5em auto; padding: 0 auto; text-decoration: none; }
					div.contentnavi div.contentNavDiv div.cnaviimg img { width: 100%; margin: 0; padding: 0; }
				div.contentnavi div.contentNavDiv div.cnaviimg a:link, div.contentnavi div.contentNavDiv div.cnaviimg a:visited
					{ opacity: 1.0; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }
				div.contentnavi div.contentNavDiv div.cnaviimg a:hover, div.contentnavi div.contentNavDiv div.cnaviimg a:active
					{ opacity: 0.6; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }

				div.contentnavi div.contentNavDiv div.cnavitex { width: 92%; float: none; margin: 0 auto; padding: 0 auto; text-decoration: none; }
					div.contentnavi div.contentNavDiv div.cnavitex h3 { width: 98%; margin: 0 auto; padding: 0.6em auto 0.8em auto; text-align: center; color: #1273a5; font-size: 118%; letter-spacing: 0.04em; /* web font */ font-family: 'Noto Serif JP', serif;
																										background: none; }

					div.contentnavi div.contentNavDiv div.cnavitex p { width: 88%; margin: 0 auto; padding: 0 auto; font-size: 78%; line-height: 1.6em; }
					div.contentnavi div.contentNavDiv div.cnavitex p.forTop { width: 98%; margin: 0 auto; padding: 0 auto; font-size: 88%; letter-spacing: 0.04em; line-height: 1.6em; }

				/*サブ用*/ div.contentnavi div.contentNavDiv div.cnaviimgSub { width: 88%; float: none; margin: 0.5em auto; padding: 0 auto; text-decoration: none; }
				/*サブ用*/ div.contentnavi div.contentNavDiv div.cnavitexSub { width: 92%; float: none; margin: 0 auto; padding: 0 auto; text-decoration: none; }
					/*サブ用*/ div.contentnavi div.contentNavDiv div.cnavitexSub p { width: 100%; margin: 0 0 1.3em 0; padding: 0; font-size: 88%; }
					/*サブ用*/ div.contentnavi div.contentNavDiv div.cnavitexSub h3.contentSub { width: 100%; margin: 0; padding: 0.3em 0; color: #1273a5; font-size: 110%; letter-spacing: 0.08em; /* web font */ font-family: 'Noto Serif JP', serif; background: none; }


				div.contentnavi div.cnavidetail { margin: 0 0 10px 0; padding: 0; font-size: 84%; text-align: center; letter-spacing: 0; /* web font */ font-family: 'Noto Sans', sans-serif; }
					div.contentnavi div.cnavidetail div.more a { margin: 0; padding: 1.0em 0; color: #fff; display: block; }
					div.contentnavi div.cnavidetail div.more a:hover { color: #122d4e;  opacity: 1.0;}

					/* button action */
					div.contentnavi div.cnavidetail div.more {
						display: block;  width: 98%; min-width: 120px; height: 100%; margin: 0.5em 0; padding: 0; 
						background-color: #fff;color: #122d4e; 
						border: 2px solid #122d4e;
						position: relative;
					}

					div.contentnavi div.cnavidetail div.more span {
						position: relative;
						z-index: 1;
					}

					div.contentnavi div.cnavidetail div.more::before,
					div.contentnavi div.cnavidetail div.more::after {
						content: "";
						display: block;
						background-color: #122d4e;
						width: 50%;
						height: 100%;
						position: absolute;
						top: 0;
						transition: .2s;
					}
					div.contentnavi div.cnavidetail div.more::before { left: 0; }
					div.contentnavi div.cnavidetail div.more::after { right: 0; }

					div.contentnavi div.cnavidetail div.more:hover:before,
					div.contentnavi div.cnavidetail div.more:hover:after { width: 0; background-color: #122d4e; }

					div.contentnavi div.cnavidetail div.more:hover { color: #122d4e; }




		div.gridOverscra { width: 100%; display: block; margin: 0; padding: 0; text-align: center; overflow: hidden; background: url(../imgs/gridCon-Overscr-gr.jpg) no-repeat top #fff; -moz-background-size: cover; background-size: cover; }
				div.OverscraBox figure { width: 100%; padding: 0; }
				div.OverscraBox figure img { width: auto; max-width: 80px ; }

				/* img rolling */
				div.OverscraBox img { transition: .5s ; transform: rotateY( 0deg ) ; }
				div.OverscraBox img:hover, div.OverscraBox img:active { transform: rotateY( 180deg ) ; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }

		div.OverscraBox { width: 48%; max-width: 320px; min-height: 100px; margin: 0.6em 0.1em; padding: 1.2em 0 0 0; display: inline-block; text-align: center; background: #fff;
							/* box-shadow */
							box-shadow: 5px 5px 0px 0px #253335;
							-moz-box-shadow: 5px 5px 0px 0px #253335; -webkit-box-shadow: 5px 5px 0px 0px #253335; }

			div.OverscraBox figure { width: 100%; padding: 0 0 2% 0; }
				div.OverscraBox figure img.RehabImg { width: 100%; max-width: 160px; }
				div.OverscraBox figure a:link, div.OverscraBox figure a:visited
					{ opacity: 1.0; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }
				div.OverscraBox figure a:hover, div.OverscraBox figure a:active
					{ opacity: 0.6; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }




	/*------ sub page parts ------*/
	/* gridCoverboxCat */
	div.gridCoverboxCat { width: 100%; max-width: 480px; height: auto; margin: 1.8em auto 0 auto; padding: 30px auto 0 auto; overflow: hidden; }
		div.gridCoverboxCat div#gridContentDiv { width: 96%; max-width: 480px; float: none; margin: 0 auto; padding: 0 auto; overflow: hidden; text-align: left; }

				div#gridContentDiv a:link, div#gridContentDiv a:visited { display: inline-block; /* base */ }
				div#gridContentDiv a:hover, div#gridContentDiv a:active { display: inline-block; /* base */ }

			h2.contentHeading { margin: 1.2em 0 0.1em 0; padding: 0 0 0.5em 0; color: #000; font-size: 148%; position: relative; border-bottom: solid 1px #ee3a80; /* web-font */ font-family: 'Noto Serif JP', serif; }
				h2.contentHeading:after { position: absolute; content: " "; display: block; border-bottom: solid 3px #005da3; bottom: -2px; width: 30%; }

				span.subEngHeading { display: block; margin: 0; padding: 0 0 0.8em 0.4em; text-align: left; font-size: 86%; color: #759ca7; /* web-font */ font-family: 'Open Sans Condensed', sans-serif; } 

		div#gridContentDiv p { width: 98%; margin: 0.8em 0 0.8em 0; padding: 0.4em; font-size: 88%; text-align: justify; text-justify: auto ;/* web-font */ font-family: 'Noto Sans', sans-serif;	}

			div#gridContentDiv div.signature { width: 98%; margin: 0.8em 0; padding: 0.4em; text-align: right; }

			h3.subContentHeading3rd { margin: 0.8em 0; padding: 1.0em 0; color: #000; font-size: 128%; background: none; /* web-font */ font-family: 'Noto Serif JP', serif; }
				h3.subContentHeading3rd span { margin: 0; padding: 0; color: #c1d5e0; font-size: 188%; vertical-align: middle; letter-spacing: 0; }

			h3.numnContentHeading3rd { margin: 1.3em 0; padding: 2.5em 0; color: #000; line-height: 1.3em; font-size: 148%; /* web-font */ font-family: 'Noto Serif JP', serif; }


			h3.phIdealContentHeading3rd { margin: 0.4em 0; padding: 0.3em 0; line-height: 1.3em; font-size: 168%; 
										/* web-font 2025.05.22 */ font-family: "Noto Sans JP", sans-serif;
																	font-optical-sizing: auto; font-weight: 500; font-style: normal;
										}
				div#gridContentDiv p.characterLT03 { /* web-font 2025.05.22 */ font-family: "Noto Sans JP", sans-serif;
																				font-optical-sizing: auto; font-weight: 400; font-style: normal;
													}


			h4.subContentHeading4th { width: 90%; margin: 1.4em 0; padding: 0.4em auto 0.6em auto; font-size: 128%; color: #fff;
										/* web-font */ font-family: 'Noto Serif JP', serif;
										background: #005da3;
										/* box-shadow */ display: block; box-shadow: 5px 5px 0px 0px #ee3a80;
										-moz-box-shadow: 5px 5px 0px 0px #ee3a80; -webkit-box-shadow: 5px 5px 0px 0px #ee3a80; }


				div.boxsubfloater01 { width: 98%; margin: 1.0em auto 1.5em auto; padding: 0; }
					div.boxsubfloater01 img { width: 98%; float: none; margin: 0.5em auto; padding: 0; text-align: center; }

				div.boxsubfloater02 {	width: 98%; margin: 1.0em auto 1.5em auto; padding: 0; }
					div.boxsubfloater02 img { width: 94%; float: none; margin: 0.5em auto; padding: 0; text-align: center; }


			/* img box */
			div.imgDivEins { width: 100%; margin: 0 auto; padding: 0; text-align: center; }

			div.imgDivZwei { width: 100%; margin: 0 auto; padding: 0; text-align: center; }
				div.imgDivZwei ul li.imgPart02 { /* width: 46%; display: inline-block; */ margin: 0; padding: 0; }


		/* pagevis box */
		div.gridPageVis { /* base */ }

		/* list */
			ul.apbody { /* base */ }
				ul.apbody li { /* base */ }				ul.apbody li::before { /* base */ }
				ul.apbody li a { display: inline!important; }


			ul.contentlist { /* base */ }
				ul.contentlist li { /* base */ }		ul.contentlist li.indentpt { /* base */ }

			ul#subnavi { /* base */ }
				ul#subnavi li { /* base */ }		ul#subnavi li.activelist { /* base */ }
					ul#subnavi  li a {	/* base */ }		ul#subnavi  li a:hover { /* base */ }


			dl.require { /* base */ }
				dl.require dt { /* base */ }

				dl.require dd { /* base */ }
					dl.require dd.ddsubtitle { /* base */ }
					dl.require dd.normal { /* base */ }
					dl.require dd.end { /* base */ }

				dl.require dt.crosslink { /* base */ }
					dl.require dt.crosslink dd { /* base */ }



		/*------ mainCategory button ------*/
		div.mainCategoryNavi { width: 100%; display: block; margin: 0; padding: 0; text-align: center; overflow: hidden; }

		div.mainCatebox { width: 92%; max-width: 310px; margin: 0.8em 0; padding: 0.8em; display: inline-block; text-align: center; background: #fff;
							/* box-shadow */
							box-shadow: 0px 0px 0px 0px #315c75; -moz-box-shadow: 0px 0px 0px 0px #315c75; -webkit-box-shadow: 0px 0px 0px 0px #315c75; }

			div.mainCatebox figure { width: 100%; padding: 0; }
				div.mainCatebox figure img.mainCateImg { width: 100%; max-width: 320px; /* time */ transition-duration: 0.5s; }
					div.mainCatebox figure img.mainCateImg:hover { /* zoom rate */ transform: scale(1.1); /* time */ transition-duration: 0.5s; }

		div.mainCatebox figcaption { width: 100%; height: auto; padding: 1.0em 0; text-align: left; font-size: 100%; }
			div.mainCatebox figcaption p { width: 100%; color: #555; letter-spacing: 0; font-size: 84%; }
			div.mainCatebox figcaption span { /* web-font */ font-family: 'Open Sans Condensed', sans-serif; color: #70b1e1; font-weight: bold;  font-size: 82%; }
			div.mainCatebox figcaption h3 { width: 100%; margin: 0.3em 0; padding: 0; text-align: left; background: #315c75; }
			div.mainCatebox figcaption h3 a:link, div.mainCatebox figcaption h3 a:visited { color: #fff; text-decoration: none; }
			div.mainCatebox figcaption h3 a:hover, div.mainCatebox figcaption h3 a:active { color: #4d81a2; text-decoration: none; }
		/*------ mainCategory button ------*/


		/*------ subCategory button ------*/
		div.subCategoryNavi { width: 100%; display: block; margin: 0; padding: 0; text-align: center; overflow: hidden; }

		div.subCatebox { width: 88%; max-width: 320px; margin: 0.8em auto; padding: 0.6em auto; display:block; text-align: center; background: #fff; }
			div.subCatebox figure { width: 100%; padding: 0; }
				div.subCatebox figure img.subCateImg { width: 100%; max-width: 320px; }
				div.subCatebox figure a:link, div.subCatebox figure a:visited
					{ opacity: 1.0; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }
				div.subCatebox figure a:hover, div.subCatebox figure a:active
					{ opacity: 0.6; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }

		div.subCatebox figcaption { width: 100%; height: auto; padding: 1.0em 0 0 0; text-align: left; font-size: 110%; }
			div.subCatebox figcaption p { width: 92%; color: #666; letter-spacing: 0; }
			div.subCatebox figcaption span { /* web-font */ font-family: 'Open Sans Condensed', sans-serif; color: #70b1e1; font-weight: bold; font-size: 90%; }
			div.subCatebox figcaption h3 { width: 90%; margin: 0.3em 0 0 0; padding: 0; text-align: left; font-size: 110%; }
			div.subCatebox figcaption h3 a:link, div.subCatebox figcaption h3 a:visited { color: #044e84; text-decoration: none; }
			div.subCatebox figcaption h3 a:hover, div.subCatebox figcaption h3 a:active { color: #ffd300; text-decoration: none; }
		/*------ subCategory button ------*/


		/*------ colCategory button ------*/
		div.colCategoryNavi { width: 100%; display: block; margin: 0; padding: 0; text-align: center; overflow: hidden; }

		div.dreiCatebox { width: 92%; margin: 0.8em auto; padding: 1.2em 1.2em 1.0em 1.2em; display: block; text-align: center; background: #f5fbfc; }
			div.dreiCatebox figure { width: 100%; padding: 0; }
				div.dreiCatebox figure img.subCateImg { width: 100%; max-width: 320px; float: none; }
				div.dreiCatebox figure a:link, div.dreiCatebox figure a:visited
					{ opacity: 1.0; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }
				div.dreiCatebox figure a:hover, div.dreiCatebox figure a:active
					{ opacity: 0.6; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }

			div.dreiCatebox figcaption { font-size: 100%; }
				div.dreiCatebox figcaption p { width: 98%; color: #666; letter-spacing: 0.04em; font-size: 94%; text-align: justify; line-height: 1.5; /* web-font */ font-family: 'Noto Sans', sans-serif; }
		/*------ colCategory button ------*/


		/*------ content Visual Flow start ------*/
		div#contentVisualFlow01 { width: 100%; position: relative;  } 

			div.contentVisFlowWrap { width: 100%; max-width: 880px; margin: 0 auto; padding: 0.6em 0 0.6em 0; position: relative; text-align: center; font-size: 100%; } 
				div.contentVisFlowBody { width: 96%; position: relative; margin: 0 auto; padding: 2.0em 0 2.0em 0; text-align: center; } 
					div.contentVisFlowBody h2 { width: 100%; font-size: 194%; margin: 1.5em auto 1.0em auto; letter-spacing: 0.13em; color: #000; line-height: 1.5; text-align: center; }
					div.contentVisFlowBody h3 { width: 82%; font-size: 108%; margin: 2.5em auto 1.0em auto; padding: 0.8em 0.3em; line-height: 1.5; text-align: center; background: #005da3; color: #fff; border: 3px solid #ee3a80; border-radius: 0.5em; }
					div.contentVisFlowBody p { width: 82%; font-size: 104%; margin: 0 auto; padding: 1.0em 0; text-align: left; text-align: justify; }
					div.contentVisFlowBody div { width: 96%; text-align: left; text-align: justify; }
						div.contentVisFlowBody p.afterArrow::after { position: absolute; content:""; width: 0; height: 0; border: 30px solid transparent; border-top: 30px solid #5bc0de; left: 50%; top: 96%; margin-left: -30px; z-index: 999; }
		/*------ content Visual Flow end ------*/


		/*------ custom Page Vis ------*/
		div.customPageVis { width: 100%; display: block; height: 100%; margin: 0.8em auto; padding: 0 auto; text-align: center; overflow: hidden; }
			div.customPageVis div.cpvLeftDiv, div.customPageVis div.cpvRightDiv { width: 100%; margin: 0; padding: 2.0em 0 0 0; text-align: center; color: #fff; /* web-font */ font-family: 'Sawarabi Gothic', sans-serif; }
				div.customPageVis div.cpvLeftDiv { background: #1991bd; }
				div.customPageVis div.cpvRightDiv { background: #2fb3bb; }

			div.customPageVis img { margin: 1.8em 0 0 0; padding: 0; text-align: center; overflow: hidden; pointer-events: none; }
			div.customPageVis p { width: 100%; display: block; height: 100%; margin: 1.3em auto; padding: 0 auto; text-align: center; overflow: hidden; }
		/*------ custom Page Vis ------*/


		/*------ case study panel ------*/
		div.caseStuCateNavi { width: 100%; display: block; }

			div.caseStuDivbox { /* img */ width: 88%; max-width: 430px; margin: 0 auto; padding: 1.0em auto; text-align: center; z-index: 0; position: static; right: 0; }
			div.caseStuTxtPanel { /* text */ width: 76%; max-width: 430px; margin: 0 auto; padding: 0em auto; text-align: left; font-size: 100%; z-index: 0; position: static; top: 0; left: 0; }

				div.caseStuTxtPanel p { width: 100%; margin: 0.6em 0; color: #e5eff5; letter-spacing: 0.03em; font-size: 86%; text-align: justify; }
				div.caseStuTxtPanel span { /* web-font */ font-family: 'Open Sans Condensed', sans-serif; color: #cfc2a3; font-weight: bold; font-size: 88%; }
				div.caseStuTxtPanel h3 { width: 100%; margin: 0.3em 0; padding: 0; text-align: left; font-size: 108%; }

				div.caseStuTxtPanel div.cnavidetail { width: 26%; display: block; margin: 0; padding: 0; text-align: center; font-size: 80%; letter-spacing: 0; /* web-font */ font-family: 'Noto Sans', sans-serif; }

					/* button action */
					div.caseStuTxtPanel div.cnavidetail div.more {
						display: block; width: 100%; min-width: 80px; height: 100%; margin: 0.6em auto; padding: 0; 
						border: 2px solid #bee4e3;
						position: relative;
					}
					div.caseStuTxtPanel div.cnavidetail div.more a { margin: 0; padding: 0.8em 0; text-align: center; color: #fff; display: block; }
					div.caseStuTxtPanel div.cnavidetail div.more a:link, div.caseStuTxtPanel div.cnavidetail div.more a:visited
						{ color: #fff; background: #122d4e; text-decoration: none; opacity: 1.0; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }
					div.caseStuTxtPanel div.cnavidetail div.more a:hover, div.caseStuTxtPanel div.cnavidetail div.more a:active
						{ color: #fff; background: #08507e; text-decoration: none; opacity: 0.6; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }

		/*------ case study panel ------*/


		/*------ paralell flow panel ------*/
		div.parallelogram { width: 94%; min-height: 100px; margin: 0 0 0 1.4em; padding: 0 auto; text-align: center; }
			div.parallelogram ul { width: 100%; display: block; margin: 0; padding: 0; text-align: left; font-size: 98%; letter-spacing: 0; }
				div.parallelogram ul li { width: 30%; display: inline-block; margin: 0.5em 0.3em 0 0; padding: 0.8em; text-align: left; font-size: 88%; -webkit-transform: skewX(20deg); transform: skewX(20deg); }
				div.parallelogram ul li span { width: 100%; display: block; margin: 0 auto; text-align: center; -webkit-transform: skewX(-20deg); transform: skewX(-20deg); }

			div.parallelogram ul li span::after { content: url(../imgs/coParalell-arrow-smph.png); margin: 0; padding: 0; position: absolute; top: 50%; right: -10%; margin-top: -15px; }
			div.parallelogram ul li span.period::after { content: none; }
		/*------ paralell flow panel ------*/



	/* gridSidebar */
	div.gridCoverboxCat div#gridSidebar { width: 100%; max-width: 480px; float: none; margin: 0; padding: 0; }

		div#gridSidebar h3#rightCate { width: 100%; max-width: 480px; height: auto; margin: 0 auto; padding: 0.4em 1.5em; text-align: left; text-decoration: none; font-size: 118%;
										background: #f5f3ea; border-top: 5px solid #005da3; /* web-font */ font-family: 'Noto Serif JP', serif;
										/* bg img replace >>> text-indent: 100%; white-space: nowrap; overflow: hidden;*/ }
			div#gridSidebar h3#rightCate span { font-size: 68%; color: #005da3; /* web-font */ font-family: 'Open Sans Condensed', sans-serif; }

		div#gridSidebar ul.rightSubMenu { width: 96%; max-width: 480px; margin: 0px auto 20px auto; padding: 0 auto; text-align: center; list-style-type: none; border-top: 3px solid #ee3a80; }
			div#gridSidebar ul.rightSubMenu li { width: 100%; margin: 0 auto; padding: 3px auto; font-size: 84%; display: inline-block; border-bottom: 1px solid #9ac7d9; text-align: left; }
				div#gridSidebar ul.rightSubMenu li a { display: block; height: auto; margin: 0; padding: 0; color: #333; background: #fff; }
				div#gridSidebar ul.rightSubMenu li a:link 
													{ padding: 15px 10px ; color: #333; background: #fff; 
														-webkit-transition: all .5s ease-out; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }
				div#gridSidebar ul.rightSubMenu li a:hover 
													{ padding: 15px 10px 15px 15px; color: #2482d7; background: #d8edf3; 
														-webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; opacity: 1.0; }

				div#gridSidebar ul.rightSubMenu li a::before { content: url(../imgs/Sidebar-listmk-01.png); position: relative; top: 0.1em; left: -0.5em; }

			/* div#gridSidebar ul.rightSubMenu li.branch { margin: 0; padding: 3px 0; font-size: 78%; border-bottom: 1px solid #9ac7d9; text-align: left; }
				div#gridSidebar ul.rightSubMenu li.branch a { display: block; height: auto; margin: 0; padding: 0; color: #333; background: #e8ffff; }
				div#gridSidebar ul.rightSubMenu li.branch a:link 
																	{ padding: 10px 20px; color: #333; background: #e8ffff; 
																		-webkit-transition: all .5s ease-out; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }
				div#gridSidebar ul.rightSubMenu li.branch a:hover 
																	{ padding: 10px 10px 10px 25px; color: #2482d7; background: #eeede7; 
																		-webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }
				div#gridSidebar ul.rightSubMenu li.branch a::before { content: url(../img/bt/rightmenu_list_mark_sub.png); position: relative; top: 0.1em; left: -0.5em; } */



		div#gridSidebar ul.bannerArea { width: 100%; margin: 10px 0px; padding: 0; list-style-type: none; }
			div#gridSidebar ul.bannerArea li { margin: 10px 0; padding: 0; }
				div#gridSidebar ul.bannerArea a:link, div#gridSidebar ul.bannerArea a:visited
					{ opacity: 1.0; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }
				div#gridSidebar ul.bannerArea a:hover, div#gridSidebar ul.bannerArea a:active
					{ opacity: 0.6; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }
	/*------ gridSidebar end ------*/


	/*------ pageScroller start ------*/
	div#pageTop { position: fixed; bottom: 20px; right: 0px; z-index: 999; }
		div#pageTop a { width: 42px; height: 32px; display: block; padding: 1.0em 0 0 0; text-align: center; font-size: 78%; color: #fff; background: #122d4e;
					/* border-radius */ border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
			div#pageTop a:hover { text-decoration: none; opacity: 0.7;
										-webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }
			div#pageTop a::before { content: ''; display: block; position: relative; top: 3%; left: 37%; width: 0.5em; height: 0.5em; margin-top: 0; border-top: #fff 3px solid; border-right: #fff 3px solid; transform: rotate(-45deg); }
	/*------ pageScroller end ------*/


/****************************/
/*------ pageBottomLine start ------*/
/****************************/
div#pageBottomLine { width: 100%; margin: 0; padding: 0; background: #f6f2e1; }

	div#BottomLineBody { width: 100%; max-width: 320px; margin: 0 auto; padding: 1.3em 0em; text-align: center; font-family: 'Sawarabi Gothic', sans-serif; }

		div#pageBottomLine div#BottomLineBody ul { width: 100%; margin: 0 auto; padding: 0 auto; text-align: center; }
			div#pageBottomLine div#BottomLineBody ul li { display: block; height: auto; vertical-align: middle; margin: 0 auto; padding: 0 auto; text-align: center; }
				div#pageBottomLine div#BottomLineBody ul li#BtLineLogo { width: 68%; }
				div#pageBottomLine div#BottomLineBody ul li#BtLineNum { width: 94%; font-size: 78%; }

		ul li#BtLineSwitch {	width: 15%; min-width: 150px; margin: 0 auto; padding: 0; font-size: 84%; }
			ul li#BtLineSwitch a { margin: 0.7em auto; padding: 1.0em 1.5em; color: #5da6d1; background: #fff; font-weight: bold; display: block;
									/* border go */ border: 3px solid #5da6d1;
									/* border-radius go */ border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;
								}
		/*------ Switch button action ------*/
			ul li#BtLineSwitch a:link, ul li#BtLineSwitch a:visited { color: #5da6d1; }		ul li#BtLineSwitch a:hover, ul li#BtLineSwitch a:active { color: #fff; }
				ul li#BtLineSwitch a:hover, ul li#BtLineSwitch a:active
					{ background: #d2e9f7; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; -ms-transition: all .3s; transition: all .3s; }
		/*------ Switch button action ------*/


		/*------ Google map ------*/
		div.ggmap { width: 98%; height: 0; margin: 5px 0px 5px 0px; padding-bottom: 56.25%; padding-top: 30px; text-align: center; position: relative; overflow: hidden;}
			div.ggmap iframe, div.ggmapr object, div.ggmap embed { position: absolute; top: 0; left: 0; width: 98%; height: 100%;	}
		/*------ Google map ------*/


/****************************/
/*------ Footer start ------*/
/****************************/
div#Footer { width: 100%; }

	div#gridFooterBody { width: 98%; max-width: 460px; margin: 0 auto; padding: 0 auto; background: none; -moz-background-size: contain; background-size: contain; }

	div#gridFooterBody div#FooterLogoAr { width: 98%; margin: 0; padding: 0; font-size: 88%; letter-spacing: 0; font-family: 'Sawarabi Gothic', sans-serif; }
		div#gridFooterBody div#FooterLogoAr h2 { margin: 1.3em 0 0 0 }
			div#gridFooterBody div#FooterLogoAr p { margin: 0.3em 0; padding-left: 0.8em; font-size: 88%; }


	div#Footer div#gridFooterLeft { width: 94%; height: auto; float: none; display: block; margin: 1.5em 0; padding: 0.5em auto; text-align: left; }

		div#Footer div#gridFooterLeft h3 { width: 88%; height: auto; display: block; margin: 0 0 0 0; padding: 0 0 0 0.8em; text-align: left; font-size: 88%; }

		/* div#Footer div#gridFooterLeft div#FooterListUpper h3::before { base } */

		div#Footer div#gridFooterLeft div#FooterListUpper { width: 94%; }
		div#Footer div#gridFooterLeft div#FooterListBottom { width: 94%; }

			div#Footer div#gridFooterLeft div#FooterListUpper ul { width: 94%; display: inline-block; margin: 0.8em 0 0.3em 0.5em; vertical-align: top; }
			div#Footer div#gridFooterLeft div#FooterListBottom ul { width: 94%; display: inline-block; margin: 0.5em 0 0 0.5em; vertical-align: top; }


		div#Footer div#gridFooterLeft li.ftlistheader { margin: 0 0 0.5em 0; padding: 0; font-size: 88%; }
			div#Footer div#gridFooterLeft ul li.ftlistheader::before { content: url(../imgs/footer-listmk-catgTit.png); position: relative; top: 0em; left: -0.5em; }
				/* div#Footer div#gridFooterLeft li.ftlistheader a:link, div#Footer div#gridFooterLeft li.ftlistheader a:visited { base } */
				/* div#Footer div#gridFooterLeft li.ftlistheader a:hover, div#Footer div#gridFooterLeft li.ftlistheader a:active { base } */

		div#Footer div#gridFooterLeft ul li.ftlist { margin: 0 0 0.5em 0; padding: 0; color: #fff; font-size: 84%; }
			div#Footer div#gridFooterLeft ul li.ftlist::before { content: url(../imgs/Footer_list_headmark.png); position: relative; top: 0.1em; left: -0.2em; }

			div#Footer div#gridFooterLeft ul li.ftlist a { color: #c8dfe6; text-decoration: none; }
				div#Footer div#gridFooterLeft ul li.ftlist a:link, div#Footer div#gridFooterLeft ul li.ftlist a:visited { color: #005da3; text-decoration: none; }
				div#Footer div#gridFooterLeft ul li.ftlist a:hover, div#Footer div#gridFooterLeft ul li.ftlist a:active { color: #ee3a80; text-decoration: none; }



	div#Footer div#gridFooterRight { border: none; width: 34%; float: right; display: block; height: auto; margin: 0; padding: 0; text-align: left; color: #98a6bd; }
		div#Footer div#gridFooterRight div#imgtable { width: 100%; height: 100%; margin: 0; padding: 0; text-align: right; }
		div#Footer div#gridFooterRight div#imgtable img { margin: 0; padding: 0; text-align: right; color: #c5e9ff; font-size: 94%; }


	div#Footer div#gridFooterbottom { width: 100%; margin: 0; padding: 1.0em 0 1.3em 0; font-size: 68%; color: #9ac7d9; text-align: center; clear: both; }

		div#Footer div#gridFooterbottom div#FooterbotBody { width: 94%; max-width: 320px; margin: 0 auto; padding: 0.1em; text-align: center; }

		div#Footer div#gridFooterbottom ul { width: 96%; height: auto; float: none; display: block; margin: 0.3em auto; padding: 0; text-align: center; }
			div#Footer div#gridFooterbottom ul li { width: 88%; display: block; margin: 0.8em 0; padding: 0; text-align: left; color: #fff; }

			div#Footer div#gridFooterbottom ul li a { color: #c8dfe6; text-decoration: none; }
				div#Footer div#gridFooterbottom ul li a:link, div#Footer div#gridFooterbottom ul li a:visited { color: #fff; text-decoration: none; }
				div#Footer div#gridFooterbottom ul li a:hover, div#Footer div#gridFooterbottom ul li a:active { color: #9ff; text-decoration: none; }


		div#Footer div#gridFooterbottom small.credit { width: 96%; float: none; letter-spacing: 0.15em; font-size: 88%; }
		div#Footer div#gridFooterbottom small.credit span { color: #fff; }
/********** Footer end **********/