@charset "utf-8";

/* HTML5 */
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary {
	display: block;
}

/* ----------------
 A
---------------- */

a {
	color: #568cc5;
	outline: none;
	overflow: hidden;
	text-decoration: none;
}
a:hover {
	/* text-decoration: none; */
}


/* ----------------
 BODY
---------------- */

body {
	position: relative;
	margin: 0;
	padding: 0;
	background: #bbb;
	background: url(../img/bg.png);
}

/* ----------------
 FIX
---------------- */

.fix {
	position: relative;
	width: 960px;
	margin: 0 auto;
	padding: 0;
}

/* ----------------
 NAV
---------------- */

nav {
	position: fixed;
	top: -20px;
	width: 100%;
	height: 100px;
	background: url(../img/gnavi/bg.png);
	z-index: 100;
}
nav .line {
	position: absolute;
	top: 20px;
	right: 0;
	z-index: 101;
}
nav figure {
	position: absolute;
	top: 24px;
	left: 0px;
	z-index: 102;
}
nav li:nth-of-type(1) {
	position: absolute;
	top: 36px;
	left: 261px;
	z-index: 102;
}
nav li:nth-of-type(2) {
	position: absolute;
	top: 35px;
	left: 337px;
	z-index: 102;
}
nav li:nth-of-type(3) {
	position: absolute;
	top: 35px;
	left: 446px;
	z-index: 102;
}
nav li:nth-of-type(4) {
	position: absolute;
	top: 35px;
	left: 550px;
	z-index: 102;
}
nav li:nth-of-type(5) {
	position: absolute;
	top: 35px;
	left: 852px;
	z-index: 102;
}

/* ----------------
 ENTER
---------------- */

#enter {
	position: relative;
	z-index: 0;
	margin: 0px;
	padding: 0px;
	min-height: 778px;
}
#enter h1 {
	position: absolute;
	top: 113px;
	left: 0px;
}
#enter h2 {
	position: absolute;
	top: 137px;
	right: 0px;
	z-index: 3
}
#enter figure:nth-of-type(1) {
	position: absolute;
	top: 260px;
	left: 190px;
	z-index: 2;
}
#enter figure:nth-of-type(2) {
	position: absolute;
	top: 279px;
	left: 556px;
	z-index: 1;
}
#enter figure:nth-of-type(3) {
	position: absolute;
	top: 249px;
	left: -30px;
	z-index: 1;
}
#enter #visual {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	width: 100%;
	text-align: center;
}

/* SOCIAL */

.hatebu {
	position: absolute;
	right: -18px;
	top: 100px;
	z-index: 1000;
}
.gplus {
	position: absolute;
	right: 44px;
	top: 100px;
	z-index: 1000;
}
.tweet {
	position: absolute;
	right: 118px;
	top: 100px;
	z-index: 1000;
}
.like {
	position: absolute;
	right: 257px;
	top: 100px;
	z-index: 1000;
}

/* ----------------
 INTRODUCTION
---------------- */

#intro {
	position: relative;
	z-index: 4;
	margin: 0;
	padding: 0;
	background: url(../img/intro/bg.png);
	overflow: hidden;
}
#intro .fix {
	height: 2300px;
}
#intro .ttl {
	position: absolute;
	top: 140px;
	left: 0px;
	z-index: 8;
}
#intro .hl01 {
	position: absolute;
	top: 295px;
	left: 0px;
	z-index: 8;
}
#intro .hl02 {
	position: absolute;
	top: 800px;
	left: 0px;
	z-index: 8;
}
#intro .str01 {
	position: absolute;
	top: 355px;
	left: 0;
	z-index: 8;
}
#intro .str02 {
	position: absolute;
	top: 862px;
	left: 0;
	z-index: 8;
}
#intro .str03 {
	position: absolute;
	top: 1712px;
	left: 278px;
	z-index: 8;
}
#intro .str04 {
	position: absolute;
	top: 2008px;
	left: 278px;
	z-index: 8;
}
#intro .cloud01 {
	position: absolute;
	top: 279px;
	left: 700px;
	z-index: 5;
}
#intro .cloud02 {
	position: absolute;
	top: 440px;
	left: 300px;
	z-index: 5;
}
#intro .cloud03 {
	position: absolute;
	top: 334px;
	left: -200px;
	z-index: 5;
}
#intro .blossom01 {
	position: absolute;
	top: 200px;
	left: -100px;
	z-index: 6;
}
#intro .blossom02 {
	position: absolute;
	top: 0px;
	left: 100px;
	z-index: 6;
}
#intro .sheet01 {
	position: absolute;
	top: 936px;
	right: 0px;
	z-index: 5;
}
#intro .sheet02 {
	position: absolute;
	top: 1704px;
	left: 25px;
	z-index: 5;
}
#intro .dc {
	position: absolute;
	bottom: 0px;
	left: 56px;
	z-index: 5;
}
#intro .staff01 {
	position: absolute;
	top: 884px;
	right: 20px;
	z-index: 6;
}
#intro .staff02 {
	position: absolute;
	top: 1691px;
	left: 41px;
	z-index: 6;
}
#intro #grass {
	position: absolute;
	top: 2245px;
	left: 0px;
	z-index: 5;
	width: 100%;
	height: 60px;
	background: url(../img/intro/grass.png);
}


