@charset "UTF-8";
/*
Sugamo Hospitality. CSS
Author: Kyohei Uchimura(Hdj)
Version: 150903
*/

/*-----------------------------------------------
 __ResetCSS
-----------------------------------------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-style:normal;
font-weight: normal;
font-size: 100%;
vertical-align: baseline;
}


a{
	text-decoration:none;
}
/*-----------------------------------------------
 __Base Setting
-----------------------------------------------*/
html,body{
}
body{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
P{
	color:#4C4C4C;
}
.section{
	box-sizing:border-box;
	width:1020px;
	height:600px;
}
#Stage01,
#Stage02,
#Stage03,
#Stage04,
#Stage05,
#Stage06,
#Stage07,
#Stage08{
	width:1020px;
	height:600px;
	margin:auto;
}
#Poster{
	background:#EEE;
}
#Poster .PosterImg{
	width:615px;
	margin:20px auto;
}

.fp-viewing-3::before,
.fp-viewing-4::before,
.fp-viewing-5::before{
  background:url(../images/bg_logo.jpg) no-repeat 50% 50%;
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  z-index: -1;
}
/*-----------------------------------------------
 __Nav
-----------------------------------------------*/
.Nav{
	position:fixed;
	z-index:100;
	top:0;
	background:#000;
	height:40px;
	width:100%;
}
.Nav ul{
	position:absolute;
	right:18px;
	top:6px;
}
.Nav ul li{
	list-style-type:none;
	display:inline-block;
	margin-right:12px;
	border:solid 1px #888;
	line-height:26px;
	width:26px;
	height:26px;
	text-align:center;
	color:#888;
}
.Nav ul li:hover{
	background:#888;
	color:#000;
	cursor:pointer;
}
.fp-viewing-0 .Nav ul #P01{
	border:solid 1px #FFF;
	background:#FFF;
	color:#000;
}
.fp-viewing-1 .Nav ul #P02{
	border:solid 1px #FFF;
	background:#FFF;
	color:#000;
}
.fp-viewing-2 .Nav ul #P03{
	border:solid 1px #FFF;
	background:#FFF;
	color:#000;
}
.fp-viewing-3 .Nav ul #P04{
	border:solid 1px #FFF;
	background:#FFF;
	color:#000;
}
.fp-viewing-4 .Nav ul #P05{
	border:solid 1px #FFF;
	background:#FFF;
	color:#000;
}
.fp-viewing-5 .Nav ul #P06{
	border:solid 1px #FFF;
	background:#FFF;
	color:#000;
}
.fp-viewing-6 .Nav ul #P07{
	border:solid 1px #FFF;
	background:#FFF;
	color:#000;
}
.fp-viewing-7 .Nav ul #P08{
	border:solid 1px #FFF;
	background:#FFF;
	color:#000;
}
/*-----------------------------------------------
 __Sec01
-----------------------------------------------*/
#Sec01{
	position:relative;
}
#Sec01 h1{
	width:250px;
	margin:-20px auto 0;
}
#Sec01 .ScrollBox{
	position:absolute;
	bottom:0;
	height:60px;
	width:100%;
	background:url(../images/top_bg.jpg) repeat-x 0 0;
}
#Sec01 .ScrollBox .Scroll{
	line-height:60px;
	text-align:center;
	color:#656565;
	background:url(../images/top_arrow_bg.jpg) no-repeat 50% 0;
}

/*-----------------------------------------------
 __Sec02
-----------------------------------------------*/
#Sec02{
}

/*-----------------------------------------------
 __Sec03
-----------------------------------------------*/
#Sec03-1{
}
#Sec03-6 p{
	text-align:center;
}



/*-----------------------------------------------
 __Sec04
-----------------------------------------------*/
#Sec04{
}
#Sec04 .Poster{
	width:160px;
	height:220px;
	margin:-180px auto 0;
	padding-bottom:40px;
	opacity:0;
}
#Sec04.active .Poster{
	animation:FadeIn 1s ease-in-out 6s forwards;
	-ms-animation:FadeIn 1s ease-in-out 6s forwards;
	-webkit-animation:FadeIn 1s ease-in-out 6s forwards;
	-moz-animation:FadeIn 1s ease-in-out 6s forwards;
}
#Sec04 .Poster a{
	display:block;
	width:160px;
	height:220px;
}
#Sec04 .Poster a:hover{
	opacity:0.6;
}
poster.jpg{
	margin:0 auto;
}

@keyframes FadeIn{
	0%{
	opacity:0;
	}
	100%{
	opacity:1;
	}
}
@-ms-keyframes FadeIn{
	0%{
	opacity:0;
	}
	100%{
	opacity:1;
	}
}
@-webkit-keyframes FadeIn{
	0%{
	opacity:0;
	}
	100%{
	opacity:1;
	}
}
@-moz-keyframes FadeIn{
	0%{
	opacity:0;
	}
	100%{
	opacity:1;
	}
}

/*-----------------------------------------------
 __Sec05
-----------------------------------------------*/
#Sec05{
	position:relative
}
#Sec05 #Stage08{
	height:600px;
	position:absolute;
	bottom:0%;
	left:50%;
	margin-left:-510px;
}
#Sec05  .LogoSugamo{
	width:80px;
	height:50px;
	position:absolute;
	left:40px;
	bottom:30px;
}
#Sec05  .LogoSugamo a:hover{
	opacity:0.6;
}
#Sec05 #PageTop{
	position:absolute;
	bottom:10px;
	right:40px;
	text-indent:-9999px;
	width:100px;
	height:100px;
	background:url(../images/bt_page_top.jpg) no-repeat center center;
	-ms-animation: PageTop 1.5s ease-in-out infinite;
	-webkit-animation: PageTop 1.5s ease-in-out infinite;
	-moz-animation: PageTop 1.5s ease-in-out infinite;
	animation: PageTop 1.5s ease-in-out infinite;
}
#Sec05 #PageTop:hover{
	opacity:0.6;
	cursor:pointer;
}
@-ms-keyframes PageTop{
	0%{
	bottom:0px;
	}
	50%{
	bottom:15px;
	}
	100%{
	bottom:0px;
	}
}
@-webkit-keyframes PageTop{
	0%{
	bottom:0px;
	}
	50%{
	bottom:15px;
	}
	100%{
	bottom:0px;
	}
}
@-moz-keyframes PageTop{
	0%{
	bottom:0px;
	}
	50%{
	bottom:15px;
	}
	100%{
	bottom:0px;
	}
}
@keyframes PageTop{
	0%{
	bottom:0px;
	}
	50%{
	bottom:15px;
	}
	100%{
	bottom:0px;
	}
}