.bg-shelf {
	background-image: url(../images/bg/bg-shelf.jpg);
	background-repeat: no-repeat;
	background-size: cover;
}

.shelf {
	display: block;
	height: 675px;
}

.shelf-container {
	/*background-image: url(../images/pic/shelf.png);*/
	background-repeat: no-repeat;
	background-size: 1240px 960px;
	background-position: center top;
	width: 100%;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
}

.shelf .owl-carousel-group {
	position: relative; 
	width: 100%; 
	height: 100%;
	padding-top: 20%;
}

@media only screen and (max-width: 1199px) {
	.shelf-container {
		background-size: 1024px 960px;
	}
}

@media only screen and (max-width: 480px) {
	.shelf .owl-carousel-group {
		margin-left: -5%;
	}
}

@media only screen and (max-width: 320px) {
	.shelf .owl-carousel-group {
		margin-left: 0;
	}
}

.shelf .owl-carousel {
	width: 85% !important;
}

@media only screen and (min-width: 480px) {
	.shelf .owl-carousel {
		width: auto !important;
	}
}


.owl-carousel.owl-drag .owl-item {
	display: flex;
	align-items: center;
	justify-content: center;
}

.shelf .owl-carousel.owl-drag .owl-item .item {
	/*width: 180px !important; 
	height: 250px !important;*/
	width: 150px !important; 
	height: auto !important;
	height: 200px !important;
	object-fit: contain;
	display: flex;
    align-items: flex-end;
}

.shelf .owl-dots{
	display: none;
}

.shelf .owl-nav{
	display: block;
}

.shelf .shelf-one {
	position: absolute !important; 
	top: 85px; 
	/*left: 65%;*/
	left: 50%;
	/*transform: translateX(-65%);*/
	transform: translateX(-55%);
	right: 0;
	/*padding-left: 50%;*/
	/*padding-left: 10%;
	padding-right: 28%;*/
}

.shelf .shelf-two {
	position: absolute !important; 
	top: 395px;
	/*top: 420px;*/
	/*left: 70%;*/
	left: 50%;
	/*transform: translateX(-70%);*/
	transform: translateX(-55%);
	right: 0;
	/*padding-left: 50%;*/
	/*padding-left: 28%;
	padding-right: 10%;*/
}

.shelf .shelf-three {
	position: absolute !important; 
	top: 685px;
	/*left: 70%;*/
	left: 50%;
	/*transform: translateX(-70%);*/
	transform: translateX(-55%);
	right: 0;
	/*padding-left: 50%;*/
	/*padding-left: 28%;
	padding-right: 10%;*/
}

.shelf .item img{
	display: block;
	max-width: 100%;
	height: auto;
}

#book img {
	max-width: 800px;
	max-height: 500px;
}

.owl-stage-outer {
	max-width: 650px;
	min-height: 200px;
	margin-left: auto;
	margin-right: auto;
}

.nopadding {
	padding: 0 !important;
	margin: 0 !important;
}

@media only screen and (max-width: 1400px) {
	.shelf .shelf-one {
		top: 85px; 
	}
    .shelf .shelf-two {
        top: 395px;
    }
    .shelf .shelf-three {
        top: 685px;
    }
}


@media only screen and (max-width: 1024px) {
	/*.shelf .shelf-one {
		top: 118px;
	}*/
}


@media only screen and (max-width: 999px) {
	.shelf {
		height: 830px;
	}
}


@media only screen and (max-width: 1200px) {
	.shelf-container {
		/*background-image: url(../images/pic/shelf02.png);*/
		background-position: none;
	}
}

@media only screen and (max-width: 480px) {
	.shelf .shelf-one {
		/*top: 95px;*/
		left: 60%;
	}
	.shelf .shelf-two {
		/*top: 405px;*/
		left: 60%;
	}
	.shelf .shelf-three {
		/*top: 695px;*/
		left: 60%;
	}
}

@media only screen and (max-width: 320px) {
	.shelf .shelf-one {
		/*top: 12%;*/
		left: 50%; 
	}
	.shelf .shelf-two {
		/*top: 42%;*/
		left: 50%; 
	}
	.shelf .shelf-three {
		/*top: 70%;*/
		left: 50%; 
	}
}