﻿
.book {
	
	list-style: none;
	position: relative;
}

.book li {
	-webkit-perspective:1800px;
	-moz-perspective: 1800px;
	perspective: 1800px;
	position: relative;
	width: 100%;
	float: left;
	z-index: 1;
}

.book li .coverItem 
{
	cursor:url(//image.aladin.co.kr/img/shop/mousecursor2.png), pointer !important;
	position: absolute;
	width: 100%;
	
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	
	-webkit-transition: -webkit-transform .5s;
	-moz-transition: -moz-transform .5s;
	transition: transform .5s;
}

.coverItem .c_front > div,
.coverItem .c_back,
.coverItem .c_left,
.coverItem .c_right {
	background-color: #f5f5f5;
}

.book li .coverItem.default:hover 
{
	-webkit-transform: rotate3d(0,1,0,-30deg);
	-moz-transform: rotate3d(0,1,0,-30deg);
	transform: rotateY(-30deg);
}

.book li .coverItem > div,
.book li .c_front > div {
	display: block;
	position: absolute;
}

.book li .c_front 
{
	-webkit-transform-origin: 0% 50% 50%;
	-moz-transform-origin: 0% 50% 50%;
	transform-origin: 0% 50% 50%;
	
	-webkit-transition: -webkit-transform .5s;
	-moz-transition: -moz-transform .5s;
	transition: transform .5s;
	z-index: 10;
}

.book li .c_front > div {
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
	
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
}


.book li .c_back
{
	box-shadow: -5px 5px 15px rgba(0,0,0,0.3);
	border-radius: 3px 0 0 3px;
	z-index: 0;
}


.book li .c_front,
.book li .c_back,
.book li .c_front > div {
	width: 100%;
}

.book li .c_left 
{
	overflow:hidden;
	-webkit-transform: rotate3d(0,1,0,-90deg);
	-moz-transform: rotate3d(0,1,0,-90deg);
	transform: rotateY(-90deg);
}

.book li .c_right
{
	
}

.book li .coverItem.bk-viewback {
	-webkit-transform: translate3d(0,0,0px) rotate3d(0,1,0,-180deg);
	-moz-transform: translate3d(0,0,0px) rotate3d(0,1,0,-180deg);
	transform: rotateY(-179.9deg);
}

.book li .coverItem.hover {
	-webkit-transform: rotate3d(0,1,0,-30deg);
	-moz-transform: rotate3d(0,1,0,-30deg);
	transform: rotateY(-30deg);
}

.book li .bk-viewback .c_back {
	z-index: 10;
}

book .coverItem {
	background-repeat: no-repeat;
	background-position: 0px 0px;
}