@charset "utf-8";
/**
 * reset
 */
	html, body, div, span, object, iframe,
	h1, h2, h3, h4, h5, h6, p, blockquote, pre,
	abbr, address, cite, code,
	del, dfn, em, img, ins, kbd, q, samp,
	small, strong, sub, sup, var,
	b, i,
	dl, dt, dd, ol, ul, li,
	fieldset, form, label, legend,
	table, caption, tbody, tfoot, thead, tr, th, td,
	article, aside, canvas, details, figcaption, figure, 
	footer, header, hgroup, menu, nav, section, summary,
	time, mark, audio, video {
		 margin:0;
		 padding:0;
		 border:0;
		 outline:0;
		 font-size:100%;
		 vertical-align:baseline;
		 background:transparent;
	}
	article,aside,canvas,details,figcaption,figure,
	footer,header,hgroup,menu,nav,section,summary { 
		 display:block;
	}
	del { text-decoration: line-through; }
	abbr[title], dfn[title] {
		 border-bottom:1px dotted #000;
		 cursor:help;
	}
	table {
		 border-collapse:collapse;
		 border-spacing:0;
	}
	hr{ display:none; }
	input, select { vertical-align:middle; }
	*{ list-style-type:none; }

/**
 * font-face
 */

	/*
		font "SYMBOL SIGNS" was designed by Sander Baumann
		http://www.fontsquirrel.com/fonts/Symbol-Signs
	*/
	@font-face {
		font-family: 'SymbolSignsBasisset';
		src: local('Symbol Signs Basis set'), local('SymbolSigns-Basisset'), url('../fonts/symbol-signs.ttf') format('truetype');
	}

/**
 * base
 */
	html,body{
		/* necessary to enable bg gradient? */
		overflow:hidden;
		width:100%;
		height:100%;
		font-size:30px;
		line-height:1.5;
		background:#000;
		color:#fff;
		font-family: 'VL Pゴシック', Arial, Helvetica, sans-serif;
	}
	a{
		color:#fff;
	}
	em{
		font-style: normal;
		color:orange;
	}
	strong{
		font-style: normal;
		color:red;
	}

	/*
		erase all styles about elems not in view
		this seems to increase performance
	*/
	div.page:not(.onView),
	div.page:not(.onView) *{
		display:none !important;
		background:none !important;
		border:none !important;
		border-radius:none !important;
		transition:none !important;
		-webkit-transition:none !important;
		-webkit-background-size: auto !important;
		float:none !important;
		-webkit-animation-name: none !important;
		-webkit-animation-iteration-count:0 !important;
	}

