/* generals */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;outline:0;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;background-color:#F7F7F7;}

body {background-color:#F7F7F7; margin:0; padding:0px; color:#9F9FA0; font:10px LinotypeUnivers,Helvetica,Verdana,"Arial Black",sans-serif; line-height:15px}

:focus {outline:0;}
ol, ul {list-style:none;}

/* note text */ 
.note_title {font:16px LinotypeUnivers,Helvetica,Verdana,"Arial Black",sans-serif; line-height:20px; color:#000}
.note_title a{color:#000}
.note_body {font:12px LinotypeUnivers,Helvetica,Verdana,"Arial Black",sans-serif; line-height:20px; color:#777777}
.note_body a{text-decoration:underline; color:#777777}
.note_body a:hover{text-decoration:underline; color:#000}

.note_page {font:12px LinotypeUnivers,Helvetica,Verdana,"Arial Black",sans-serif; line-height:20px; color:#000}
.note_page a{font:12px LinotypeUnivers,Helvetica,Verdana,"Arial Black",sans-serif; line-height:20px; text-decoration:underline; color:#777777}
.note_page a:hover{font:12px LinotypeUnivers,Helvetica,Verdana,"Arial Black",sans-serif; line-height:20px; text-decoration:underline; color:#777777}

/* links */
a {color:#9F9FA0;text-decoration:none;}
a:hover, a:active{text-decoration:none; color:#000}


div#outer{
    height:720px;
    width:960px;
    position:absolute;
    top:0px;
    left:0px;
    text-align:left;
	background-color:#F7F7F7;
	
}

div#msg_area{
    height:160px;
    width:300px;
    position:absolute;
    top:20px;
    left:20px;
    text-align:left;
	background:url(../img/message_area.gif) no-repeat;
	color:#9F9FA0;
	font:12px LinotypeUnivers,Helvetica,Verdana,"Arial Black",sans-serif;
	text-decoration:none;
	padding-top:4px;

	
	
}

div#msg_area a{text-decoration:none}
div#msg_area a:hover, div#msg_area a:active{text-decoration:none; color:#000}

div#msg_padding{
    padding-top:px;
}

div#logo_area{
    height:68px;
    width:300px;
    position:absolute;
    top:180px;
    left:20px;
    text-align:left;
	
}

div#cts_area_1{
    height:472px;
    width:100px;
    position:absolute;
    top:248px;
    left:20px;
    text-align:left;
	
}

div#cts_area_2{
    height:270px;
    width:180px;
    position:absolute;
    top:248px;
    left:140px;
    text-align:left;
	
}

div#item_ol{

    width:450px;
    position:absolute;
    top:0px;
    left:390px;
    text-align:left;
	padding-top:248px;
	
}

div#item_img{


    width:570px;
	position:absolute;
    top:0px;
    left:0px;
    text-align:left;
	overflow:hidden;
}

div#error_msg{

    height:380px;
    width:570px;
	position:absolute;
    top:248px;
    left:0px;
    text-align:left;
	overflow: hidden;
}

div#item_credit{

    height:100px;
    width:570px;
	position:absolute;
    top:396px;
    left:0px;
    text-align:left;
	color:#000;
    background:url(../img/bg_credit.gif);
	padding-top: 4px;
	
}

div#about_email{

    height:96px;
    width:180px;
	position:absolute;
    top:4px;
    left:0;
    text-align:left;

}

div#about_info_e{

    height:96px;
    width:180px;
	position:absolute;
    top:4px;
    left:195px;
    text-align:left;

}

div#about_info_j{

    height:96px;
    width:180px;
	position:absolute;
    top:4px;
    left:390px;
    text-align:left;

}

.text_j{font:10px LinotypeUnivers,Helvetica,Verdana,"Arial Black",sans-serif; line-height:15px}

div#item_numb{

    height:224px;
    width:570px;
	position:absolute;
    top:496px;
    left:0px;
    text-align:left;
	
}

div#site_credit{

    height:120px;
    width:180px;
    text-align:left;
	padding-top:4px;
	
}

/* logo */

#logo_area a {float:left; height:68px}
#logo_area a.logo {float:left;width:300px; background:url(../img/logo.gif) no-repeat}
  
/* contents 1 */
#slide
{
  padding: 0;
  margin: 0;
  list-style: none;
  width: 100px;
  height: 472px;
  position: relative;
  overflow: hidden;
  font-family: verdana, sans-serif;
  font-size: 11px;
}
#slide li.sub
{
  float: left;
  height: 30px;
  line-height: 30px;
  width: 100px;
  text-indent: 20px;
  overflow: hidden;
  cursor: pointer;
  background: #ddd url(../img/cts_works.gif) no-repeat;
  
}

