@charset "UTF-8";
/*---------------------------------------------------------------
local.css
-----------------------------------------------------------------
table of contents

	1. Common
	2. List
	3. POP
	4. SWEET
	5. COOL
	6. VIVID
	7. NATURAL
	8. ANIMAL
	9. DELICIOUS
	10.List201


-----------------------------------------------------------------
font-size table

	10px :   77%		16px : 123.1%
	11px :   85%		17px :    131%
	12px :   93%		18px : 138.5%
	13px : 100%		19px : 146.5%
	14px : 108%		20px : 153.9%
	15px : 116%		21px : 161.6%
---------------------------------------------------------------*/

/*==============================================================
	1.	Common
===============================================================*/

#contents{
	margin-top:20px;
}

/*==============================================================
	2.	List
===============================================================*/

#list{
	position:relative;
	width:100%;
	background:url(/images/list/bg_list.png) top left repeat-y;
}
#list div.list-bottom{
	width:100%;
	height:7px;
	background:url(/images/list/bg_list_bottom.png) bottom left repeat-y;
}
#category{
	position:relative;
	width:100%;
	overflow:hidden;
}
#list h2{
	/*position:relative;
	left:180px;*/
	width:570px;
	height:40px;
	padding-left:180px;
	line-height:0;
}
#list div.menu{
	position:absolute;
	z-index:100;
	top:-40px;
	left:0px;
	width:150px;
	padding-left:30px;
	background:url(/images/list/bg_menu.png) bottom left no-repeat #fff;
}
/*#list.pop div.menu{
	padding-top:64px;
}
#list.sweet div.menu{
	padding-top:99px;
}
#list.cool div.menu,
#list.vivid div.menu{
	padding-top:79px;
}
#list.natural div.menu{
	padding-top:99px;
}
#list.animal div.menu{
	padding-top:54px;
}
#list.delicious div.menu{
	padding-top:79px;
	background:url(/images/list/bg_menu_delicious.jpg) top left no-repeat;
}*/
#list div.menu dl{
	width:150px;
	padding-bottom:11px;
	background:url(/images/list/bg_menu_bottom.png) bottom left no-repeat;
}
#list div.menu dt,
#list div.menu dd{
	line-height:0;
}
/*#list.pop div.menu dl{
}
#list.sweet div.menu dl{
	background:url(/images/list/bg_menu_bottom_sweet.png) bottom left no-repeat;
}
#list.cool div.menu dl{
	background:url(/images/list/bg_menu_bottom_cool.png) bottom left no-repeat;
}
#list.vivid div.menu dl{
	background:url(/images/list/bg_menu_bottom_vivid.png) bottom left no-repeat;
}
#list.natural div.menu dl{
	background:url(/images/list/bg_menu_bottom_natural.png) bottom left no-repeat;
}
#list.animal div.menu dl{
	background:url(/images/list/bg_menu_bottom_animal.png) bottom left no-repeat;
}
#list.delicious div.menu dl{
	background:url(/images/list/bg_menu_bottom_delicious.png) bottom left no-repeat;
}*/
#templates{
/*	z-index:50;*/
	position:relative;
	width:862px;
/*	margin-top:-191px;*/
	padding:10px 34px 0;
}
#templates div.row{
	position:relative;
	width:100%;
	height:20em;
	margin-bottom:5px;
}
#templates dl.template{
	position:absolute;
	top:0px;
	width:170px;
	cursor:pointer;
}
/*#list.sweet #templates{
	padding-top:0;
	background:url(/images/list/bg_templates_sweet.jpg) top left no-repeat;
}
#list.cool #templates{
	padding-top:0;
	background:url(/images/list/bg_templates_cool.jpg) top left no-repeat;
}
#list.vivid #templates{
	padding-top:0;
	background:url(/images/list/bg_templates_vivid.jpg) top left no-repeat;
}
#list.natural #templates{
	padding-top:0;
}
#list.animal #templates{
	padding-top:0;
	background:url(/images/list/bg_templates_animal.jpg) top left no-repeat;
}
#list.delicious #templates{
	padding-top:0;
}*/
#templates dl.template dt{
	padding-left:5px;
	padding-bottom:8px;
	line-height:0;
}
#templates dl.template img{
	border:1px solid #fff;
}
#templates dl.template dd.name{
	padding-bottom:5px;
	font-weight:bold;
	font-size:77%;
	color:#4c4c4c;
	letter-spacing:0.05em;
}
#templates dl.template dd.name a:link,
#templates dl.template dd.name a:visited{
	color:#4c4c4c;
	text-decoration:none;	
}
#templates dl.template dd.comment p{
	width:155px;
	font-size:77%;
	line-height:1.45;
	color:#949494;
}
#templates dl.template.over img{
	border:1px solid #ccc;	
}
#templates dl.template.over dd.comment p{
	color:#4c4c4c;
}
#templates div.cut{
	position:absolute;
	top:0px;
	width:170px;
}

