
body.fixed {
	height: 300vw;
}
body.fixed #wrapper {
	display: none;
}
#lightboxOverlay {
	position: fixed !important;
	height: 200vw !important;
}
#lightbox {
	position: fixed !important;
	top: 20px !important;
}
.lb-container {
	height: calc(100% - 8px);
	overflow: hidden !important;
	position: relative;
	border-radius: 3px !important;
	border: 4px solid white !important;
}
.lightbox .lb-image {
	position: absolute;
	border-radius: 0 !important;
	border: 0 !important;
	cursor: pointer;
}
.lightbox .lb-image.drag {
	cursor: move;
	z-index: 11;
}
.lb-nav {
	width: 50px !important;
	height: 50px !important;
	top: 50%;
	margin-top: -25px;
}
.lb-prev,
.lb-next {
	width: 50px !important;
	height: 50px !important;
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -25px;
	background: url(../images/common/prev.png) left 48% no-repeat;
	opacity: 0;
	transition: all .4s;
}
.lb-next {
	left: auto;
	right: 0;
	background: url(../images/common/next.png) right 48% no-repeat;
}

.lb-prev:hover,
.lb-next:hover {
	opacity: 1;
}

.lb-container::before,
.lb-container:has(.drag)::before {
	white-space: pre;
	content: "下にスクロールすると画像が拡大されます。\A画像をクリックすると、自由に動かせるようになります。";
	background-color: #FFFFFF;
	position: absolute;
	top: 8px;
	padding: 10px;
	left: 0;
	z-index: 12;
	line-height: 1.4;
	text-align: left;
}
.lb-container:has(.drag)::before {
	content: "画像をクリックすると、移動を停止します。" !important;
	background-color: #FFA042 !important;
}