#slide li a.project, #slide li a.project_a
{
  float: left;
  height: 30px;
  width: 100px;
  text-indent: 20px;
  overflow: hidden;
  cursor: pointer;
  background:url(../img/cts_project.gif) no-repeat;
}

#slide li a.about, #slide li a.about_a
{
  float: left;
  height: 30px;
  width: 100px;
  text-indent: 20px;
  overflow: hidden;
  cursor: pointer;
  background:url(../img/cts_about.gif) no-repeat;
}

#slide li a.note, #slide li a.note_a
{
  float: left;
  height: 30px;
  width: 100px;
  text-indent: 20px;
  overflow: hidden;
  cursor: pointer;
  background:url(../img/cts_note.gif) no-repeat;
}


#slide li a.project:hover, #slide li a.project:active, #slide li a.about:hover, #slide li a.about:active, #slide li a.note:hover, #slide li a.note:active {background-position: 0 -32px;}

#slide li a.works_a, #slide li a.works_a, #slide li a.project_a, #slide li a.project_a, #slide li a.about_a, #slide li a.about_a, #slide li a.note_a, #slide li a.note_a{background-position: 0 -32px;}

#slide li a.new:hover, #slide li a.new:active, #slide li a.book:hover, #slide li a.book:active, #slide li a.graphic:hover, #slide li a.graphic:active {background-position: 20px -26px;}
#slide li a.new_a, #slide li a.book_a, #slide li a.graphic_a {background-position: 20px -26px;}


/* work button mouseover*/
#slide li.clicked
{
  color: #800;
  background: #ddd url(../img/cts_works.gif) no-repeat;
  background-position:0 0;
}

#slide li.highlight
{
  color: #c00;
  background: #ddd url(../img/cts_works.gif) no-repeat;
  background-position:0 -32px;
}

/* #slide li.sub div height = (maximum sub lines * sub line height) + top level link height(variable fY in jQuery) */

#slide li.sub div
{
  background: #F7F7F7;
  height: 82px; /* defaoult 84px = #slide li a.blank */
  width: 80px;
  padding: 0 20px;
  font-family: verdana, sans-serif;
  text-indent: 0;
  
}
#slide li div ul
{
  padding: 0;
  margin: 0;
  list-style: none;
}
#slide li div ul li
{
  float: left;
  height: 24px;
  width: 100%;
}
#slide li div ul li a.new
{
  padding: 0;
  margin: 0;
  text-decoration: none;
  background: #F7F7F7 url(../img/cts_new.gif) no-repeat;
  font-size: 10px;
  display: block;
  height: 24px;
  width: 100%;

}


#slide li div ul li a.book, #slide li div ul li a.book_a
{
  padding: 0;
  margin: 0;
  text-decoration: none;
  background: #F7F7F7 url(../img/cts_book.gif) no-repeat;
  font-size: 10px;
  display: block;
  height: 24px;
  width: 100%;
  
  

}

#slide li div ul li a.graphic
{
  padding: 0;
  margin: 0;
  text-decoration: none;
  background: #F7F7F7 url(../img/cts_graphic.gif) no-repeat;
  font-size: 10px;
  display: block;
  height: 24px;
  width: 100%;
  
  

}


#slide li div ul li a.new:hover, #slide li div ul li a.book:hover, #slide li div ul li a.graphic:hover
{
  background-position:0 -26px;
}

#slide li div ul li a.new:active, #slide li div ul li a.book:active, #slide li div ul li a.graphic:active
{
  background-position:0 -26px;
}

#slide li div ul li a.book_a
{
  background-position:0 -26px;
}

/* cts 2 */

#works_list
{
  padding: 0;
  margin: 0;
  list-style: none;
  width: 180px;
  height: 472px;
  position: relative;

}

#works_list li a {float:left; height:28px}

