@charset "UTF-8";


body {
	background:#f5f5f5;
}

/* ヘッダー */
#header {
	height:50px;
}
.header-space {
	top:50px; /* #headerのheightと同じサイズを指定 */
}
#headerControl {
	z-index:10001;
	position:absolute;
	width:100%;
	height:60px;
	top:0px;
}

/* ブック背景 */
#flipper-component {
	background-color:#f5f5f5;
}

/**************************************************************

めくるボタン（ブックの左右にあるもの）

**************************************************************/
.viewer-btn-outer {
	width:50px;
}
#flipper-app{}

/* めくるボタン（Ｒ） */
#viewer-flipr-outer {
	right:20px;
}
#viewer-flipr {
	background:none;
}
#viewer-flipr .icon:hover {
	transform:rotate(-5deg);
}
#viewer-flipr .icon {
	background:url(../../customdesign/flipr.png) no-repeat 0 0;
	background-size:60px 60px;
	width:60px;
	height:60px;
}


/* めくるボタン（Ｌ） */
#viewer-flipl {
	background:none;
}
#viewer-flipl .icon:hover {
	transform:rotate(5deg);
}
#viewer-flipl .icon {
	background:url(../../customdesign/flipl.png) no-repeat 0 0;
	background-size:60px 60px;
	width:60px;
	height:60px;
}


#popup{position:absolute;z-index:10002;width:100vw;height:100vh}
#popup img,#popup video{position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;width:auto;max-width:80%;max-height:80%}
#popup .popup-background{position:absolute;width:100vw;height:100vh;background-color:#d3d3d3;opacity:0.5}
#lt-add{position:absolute;right:0;left:0;margin:auto;height:60px;width:100%}
#headerControl{z-index:10001;position:absolute;width:100%;height:60px;top:0px}