#list.pop dl.temp1{
	left:0px;
}
#list.pop dl.temp2{
	left:178px;
}
#list.pop dl.temp3{
	left:356px;
}
#list.pop dl.temp4{
	left:533px;
}
#list.pop dl.temp5{
	left:713px;
}

/*==============================================================
	3.	POP
===============================================================*/

/*
	cols position
	
	1st: left:0px;
	2nd: left:178px;
	3rd: left:356px;
	4th: left:533px;
	5th: left:713px;

*/

#list.pop #row1 dl.temp1{
	left:178px;
}
#list.pop #row1 dl.temp2{
	left:533px;
}
#list.pop #row1 dl.temp3{
	left:713px;
}
#list.pop #row1 div.cut1{
	top:191px;
	left:-5px;
}
#list.pop #row1 div.cut2{
	left:351px;
}

#list.pop #row2 dl.temp1{
	left:0px;
}
#list.pop #row2 dl.temp2{
	left:356px;
}
#list.pop #row2 dl.temp3{
	left:533px;
}
#list.pop #row2 dl.temp4{
	left:713px;
}
#list.pop #row2 div.cut1{
	left:173px;
}

#list.pop #row3 dl.temp1{
	left:0px;
}
#list.pop #row3 dl.temp2{
	left:178px;
}
#list.pop #row3 dl.temp3{
	left:356px;
}
#list.pop #row3 dl.temp4{
	left:713px;
}
#list.pop #row3 div.cut1{
	left:529px;
}

#list.pop #row4 dl.temp1{
	left:0px;
}
#list.pop #row4 dl.temp2{
	left:178px;
}
#list.pop #row4 dl.temp3{
	left:533px;
}
#list.pop #row4 dl.temp4{
	left:713px;
}
#list.pop #row4 div.cut1{
	left:351px;
}

/*==============================================================
	4.	SWEET
===============================================================*/

/*
	cols position
	
	1st: left:0px;
	2nd: left:178px;
	3rd: left:356px;
	4th: left:533px;
	5th: left:713px;

*/

#list.sweet #row1 dl.temp1{
	left:178px;
}
#list.sweet #row1 dl.temp2{
	left:356px;
}
#list.sweet #row1 dl.temp3{
	left:713px;
}
#list.sweet #row1 div.cut1{
	top:191px;
	left:-5px;
}
#list.sweet #row1 div.cut2{
	left:529px;
}


#list.sweet #row2 dl.temp1{
	left:0px;
}
#list.sweet #row2 dl.temp2{
	left:356px;
}
#list.sweet #row2 dl.temp3{
	left:533px;
}
#list.sweet #row2 dl.temp4{
	left:713px;
}
#list.sweet #row2 div.cut1{
	left:173px;
}

#list.sweet #row3 dl.temp1{
	left:0px;
}
#list.sweet #row3 dl.temp2{
	left:178px;
}
#list.sweet #row3 dl.temp3{
	left:533px;
}
#list.sweet #row3 dl.temp4{
	left:713px;
}
#list.sweet #row3 div.cut1{
	left:351px;
}

#list.sweet #row4 dl.temp1{
	left:0px;
}
#list.sweet #row4 dl.temp2{
	left:178px;
}
#list.sweet #row4 dl.temp3{
	left:356px;
}
#list.sweet #row4 dl.temp4{
	left:713px;
}
#list.sweet #row4 div.cut1{
	left:529px;
}

/*==============================================================
	5.	COOL
===============================================================*/

/*
	cols position
	
	1st: left:0px;
	2nd: left:178px;
	3rd: left:356px;
	4th: left:533px;
	5th: left:713px;

*/

#list.cool #row1 dl.temp1{
	left:178px;
}
#list.cool #row1 dl.temp2{
	left:533px;
}
#list.cool #row1 dl.temp3{
	left:713px;
}
#list.cool #row1 div.cut1{
	top:191px;
	left:-5px;
}
#list.cool #row1 div.cut2{
	left:351px;
}

#list.cool #row2 dl.temp1{
	left:0px;
}
#list.cool #row2 dl.temp2{
	left:178px;
}
#list.cool #row2 dl.temp3{
	left:356px;
}
#list.cool #row2 dl.temp4{
	left:713px;
}
#list.cool #row2 div.cut1{
	left:529px;
}

