@charset "shift_jis";

/* =======================================

	Joy Index CSS

 -----------------------------------------
	INDEX
 -----------------------------------------
 	1.Common Setting
		1-1.Title
		1-2.Column List
		1-3.News List
		1-4.Column Table
	
	2.Art News
	
	3.Art Column
	
	4.Blog
		4-1.New Entry

========================================== */

/* 1.Common Setting
========================================== */
#contents01 {
	float: left;
	display: inline;
	width: 595px;
}

#contents02 {
	float: right;
	display: inline;
	width: 290px;
}

	/* 1-1.Title
	---------------------------------------- */
	#main h2 {
	}
	
	#main p.more {
		position: relative;
		top: -12px;
		margin: -14px 0 10px auto;
		width: 40px;
	}
	
	#main p.more a {
		display: block;
		height: 14px;
		background: url(../../common/images/btn_more.gif) no-repeat;
		text-indent: -9999px;
		overflow: hidden;
	}
	
	#main p.more a:hover {
		background-position: 0 -14px;
	}
	
	/* 1-2.Column List
	---------------------------------------- */
	#contents01 ul li.column-list {
		margin: 0 0 10px;
		padding: 0 0 10px;
		height: 100%;
		border-bottom: 1px solid #CCCCCC;
	}
	
	#contents01 ul li.column-list:after { /* for Modern Browser */
		content: "."; display: block; clear: both; height: 0px; visibility: hidden;
	}
	
	#contents01 ul li.column-list h3 {
		float: left;
		display: inline;
		width: 94px;
	}
	
	#contents01 ul li.column-list p.date {
		margin: 0 0 10px 102px;
		padding: 2px 0;
		border-bottom: 1px solid #CCCCCC;
		font-weight: bold;
		font-size: 77%;
		line-height: 1.2;
		text-align: right;
	}
	
	#contents01 ul li.column-list .image {
		float: left;
		display: inline;
		padding: 5px;
		width: 280px;
		background: #CCCCCC;
	}
	
	#contents01 ul li.column-list .summary {
		float: right;
		display: inline;
		width: 286px;
		background: url(../../common/images/ico_arrow01o.gif) no-repeat 0 4px;
	}
	
	#contents01 ul li.column-list .summary h4 {
		margin: 0 0 7px;
		padding: 0 0 7px;
		height: auto !important;
		height: 3em;
		min-height: 3em;
		background: url(../../common/images/line_dotted02_gray.gif) repeat-x 0 100%;
		font-weight: bold;
		font-size: 92.4%;
		line-height: 1.5;
	}
	
	#contents01 ul li.column-list .summary h4 a {
		display: block;
		padding: 0 0 0 15px;
		background: url(../../common/images/ico_arrow01.gif) no-repeat 0 4px;
	}
	
	#contents01 ul li.column-list .summary h4 a:hover {
		background: none;
	}
	
	#contents01 ul li.column-list .summary p {
		padding: 0 0 0 15px;
		font-size: 92.4%;
		line-height: 1.5;
	}
	
	/* 1-3.News List
	---------------------------------------- */
	#contents01 .news-list {
		position: relative;
		margin: 0 0 0 -15px;
		width: 610px;
	}
	
	#contents01 .news-list:after { /* for Modern Browser */
		content: "."; display: block; clear: both; height: 0px; visibility: hidden;
	}
	
	#contents01 .news-list .unit {
		position: relative;
		top: -10px;
		float: left;
		display: inline;
		margin: 10px 0 0 15px;
		padding: 10px 0 0;
		width: 290px;
		background: url(../../common/images/ico_arrow01o.gif) no-repeat 94px 13px;
		border-top: 1px solid #CCCCCC;
	}
	
	#contents01 .news-list.first .unit {
		margin-top: 0;
		border: none;
	}
	
	#contents01 .news-list .unit:after { /* for Modern Browser */
		content: "."; display: block; clear: both; height: 0px; visibility: hidden;
	}
	
	#contents01 .news-list .unit .image {
		float: left;
		display: inline;
		padding: 5px;
		width: 63px;
		background: #CCCCCC;
	}
	
	#contents01 .news-list .unit .summary {
		float: right;
		display: inline;
		padding: 0 0 0 10px;
		width: 196px;
		border-left: 1px solid #CCCCCC;
	}
	
	#contents01 .news-list .unit .summary h3 {
		margin: 0 0 6px;
		padding: 0 0 7px;
		background: url(../../common/images/line_dotted02_gray.gif) repeat-x 0 100%;
		font-weight: bold;
		font-size: 92.4%;
		line-height: 1.335;
	}
	
	#contents01 .news-list .unit .summary h3 a {
		display: block;
		padding: 0 0 0 17px;
		background: url(../../common/images/ico_arrow01.gif) no-repeat 0 3px;
	}
	
	#contents01 .news-list .unit .summary h3 a:hover {
		background: none;
	}
	
	#contents01 .news-list .unit .summary p {
		font-size: 92.4%;
		line-height: 1.335;
	}
	
	/* 1-4.Column Table
	---------------------------------------- */
	#contents01 table.column-table {
	}
	
	#contents01 table.column-table tr {
	}
	
	#contents01 table.column-table tr th,
	#contents01 table.column-table tr td {
		padding: 8px 10px 7px 0;
		background: url(../../common/images/line_dotted02_gray.gif) repeat-x;
		font-size: 92.4%;
		line-height: 1.335;
	}
	
	#contents01 table.column-table tr.first th,
	#contents01 table.column-table tr.first td {
		padding-top: 3px;
		background: none;
	}
	
	#contents01 table.column-table tr th {
		font-weight: bold;
		font-size: 77%;
		line-height: 1.401;
		white-space: nowrap;
	}
	
	#contents01 table.column-table tr th a {
		position: relative;
		top: 1px;
		padding: 0 0 0 18px;
		background: url(../../common/images/ico_arrow01.gif) no-repeat 0 1px;
	}
	
	#contents01 table.column-table tr th a:hover {
		background-image: url(../../common/images/ico_arrow01o.gif);
	}
	
	#contents01 table.column-table tr td {
		padding-left: 20px;
		width: 100%;
	}