/* book */
#works_list li a.graindaile{width:180px;background:url(../img/w_graindaile.gif) no-repeat;}
#works_list li a.imakoko{width:180px;background:url(../img/w_imakoko.gif) no-repeat;}
#works_list li a.studyingreen{width:180px;background:url(../img/w_studyingreen.gif) no-repeat;}
#works_list li a.ezzel{width:180px;background:url(../img/w_ezzel.gif) no-repeat;}
#works_list li a.soratoki{width:180px;background:url(../img/w_soratoki.gif) no-repeat;}
#works_list li a.kageoinomachi{width:180px;background:url(../img/w_kageoinomachi.gif) no-repeat;}
#works_list li a.lamour{width:180px;background:url(../img/w_lamour.gif) no-repeat;}
#works_list li a.ecologyandart{width:180px; height:44px; background:url(../img/w_ecologyandart.gif) no-repeat}
#works_list li a.jspe2010{width:180px;background:url(../img/w_jspe2010.gif) no-repeat;}
#works_list li a.jspe2009{width:180px;background:url(../img/w_jspe2009.gif) no-repeat;}
#works_list li a.jspe2008{width:180px;background:url(../img/w_jspe2008.gif) no-repeat;}
#works_list li a.subject0607{width:180px;background:url(../img/w_subject0607.gif) no-repeat;}
#works_list li a.blank{width:180px; height:8px}
#works_list li a.archive{width:180px;background:url(../img/w_archive.gif) no-repeat;}
/* new */
#works_list li a.nft{width:180px;background:url(../img/w_nebularforthirteen.gif) no-repeat;}
#works_list li a.africanmode{width:180px;background:url(../img/w_africanmode.gif) no-repeat;}
#works_list li a.dianlogue{width:180px;background:url(../img/w_dianlogue.gif) no-repeat;}
#works_list li a.ukabe{width:180px;background:url(../img/w_ukabe.gif) no-repeat;}
#works_list li a.tsukai{width:180px;background:url(../img/w_tsukai.gif) no-repeat;}
/* graphic */
#works_list li a.markborthwick{width:180px;background:url(../img/w_markborthwick.gif) no-repeat;}
#works_list li a.utsuroi{width:180px;background:url(../img/w_utsuroi.gif) no-repeat;}
#works_list li a.nikiclub2009{width:180px;background:url(../img/w_nikiclub2009.gif) no-repeat;}
#works_list li a.green{width:180px;background:url(../img/w_green.gif) no-repeat;}
#works_list li a.newgardens{width:180px;background:url(../img/w_newgardens.gif) no-repeat;}
#works_list li a.foas{width:180px;background:url(../img/w_foas.gif) no-repeat;}
#works_list li a.lfaty{width:180px;background:url(../img/w_lfaty.gif) no-repeat;}
#works_list li a.hidakariekoex{width:180px;background:url(../img/w_hidakariekoex.gif) no-repeat;}
#works_list li a.nine{width:180px;background:url(../img/w_9nine.gif) no-repeat;}
#works_list li a.aricaflier{width:180px;background:url(../img/w_aricaflier.gif) no-repeat;}
/* project */
#works_list li a.transforming09{width:180px;background:url(../img/p_transforming09.gif) no-repeat;}
#works_list li a.transforming09_a{width:180px;background:url(../img/p_transforming09.gif) no-repeat; background-position: 0 -30px}
#works_list li a.audreyworkshop{width:180px;background:url(../img/p_audreyworkshop.gif) no-repeat;}
#works_list li a.audreyworkshop_a{width:180px;background:url(../img/p_audreyworkshop.gif) no-repeat; background-position: 0 -30px}
#works_list li a.audreydesailes{width:180px;background:url(../img/p_audreydesailes.gif) no-repeat;}
#works_list li a.audreydesailes_a{width:180px;background:url(../img/p_audreydesailes.gif) no-repeat; background-position: 0 -30px}
#works_list li a.fishmouths{width:180px;background:url(../img/p_fishmouths.gif) no-repeat;}
#works_list li a.fishmouths_a{width:180px;background:url(../img/p_fishmouths.gif) no-repeat; background-position: 0 -30px}
#works_list li a.twmf{width:180px;background:url(../img/p_twmf.gif) no-repeat;}
#works_list li a.twmf_a{width:180px;background:url(../img/p_twmf.gif) no-repeat; background-position: 0 -30px}
#works_list li a.osadahidaka{width:180px;background:url(../img/p_osadahidaka.gif) no-repeat;}
#works_list li a.osadahidaka_a{width:180px;background:url(../img/p_osadahidaka.gif) no-repeat; background-position: 0 -30px}