#list.cool #row3 dl.temp1{
	left:0px;
}
#list.cool #row3 dl.temp2{
	left:178px;
}
#list.cool #row3 dl.temp3{
	left:533px;
}
#list.cool #row3 dl.temp4{
	left:713px;
}
#list.cool #row3 div.cut1{
	left:351px;
}

#list.cool #row4 dl.temp1{
	left:0px;
}
#list.cool #row4 dl.temp2{
	left:178px;
}
#list.cool #row4 dl.temp3{
	left:356px;
}
#list.cool #row4 dl.temp4{
	left:713px;
}
#list.cool #row4 div.cut1{
	left:529px;
}

/*==============================================================
	6.	VIVID
===============================================================*/

/*
	cols position
	
	1st: left:0px;
	2nd: left:178px;
	3rd: left:356px;
	4th: left:533px;
	5th: left:713px;

*/

#list.vivid #row1 dl.temp1{
	left:178px;
}
#list.vivid #row1 dl.temp2{
	left:533px;
}
#list.vivid #row1 dl.temp3{
	left:713px;
}
#list.vivid #row1 div.cut1{
	top:191px;
	left:-5px;
}
#list.vivid #row1 div.cut2{
	left:351px;
}


#list.vivid #row2 dl.temp1{
	left:0px;
}
#list.vivid #row2 dl.temp2{
	left:356px;
}
#list.vivid #row2 dl.temp3{
	left:533px;
}
#list.vivid #row2 dl.temp4{
	left:713px;
}
#list.vivid #row2 div.cut1{
	left:173px;
}

#list.vivid #row3 dl.temp1{
	left:0px;
}
#list.vivid #row3 dl.temp2{
	left:178px;
}
#list.vivid #row3 dl.temp3{
	left:356px;
}
#list.vivid #row3 dl.temp4{
	left:713px;
}
#list.vivid #row3 div.cut1{
	left:529px;
}

#list.vivid #row4 dl.temp1{
	left:0px;
}
#list.vivid #row4 dl.temp2{
	left:356px;
}
#list.vivid #row4 dl.temp3{
	left:533px;
}
#list.vivid #row4 dl.temp4{
	left:713px;
}
#list.vivid #row4 div.cut1{
	left:173px;
}

/*==============================================================
	7.	NATURAL
===============================================================*/

/*
	cols position
	
	1st: left:0px;
	2nd: left:178px;
	3rd: left:356px;
	4th: left:533px;
	5th: left:713px;

*/

#list.natural #row1 dl.temp1{
	left:356px;
}
#list.natural #row1 dl.temp2{
	left:533px;
}
#list.natural #row1 dl.temp3{
	left:713px;
}
#list.natural #row1 div.cut1{
	top:191px;
	left:-5px;
}
#list.natural #row1 div.cut2{
	left:173px;
}

#list.natural #row2 dl.temp1{
	left:0px;
}
#list.natural #row2 dl.temp2{
	left:178px;
}
#list.natural #row2 dl.temp3{
	left:356px;
}
#list.natural #row2 dl.temp4{
	left:713px;
}
#list.natural #row2 div.cut1{
	left:529px;
}

#list.natural #row3 dl.temp1{
	left:0px;
}
#list.natural #row3 dl.temp2{
	left:356px;
}
#list.natural #row3 dl.temp3{
	left:533px;
}
#list.natural #row3 dl.temp4{
	left:713px;
}
#list.natural #row3 div.cut1{
	left:173px;
}

#list.natural #row4 dl.temp1{
	left:0px;
}
#list.natural #row4 dl.temp2{
	left:178px;
}
#list.natural #row4 dl.temp3{
	left:533px;
}
#list.natural #row4 dl.temp4{
	left:713px;
}
#list.natural #row4 div.cut1{
	left:351px;
}

/*==============================================================
	8.	ANIMAL
===============================================================*/

/*
	cols position
	
	1st: left:0px;
	2nd: left:178px;
	3rd: left:356px;
	4th: left:533px;
	5th: left:713px;

*/

#list.animal #row1 dl.temp1{
	left:178px;
}
#list.animal #row1 dl.temp2{
	left:356px;
}
#list.animal #row1 dl.temp3{
	left:533px;
}
#list.animal #row1 div.cut1{
	top:191px;
	left:-5px;
}
#list.animal #row1 div.cut2{
	left:707px;
}