/**
 * modules for $.presentation
 */
	/**
	 * .mod-pager
	 */
	@-webkit-keyframes 'pagerReveal' {
		from{ opacity:1; }
		to{ opacity:0; }
	}
	.mod-pager{
		position:fixed;
		z-index:9999;
		top:0;
		left:0;
		right:0;
		height:1.75em;
		text-align:center;
		font-family: 'SymbolSignsBasisset', sans-serif;
		font-size:1.5em;
		opacity:0;
		transition:opacity .3s;
		-o-transition:opacity .3s;
		-moz-transition:opacity .3s;
		-webkit-transition:opacity .3s;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
		-webkit-animation-name: 'pagerReveal';
		-webkit-animation-iteration-count:1;
		-webkit-animation-duration:1s;
	}
	.mod-pager:hover{
		opacity:1;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	}
		.mod-pager li{
			position:absolute;
			top:0;
		}
		.mod-pager li#pager-L{
			left:0;
		}
		.mod-pager li#pager-R{
			right:0;
		}
			.mod-pager li a{
				line-height:1;
				text-decoration:none;
				float:left;
				color:#000;
				font-weight:bold;
				padding:0 .1em .2em .3em;
				text-decoration:none;
				background:rgb(255,255,255);
				border-radius:.4em;
				margin:.2em;
			}

	/**
	 * .mod-pageNum
	 */
	.mod-pageNum{
		position:fixed;
		z-index:9999;
		bottom:0;
		left:0;
		right:0;
		font-size:.5em;
		padding:0 0 .2em;
		text-align:center;
	}

	/**
	 * .mod-page
	 */
	.mod-page{
		position:fixed;
		left:0;
		top:0;
		width:100%;
		height:100%;
		display:table;
		background:#222;
	}
	.mod-page.transition{
		/* class "transition" will be attached by JavaSript */
		transition:all .5s;
		-o-transition:all .5s;
		-moz-transition:all .5s;
		-webkit-transition:all .5s;
		-webkit-transform-origin:50% 0;
	}
		.mod-page > div{
			display:table-cell;
			vertical-align:middle;
			text-align:center;
			padding:40px 60px;
		}
	.mod-page.center{
		left:0;
		opacity:1;
		-webkit-transform:rotate(0);
		z-index:101;
	}
	.mod-page.left{
		left:-100%;
		opacity:0;
		opacity:0;
		-webkit-transform:rotate(-30deg) skewX(-30deg);
	}
	.mod-page.right{
		left:100%;
		opacity:0;
		opacity:0;
		-webkit-transform:rotate(30deg) skewX(30deg);
	}

	/**
	 * .mod-page.top
	 */
	.mod-page.top{
	}
		.mod-page.top > div{
			font-size:1.25em;
		}
			.mod-page.top h1{
				font-size:bold;
				font-size:3em;
				line-height:1.3;
				padding:0 0 .25em;
				text-shadow: #000 0 5px 5px ;
			}
			.mod-page.top p{
				padding:1em 0 0;
			}
				.mod-page.top p span{
					font-size:.75em;
				}

	/**
	 * .mod-page.plain
	 */
	.mod-page.plain{
	}
		.mod-page.plain > div{
			vertical-align:top;
			text-align:left;
		}
			.mod-page.plain h2{
				font-weight:bold;
				font-size:1.75em;
				padding:0 0 .5em;
				line-height:1.25;
			}
			.mod-page.plain div.img{
				margin:1em 0;
			}
			.mod-page.plain p{
				padding:0 0 .75em;
			}
			.mod-page.plain ul{
				padding:0 0 .5em;
			}
				.mod-page.plain ul li{
					padding:0 0 .25em .1em;
					margin:0 0 0 1.75em;
					list-style-type:disc;
				}
			.mod-page.plain ol{
				padding:0 0 .5em;
			}
				.mod-page.plain ol li{
					padding:0 0 .25em .1em;
					margin:0 0 0 1.75em;
					list-style-type:decimal;
				}
			.mod-page.plain .sideImgR{
				float:right;
				margin:0 0 25px 30px;
			}
			.mod-page.plain pre{
				border:1px solid #fff;
				background:#333;
				padding:.6em .75em;
				margin:0 0 20px;
			}
			.mod-page.plain code{
				font-family: 'VL ゴシック', monospace;
			}
			.mod-page.plain dl.list{
				margin:-.5em 0 0 1.75em;
				padding:0 0 .75em;
			}
				.mod-page.plain dl.list dt{
					padding:.5em 0 .25em;
					display:list-item;
					list-style-type:disc;
				}
				.mod-page.plain dl.list dd{
				}
			.mod-page.plain .buttons{
				margin:0 0 0 -.25em;
				padding:0 0 .5em;
				overflow:hidden;
				*zoom:1; /* ie */
			}
				.mod-page.plain .buttons div{
					float:left;
					padding:0 0 0 .25em;
				}
					.mod-page.plain .buttons button{
						font-size:1.2em;
						padding:.25em .5em;
					}

	/**
	 * .mod-page.shout
	 */
	.mod-page.shout{
	}
		.mod-page.shout > div{
		}
			.mod-page.shout p{
				font-size:2.5em;
				font-weight:bold;
			}
			.mod-page.shout .big{
				font-size:5em;
			}

	/**
	 * .mod-page.shout.canvas
	 */
	.mod-page.shout.canvas{
		background:#fff;
	}

	/**
	 * .mod-page.sectionStart
	 */
	.mod-page.sectionStart{
	}
		.mod-page.sectionStart > div{
		}
			.mod-page.sectionStart ul{
				font-size:.8em;
				line-height:1.3;
				position:fixed;
				right:0;
				top:0;
				width:35%;
				height:100%;
				box-align:left;
				-webkit-box-align:left;
				box-orient:vertical;
				-webkit-box-orient:vertical;
				box-pack:center;
				-webkit-box-pack:center;
				display:box;
				display:-webkit-box;
				letter-spacing:-.1em;
				text-align:left;
			}
				.mod-page.sectionStart ul li{
					border-bottom:1px solid #fff;
					padding:.5em 0 .5em 0;
					opacity:.5;
				}
				.mod-page.sectionStart ul li:last-child{
					border-bottom:none;
				}
				.mod-page.sectionStart ul li.current{
					z-index:2;
					background:#fff;
					color:#000;
					-webkit-transform:scale(1.1);
					opacity:1;
					border-radius:.2em 0 0 .2em;
					padding-left:.5em;
				}
			.mod-page.sectionStart h2{
				position:fixed;
				right:40%;
				top:0;
				height:100%;
				width:60%;
				box-align:center;
				-webkit-box-align:center;
				box-pack:end;
				-webkit-box-pack:end;
				display:box;
				display:-webkit-box;
				text-align:right;
				font-size:2em;
			}



