/* RESET & BASE */
*{
	margin:0;
	padding:0;
	line-height:1.62;
}
.left{
	float:left;
}
.right{
	float:right;
}
.clear{
	clear:both;
}
.text-r{
	text-align:right;
}
img{
	border:none;
}
.section p a{
	color:#f09;
}
.section p a:hover{
	color:#f09;
	background:rgba(255,255,255,0.7);
}
html{
	font: 12px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#fff;
}

/* MENU BAR */
@-webkit-keyframes MenuArea {
	0% {
		-webkit-opacity:0;
		-webkit-transform: translateX(-200px);
	}
	100% {
		-webkit-opacity:1;
		-webkit-transform: translateX(0px);
	}
}
html, body, #menu {
  height: 100%; /* 「div.background」に対してはmin-heightに対応していないブラウザ用 */
}
#menu{
	-webkit-animation-name: MenuArea;
	-webkit-animation-fill-mode:backwards;
	-webkit-animation-delay: 0s;
	-webkit-animation-duration: 0.5s;
	-webkit-animation-iteration-count: 1;
	position:absolute;
	position:absolute\9; /* IE8 */
	*position:absolute; /* IE7 */
	_position:absolute; /* IE6 */
	top:-65px;
	left:0;
	margin-top:0;
	margin-top:-65px\9; /* IE8 */
	*margin-top:0; /* IE7 */
	_margin-top:0; /* IE6 */
	padding:15px;
	width:220px;
	height:100%;
	min-height:100%;
	background-color:rgba(0,0,0,0.4);
	background-color:#000\9;
	*background-color:#000;
	_background-color:#000;
	z-index:50;
}
#menu:not(:target){
	position:absolute;¥9;
	margin-top:0;
	background-color:rgba(0,0,0,0.4);
}

body > #menu {
  height: auto; /* 要素を超えた分の背景が伸びないブラウザ用 */
}
#collabo{
	background:url(../img/title1.png) no-repeat;
	width:220px;
	height:50px;
	text-indent:-9999px;
}
#collabo a{
	display:block;
	width:220px;
	height:50px;
}
h1{
	background:url(../img/title2.png) no-repeat;
	width:220px;
	height:230px;
	text-indent:-9999px;
}
#mainmenu{
	padding-top:15px;
}
#mainmenu li{
	list-style-type:none;
	height:55px;
}
#mainmenu li a{
	display:block;
	text-indent:-9999px;
	width:220px;
	height:45px;
}
#menu li a:hover, #link a:hover{
	opacity:0.5;
	filter:alpha (opacity=50); /* IE */
}
#menu_top{
	background:url(../img/menu_top.png) no-repeat;
}
#menu_whatsnew{
	background:url(../img/menu_whatsnew.png) no-repeat;
}
#menu_imagephoto{
	background:url(../img/menu_imagephoto.png) no-repeat;
}
#menu_virtualviewer{
	background:url(../img/menu_virtualviewer.png) no-repeat;
}
#menu_roominfo{
	background:url(../img/menu_roominfo.png) no-repeat;
}
#artist{
	background:url(../img/artistmenu_title.png) no-repeat;
	display:block;
	width:220px;
	height:65px;
	text-indent:-9999px;
	margin-top:15px;
}
#artistmenu li{
	float:left;
	list-style-type:none;
	margin-top:8px;
}
#artistmenu li a{
	display:block;
	text-indent:-9999px;
	height:35px;
}
#artistmenu_profile{
	background:url(../img/artistmenu_profile.png) no-repeat;
	width:55px;
	border-right:1px solid #fff;
}
#artistmenu_interview{
	background:url(../img/artistmenu_interview.png) no-repeat;
	width:73px;
	border-right:1px solid #fff;
}
#artistmenu_movie{
	background:url(../img/artistmenu_movie.png) no-repeat;
	width:89px;
}
#link{
	padding-top:50px;
}

/* Scrooll to Top */
#back-top {
    position: fixed;
    bottom: 8px;
    right: 8px;
}
#back-top a {
    width: 50px;
    display: block;
    text-align: center;
    font: 11px/100% Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    text-decoration: none;
    outline: none;
}
#back-top a:hover {
    color: #000;
}
/* arrow icon (span tag) */
#back-top span {
    width: 40px;
    height: 26px;
    display: block;
    margin-bottom: 7px;
    background: #ccc;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    color:#ffffff;
    font-size:24px;
    padding-top:14px;
        line-height:0.5;
}
#back-top a:hover span {
    background-color: #eee;
    color:#999;
}