/* 2.Art News
========================================== */
#contents01 #art-news {
	margin: 0 0 20px;
	padding: 0 0 5px;
	border-bottom: 1px solid #CCC;
}

#contents01 #art-news table.column-table {
	border-top: 1px solid #CCC;
}

#contents01 #art-news table.column-table tr.first th,
#contents01 #art-news table.column-table tr.first td {
	padding-top: 6px;
}

#contents01 #art-news table.column-table tr th,
#contents01 #art-news table.column-table tr td {
	padding-top: 1px;
	padding-bottom: 1px;
	background: none;
	font-weight: bold;
}


/* 3.Art Column
========================================== */
#contents01 #art-column {
	border-bottom: 1px solid #CCC;
}


/* 4.Blog
========================================== */
#contents02 #art-blog .art-blog-sec {
	margin: 0 0 20px;
}

#contents02 #art-blog .art-blog-sec p.image {
	margin: 0 0 10px;
	padding: 5px;
	background: #CCCCCC;
}

#contents02 #art-blog .art-blog-sec p.banner {
	margin: 0 0 10px;
}

	/* 4-1.New Entry
	---------------------------------------- */
	#contents02 #art-blog .art-blog-sec .new-entry {
	}
	
	#contents02 #art-blog .art-blog-sec .new-entry p.new-entry-ico {
		float: left;
		display: inline;
	}
	
	#contents02 #art-blog .art-blog-sec .new-entry p.date {
		margin: 0 0 7px 83px;
		padding: 2px 0;
		border-bottom: 1px solid #CCC;
		font-weight: bold;
		font-size: 77%;
		line-height: 1.2;
		text-align: right;
	}
	
	#contents02 #art-blog .art-blog-sec .new-entry h4 {
		margin: 0 0 7px;
		background: url(../../common/images/ico_arrow01o.gif) no-repeat 0 4px;
		font-weight: bold;
		font-size: 92.4%;
		line-height: 1.5;
	}
	
	#contents02 #art-blog .art-blog-sec .new-entry h4 a {
		display: block;
		padding: 0 0 0 19px;
		background: url(../../common/images/ico_arrow01.gif) no-repeat 0 4px;
	}
	
	#contents02 #art-blog .art-blog-sec .new-entry h4 a:hover {
		background: none;
	}
	
	#contents02 #art-blog .art-blog-sec .new-entry p.summary {
		padding: 10px 0 9px 19px;
		border-bottom: 1px solid #CCC;
		background: url(../../common/images/line_dotted02_gray.gif) repeat-x;
		font-size: 92.4%;
		line-height: 1.167;
	}