/* BODY */
	
	body { 
		font-family			: Verdana, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, sans-serif; 
		background-image	: url(bgBody.png); 
		background-color	: #555; 
		color				: #FFF; 
		padding 			: 0px;
		margin  			: 0px;
		text-align			: center;
		line-height:140%;
	}

	#TOP { border: 1px solid rgb(200,200,0); background: rgb(80,80,50); }

/* GLOBAL */

	A 			{ color: #44FFFF; text-decoration: none; }
	A:link		{ color: #88FFFF; text-decoration: none; }
	A:visited	{ color: #DDDD22; text-decoration: none; }
	A:active	{ color: #FFFFFF; }
	A:hover		{ color: #FFFF00; text-shadow: 0px 0px 8px yellow; }

	a.active {
		font-weight: bold;
		background: rgb(30,30,200);
	}

	img 		{ border-style:none; }
	a img 		{ border-style:none; }


	.button {

		color:#777;	background-color:#222;
		font-weight:bold;

		margin :0px 4px 0px 4px;
		padding:2px 8px 2px 8px;
		border :1px solid #444;
		border-radius:6px;

	}

	.active {
		border: 1px solid rgb(200,200,0); 
		background: rgb(80,80,50);
		color:rgb(200,200,0);
	}

	.button a {
		color:rgb(128,128,128);
	}

	.appTitle .button a {
		color:rgb(200,200,0);
	}


	.pathBox a {
		border-width: 0;
		border-radius: 8px;
		maring: 2px 0px;
		padding:2px 10px;
		background: rgb(40,40,40);
	}

	.langBox a {
		border-width: 0;
		border-radius: 8px;
		maring: 2px 0px;
		padding:2px 10px;
		background: rgb(40,40,40);
	}

	hr {
		width			: 95%;
		height			: 1px;
		border-width	: 1px 0px 0px 0px;
		border-style	: dotted;
		border-color	: #444;
	}

	.hrDark {
		color: #444;
		border-width:1px 0px 0px 0px;
		height: 1px;
		border-style: dotted;
		width:95%
	}

	li {
		font-size:9pt;
	}

	/* TITLE : ƒy[ƒW‚̐擪‚̃ƒSƒ^ƒCƒgƒ‹ */
	.titleBox {
		height:200px;
		margin-left:auto;
		margin-right:auto;
	}

	.titleBoxText {
		padding:20px 20px 20px 20px;
		text-shadow: 0px 2px 3px #666;
		font-size:14pt;
		font-weight:bold;
		font-family: Arial, sans-serif;
	}

	.pathBox {
		font-size:9pt;
		padding: 5px;
		text-align:center;
		background-color:rgb(20,20,20);
		border-bottom: 1px solid rgb(40,40,40);
	}

	.langBox {
		font-size:9pt;
		padding: 5px;
		text-align:center;
		border-bottom: 1px solid #181818;
		background-color:rgb(10,10,10);
	}


	/* TOP BOX : –{•¶•”•ª‚Ì‘S‘Ì‚ðˆÍ‚¤ */

		.topBox {
			width				: 100%;
			margin-left			: auto;
			margin-right		: auto;
			margin-top			: 0px;
			vertical-align		: top;
	
			border 		 		: 0px solid #333;
			background-color	: #111;
			-background-image	: url(bgTopBox.png); 
	
		}

	@media screen and (min-width : 700px) {
		.topBox {
			width				: 94%;
			margin-left			: auto;
			margin-right		: auto;
			margin-top			: 0px;
			vertical-align		: top;
	
			border 		 		: 1px solid #333;
			background-color	: #111;
			-background-image	: url(bgTopBox.png); 
	
			box-shadow			: 0px 0px 20px 0px #000;
			-webkit-box-shadow	: 0px 0px 20px 0px #000;
			-moz-box-shadow		: 0px 0px 20px 0px #000;
		}
	}

	@media screen and ( min-width : 1000px ) {
		.topBox {
			width				: 940px;
			margin-left			: auto;
			margin-right		: auto;
			margin-top			: 0px;

			border 		 		: 1px solid #333;
			background-color	: #111;
			-background-image	: url(bgTopBox.png); 

			box-shadow			: 0px 0px 20px 0px #000;
			-webkit-box-shadow	: 0px 0px 20px 0px #000;
			-moz-box-shadow		: 0px 0px 20px 0px #000;
		}
	}



	.halfBox { /* SMART PHONE */
		vertical-align	: top;
		width			: 96%;
		margin: 		4px;
		display			: inline-block;
	}

	.halfBoxLeft {
		vertical-align	: top;
		width			: 96%;
		margin 		: 4px;
		display			: inline-block;
	}

	.halfBoxRight {
		vertical-align	: top;
		width			: 96%;
		margin		: 4px;
		display			: inline-block;
	}

	@media screen and (min-width : 700px) {

		.halfBox  { 
			vertical-align	: top;
			width			: 48%;
			margin 		: 4px;
			display			: inline-block;
		}

		.halfBoxLeft  { vertical-align : top; width : 48%; margin : 4px; display : inline-block; }
		.halfBoxRight { vertical-align : top; width : 48%; margin : 4px; display : inline-block; }

	}


/* LEVEL */

	.lv1 {
		text-align: left;
		color:#ccc;
		font-size:11pt;
		font-weight:bold;
		line-height:120%;

		padding:20px 0px 5px 8px;
		border-bottom:1px solid #444;
		
	}


/* APPLICATION */

	.app {
		margin-top: 24px;
		padding-bottom: 24px;
		border-bottom: 1px #444 dotted;
	}
	

	.appIcon {
		float	: left; 
		margin	: 0px 8px 8px 0px;
	}


	.appIconMask {
		float	: left; 
		margin	: 0px 8px 8px 0px;
		width: 80px;
		height: 80px;
		-webkit-mask-image: url(appIconMask.png);
		-webkit-mask-size: 80px 80px;
	}
	@media screen and (min-width : 700px) {
		.appIconMask {
			width: 175px;
			height: 175px;
			-webkit-mask-size: 175px 175px;
		}
	}


	.appIconS {
		float	: left; 
		margin	: 0px 8px 8px 0px;
		width	: 64px;
		height	: 64px;
	}

	.appTitle {
		text-align: left;
		font-weight:bold;
		font-size:10pt;
		margin:8px;
		padding:4px 4px 2px 4px ;
		line-height:180%;
	}



	.descScroll { /*--- DESCRIPTION ---*/
		color:			#bbb;
		font-size:		9pt;
		font-weight:	normal;
		line-height:	180%;
		margin:			8px 10px 8px 10px;
		text-align: 	center;
		overflow-x: 	scroll;
		white-space: nowrap;
	}




	
	.desc { /*--- DESCRIPTION ---*/
		text-align: left;
		color:#bbb;
		font-size:9pt;
		font-weight:normal;
		line-height:180%;
		margin :8px 10px 8px 10px;
	}


	.descScroll { /*--- DESCRIPTION ---*/
		color:			#bbb;
		font-size:		9pt;
		font-weight:	normal;
		line-height:	180%;
		margin:			8px 10px 8px 10px;
		text-align: 	center;
		overflow-x: 	scroll;
		white-space: nowrap;
	}


	.desc2 { /*--- DESCRIPTION 2 COLUMNS ---*/
		color:#bbb;
		font-size:9pt;
		font-weight:normal;
		line-height:180%;
		margin :8px 10px 8px 10px;

		column-count: 2;
		-webkit-column-count: 2;
		-moz-column-count: 2;
		
		column-rule: 1px dotted #666;
		-webkit-column-rule: 1px dotted #666;
		-moz-column-rule: 1px dotted #666;

	}

	.desc3 { /*--- DESCRIPTION 3 COLUMNS ---*/
		color:#bbb;
		font-size:9pt;
		font-weight:normal;
		line-height:180%;
		margin :8px 10px 8px 10px;

		column-count: 3;
		-webkit-column-count: 3;
		-moz-column-count: 3;
		
		column-rule: 1px dotted #666;
		-webkit-column-rule: 1px dotted #666;
		-moz-column-rule: 1px dotted #666;

	}

	.note { /* NOTE 1 COLUMN */
		text-align: left;
		color:			#bbb;
		font-size:		9pt;
		font-weight:	normal;
		line-height:	180%;
		margin :		8px 10px 8px 10px;
		padding:		8px;

		text-align: 	left;
		white-space:	normal;


		opacity:			.75;
		-moz-opacity:		0.75;
		background-color:	#444;

		-webkit-border-radius:	3px;
		-moz-border-radius:		3px;

	}


		.note3 { /* NOTE 3 COLUMN */
			text-align: left;
			color:#bbb;
			font-size:9pt;
			font-weight:normal;
			line-height:180%;
			margin :8px 10px 8px 10px;
			padding:8px;
	
			opacity:.75;
			-moz-opacity:0.75;
			background-color:#444;
	
			-webkit-border-radius:3px;
			-moz-border-radius:3px;
	
		}

	@media screen and ( min-width: 700px ) {

		.note3 { /* NOTE 3 COLUMN */
			text-align: left;
			color:#bbb;
			font-size:9pt;
			font-weight:normal;
			line-height:180%;
			margin :8px 10px 8px 10px;
			padding:8px;
	
			opacity:.75;
			-moz-opacity:0.75;
			background-color:#444;
	
			-webkit-border-radius:3px;
			-moz-border-radius:3px;
			
			column-count: 3;
			-webkit-column-count: 3;
			-moz-column-count: 3;
			
			column-rule: 1px dotted #666;
			-webkit-column-rule: 1px dotted #666;
			-moz-column-rule: 1px dotted #666;
	
		}

	}



	.note * * u {
		background-color: #222;
		text-decoration: none;
		padding: 2px 4px;
		border-radius:6px;
	}


	.note * * s {
		background-color: #666;
		text-decoration: none;
		padding: 2px 4px;
		border-radius:6px;
	}



	.srcCode {
		font-size:9pt;
		line-height:135%;
		font-family: Courier, monospace;
		white-space: pre;
		overflow-x:scroll;
	}


	
	.articleTitle {
		font-weight:bold;
		font-size:10pt;
/* font-family:Arial, Hiragino Kaku Gothic Std; */
		margin:8px;
		padding:10px 4px 4px 4px ;
		line-height:180%;
	}
	
	.tip {
		display:none;
		font-size:8pt;
		color:#222;
		background-color:#ddd;

/*		filter: alpha(opacity=75); */
		opacity:.75;
		-moz-opacity:0.75;
		
		margin :0px 0px 0px 8px;
		padding:1px 4px 1px 4px;
		border :1px solid #999;
		border-radius:4px;
		-webkit-border-radius:4px;
		-moz-border-radius:4px;
	}









	.normal {
		color:#000;
		font-size:8pt;
		font-weight:normal;
		line-height:170%;
	}




	.code {

		color:#000;
		font-size:9pt;
		font-weight:normal;
		font-family: Courier, monospace;

		background:#FFF;
		line-height:120%;

		margin :15px 30px 15px 30px;
		padding:8px 8px 8px 8px;
		border :1px solid #999;
		
	}
	
	.codeHead {

		color:#000;
		font-size:9pt;
		font-weight:normal;
		font-family: Courier, monospace;

		background:#ddf;
		line-height:120%;

		margin :0px 0px 0px 0px;
		padding:5px 5px 5px 5px;
		border :1px solid #999;
		
	}

	.codeBody {

		color:#000;
		font-size:9pt;
		font-weight:normal;
		font-family:Courier, monospace;

		background:#fff;
		line-height:120%;

		margin :1px 1px 1px 1px;
		padding:5px 10px 5px 10px;
		
	}

	.com { /*--- ƒ\[ƒX‚̃Rƒƒ“ƒg ---*/
		color:#22f;
	}

	.top { /*--- ƒ^ƒCƒgƒ‹•”•ª ---*/

		color:#000;
		font-size:20pt;
		font-weight:bold;
		font-family: 'Hiragino Kaku Gothic Std', sans-serif;
		text-align:right;

		background:#ddd;
		line-height:120%;

		padding: 15px 20px 15px 20px;
		margin : 15px 10px 10px 0px;
		border: 1px solid #bbb;
		border-right: 4px solid #bbb;
		border-left: 0px solid #bbb;
		
	}


	.detail {

		color:#000;
		font-size:8pt;
		font-weight:normal;
		font-family: 'Hiragino Kaku Gothic Pro', sans-serif;

		background:#DDD;
		line-height:120%;

		margin :40px;
		padding:5px 10px 10px 10px;
		border :1px dotted  #999;
		
	}


	.lv2 {

		color:#888;
		font-size:10pt;
		font-weight:bold;
		font-family: 'Hiragino Kaku Gothic Std', sans-serif;

		line-height:180%;

		margin :10px 0px 15px 0px;
		padding:10px 0px 5px 8px;
		border-bottom:1px solid #777;
		
	}


	.box1 {

		color:#000;
		font-size:10pt;
		font-weight:bold;
		font-family: 'Hiragino Kaku Gothic Std', sans-serif;

		background:#ddd;

		padding:5px 5px 5px 5px;
		margin :5px 5px 5px 5px;
		border  :1px solid #999;
		
	}


	TT	{
		font-family: Courier, monospace;
	}


/* SMALL BUTTON */

	@-webkit-keyframes blink_effect {
		from { -webkit-box-shadow:0px 0px 10px #ffff88; }
		to   { -webkit-box-shadow:0px 0px 10px #000000; }
	}

	.blink_effect {
		-webkit-animation-name: blink_effect;
		-webkit-animation-duration: 1s;
		-webkit-animation-iteration-count: infinite;
		-webkit-animation-direction: alternate;
	}

	.sbtn { /* small button */
	
		border: 0px solid #888;
		margin: 2px 2px 2px 2px;
		padding: 1px 6px 1px 6px;
		background-color: #666;
		color: #ffe;
		border-radius: 6px;        /* CSS3‘ˆÄ */  
		font-size: 9px;
	
	}

	.mbtn { /* middle button */
	
		border: 0px solid #888;
		margin: 2px 2px 2px 2px;
		padding: 2px 6px 2px 6px;
		background-color: #333;
		color: #ffe;
		border-radius: 6px;        /* CSS3‘ˆÄ */  
		font-size: 11px;
		font-weight: normal;
	
	}







	h1, h2, h3 {
		margin: 2px;
		padding: 2px;
	}

/* COLOR FULL BOX */

	.box {

		color:#000;
		font-size:9pt;
		font-weight:normal;

		background:#FFF;
		line-height:120%;

		margin :15px 30px 15px 30px;
		padding:0px;
		border :1px solid #70F267;
		
	}

	.boxHead {

		color:#000;
		font-size:9pt;
		font-weight:normal;
		font-family: 'Hiragino Kaku Gothic Std', sans-serif;

		background:#59DA4D;
		line-height:120%;

		margin :0px 0px 0px 0px;
		padding:5px 5px 5px 5px;
		border :0px solid #999;
		
	}

	.boxBody {

		color:#000;
		font-size:9pt;
		font-weight:normal;
		font-family: 'Hiragino Kaku Gothic Pro', sans-serif;

		background:#70F267;
		line-height:150%;
		text-align:left;

		padding:7px 5px 7px 15px;
		
	}

	.boxSub {

		color:#000;
		font-size:8pt;
		font-weight:normal;

		line-height:150%;
		text-align:left;

		padding:7px 5px 7px 10px;
		
	}


/*** SCREEN SNAPSHOT : HEIGHT=460px ***/


	.snap43 { /* iPad Landspace */
		display:		inline-block;
		width:			615px;
		margin:			0 4px;
		padding:		0;

		text-align:		center;
		line-height:	1.3em;
		vertical-align:	top;
	}
	.snap43 img {
		border:			1px solid #666;
		width:			613px;
		height:			460px;
	}


	.snap35 { /* iPhone5 Portrait */
		display:		inline-block;
		width:			262px;
		margin:			0 4px;
		padding:		0;

		text-align:		center;
		line-height:	1.3em;
		vertical-align:	top;
	}
	.snap35 img {
		border:			1px solid #666;
		width:			260px;
		height:			460px;
	}


	.snap53 { /* iPhone5 Landscape */
		display:		inline-block;
		width:			818px;
		margin:			0;
		padding:		0;

		text-align:		center;
		line-height:	1.3em;
		vertical-align:	top;
	}
	.snap53 img {
		border:			1px solid #666;
		width:			816px;
		height:			460px;
	}



	/* iPhone */

	.snap30 {	/* iPhone Portrait */
		text-align:		center;
		width:			278px;
		display:		inline-block;
		margin:			0px;
		padding:		0px;
		line-height:	1.3em;
		vertical-align:	top;
	}
	.snap30 img {
		height:			410px;
		border:			1px solid #666;
	}


	.snap45 {	/* iPhone Landscape */
		width:			412px;
		display:		inline-block;
		margin:			0px;
		padding:		0px;
		line-height:	1.3em;
		vertical-align:	top;
	}
	.snap45 img {
		height:			273px;
		border:			1px solid #666;
	}






	.snap33 {	/* iPad Portrait */
		width:			297px;
		display:		inline-block;
		margin:			0px;
		padding:		0px 2px;
		line-height:	1.3em;
		vertical-align:	top;
	}
	.snap33 img {
		height:			397px;
		border:			1px solid #666;
	}


	.snap44 {	/* iPad Landscape */
		width:			406px;
		display:		inline-block;
		margin:			0px;
		padding:		0px 2px;
		line-height:	1.3em;
		vertical-align:	top;
	}
	.snap44 img {
		height:			305px;
		border:			1px solid #666;
	}


/* CONPACT */

	#zenback {
			display: none;
			visibility: hidden;
	}
	@media screen and (min-width : 700px) {
		#zenback {
			display: block;
			visibility: visible;
		}
	}

	.titleBox {
			display: none;
			visibility: hidden;
	}
	@media screen and (min-width : 700px) {
		.titleBox {
			display: block;
			visibility: visible;
		}
	}