main {
	position: relative;
	display: table;
	width: 100%;
	height: calc(100% - 149px);
	height: 100%;
	/* background: blue; */
	vertical-align: middle;
}
main.main {
	padding-top: 20px;
}

@media all and (max-height: 936px) {
	main.main {
		padding-top: 25px;
	}
}

.contnet-wrap {
	position: relative;
	display: table-cell;
	width: 100%;
	height: 100%;
	vertical-align: middle;
}

body {
/*overflow: hidden;*/
}

.ebookDiv {
	overflow: hidden;
	position: relative;
	display: block;
	width: 100%;
	max-width: 1060px;
	margin: 0 auto;
}

.ebookDiv.ebookDiv2 {
	max-width: 1060px;
	height: 750px;
}

.ebookDiv.ebookDiv2 #ebook {
	height: 750px;
}

/* .ebookDiv.ebookDiv2 #ebook img {
	width: 568px !important;
	height: 751px !important;
} */

@media all and (max-height: 895px) {
	.ebookDiv.ebookDiv2 {
		max-width: 954px;
		height: 675px;
	}
	

	.ebookDiv.ebookDiv2 #ebook {
		max-width: 954px;
		height: 675px;
	}

	/* .ebookDiv.ebookDiv2 #ebook img {
		width: 498px !important;
		height: 658px !important;
	} */

}

.ebookPrev {
	font-size: 0;
	display: block;
	width: 37px;
	height: 70px;
	background: url(/images/common/ebookPrev.png)no-repeat center center;
	z-index: 1000;
	position: fixed;
	top:50%; 
	transform:translateY(-50%);
	left: 40px;
	cursor: pointer;
	opacity: 0.9;
}
/* .ebookPrev:hover {
	background: url(/images/common/ebookPrev-over.png)no-repeat center center;
} */

.ebookNext {
	font-size: 0;
	display: block;
	width: 37px;
	height: 70px;
	background: url(/images/common/ebookNext.png)no-repeat center center;
	z-index: 1000;
	position: fixed;
	top:50%; 
	transform:translateY(-50%);
	right: 40px;
	cursor: pointer;
	opacity: 0.9;
}

.ebookPrev:hover,
.ebookNext:hover {
	opacity: 1;
}

/* .ebookNext:hover {
	background: url(/images/common/ebookNext-over.png)no-repeat center center;
} */

@media all and (max-width: 1200px) {
	.ebookPrev,
	.ebookNext {
		opacity: 0.5;
	}
	.ebookPrev {
		left: 10px;
	}
	.ebookNext {
		right: 10px;
	}
}/* 1200px */
/* 
#ebook {
	transition: margin 0.3s ease-in-out;
} */
	
#ebook {
	/*width: 986px;
	height: 650px;*/
}
#ebook .page-wrapper {
	/*height: 650px;*/
}


#ebook .shadow,
#ebook.shadow{
-webkit-box-shadow: 0 4px 10px rgba(0,0,0,0.4);
-moz-box-shadow: 0 4px 10px rgba(0,0,0,0.4);
-ms-box-shadow: 0 4px 10px rgba(0,0,0,0.4);
-o-box-shadow: 0 4px 10px rgba(0,0,0,0.4);
box-shadow: 0 4px 10px rgba(0,0,0,0.4);
}

/* #ebook .shadow,
#ebook.shadow{
  -webkit-box-shadow: 0 4px 10px #666;
  -moz-box-shadow: 0 4px 10px #666;
  -ms-box-shadow: 0 4px 10px #666;
  -o-box-shadow: 0 4px 10px #666;
  box-shadow: 0 4px 10px #666;
} */

@media all and (max-height: 800px) {
/* 	body {
		height: auto;
	}
	
	main {
		height: auto;
	} */
	
	.contnet-wrap {
		height: auto;
		/* padding-bottom: 60px; */
	}
}/* 800px */


div.bottom {
	position: fixed;
	display: block;
	width: 100%;
	height: 100px;
	text-align: center;
	font-size: 0;
	left: 0;
	bottom: -0;
	overflow: hidden;
	z-index: 20;
}

.bottomList {
	position: absolute;
	display: block;
	width: 100%;
	height: 100px;
	z-index: 1000;
	text-align: center;
	font-size: 0;
	left: 0;
	visibility: hidden;
	bottom: -100px;
	/* background: red; */
	transition: visibility 0.3s ease-in-out, bottom 0.3s ease-in-out;
}

.bottomList.bottomPopUp {
	visibility: visible;
	bottom: 0;
}

/* 
	max-width: 880px; */

.bottomListDiv {
	position: relative;
	display: block;
	width: 100%;
	max-width: 880px;
	height: 100%;
	margin: 0 auto;
	/* background: yellow; */
}

.bottomList ul {
	max-width: calc(100% - 120px);
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	margin: auto;
	/* background: blue; */
	overflow: hidden;
	min-width: 760px;
}

.bottomList ul:after {
	display: block;
	content: "";
	clear: both;
}

.bottomList ul li {
	position: relative;
	display: block;
	width: 76px;
	height: 100px;
	/* background: black; */
	cursor: pointer;
	float: left;
}

.bottomList ul li.active:after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.3);
	position: absolute;
	left: 0;
	top: 0;
}

.bottomList ul li:hover:after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.3);
	position: absolute;
	left: 0;
	top: 0;
}

.bottomList ul li span {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.bottomListDiv .bottomRightBtn {
	position: absolute;
	z-index: 30;
	top:50%;
	transform:translateY(-50%);
	right: 12px;
	
	display: block;
	width: 35px;
	height: 35px;
	background: rgba(0,0,0,0.3) url(/images/common/bottomRightBtn.png)no-repeat center center;
	background-size: 17px;
	cursor: pointer;
}

.bottomListDiv .bottomRightBtn:hover {
	background: rgba(0,0,0,0.7) url(/images/common/bottomRightBtn.png)no-repeat center center;
	background-size: 17px;
}

.bottomListDiv .bottomLeftBtn {
	position: absolute;
	z-index: 30;
	top:50%;
	transform:translateY(-50%);
	left: 12px;
	
	display: block;
	width: 35px;
	height: 35px;
	background: rgba(0,0,0,0.3) url(/images/common/bottomLeftBtn.png)no-repeat center center;
	background-size: 17px;
	cursor: pointer;
}

.bottomListDiv .bottomLeftBtn:hover {
	background: rgba(0,0,0,0.7) url(/images/common/bottomLeftBtn.png)no-repeat center center;
	background-size: 17px;
}