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

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

/*--- ▼laptop Layout : 768 px ～ 1280 px ---*/
/*///////////////////////////////////////////////////////////////////////////////////////////////////*/

/*******************************/
/*------ whole structure ------*/
/*******************************/
* { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; 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.0em; 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; overflow: hidden; }


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 1.0em; color: #fff; } .beltgre { background: #a3a228; padding: 0.5em 1.0em; color: #fff; }
	/*------ character decoration end ------*/


	/*------ setup of links ------*/
		a:link, a:visited { color: #098db9; 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: 1240px; margin: 0 auto; padding: 1.0em; overflow: hidden; }

		div#Header div#gridHeaderBody div#gridHeaderLeft { width: 48%; height: 100%; float: left; 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: 60px; margin: 0; padding: 0; display: block;
																													/* bg img replace >>>*/ text-indent: 100%; white-space: nowrap; overflow: hidden; background: url(../imgs/header-logo-book.png) no-repeat top left; }
			div#Header div#gridHeaderBody div#gridHeaderLeft p { width: 96%; margin: 0; padding: 0; text-align: left; color: #98a6bd; font-size: 64%; }

		div#Header div#gridHeaderBody div#gridHeaderRight { width: 48%; height: 100%; float: right; margin: 0; padding: 0; text-align: right; }