/**
 * ex
 */
.ex-font-80{
	font-size:80%;
}
.ex-align-c{
	text-align:center;
}

/**
 * samples
 */
#sample1{
	padding:.5em .5em;
	text-align:center;
	margin: 1em 2em 1em;
	font-size:120%;
	background:#fff;
	color:#000;
}

/**
 * mod-jQueryWorksLikeThis
 */
.mod-jQueryWorksLikeThis{
	text-align:center;
	margin:0 200px;
	padding:1em 0 1.5em;
	font-size:1.5em;
}
	.mod-jQueryWorksLikeThis del{
		text-decoration: line-through;
		display:block;
		color:#777;
	}
	.mod-jQueryWorksLikeThis .step1,
	.mod-jQueryWorksLikeThis .step2{
		background:#fff;
		color:#000;
		padding:.5em .5em;
		border-radius:10px;
	}
	.mod-jQueryWorksLikeThis .arrow{
		padding:.1em;
		font-size:1.5em;
	}
	.mod-jQueryWorksLikeThis .disabled{
		opacity:.2;
	}

/**
 * mod-example-styleChange1
 */
.mod-example-styleChange1{
	color:#000;
	background:#fff;
	padding:1em 1em .5em;
	margin:0 0 1em;
	overflow:hidden;
	*zoom:1; /* ie */
}
	.mod-example-styleChange1 div{
		margin:0 0 .5em;
		padding: .25em .5em;
		border:2px solid #000;
	}
	#example-styleChange1-button{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}

/**
 * mod-example-styleChange2
 */
.mod-example-styleChange2{
	color:#000;
	background:#fff;
	padding:1em;
	margin:0 0 1em;
	overflow:hidden;
	*zoom:1; /* ie */
}
	.mod-example-styleChange2 table{
		border-collapse:collapse;
		width:100%;
		font-size:.75em;
	}
		.mod-example-styleChange2 th,
		.mod-example-styleChange2 td{
			border:2px solid #000;
			padding:.1em .5em;
		}
	#example-styleChange2-button{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}

/**
 * mod-example-styleChange3
 */
.mod-example-styleChange3{
	color:#000;
	background:#fff;
	padding:1em;
	margin:0 0 1em;
	overflow:hidden;
	*zoom:1; /* ie */
}
	.mod-example-styleChange3 div{
		text-align:center;
		padding:.5em 1em;
		margin:0 auto;
		background:blue;
		color:#fff;
	}
	#example-styleChange3-button{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}

/**
 * mod-example-styleChange4
 */
.mod-example-styleChange4{
	color:#000;
	background:#fff;
	padding:1em;
	margin:0 0 1em;
	overflow:hidden;
	*zoom:1; /* ie */
}
	.mod-example-styleChange4 div{
		text-align:center;
		padding:2em 1em;
		margin:0 150px;
		background:blue;
		color:#fff;
	}
	#example-styleChange4-button-hide,
	#example-styleChange4-button-show{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}

/**
 * mod-example-styleChange5
 */
.mod-example-styleChange5{
	color:#000;
	background:#fff;
	padding:1em;
	margin:0 0 1em;
	overflow:hidden;
	*zoom:1; /* ie */
}
	.mod-example-styleChange5 div{
		text-align:center;
		padding:2em 1em;
		margin:0 150px;
		background:blue;
		color:#fff;
	}
	#example-styleChange5-button{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}