#list.animal #row2 dl.temp1{
	left:0px;
}
#list.animal #row2 dl.temp2{
	left:356px;
}
#list.animal #row2 dl.temp3{
	left:533px;
}
#list.animal #row2 dl.temp4{
	left:713px;
}
#list.animal #row2 div.cut1{
	left:173px;
}

#list.animal #row3 dl.temp1{
	left:0px;
}
#list.animal #row3 dl.temp2{
	left:178px;
}
#list.animal #row3 dl.temp3{
	left:356px;
}
#list.animal #row3 dl.temp4{
	left:713px;
}
#list.animal #row3 div.cut1{
	left:529px;
}

#list.animal #row4 dl.temp1{
	left:0px;
}
#list.animal #row4 dl.temp2{
	left:356px;
}
#list.animal #row4 dl.temp3{
	left:533px;
}
#list.animal #row4 dl.temp4{
	left:713px;
}
#list.animal #row4 div.cut1{
	left:173px;
}

/*==============================================================
	9.	DELICIOUS
===============================================================*/

/*
	cols position
	
	1st: left:0px;
	2nd: left:178px;
	3rd: left:356px;
	4th: left:533px;
	5th: left:713px;

*/

#list.delicious #row1 dl.temp1{
	left:178px;
}
#list.delicious #row1 dl.temp2{
	left:533px;
}
#list.delicious #row1 dl.temp3{
	left:713px;
}
#list.delicious #row1 div.cut1{
	top:191px;
	left:-5px;
}
#list.delicious #row1 div.cut2{
	left:351px;
}

#list.delicious #row2 dl.temp1{
	left:0px;
}
#list.delicious #row2 dl.temp2{
	left:178px;
}
#list.delicious #row2 dl.temp3{
	left:356px;
}
#list.delicious #row2 dl.temp4{
	left:713px;
}
#list.delicious #row2 div.cut1{
	left:529px;
}

#list.delicious #row3 dl.temp1{
	left:0px;
}
#list.delicious #row3 dl.temp2{
	left:178px;
}
#list.delicious #row3 dl.temp3{
	left:533px;
}
#list.delicious #row3 dl.temp4{
	left:713px;
}
#list.delicious #row3 div.cut1{
	left:351px;
}

#list.delicious #row4 dl.temp1{
	left:178px;
}
#list.delicious #row4 dl.temp2{
	left:356px;
}
#list.delicious #row4 dl.temp3{
	left:533px;
}
#list.delicious #row4 dl.temp4{
	left:713px;
}
#list.delicious #row4 div.cut1{
	left:-5px;
}


/*==============================================================
	10.	List201
===============================================================*/

#list201{
	position:relative;
	width:100%;
	background:url(/images/list/bg_list.png) top left repeat-y;
}
#list201 div.list-bottom{
	width:100%;
	height:6px;
	background:url(/images/list/bg_list_bottom.png) bottom left no-repeat;
}
#list201 h2{
	/*position:relative;
	left:180px;*/
	width:930px;
	height:26px;
	padding-bottom:34px;
	background:url(/images/list/bg_h2_201.png) bottom left no-repeat #fff;
	line-height:0;
}
#list201 #templates{
/*	z-index:50;*/
	position:relative;
	width:920px;
/*	margin-top:-191px;*/
	margin-right:-14px;
	padding:19px 0 0 24px;
}
#list201 #templates div.row{
	clear:both;
	overflow:hidden;
	position:relative;
	width:940px;
	/*height:20em;*/
	height:auto;
	margin-right:-20px;
	margin-bottom:10px;
}
#list201 #templates dl.template{
	position:static;
	float:left;
	width:205px;
	min-height:260px;
	margin:0 20px 0 0;
	cursor:pointer;
}
#list201 #templates dl.template dt{
	padding-left:0;
	padding-bottom:2px;
	line-height:0;
}
#list201 #templates dl.template img{
	border:1px solid #fff;
}
#list201 #templates dl.template dd.name{
	padding-bottom:5px;
	font-weight:bold;
	font-size:77%;
	color:#4c4c4c;
	letter-spacing:0.05em;
}
#list201 #templates dl.template dd.name a:link,
#list201 #templates dl.template dd.name a:visited{
	color:#4c4c4c;
	text-decoration:none;	
}
#list201 #templates dl.template dd.comment p{
	width:205px;
	font-size:77%;
	line-height:1.45;
	color:#949494;
}
#list201 #templates dl.template.over img{
	border:1px solid #ccc;	
}
#list201 #templates dl.template.over dd.comment p{
	color:#4c4c4c;
}
#list201 #templates div.cut{
	position:absolute;
	top:0px;
	width:170px;
}