﻿@charset "UTF-8";

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

html, body {
	line-height: 1;
	min-height:100%;
	font-family:Artial, Verdana, sans-serif;
}

body {
	background: #3870ba;
	background: -webkit-linear-gradient(top, #3870ba, #3870ba 100%);
	background: -moz-linear-gradient(top, #3870ba, #3870ba 100%);
	background: -o-linear-gradient(top, #3870ba, #3870ba 100%);
	background: -ms-linear-gradient(top, #3870ba, #3870ba 100%);
	background: linear-gradient(top, #3870ba, #3870ba 100%);
	background-attachment:fixed;
} 

ol, ul {
	list-style: none;
}

p {
	margin:1em 0;
	line-height:1.1em;
}

q {
	font-style:italic;
	color:#333;
}

h1 {
	font-size:2.91em;
	margin:0;
}

h1 > small {
	text-align:right;
	display:inline-block;
	font-size:.71em;
	text-indent:15em;
	color:#444;
}

h2 {
	color:inherit;
	font-size:1.91em;
	margin:2em 0 1em 0;
}

h2:first-child {margin-top:0;}

h3 {
	color:#333;
	font-size:1.41em;
	margin:1em 0;
}

h4 {
	color:#444;
	font-size:1.11em;
	margin:1em 0;
}

#progress {
	height:2%;
	background:#444;
	bottom:0;
	z-index:200;
}

#scrollbar {
	position:fixed;
	right:2px;
	height:50px;
	width:6px;
	background:#444;
	background:rgba(0,0,0,0.6);
	border:1px solid rgba(255,255,255,0.6);
	z-index:300;
	border-radius:3px;
}

.skrollr-desktop #scrollbar {display:none;}

#bg1, #bg2, #bg3 {
	z-index:1; 
	top:0;
	left:0;
	width:100%;
	height:100%;
/*	background:url(img/bg1.png) repeat 0 0; */
/*	background:url(images/bubbles.png) repeat 0 0; */

}

#bg2 {
	z-index:49;
	background-image:url(img/bg2.png); 
/*	background-image:url(images/bubbles2.png); */
}

#bg3 {
	z-index:50;
	background-image:url(img/bg3.png); 
/*	background-image:url(images/bubbles2.png); */
}

#intro {
	width:80%;
	left:50%;
	top:1em;
	margin-left:-40%;
	padding:2em;
	background:#fff;
	text-align:center;
	border-radius:1em;

	-webkit-transform-origin:0 0;
	-moz-transform-origin:0 0;
	-ms-transform-origin:0 0;
	-o-transform-origin:0 0;
	transform-origin:0 0;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#intro .arrows {
	font-size:2em;
	color:#09f;
}

#transform1 {
	width:100%;
	text-align:center;
	z-index: 100;
}

#transform {
	width:70%;
	left:50%;
	top:20%;
	margin-left:-35%;
	text-align:center;
	font-size:150%;
	z-index: 1000;
	.transform-origin(50%, 50%);
}

#transform2 {
	width:100%;
	text-align:center;
	z-index: 1000;
	.transform-origin(103px, 103px);
}

#transform3 {
	width:100%;
	text-align:center;
	z-index: 102;
}
#transform4 {
	width:100%;
	text-align:center;
	z-index: 1001;
	.transform-origin(103px, 103px);
}

#properties {
	width:100%;
	height:100%;
	padding-top:10%;
	text-align:center;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#easing_wrapper {
	width:100%;
	height:100%;
}

#easing {
	width:50%;
	z-index:101;
}

.Top3 { top: 3%; }
.Top4 { top: 4%; }
.Top5 { top: 5%; }
.Top6 { top: 6%; }
.Top7 { top: 7%; }
.Top8 { top: 8%; }
.Top9 { top: 9%; }
.Top10 { top: 10%; }
.Top12 { top: 12%; }
.Top13 { top: 13%; }
.Top14 { top: 14%; }
.Top15 { top: 15%; }
.Top16 { top: 16%; }
.Top17 { top: 17%; }
.Top18 { top: 18%; }
.Top20 { top: 20%; }
.Top23 { top: 23%; }
.Top24 { top: 24%; }
.Top25 { top: 25%; }
.Top30 { top: 30%; }
.Top32 { top: 32%; }
.Top35 { top: 35%; }
.Top36 { top: 36%; }
.Top37 { top: 37%; }
.Top38 { top: 38%; }
.Top40 { top: 40%; }
.Top41 { top: 41%; }
.Top42 { top: 42%; }
.Top43 { top: 43%; }
.Top45 { top: 45%; }
.Top46 { top: 46%; }
.Top47 { top: 47%; }
.Top50 { top: 50%; }
.Top52 { top: 52%; }
.Top53 { top: 53%; }
.Top54 { top: 54%; }
.Top55 { top: 55%; }
.Top56 { top: 56%; }
.Top57 { top: 57%; }
.Top58 { top: 58%; }
.Top60 { top: 60%; }
.Top62 { top: 62%; }
.Top64 { top: 64%; }
.Top65 { top: 65%; }
.Top67 { top: 67%; }
.Top68 { top: 68%; }
.Top73 { top: 73%; }
.Top75 { top: 75%; }
.Top80 { top: 80%; }
.Top82 { top: 82%; }
.Top85 { top: 85%; }
.Top90 { top: 90%; }

.drop {
	background:#09f;
	font-weight:bold;
	padding:1em;
}

#download {
	width:80%;
	left:10%;
	height:80%;
	padding:3em;
	border:0 solid #222;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.twitter-share-button, .twitter-follow-button {
	vertical-align:middle;
}

.indicator {
     margin: 0;
     position: fixed;
     right: 10px;
     top: 10px;
	z-index: 10000;
}

#scene2_wrapper {
	width:100%;
	height:100%;
}

#footer {
	width:100%;
	padding-top: 20px;
	padding-bottom: 20px;
	background-color:#000000;
	height:310px;
	margin:0 auto;

}

#FooterContent { width:800px; margin:0 auto; }

#FooterContent ul li {
	border-right:1px solid #CCCCCC;
	color:#CCCCCC;
	font-size:12px;
	list-style:none;
	float:left;
	padding:0 10px;
	margin-top:30px;
}

#FooterContent ul li:last-child {
	border-right: none;
	color:#CCCCCC;
	font-size:12px;
	list-style:none;
	float:left;
	padding:0 10px;
	margin-top:30px;
}

#FooterContent ul li a {
	text-decoration: none;
	color: #CCC;
}

/*ロールオーバー拡大*/

.img-block {
	width: 486px;
	height: 274px;
	overflow: hidden;
}

.img-block img {
	transition: 0.5s;
}

.img-block img:hover {
	-webkit-transform: translateY(-50px);
	-moz-transform: translateY(-50px);
	-ms-transform: translateY(-50px);
	-o-transform: translateY(-50px);
}