/* ”KIHON NO KI” */


/* wait_time */

 @keyframes wait_time {
	  0% { opacity: 0;}
	100% { opacity: 1;}
	}

 #wait_time {
   animation: wait_time 3s forwards;
   	height: 100%;
   	left: 0;
 	opacity: 0;
	position: fixed;
	top: 0;
	width: 100%;
	}

/* BG_img */

 #bg_img {
	animation: bg_img 60s linear infinite;
	backface-visibility: hidden;
	transform: translate3d(0,0,0);
		/* Set your background with this */

	background: #F7AD2E url("img/tokyo800.png") bottom left;
	background-repeat: repeat-x;
	height: 100%;
	left: 0;
	opacity: 1;
	position: fixed;
	top: 0;
	}

 .no-scroll {
    animation: none !important;
    }



 @keyframes bg_img {
	  0% { transform: translate3d(0,0,0); }
	100% { transform: translate3d(-2250px,0,0); }
	}

 #bg_img {
	background-size: 2250px auto;
	width: 6750px;
	}

@keyframes change-color-anim {
	0%,100%{background-color: #ff4500;}
	    50%{background-color: #7fff00;}
}

/* Main */

 #main {
	height: 100%;
	left: 0;
	position: fixed;
	text-align: center;
	top: 0;
	width: 100%;
	}

 #main:before {
	content: '';
	display: inline-block;
	height: 100%;
	margin-right: 0;
	vertical-align: middle;
	width: 1px;
	}


/* Header */

 @keyframes header {
	0% { transform: translate3d(0,1em,0);opacity: 0; }
	100% { transform: translate3d(0,0,0);opacity: 1; }
	}

 @keyframes nav-icons {
	0% { transform: translate3d(0,1em,0);opacity: 0; }
	100% { transform: translate3d(0,0,0);opacity: 1; }
	}

#header {
	animation: header 1s 2.25s forwards;
	backface-visibility: hidden;
	transform: translate3d(0,0,0);
	cursor: default;
	display: inline-block;
	opacity: 0;
	position: relative;
	text-align: center;
	top: -1em;
	vertical-align: middle;
	width: 90%;
	}

#header h1 {
	font-size: 4.35em;
	font-weight: 900;
	letter-spacing: -0.035em;
	line-height: 1em;
	}

#header p {
	font-size: 1.25em;
	margin: 0.75em 0 0.25em 0;
	opacity: 0.75;
	}

#header nav {
	margin: 1.5em 0 0 0;
	}

#header nav li {
	animation: nav-icons 0.5s ease-in-out forwards;
	backface-visibility: hidden;
	transform: translate3d(0,0,0);
	display: inline-block;
	height: 5.35em;
	line-height: 5.885em;
	opacity: 0;
	position: relative;
	top: 0;
	width: 5.35em;
	}

/* button */
.btn-circle-flat {
	display: inline-block;
  	text-decoration: none;
	color: #FFF;
  	width: 90px;
  	height: 90px;
  	line-height: 90px;
  	border-radius: 50%;
  	text-align: center;
  	overflow: hidden;
  	transition: .4s;
	}

.btn-circle-flat:hover {
  	background: #ff7f50;
	border :1px solid;
	}


/* Footer */

#footer {
	background-image: linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.5) 75%);
	bottom: 0;
	cursor: default;
	height: 6em;
	left: 0;
	line-height: 8em;
	position: absolute;
	text-align: center;
	width: 100%;
	color: #FFF;
	}