/* CSS Document */
* {
    margin: 0;
    padding: 0;
}

html{
	width:100%;
	height:100%;
	overflow:hidden;
}

body{
	background:#000;
	width:100%;
	height:100%;
}
.header{
	position:fixed;
	top:20px;
	left:20px;
	z-index:9999;
}

.imageBoxWrap{
	padding-bottom:140px;
	width:100%;
	height:100%;
	border:10px solid #000;
}

.imageBox{
	width:100%;
	height:100%;
	-moz-background-size:contain;
	background-size:contain;
	text-align:center;
}
#images{
	width:100%;
	height:auto;
}


.thumbnailMenu{
	width:100%;
	position:fixed;
	bottom:0px;
	height:110px;
	overflow:hidden;
	background:#000;
	text-align:center;
	position:relative;
}

.captionBox{
	font-family: Helvetica,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
	color:#FFF;
	text-align:center;
	padding-top:10px;
}

#image_selector{
	position:absolute;
	margin-top:15px;
	white-space: nowrap;
	left:0px;
}
#image_selector li{
	display: inline-block;
	cursor:pointer;
}
#image_selector li img{
	height:80px;
	opacity:0.40;
}

.selected img{
	opacity:1.0 !important;
}

#image_selector li img:hover{
	-webkit-animation: fadein 0.3s linear 0s 1;
	opacity:1;
}
@-webkit-keyframes fadein {
	0%{
		opacity:0.4;
	}
	100% {
		opacity:1;
	}
}


#btn_prev{
	display:block;
	width:30px;
	height:30px;
	background:url(../images/icn_l.png);
	z-index:9999;
	position:fixed;
	left:10px;
	top:40%;
	cursor:pointer;
}

#btn_next{
	display:block;
	width:30px;
	height:30px;
	background:url(../images/icn_r.png);
	z-index:9999;
	position:fixed;
	right:10px;
	top:40%;
	cursor:pointer;
}

#btn_prev:hover,
#btn_next:hover{
	opacity:0.7;
}



#btn_fullscreen{
	cursor:pointer;
	position:fixed;
	width:32px;
	height:32px;
	display:block;
	top:10px;
	right:10px;
	text-indent:-99999px;
	background:url(../images/fullscreen.png) rgba(5,5,5,0.3);
	opacity:0.5;
}
#btn_fullscreen:hover{
	background:url(../images/fullscreen_o.png) rgba(5,5,5,0.5);
}

#btn_auto{
	cursor:pointer;
	position:fixed;
	width:32px;
	height:32px;
	display:block;
	top:50px;
	right:10px;
	text-indent:-99999px;
	background:url(../images/auto.png) rgba(5,5,5,0.3);
	opacity:0.5;
}
#btn_auto:hover{
	background:url(../images/auto_o.png) rgba(5,5,5,0.5);
}
.btn_auto_off,
.btn_auto_off:hover{
	background:url(../images/auto_n.png) rgba(5,5,5,0.5) !important;
}


.sml{
	font-size:75%;
}