/**
 * mod-example-styleChange6
 */
.mod-example-styleChange6{
	color:#000;
	background:#fff;
	padding:1em;
	margin:0 0 1em;
	overflow:hidden;
	*zoom:1; /* ie */
}
	.mod-example-styleChange6 div{
		text-align:center;
		padding:1em .5em;
		margin:0 150px;
		background:blue;
		color:#fff;
		font-size:2em;
	}
	#example-styleChange6-button{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}

/**
 * mod-example-styleChange7
 */
.mod-example-styleChange7{
	color:#000;
	background:#fff;
	padding:.5em;
	margin:0 0 1em;
	overflow:hidden;
	*zoom:1; /* ie */
}
	.mod-example-styleChange7 div{
		text-align:center;
	}
	#example-styleChange7-button{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}

/**
 * mod-example-styleChange8
 */
.mod-example-styleChange8{
	color:#000;
	background:#fff;
	padding:.5em;
	margin:0 0 1em;
	overflow:hidden;
	*zoom:1; /* ie */
}
	.mod-example-styleChange8 div{
		text-align:center;
	}
	#example-styleChange8-button{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}

/**
 * mod-example-styleChange9
 */
.mod-example-styleChange9{
	color:#000;
	background:#fff;
	padding:1em;
	margin:0 0 1em;
	overflow:hidden;
	*zoom:1; /* ie */
}
	.mod-example-styleChange9 div{
		text-align:center;
		padding:2em 1em;
		margin:0 150px;
		background:blue;
		color:#fff;
	}
	.mod-example-styleChange9 .hoge{
		background:red;
	}
	#example-styleChange9-button-addClass,
	#example-styleChange9-button-removeClass{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}

/**
 * mod-example-styleChange10
 */
.mod-example-styleChange10{
	color:#000;
	background:#fff;
	padding:.25em 0;
	margin:0 0 1em;
	overflow:hidden;
	*zoom:1; /* ie */
}
	.mod-example-styleChange10 *{
		text-align:center;
		display:block;
		margin:0 auto;
	}
	#example-styleChange10-button-fadeIn,
	#example-styleChange10-button-fadeOut{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}

/**
 * mod-example-styleChange11
 */
.mod-example-styleChange11{
	color:#000;
	background:#fff;
	padding:.25em 0;
	margin:0 0 1em;
	overflow:hidden;
	*zoom:1; /* ie */
}
	.mod-example-styleChange11 *{
		text-align:center;
		display:block;
		margin:0 auto;
	}
	#example-styleChange11-button-slideToggle,
	#example-styleChange11-button-slideDown,
	#example-styleChange11-button-slideUp{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}

/**
 * mod-example-styleChange12
 */
.mod-example-styleChange12{
	color:#000;
	background:#fff;
	height:200px;
	position:relative;
	margin:0 0 1em;
	*zoom:1; /* ie */
}
	.mod-example-styleChange12 div{
		padding:.5em 1em;
		background: #000;
		color:#fff;
		position:absolute;
		left:10px;
		top:10px;
	}
	#example-styleChange12-button{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}

/**
 * mod-example-move1
 */
.mod-example-move1{
	color:#000;
	background:#fff;
	margin:0 0 1em;
	padding:.5em 1em;
	*zoom:1; /* ie */
}
	.mod-example-move1 div{
		padding:.25em .5em;
		margin:.5em .25em;
	}
	.mod-example-move1 div.hoge{
		border:4px solid red;
	}
	.mod-example-move1 div.fuga{
		border:4px solid blue;
	}
	#example-move1-button{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}


/**
 * mod-example-move2
 */
.mod-example-move2{
	color:#000;
	background:#fff;
	margin:0 0 1em;
	padding:.5em 1em;
	*zoom:1; /* ie */
}
	.mod-example-move2 div{
		padding:.25em .5em;
		margin:.5em .25em;
	}
	.mod-example-move2 div.hoge{
		border:4px solid red;
	}
	.mod-example-move2 div.fuga{
		border:4px solid blue;
	}
	#example-move2-button{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}