#works_list li a.graindaile:hover, #works_list li a.graindaile:active, #works_list li a.imakoko:hover, #works_list li a.imakoko:active, #works_list li a.studyingreen:hover, #works_list li a.studyingreen:active, #works_list li a.ezzel:hover, #works_list li a.ezzel:active, #works_list li a.soratoki:hover, #works_list li a.soratoki:active, #works_list li a.kageoinomachi:hover, #works_list li a.kageoinomachi:active, #works_list li a.lamour:hover, #works_list li a.lamour:active, #works_list li a.jspe2010:hover, #works_list li a.jspe2010:active, #works_list li a.jspe2009:hover, #works_list li a.jspe2009:active, #works_list li a.jspe2008:hover, #works_list li a.jspe2008:active, #works_list li a.subject0607:hover, #works_list li a.subject0607:active, #works_list li a.nft:hover, #works_list li a.nft:active, #works_list li a.africanmode:hover, #works_list li a.africanmode:active, #works_list li a.dianlogue:hover, #works_list li a.dianlogue:active, #works_list li a.ukabe:hover, #works_list li a.ukabe:active, #works_list li a.tsukai:hover, #works_list li a.tsukai:active, #works_list li a.markborthwick:hover, #works_list li a.markborthwick:active, #works_list li a.utsuroi:hover, #works_list li a.utsuroi:active, #works_list li a.nikiclub2009:hover, #works_list li a.nikiclub2009:active, #works_list li a.green:hover, #works_list li a.green:active, #works_list li a.newgardens:hover, #works_list li a.newgardens:active, #works_list li a.foas:hover, #works_list li a.foas:active, #works_list li a.hidakariekoex:hover, #works_list li a.hidakariekoex:active, #works_list li a.nine:hover, #works_list li a.nine:active, #works_list li a.aricaflier:hover, #works_list li a.aricaflier:active, #works_list li a.lfaty:hover, #works_list li a.lfaty:active, #works_list li a.transforming09:hover, #works_list li a.transforming09:active, #works_list li a.audreyworkshop:hover, #works_list li a.audreyworkshop:active, #works_list li a.audreydesailes:hover, #works_list li a.audreydesailes:active, #works_list li a.fishmouths:hover, #works_list li a.fishmouths:active, #works_list li a.twmf:hover, #works_list li a.twmf:active, #works_list li a.osadahidaka:hover, #works_list li a.osadahidaka:active, #works_list li a.archive:hover, #works_list li a.archive:active{width:180px;background-position: 0 -30px}



#works_list li a.ecologyandart:hover, #works_list li a.ecologyandart:active{background-position: 0 -46px}


/* archive */
#works_list li a.b2009{width:180px;background:url(../img/a_2009.gif) no-repeat;}
#works_list li a.b2009_a{width:180px;background:url(../img/a_2009.gif) no-repeat; background-position: 0 -30px}
#works_list li a.b2008{width:180px;background:url(../img/a_2008.gif) no-repeat;}
#works_list li a.b2008_a{width:180px;background:url(../img/a_2008.gif) no-repeat; background-position: 0 -30px}
#works_list li a.b2007{width:180px;background:url(../img/a_2007.gif) no-repeat;}
#works_list li a.b2007_a{width:180px;background:url(../img/a_2007.gif) no-repeat; background-position: 0 -30px}
#works_list li a.b2006{width:180px;background:url(../img/a_2006.gif) no-repeat;}
#works_list li a.b2006_a{width:180px;background:url(../img/a_2006.gif) no-repeat; background-position: 0 -30px}
#works_list li a.back{width:180px;background:url(../img/w_back.gif) no-repeat;}

#works_list li a.b2009:hover, #works_list li a.b2009:active, #works_list li a.b2008:hover, #works_list li a.b2008:active, #works_list li a.b2007:hover, #works_list li a.b2007:active, #works_list li a.b2006:hover, #works_list li a.b2006:active, #works_list li a.back:hover, #works_list li a.back:active{width:180px;background-position: 0 -30px}


/* img */

#item_img a
{
  text-decoration: none;
  display: block;
  width: 570px;
  height: 380px;
  position: absolute;
  left: 570px;
}
#item_img a img
{
  display: block;
  border: 0;
}


/* numb : buttons=item_numb*/ 

#item_numb div
{
  height: 34px;
  float: left;
  overflow: hidden;
  position:relative;
  top:1px;
  left:0;
}

#item_numb div a
{
  display: block;
  height: 34px;
  color: #16a;
  text-align: center;
  cursor: pointer;
  background-position:0 0;
}

#item_numb div a.b1:hover, #item_numb div a.b1:active, #item_numb div a.b2:hover, #item_numb div a.b2:active, #item_numb div a.b3:hover, #item_numb div a.b3:active, #item_numb div a.b4:hover, #item_numb div a.b4:active, #item_numb div a.b5:hover, #item_numb div a.b5:active{background-position:0 -36px}

#item_numb div a.b1{width:18px;background:url(../img/numb_1.gif) no-repeat}
#item_numb div a.b2{width:31px;background:url(../img/numb_2.gif) no-repeat}
#item_numb div a.b3{width:28px;background:url(../img/numb_3.gif) no-repeat}
#item_numb div a.b4{width:28px;background:url(../img/numb_4.gif) no-repeat}
#item_numb div a.b5{width:28px;background:url(../img/numb_5.gif) no-repeat}