/* ----------------
 FACILITY
---------------- */

#facility {
	position: relative;
	height: 900px;
	z-index: 10;
	overflow: hidden;
}
#facility #seg01 {
	height: 213px;
	background: url(../img/facility/bg_upper.jpg);
}
#facility #seg02 {
	position: relative;
	height: 564px;
	text-align: center;
	background: url(../img/facility/bg_stage.png);
	z-index: 11;
}
#facility #seg03 {
	height: 123px;
	background: url(../img/facility/bg_lower.jpg);
}
#facility #art01 {
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 12;
}
#facility #art02 {
	position: absolute;
	top: 0px;
	left: 2000px;
	z-index: 12;
}
#facility #art03 {
	position: absolute;
	top: 0px;
	left: 2000px;
	z-index: 12;
}
#facility #art04 {
	position: absolute;
	top: 0px;
	left: 2000px;
	z-index: 12;
}
#facility #art05 {
	position: absolute;
	top: 0px;
	left: 2000px;
	z-index: 12;
}
#facility #art06 {
	position: absolute;
	top: 0px;
	left: 2000px;
	z-index: 12;
}
#facility #cap01 {
	position: absolute;
	top: 302px;
	left: 32px;
	z-index: 13;
}
#facility #cap02 {
	position: absolute;
	top: 289px;
	left: 472px;
	z-index: 13;
}
#facility #cap03 {
	position: absolute;
	top: 313px;
	left: 11px;
	z-index: 13;
}
#facility #cap04 {
	position: absolute;
	top: 346px;
	left: 14px;
	z-index: 13;
}
#facility #cap05 {
	position: absolute;
	top: 276px;
	left: 14px;
	z-index: 13;
}
#facility #cap06 {
	position: absolute;
	top: 348px;
	left: 14px;
	z-index: 13;
}
#facility h2 {
	position: absolute;
	top: 90px;
	left: -8px;
}
#facility .fix #gallery {
	top: 100px;
}
#facility .fix figure:nth-of-type(1) {
	position: absolute;
}
#facility #thumb01 {
	position: absolute;
	top: -70px;
	left: 10px;
	z-index: 14;
	cursor: pointer;
}
#facility #thumb02 {
	position: absolute;
	top: -70px;
	left: 165px;
	z-index: 14;
	cursor: pointer;
}
#facility #thumb03 {
	position: absolute;
	top: -70px;
	left: 320px;
	z-index: 14;
	cursor: pointer;
}
#facility #thumb04 {
	position: absolute;
	top: -70px;
	left: 475px;
	z-index: 14;
	cursor: pointer;
}
#facility #thumb05 {
	position: absolute;
	top: -70px;
	left: 630px;
	z-index: 14;
	cursor: pointer;
}
#facility #thumb06 {
	position: absolute;
	top: -70px;
	left: 785px;
	z-index: 14;
	cursor: pointer;
}
#facility #lamp01 {
	position: absolute;
	top: 45px;
	left: 10px;
	z-index: 14;
}
#facility #lamp02 {
	position: absolute;
	top: 45px;
	left: 165px;
	z-index: 14;
}
#facility #lamp03 {
	position: absolute;
	top: 45px;
	left: 320px;
	z-index: 14;
}
#facility #lamp04 {
	position: absolute;
	top: 45px;
	left: 475px;
	z-index: 14;
}
#facility #lamp05 {
	position: absolute;
	top: 45px;
	left: 630px;
	z-index: 14;
}
#facility #lamp06 {
	position: absolute;
	top: 45px;
	left: 785px;
	z-index: 14;
}

