@charset "utf-8";



/* index.css */





/* layout

------------------------------------------------ */



html {

	height: 100%;

	overflow: hidden;

}



body {

	padding-top: 0;

	height: 100%;

	min-height: 100%;

	overflow: hidden;

}



section {

	padding: 0;

	height: 100%;

	min-height: 100%;

}



nav {

	bottom: -37px;

}





/* top

------------------------------------------------ */



#top {

	position: relative;

	top: 12%;

	left: 50%;

	margin-left: -390px;

	width: 780px;

	height: 76%;

	display: none;

	z-index: 101;

	background: no-repeat center center;

	background-size: contain;

	-webkit-tap-highlight-color: rgba(0,0,0,0);

}



body.dawning #top {

	background-image: url(../../img/index/top_dawning.png);

}



body.morning #top {

	background-image: url(../../img/index/top_morning.png);

}



body.daytime #top {

	background-image: url(../../img/index/top_daytime.png);

}



body.evening #top {

	background-image: url(../../img/index/top_evening.png);

}



#top h1 {

	text-indent: -9999em;

}



#top h2 {

	text-indent: -9999em;

}



#top .update {

	position: absolute;

	top: 50%;

	left: 0;

	padding-top: 255px;

	width: 100%;

	font-size: 11px;

	letter-spacing: 1px;

	color: #ffff50;

	font-family: Arial, Helvetica, sans-serif;

	font-weight: bold;

	text-shadow: 1px 1px 1px #152f70, 0 0 2px #152f70, 0 0 3px #152f70;

	text-align: center;

}





/* contents

------------------------------------------------ */



#contents {

	position: relative;

	top: 50%;

	left: 50%;

	margin: -273px 0 0 -450px;

	padding: 3px;

	width: 900px;

	height: 572px;

	display: none;

	z-index: 100;

	background-image: url(../../img/index/contents_bg.png);

}



#contents .logo {

	position: absolute;

	top: 187px;

	left: 6px;

	width: 894px;

	height: 204px;

}



#contents ul.list {

	width: 900px;

	overflow: hidden;

}



#contents ul.list li {

	position: relative;

	float: left;

	margin: 3px;

	width: 219px;

	height: 175px;

}



#contents ul.list li.shop,

#contents ul.list li.chikura-jin,

#contents ul.list li.gallery,

#contents ul.list li.camera {

	margin-top: 213px;

}



#contents ul.list li h3 {

	position: absolute;

	top: 0;

	left: 0;

	width: 219px;

	height: 25px;

	font-size: 12px;

	line-height: 12px;

	text-align: center;

}



#contents ul.list li.shop h3,

#contents ul.list li.chikura-jin h3,

#contents ul.list li.gallery h3,

#contents ul.list li.camera h3 {

	top: 150px;

}



#contents ul.list li div {

	position: relative;

	top: 25px;

	left: 0;

	width: 219px;

	height: 150px;

}



#contents ul.list li.shop div,

#contents ul.list li.chikura-jin div,

#contents ul.list li.gallery div,

#contents ul.list li.camera div {

	top: 0;

}



#contents ul.list li div p {

	position: absolute;

	top: 0;

	left: 0;

	z-index: 111;

}



#contents ul.list li div p.current {

	z-index: 112;

}





/* menu

------------------------------------------------ */



#btn .top {

	position: fixed;

	bottom: -26px;

	left: 0;

	width: 100%;

	height: 26px;

	display: none;

	text-align: center;

	z-index: 11;

}



#btn .top img {

	cursor: pointer;

}



#btn .menu {

	position: absolute;

	bottom: 60px;

	left: 50%;

	margin: 0 0 0 -25px;

	width: 50px;

	height: 50px;

	display: none;

	cursor: pointer;

	z-index: 10;

}



@media screen and (max-height: 700px)  {

	#btn {

		display: none;

	}

}



@media screen and (max-height: 740px)  {

	#top .update {

		display: none;

	}

}





/* bg

------------------------------------------------ */



#bg {

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

	z-index: 0;

	-webkit-tap-highlight-color: rgba(0,0,0,0);

}



#bg p {

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

	background: no-repeat center center fixed;

}



#bg p.focus {

	z-index: 2;

	-webkit-background-size: cover;

	-moz-background-size: cover;

	-o-background-size: cover;

	background-size: cover;

}



body.dawning #bg p.focus {

	background-image: url(../../img/index/bg_focus_1.jpg);

}



body.morning #bg p.focus {

	background-image: url(../../img/index/bg_focus_2.jpg);

}



body.daytime #bg p.focus {

	background-image: url(../../img/index/bg_focus_3.jpg);

}



body.evening #bg p.focus {

	background-image: url(../../img/index/bg_focus_4.jpg);

}



#bg p.blur {

	z-index: 1;

	-webkit-background-size: cover;

	-moz-background-size: cover;

	-o-background-size: cover;

	background-size: cover;

}



body.dawning #bg p.blur {

	background-image: url(../../img/index/bg_blur_1.jpg);

}



body.morning #bg p.blur {

	background-image: url(../../img/index/bg_blur_2.jpg);

}



body.daytime #bg p.blur {

	background-image: url(../../img/index/bg_blur_3.jpg);

}



body.evening #bg p.blur {

	background-image: url(../../img/index/bg_blur_4.jpg);

}