<div id="bookWrap"<?# bookStyle ?>>
	<div class="tit wow">
		<h3><?# indexBTitle ?></h3>
		<p><a href="<?# indexBMLink ?>" title="<?# indexBMLinkTitle ?>"><?# indexBMLinkTitle ?></a></p>
	</div>
	<div class="bd">
		<ul>
			<php:repeater id="listB">
			<template>
			<li>
				<a class="photo" href="<?# link ?>" title="<?# BookName ?>" style="background-image:url(<?# BookImage ?>);"><img src="/images/11/index/img-bookPhoto.png" alt="<?# BookName ?>"/></a>
				<div class="hoverBox"><a href="<?# link ?>" title="<?# BookName ?>"><?# BookName ?></a></div>
			</li>
			</template>
			</php:repeater> 
		</ul>
	</div>
</div>
<script>
	$(function(){
		$('#bookWrap ul').slick({
			slidesToShow: 4,
			slidesToScroll: 4,
			autoplay: false,
			arrows: true,
			dots:false,
			responsive: [{
				breakpoint: 1440,
				settings: { slidesToShow: 3,slidesToScroll: 3,autoplay: true, }
			},{
				breakpoint: 980,
				settings: { slidesToShow: 2,slidesToScroll: 2,autoplay: true, }
			},{
				breakpoint: 480,
				settings: { slidesToShow: 1,slidesToScroll: 1,autoplay: true, }
			}]
		});
	});
</script>