/* ----------------
 STORY
---------------- */

#story {
	position: relative;
	padding-top: 150px;
	min-height: 750px;
	background: url(../img/story/bg.jpg);
	z-index: 20;
	overflow: hidden;
}
#story .fix {
	height: 583px;
	background: url(../img/story/book.png);
	z-index: 21;
}
#story #prev {
	position: absolute;
	top: 255px;
	right: 25px;
	z-index: 24;
}
#story #next {
	position: absolute;
	top: 255px;
	left: 30px;
	z-index: 24;
}
#story .fix section {
	position: relative;
	top: 13px;
	left: 70px;
	width: 835px;
	height: 562px;
	z-index: 22
}
#story .fix p {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 23;
}

#story #page01 {
	display: block;
}
#cafe {
	position: absolute;
	right: -140px;
	top: 5px;
	z-index: 24;
}

/* ----------------
 GALLERY
---------------- */

#gallery {
	position: relative;
	background: url(../img/gallery/bg.jpg)
	repeat 0px 0px;
	z-index: 15;
}
#gallery .fix {
	height: 1250px;
}
#gallery h2 {
	position: absolute;
	top: 142px;
	left: 0;
}
#gallery p {
	position: absolute;
	top: 230px;
	left: 0;
}
#gallery hr {
	position: absolute;
	top: 206px;
	left: 0px;
	z-index: 2;
	margin: 0;
	width: 100%;
	height: 2px;
	border: 0;
	background: url(../img/gallery/line.png);
}
#gallery ul {
	position: relative;
	top: 300px;
}
#gallery ul li {
	position: relative;
	float: left;
	margin-left: 21px;
	margin-bottom: 21px;
	padding-top: 20px;
	width: 306px;
	height: 263px;
	background: url(../img/gallery/sheet.png);
}
#gallery ul li:nth-of-type(1),
#gallery ul li:nth-of-type(4),
#gallery ul li:nth-of-type(7) {
	margin-left: 0px;
}

#gallery ul li figure {
	text-align: center;
}
#gallery ul li div:nth-of-type(1) {
	position: absolute;
	top: 195px;
	left: 20px;
}

#gallery ul li div:nth-of-type(2) {
	position: absolute;
	top: 195px;
	right: 20px;
}

#gallery ul li div:nth-of-type(3) {
	position: absolute;
	top: 235px;
	left: 20px;
}

#gallery ul li div:nth-of-type(4) {
	position: absolute;
	top: 235px;
	right: 20px;
}

/* ----------------
 FOOTER
---------------- */

footer {
	position: relative;
	height: 248px;
	background: url(../img/footer/bg.png);
	color: #fff;
	z-index: 0;
}
footer p {
	position: absolute;
	top: 134px;
	left: 0px;
	font-size: 10px !important;
	color: #666;
	z-index: 1;
}
footer figure:nth-of-type(1) {
	position: absolute;
	top: 43px;
	left: 0;
	z-index: 1;
}
footer figure:nth-of-type(2) {
	position: absolute;
	top: 43px;
	left: 115px;
	z-index: 1;
}
footer div div {
	position: absolute;
	top: 25px;
	left: 468px !important;
	height: 160px;
	z-index: 2px !important;
	background: #fff;
}

/* ----------------
 TW
---------------- */

#tw {
	position:fixed;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden;
	padding: 0;
	width: 100%;
	height: 40px;
	font-size: 12px;
	color: #fff;
	background: url(../img/twitter/bg.png);
	z-index: 100;
}
#twitter1 {
	width: 960px;
	margin: 0 auto;
}
#twitter1 ul {
	position:relative;
	left: 40px;
}
#twitter1 li {
	top: 0;
	left: 0;
	position: absolute;
	line-height: 40px !important;
	display:none;
	width: 96% !important;
}
#twitter1 :first-child {
	display:block;
}
.text .time {
	float: left;
	padding: 0 5px;
}
.time {
	color: #777
}
.twinf {
	display:block;
	float: left;
	padding-right: 10px;
	width: 100px;
	font-weight:bold;
	line-height: 40px !important;
}
.twinf img {
	float: left;
	padding-right:3px;
}