/********** Header end **********/


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

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

			div#gridGrobalNavi ul#navigation li.navWd01 { width: 8%; }
			div#gridGrobalNavi ul#navigation li.navWd02 { width: 16%; }
			div#gridGrobalNavi ul#navigation li.navWd03 { width: 24%; }
			div#gridGrobalNavi ul#navigation li.navWd04 { width: 16%; }
			div#gridGrobalNavi ul#navigation li.navWd05 { width: 20%; }
			div#gridGrobalNavi ul#navigation li.navWd06 { width: 10%; }


		div#gridGrobalNavi ul#navigation li a { width: 100%; height: auto; margin: 0; padding: 1.8em 0; display: block; text-decoration: none; /* web font */ font-family: 'Sawarabi Gothic', sans-serif; font-size: 88%; }
			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 0 1.5em 0; padding: 0; font-size: 68%; }
		div#breadcrumb ul { width: 88%; max-width: 1100px; margin: 1.5em auto; padding: 0 auto; text-align: right; }
			div#breadcrumb ul li { width: auto; display: inline-block; margin: 0 0 0 0.8em; padding: 0 0 0 2.1em; background: url(../imgs/bdcrumb-listmk.png) no-repeat 0 0; }
				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: 370px; 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: 270px; margin: 2.8em 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: 1240px; margin: 1.5em auto 0.5em auto; padding: 0 auto; text-align: center; letter-spacing: 0.1em; text-indent: -0.1em; /* web-font */ font-family: 'Noto Serif JP', serif; }
			div#gridMainvisual h2 { color: #fff; font-size: 2.4em; }
			div#gridMainvisual p { color: #fff; font-size: 1.1em; }
	/*------ gridMainvisual end ------*/

	/*------ gridMainvisualSub start ------*/
	div.gridPagevisualSub { width: 100%; height: auto; min-height: 300px; margin: 0; padding: 0; text-align: center; overflow: hidden; position: relative; }

			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 { /* base */ }
			div.gridPagevisSubBody h2 { margin: 3.8em auto 0.5em auto; padding: 0; color: #fff; font-size: 1.8em; }
			div.gridPagevisSubBody p { margin: 0.8em auto 0.5em auto; padding: 0; color: #08507e; font-size: 1.2em; }
/*------ 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: 1240px; height: auto; margin: 0px auto 10px auto; padding: 50px 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: 188%; /* web font */ font-family: 'Noto Serif JP', serif; }
				.mission { width: 80%; margin: 0 auto; padding: 0 auto; padding: 1.0em; font-size: 94%; 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: 310px; margin: 0 1%; padding: 0; display: inline-block; text-align: center; }
				div.columnBox figure { width: 100%; padding: 0; }
				div.columnBox figure img { width: auto; max-width: 760px; }


		div.CoRehabbox { width: 31%; max-width: 380px; margin: 1% 0.5%; padding: 0; display: inline-block; text-align: center; background: #044e84; }	div.whity { background: #cef3f9; }
			div.CoRehabbox figure { width: 100%; padding: 0 0 5% 0; }
				div.CoRehabbox figure img.RehabImg { width: 100%; max-width: 760px; }


		div.CoRehabbox figcaption { width: 100%; height: auto; padding: 1.0em; text-align: left; font-size: 88%; }
			div.CoRehabbox figcaption p { width: 92%; color: #ccc; letter-spacing: 0; font-size: 88%; }
			div.CoRehabbox figcaption span { /* web font */ font-family: 'Open Sans Condensed', sans-serif; color: #70b1e1; font-weight: bold; }
			div.CoRehabbox figcaption h3 { width: 90%; 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: 30%; float: left; margin: 0; padding: 0; 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: 65%; float: right; margin: 0; padding: 0; text-decoration: none; }
					div.contentnavi div.contentNavDiv div.cnavitex h3 { width: 100%; margin: 0; padding: 0.6em 0 0.8em 0; color: #1273a5; font-size: 168%; letter-spacing: 0.08em; /* web font */ font-family: 'Noto Serif JP', serif;
																										background: url(../imgs/p-brd01.png) top left no-repeat; }

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

				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: 45%; min-width: 120px; height: 100%; margin: 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: 100%; max-width: 120px; }

				/* 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: 22%; max-width: 220px; margin: 1.2em 0.2em; padding: 1.5em 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 3% 0; }
				div.OverscraBox figure img.RehabImg { width: 100%; max-width: 380px; }

		div.OverscraBox figcaption { width: 100%; height: auto; margin: 0; padding: 1.0em 0; text-align: left; font-size: 92%; }
			div.OverscraBox figcaption p { width: 92%; color: #ccc; letter-spacing: 0; font-size: 98%; }
			div.OverscraBox figcaption span { /* web font */ font-family: 'Open Sans Condensed', sans-serif; color: #70b1e1; font-weight: bold; }
			div.OverscraBox figcaption h3 { width: 100%; margin: 0.3em 0; padding: 0; text-align: center; }
				div.OverscraBox figcaption a:link, div.OverscraBox figcaption 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 figcaption a:hover, div.OverscraBox figcaption a:active
					{ opacity: 0.6; background: #098db9; color: #fff; -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: 1160px; height: auto; margin: 1.8em auto 0 auto; padding: 30px auto 0 auto; overflow: hidden; }
		div.gridCoverboxCat div#gridContentDiv { width: 68%; max-width: 800px; float: left; margin: 0; padding: 0; overflow: hidden; text-align: left; }

				/* div#gridContentDiv a:link, div#gridContentDiv a:visited { base } */
				/* div#gridContentDiv a:hover, div#gridContentDiv a:active { 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; 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 { font-size: 128%; }
				h3.subContentHeading3rd span { font-size: 248%; }

			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; }


			h4.subContentHeading4th { width: 94%; margin: 1.4em 0; padding: 0.4em 0.8em 0.6em 1.0em; 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: 97%; margin: 10px auto 30px auto; padding: 0; }
					div.boxsubfloater01 img { float: left;	margin: 0px 20px 0px 0px;	padding: 0; }

				div.boxsubfloater02 {	width: 97%; margin: 10px auto 30px auto; padding: 0; }
					div.boxsubfloater02 img { float: right;	margin: 0px 0px 0px 10px;	padding: 0; }


			/* 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 } */





















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

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

	@media (max-width: 1140px) {	div.mainCatebox { width: 48%; max-width: 360px; margin: 0.8em 0; padding: 1.5em; display: inline-block; text-align: center; background: #fff;
														/* box-shadow */
														box-shadow: 2px 2px 4px 0px #315c75; -moz-box-shadow: 2px 2px 4px 0px #315c75; -webkit-box-shadow: 2px 2px 4px 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: 80%; }
			div.mainCatebox figcaption p { width: 100%; color: #555; letter-spacing: 0; font-size: 88%; }
			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: flex; margin: 0; padding: 0; text-align: center; overflow: hidden; }

		div.subCatebox { width: 45%; max-width: 320px; margin: 0.8em; padding: 0.6em 0.6em 0 0.6em; display: inline-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: 94%; }
			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: 88%; }
			div.subCatebox figcaption h3 { width: 90%; margin: 0.3em 0; padding: 0; text-align: left; }
			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: flex; margin: 0; padding: 0; text-align: center; overflow: hidden; }

		div.dreiCatebox { width: 33%; max-width: 320px; margin: 0.8em auto; padding: 1.2em 1.2em 1.0em 1.2em; display: inline-block; text-align: center; background: #f5fbfc; }
			div.dreiCatebox figure { width: 100%; padding: 0; }
				div.dreiCatebox figure img.subCateImg { width: 100%; max-width: 320px; }
				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 { width: 100%; height: auto; padding: 1.0em 0 0 0; text-align: left; font-size: 96%; }
			div.dreiCatebox figcaption p { width: 98%; color: #666; letter-spacing: 0; font-size: 88%; }
			div.dreiCatebox figcaption span { /* web-font */ font-family: 'Open Sans Condensed', sans-serif; color: #70b1e1; font-weight: bold;  font-size: 88%; }
			div.dreiCatebox figcaption h3 { width: 96%; margin: 0.3em 0; padding: 0; text-align: left; }
			div.dreiCatebox figcaption h3 a:link, div.dreiCatebox figcaption h3 a:visited { color: #044e84; text-decoration: none; }
			div.dreiCatebox figcaption h3 a:hover, div.dreiCatebox figcaption h3 a:active { color: #ffd300; text-decoration: none; }
		/*------ colCategory button ------*/


		/*------ content Visual Flow start ------*/
			/* div#contentVisualFlow01 { base } */
		/*------ content Visual Flow end ------*/


		/*------ custom Page Vis ------*/
			/* div.customPageVis { base } */
		/*------ custom Page Vis ------*/


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

			div.caseStuDivbox { /* img */ width: 80%; margin: 0; padding: 1.0em; text-align: right; z-index: 10; position: absolute; right: 2.3em; }
			div.caseStuTxtPanel { /* text */ width: 32%; margin: 0; padding: 2.0em; text-align: left; font-size: 100%; z-index: 20; position: absolute; top: 4.6em; left: 2.5em; }

			@media (max-width: 1140px) {	div.caseStuTxtPanel { /* text */ width: 62%; margin: 0; padding: 1.5em; text-align: left; font-size: 100%; z-index: 20; position: absolute; top: 12.6em; left: 2.5em; }	}

				div.caseStuTxtPanel p { width: 100%; margin: 0.6em 0; color: #b8ccd8; letter-spacing: 0; font-size: 88%; }
				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: 134%; }

				div.caseStuTxtPanel h3 a:link, div.caseStuTxtPanel h3 a:visited { color: #fff; 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 h3 a:hover, div.caseStuTxtPanel h3 a:active { color: #122d4e; 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; }

				div.caseStuTxtPanel div.cnavidetail { width: 26%; margin: 0 auto; padding: 0 auto; 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: 120px; height: 100%; margin: 0.6em 0; padding: 0; 
						border: 2px solid #bee4e3;
						position: relative;
					}
					div.caseStuTxtPanel div.cnavidetail div.more a { margin: 0; padding: 0.4em 0; 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: 88%; letter-spacing: 0; }
				div.parallelogram ul li { width: 26%; display: inline-block; margin: 0.5em 0.08em 0 0; padding: 1.5em 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.png); margin: 0; padding: 0; position: absolute; top: 50%; right: -10%; margin-top: -22px; }
			div.parallelogram ul li span.period::after { content: none; }
		/*------ paralell flow panel ------*/


	/* gridSidebar */
	div.gridCoverboxCat div#gridSidebar { width: 26%; max-width: 300px; float: right; margin: 0; padding: 0; }

		div#gridSidebar h3#rightCate { width: 100%; max-width: 300px; height: auto; margin: 0; padding: 1.5em 1.2em; text-align: left; text-decoration: none; font-size: 128%;
										background: #f5f3ea; border-top: 7px 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: 100%; max-width: 300px; margin: 0px auto 20px auto; padding: 0 auto; list-style-type: none; border-top: 3px solid #ee3a80; }
			div#gridSidebar ul.rightSubMenu li { margin: 0; padding: 3px 0; font-size: 84%; 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: 80px; right: 80px; z-index: 999; }
	 div#pageTop a { width: 82px; height: 52px; display: block; padding: 1.8em 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: 5%; left: 42%; width: 1em; height: 1em; 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: 1240px; 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: inline-block; height: auto; vertical-align: middle; }
				div#pageBottomLine div#BottomLineBody ul li#BtLineLogo { width: 12%; }
				div#pageBottomLine div#BottomLineBody ul li#BtLineNum { width: 83%; 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: 1240px; margin: 0 auto; padding: 0 auto; }

	div#gridFooterBody div#FooterLogoAr { width: 96%; 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: 88%; height: auto; float: left; display: block; margin: 1.5em 0; padding: 0.5em auto; text-align: left; }

		div#Footer div#gridFooterLeft h3 { width: 33%; height: auto; display: inline-block; margin: 0; padding: 0 0 0 0.8em; text-align: left; font-size: 84%; }
			/* div#Footer div#gridFooterLeft h3 a:link, div#Footer div#gridFooterLeft h3 a:visited { base } */
			/* div#Footer div#gridFooterLeft h3 a:hover, div#Footer div#gridFooterLeft h3 a:active { base } */

		/* 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: 23%; display: inline-block; margin: 0.5em 0 0.3em 0.5em; vertical-align: top; }
			div#Footer div#gridFooterLeft div#FooterListBottom ul { width: 23%; 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 0 0 2%; font-size: 84%; }
			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: 71%; }
			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: 1px solid #f30; 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.5em 0; font-size: 68%; color: #9ac7d9; text-align: center; clear: both; }

		div#Footer div#gridFooterbottom div#FooterbotBody { width: 96%; max-width: 1240px; margin: 0 auto; padding: 0.5em; text-align: center; }

		div#Footer div#gridFooterbottom ul { width: 40%; height: auto; float: left; display: block; margin: 0; padding: 0; text-align: left; }
			div#Footer div#gridFooterbottom ul li { display: inline-block; margin: 0 0.8em 0 0.3em; 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: 40%; float: right; letter-spacing: 0.3em; /* web-font */ font-family: 'Open Sans Condensed', sans-serif; }
		div#Footer div#gridFooterbottom small.credit span { color: #fff; }
/********** Footer end **********/