#ContainerBox{ background-image:url(img/Container_bg.jpg); background-color:#FFF; background-repeat:no-repeat; background-position:left top; text-align:left}
#Header{ height:498px;}
#Header span,#Main .innerBox #news span,#Main .innerBox #info .copy p{ display:none}
#Contents{}
#Main{ }
#Main .innerBox{ padding:0 17px 0 35px;}



#news{ background-image:url(img/news_bg.jpg); background-position:left bottom; height:597px; width:314px; background-repeat:no-repeat; float:left;}
#news .btn a{display:block; height:149px; width:314px;background-image:url(img/news_btn.png); background-repeat:no-repeat; background-position:left top;}
#news .btn a:hover{ background-position:left -149px;}
#news .newsArea{ padding-top:40px; padding-left:50px;}
#news .newsArea h2{ background-image:url(img/newsArea_h2.gif); width:80px; height:21px; padding-bottom:27px; background-repeat:no-repeat}
#news .newsArea dl{ width:210px}
#news .newsArea dt{ margin-top:7px}


#info{ padding-top:120px; float:right; width:584px;}
#info .copy{ background-image:url(img/info_copy.gif); width:543px; height:182px;}

#info .bookdetailBox{ margin-top:31px; background-image:url(common/img/bookdetailBox_ln.gif); background-repeat:repeat-x; }

#info .bookdetailBox .innerBox{ padding:37px 38px 0 10px}
#info .bookdetailBox .innerBox .cover{float:left}
#info .bookdetailBox .innerBox .bookinfo{float:right; width:362px;}

#info .bookdetailBox .innerBox .bookinfo ul.sosical_button {margin-bottom:20px;}
#info .bookdetailBox .innerBox .bookinfo ul.sosical_button li{ display:block; padding-right:10px; overflow:hidden; width:120px; float:left}

#info .bookdetailBox .innerBox .bookinfo ul.price {margin-bottom:30px; height:15px;}
#info .bookdetailBox .innerBox .bookinfo ul.price li{ display:block; padding-right:5px; float:left}
#info .bookdetailBox .innerBox .bookinfo ul.price li.detailnav{ background-image:url(common/img/link_icon.gif); background-position:left center; background-repeat:no-repeat; padding-left:15px;}



#info .bookdetailBox .innerBox .bookinfo .purchase{ background-image:url(img/purchase_bg.gif); width:350px; height:77px; position:relative; top:0; left:0}

#info .bookdetailBox .innerBox .bookinfo .purchase .shopselect{ position:absolute; top:45px; left:14px;  font-size:90%; width:220px;} 

/*	display:block;
	background-image:url(img/purchase_btn.gif);
	background-repeat:no-repeat;
	width:105px;
	height:24px;
#info .bookdetailBox .innerBox .bookinfo .purchase a:hover{ background-position:left -24px;}*/
#info .bookdetailBox .innerBox .bookinfo .purchase a{
	position:absolute;
	top:43px;
	left:239px;
	cursor:pointer;
}





#ijuinbooks{ background-image:url(img/ijuinbooks_bg.gif); width:979px; height:306px;}

#ijuinbooks h3{ background-image:url(img/ijuinbooks_h3.gif); width:388px; height:22px; background-repeat:no-repeat}

#ijuinbooks h3 span{display:none}
#ijuinbooks #carousel_container{margin-top:20px;}
#ijuinbooks li img.resize{ width:92px; height:133px;}

#ijuinbooks .innerBox{ padding:30px 40px}
#carousel_inner {
position:relative;
float:left; /* important for inline positioning */
width:860px; /* important (this width = width of list item(including margin) * items shown */ 
overflow:hidden!important;  /* important (hide the items outside the div) */
/* non-important styling bellow */
}

#carousel_ul {
position:relative;
left:-123px; /* important (this should be negative number of list items width(including margin) */
list-style-type: none; /* removing the default styling for unordered list items */
margin: 0px;
padding: 0px;
width:9999px; /* important */
/* non-important styling bellow */
padding-bottom:10px;
}

#carousel_ul li{
float: left; /* important for inline positioning of the list items */                                    
width:200px;  /* fixed width, important */
/* just styling bellow*/
padding:0px;
height:164px;
margin-left:1px;
background-repeat:repeat-x;}




#carousel_ul li span{
display:block;
padding:17px 14px 15px 15px;
text-align:center
}

#carousel_ul li.hc{ background-image:url(img/ijuinbooks_bg_hc.gif); width:122px; height:164px;
}
#carousel_ul li.bnk{ background-image:url(img/ijuinbooks_bg_bnk.gif); width:122px; height:164px;
}

#carousel_ul li.mook{ background-image:url(img/ijuinbooks_bg_mook.gif); width:122px; height:164px;
}
#carousel_ul li span{
display:block;
padding:17px 14px 15px 15px;
background-repeat:no-repeat!important;}
#carousel_ul span.hc_bg{ background-image:url(img/ijuinbooks_bg_hc_bg.gif);
}
#carousel_ul span.bnk_bg{ background-image:url(img/ijuinbooks_bg_bnk_bg.gif);
}
#carousel_ul span.mook_bg{ background-image:url(img/ijuinbooks_bg_mook_bg.gif);
}


#carousel_ul li img {
.margin-bottom:-4px; /* IE is making a 4px gap bellow an image inside of an anchor (<a href...>) so this is to fix that*/
/* styling */
cursor:pointer;
cursor: hand; 
border:0px; 
}

#left_scroll, #right_scroll{
float:left; 
}
#left_scroll{ background-image:url(img/slide-prev.gif); }
#right_scroll{ background-image:url(img/slide-next.gif); }
#left_scroll span, #right_scroll span{
height:164px;
width:18px; 
display:block;
/*styling*/
cursor: pointer;
cursor: hand;
}

#left_scroll span:hover{ background-image:url(img/slide-prev.gif);background-position:left -164px;}
#right_scroll span:hover{ background-image:url(img/slide-next.gif); background-position: left -164px;}

#left_scroll span span, #right_scroll span span{ display:none}