/**
 * mod-example-creation1
 */
.mod-example-creation1{
	color:#000;
	background:#fff;
	margin:0 0 1em;
	padding:.5em 1em;
	height:300px;
	overflow-y:scroll;
	*zoom:1; /* ie */
}
	.mod-example-creation1 div{
		padding:.25em .5em;
		margin:.5em .25em;
		border:4px solid red;
	}
		.mod-example-creation1 div div{
			border:4px solid blue;
		}
	#example-creation1-button{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}

/**
 * mod-example-event1
 */
.mod-example-event1{
	color:#000;
	background:#fff;
	padding:1em;
	margin:0 0 1em;
	overflow:hidden;
	text-align:center;
	*zoom:1; /* ie */
}
	.mod-example-event1 div.result{
		padding:0 0 .5em;
	}
	.mod-example-event1 div.box{
		padding:1em 1em;
		margin:0 150px;
		background:blue;
		color:#fff;
		cursor:pointer;
	}

/**
 * mod-example-event2
 */
.mod-example-event2{
	color:#000;
	background:#fff;
	padding:1em;
	margin:0 0 1em;
	overflow:hidden;
	text-align:center;
	*zoom:1; /* ie */
}
	.mod-example-event2 div.result{
		padding:0 0 .5em;
	}
	.mod-example-event2 div.box{
		padding:1em 1em;
		margin:0 150px;
		background:blue;
		color:#fff;
	}

/**
 * mod-example-event3
 */
.mod-example-event3{
	color:#000;
	background:#fff;
	padding:1em;
	margin:0 0 1em;
	overflow:hidden;
	text-align:center;
	*zoom:1; /* ie */
}
	.mod-example-event3 div.result{
		padding:0 0 .5em;
	}
	.mod-example-event3 div.box{
		padding:1em 1em;
		margin:0 150px;
		background:blue;
		color:#fff;
	}


/**
 * mod-example-event4
 */
.mod-example-event4{
	color:#000;
	background:#fff;
	padding:1em 0;
	margin:0 0 1em;
	overflow:hidden;
	text-align:center;
	*zoom:1; /* ie */
}
	.mod-example-event4 div{
		padding:0 0 .5em;
	}
	.mod-example-event4 input{
		font-size:1em;
		padding:.125em .25em;
		border:3px solid #999;
		width:500px;
	}

/**
 * mod-example-event5
 */
.mod-example-event5{
	color:#000;
	background:#fff;
	padding:1em 0;
	margin:0 0 1em;
	overflow:hidden;
	text-align:center;
	*zoom:1; /* ie */
}
	.mod-example-event5 div{
		padding:0 0 .5em;
	}
	.mod-example-event5 input{
		font-size:1em;
		padding:.125em .25em;
		border:3px solid #999;
		width:500px;
	}

/**
 * mod-example-event6
 */
.mod-example-event6{
	color:#000;
	background:#fff;
	padding:1em;
	margin:0 0 1em;
	overflow:hidden;
	text-align:center;
	*zoom:1; /* ie */
	overflow:hidden;
	font-size:.8em;
}
	.mod-example-event6 div{
		padding:1em 1em;
		background:blue;
		margin:.25em;
		color:#fff;
		float:left;
		cursor:pointer;
	}

/**
 * mod-example-misc1
 */
.mod-example-misc1{
	color:#000;
	background:#fff;
	padding:1em;
	margin:0 0 1em;
	overflow:hidden;
	text-align:center;
	*zoom:1; /* ie */
	overflow:hidden;
	font-size:.8em;
}
	.mod-example-misc1 div{
		padding:1em 1em;
		background:blue;
		margin:.25em;
		color:#fff;
		float:left;
		white-space:nowrap;
	}
	#example-misc1-button{
		font-size:.8em;
		padding:.25em .5em;
		float:right;
	}

/**
 * mod-example-ui1
 */
.mod-example-ui1{
	color:#000;
	background:#fff;
	margin:0 0 1em;
	padding:1em 1.5em;
	*zoom:1; /* ie */
	overflow:hidden;
	font-size:.7em;
}
	.mod-example-ui1 a{
		text-align:center;
		margin:2px;
		float:left;
	}
	.mod-example-ui1 img{
		float:left;
	}







