/*-----------------------------
      Main image for toppage
-------------------------------*/
div.mainImageArea{
	width: 758px;
	padding-top: 2px;
	margin: 0;
	background-color: #999;
}



/*-----------------------------
      Category
-------------------------------*/

div#workCategory{
	width: 495px;
	margin: 0;
	padding: 0 0 30px 0;
}
div#workCategory div.box1,
div#workCategory div.box2{
	width: 495px;
	padding-bottom: 5px;
	margin: 0 0 10px 0;
	background-position: left bottom;
	background-repeat:no-repeat;
}
div#workCategory div.box1{
	background-image:url("../img/top/box_bg1.gif");
}
div#workCategory div.box2{
	background-image:url("../img/top/box_bg2.gif");
}

/* (Clearfix hack) */
div#workCategory div.box1:after,
div#workCategory div.box2:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
div#workCategory div.box1,
div#workCategory div.box2 {
    display: inline-table;
    min-height: 1%;
}
/* Hides from IE-mac \*/
* html div#workCategory div.box1,
* html div#workCategory div.box2 {height: 1%;}
div#workCategory div.box1,
div#workCategory div.box2{display: block;}
/* End hide from IE-mac */


div#workCategory div.box1 div.left,
div#workCategory div.box2 div.left{
	width: 245px;
	float: left;
	background-color:#999;
	color: #fff;
}
div#workCategory div.box1 div.right,
div#workCategory div.box2 div.right{
	width: 245px;
	float: right;
	background-color:#999;
	color: #fff;
}

div#workCategory h1{
	font-size: 82%;
	margin: 0 0 5px 0;
}
div#workCategory h1 a{
	display: block;
	width: 245px;
	background-repeat:no-repeat;
	background-position: 0 0;
	text-indent:-5000px;
}

a#headingGraphic{
	height: 79px;
	background-image: url("../img/top/hl_graphic.jpg");
}
a#headingWeb{
	height: 79px;
	background-image: url("../img/top/hl_web.jpg");
}
a#headingIllust{
	height: 85px;
	background-image: url("../img/top/hl_illust.jpg");
}
a#headingOther{
	height: 85px;
	background-image: url("../img/top/hl_other.jpg");
}


div#workCategory p.caption{
	padding: 0 5px;
	font-size: 75%;
}



/*-----------------------------
      Topics
-------------------------------*/

div#topics{
	position:relative;
	width: 495px;
	margin: 0 0 30px 0;
	padding: 55px 0 0 0;
	background:url("../img/double_line01.gif") 0 0 repeat-x;
}

/*Heading space*/
dl.zakki{
	width: 470px;
	margin: 0 0 0 25px;
	font-size: 75%;
	line-height: 120%;
	font-weight:bold;
}
dl.zakki dt{
	display: block;
	width: 9em;
	margin: 0 -9em 0 0;
	padding-top: 1px;
	float: left;
	clear:both;
	color:#fff;
	background-color:#933;
}
dl.zakki dd{
	padding: 0 0 0 10em;
	margin: 0;
	color: #933;
}
dl.zakki dt span{
	padding: 0 10px;
}

/* (Clearfix hack) */
dl.zakki:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
dl.zakki {
    display: inline-table;
    min-height: 1%;
}
/* Hides from IE-mac \*/
* html dl.zakki {height: 1%;}
dl.zakki {display: block;}
/* End hide from IE-mac */



/* Illust */
div#topics div.silhouette{
	position: absolute;
	width:79px;
	height: 98px;
	z-index:5;
	top: -57px;
	left: -45px;
}



/* Topics entry */
div#entryBlock{
	position: relative;
	width: 495px;
	padding: 10px 0 5px 0;
	background-color:#434343;
	background-color:#434343;
	color: #fff;
}
div#entryBlock div.container{
	width: 475px;
	margin: 0 0 0 10px;
}

/* subject */
div#entryBlock h2{
	margin: 0 0 0.8em 0;
	font-size: 85%;
	font-weight: bold;
	line-height: 130%;
}
div#entryBlock h3{
	margin: 0 0 0.8em 0;
	font-size: 85%;
	font-weight: bold;
	line-height: 130%;
}

/* picture */
div#entryBlock div.pictBlock{
	/*width: 153px;*/
	margin: 0 5px 5px 0;
	float: left;
}
div#entryBlock div.pictBlock img{
	border: 1px #000 solid;
}

div#entryBlock p{
	font-size: 82%;
	color: #ddd;
}
div#entryBlock p.author{
	font-size: 75%;
	text-align:right;
}
div#entryBlock p.date{
	width: 475px;
	margin: 0.8em 0 0 0;
	clear: both;
	text-align:right;
	font-size: 70%;
}
div#entryBlock span.red{color: #f00;}
div#entryBlock span.blue{color: #0cf;}
div#entryBlock span.green{color: #9f0;}



div#entryBlock a:link,
div#entryBlock a:visited{
	color:#0cf;
}
div#entryBlock a:hover{
	color: #f60;
}


/* navigation */
div#topicsNav{
	width:495px;
	background-color:#ddd;
}
div#nextBtn,
div#prevBtn{
	width: 42px;
	height: 13px;
	float: right;
}
div#firstBtn{
	width: 48px;
	height: 13px;
	float: right;
}

div#nextBtn{
	margin: 0 0 0 15px;
}
div#prevBtn{
	margin: 0 0 0 5px;
}
div#topicsNav a{
	display: block;
	width: 42px;
	height: 13px;
	background-repeat:no-repeat;
	overflow:hidden;
	text-indent:-5000px;
}
div#topicsNav div#firstBtn a{
	width: 48px;
}
/* Style for macIE \*//*/
div#topicsNav a {
  overflow: auto;
}
/* End style for macIE */

div#topicsNav a:link,
div#topicsNav a:visited{
	background-position: 0 0;
}
div#topicsNav a:hover{
	background-position: 0 -13px;
}
div#nextBtn a{background-image: url("../topics/img/btn_next.gif");}
div#prevBtn a{background-image: url("../topics/img/btn_prev.gif");}
div#firstBtn a{background-image: url("../topics/img/btn_top.gif");}




/*-----------------------------
      Office address
-------------------------------*/
div#officeInfo{
	width: 495px;
}
div#officeInfo div.left{
	width:60px;
	margin: 0 5px 0 0;
	float: left;
}
div#officeInfo div.right{
	width: 425px;
	padding: 5px 0 0 0;
	float: left;
}
div#officeInfo address{
	color: #666;
	font-style:normal;
	font-size: 69%;
	line-height:120%;
}
div#officeInfo address span{
	padding-left: 7px;
}