@charset "UTF-8";
@import "base.css";


/*=======================TOC=======================*/
/*                                                 */
/*                 01  Base                        */
/*                 02  Container                   */
/*                 03  Header                      */
/*                 04  Description                 */
/*                 05  Footer                      */
/*                 06  Contents                    */
/*                 07  Index                       */
/*                 08  Outline                     */
/*                 09  Artists                     */
/*                 10  Collection                  */
/*                 11  Events                      */
/*                                                 */
/*=======================TOC-END===================*/


/*==================フォントサイズ換算=================*/
/*                                                 */
/*                   10px      77%                 */
/*                   11px      85%                 */
/*                   12px      93%                 */
/*                   14px     108%                 */
/*                   16px     124%                 */
/*                                                 */
/*=================フォントサイズ換算-END==============*/



/*---------- 01  Base -----------*/

/*-- 冒頭の @import で外部CSSを読み込み --*/



/*---------- 02  Container -----------*/

body {
  background: #000 url(../images/body.jpg) top repeat-x;
  }

#wrapper {
  width: 800px;
  margin: 0 auto;
  background: #fff url(../images/wrapper.jpg) 0 0 no-repeat;
  text-align: left;
  border-bottom: 2px solid #999;
  font-size:  100%;
  }

#main {
  width: 620px;
  float: right;
  margin: 0;
  padding: 0;
  color: #000;
  }

#content {
  clear: both;
  padding: 20px 20px 20px 0;
  line-height: 1.6;
}


/*---------- 03  Header -----------*/

h1 {
  width: 130px;
  height: 600px;
  float: left;
  text-indent: -9999px;
  background: url(../images/h1.jpg) 0 25px no-repeat;
}


ul#nav {
  margin: 0;
  padding: 0;
  width: 350px;
  height: 25px;
  float: right;
}
ul#nav li {
  list-style: none;
  margin: 0;
  padding: 0;
  height: 25px;
  float: left;
  text-indent: -9999px;
}
ul#nav li a {
  display: block;
  height: 25px;
}
ul#nav li#n01 a {
  width: 62px;
  background: url(../images/nav.jpg) 0 0 no-repeat;
}
ul#nav li#n02 a {
  width: 79px;
  background: url(../images/nav.jpg) -62px 0 no-repeat;
}
ul#nav li#n03 a {
  width: 52px;
  background: url(../images/nav.jpg) -141px 0 no-repeat;
}
ul#nav li#n04 a {
  width: 91px;
  background: url(../images/nav.jpg) -193px 0 no-repeat;
}
ul#nav li#n05 a {
  width: 66px;
  background: url(../images/nav.jpg) -284px 0 no-repeat;
}
ul#nav li#n01 a:hover { background: url(../images/nav.jpg) 0 -25px no-repeat; }
ul#nav li#n02 a:hover { background: url(../images/nav.jpg) -62px -25px no-repeat; }
ul#nav li#n03 a:hover { background: url(../images/nav.jpg) -141px -25px no-repeat; }
ul#nav li#n04 a:hover { background: url(../images/nav.jpg) -193px -25px no-repeat; }
ul#nav li#n05 a:hover { background: url(../images/nav.jpg) -284px -25px no-repeat; }



/*----------04  Description -----------*/

#description { height: 175px; }

#description h2 {
  margin: 0;
  padding: 0;
  width: 230px;
  float: right;
  text-indent: -9999px;
  height: 78px;
  background: url(../images/h2-description.jpg) 0 0 no-repeat;
}
#description dl {
  clear: both;
  margin: 0;
  padding: 0;
  width: 230px;
  height: 54px;
  float: right;
}
#description dt {
  margin: 0;
  padding: 0;
  height: 30px;
  text-indent: -9999px;
  background: url(../images/description-dl.jpg) 0 0 no-repeat;
}
#description dd {
  margin: 0;
  padding: 0;
  height: 24px;
  text-indent: -9999px;
  background: url(../images/description-dl.jpg) 0 -30px no-repeat;
}

#description p {
  clear: both;
  margin: 0;
  padding: 0;
  width: 230px;
  float: right;
  text-indent: -9999px;
}
#description p.location {
  height: 23px;
  background: url(../images/description-p.jpg) 0 0 no-repeat;
}
#description p.date {
  height: 19px;
  background: url(../images/description-p.jpg) 0 -23px no-repeat;
}



/*---------- 05  Footer -----------*/

#footer {
  clear: both;
  text-align: center;
  padding: 20px 0;
  color: #f3f3f3;
  font-size:  100%;
}

#footer a {
  color: #fff;
}



/*---------- 06  Contents -----------*/

a {
  outline: none;
  color: #044F99;
  text-decoration: none;
  }
a:hover { text-decoration: underline; }

a.external:after {
  content: url(../images/external.jpg);
  vertical-align: middle;
  margin: 0 3px;
}

#content h2 {
  margin: 0 0 20px 0;
  padding: 0;
  height: 38px;
  border-bottom: 2px solid #000;
  text-indent: -9999px;
}

.section { padding: 10px 0 20px 0; }

h3 {
  font-weight: bold;
  font-size: 108%;
  line-height: 1.0;
  background: #e3e3e3;
  border-bottom: 1px solid #d2d2d2;
  margin: 0 0 10px 0;
  padding: 4px 6px;
}
h4 {
  font-weight: bold;
  font-size: 108%;
  }

.notes {
  font-size: 124%;
  font-weight: bold;
  color: #ed1c24;
}


/*---------- 07  Index -----------*/

.index #wrapper {
  background: #000 url(../images/wrapper_index.jpg) 0 0 no-repeat;
  border-bottom: 1px solid #131313;
  }
.index #main { color: #fff; }

.index #content {
  width: 380px;
  padding-right: 0;
  float: right;
}

.index h1 { background: url(../images/h1_index.jpg) 0 25px no-repeat; }

.index #description { height: 575px; }
.index #description h2 {
  width: 400px;
  height: 140px;
  background: url(../images/h2-description_index.jpg) 0 0 no-repeat;
}
.index #description dl {
  width: 400px;
  height: 300px;
}
.index #description dt {
  height: 250px;
  background: url(../images/description-dl_index.jpg) 0 180px no-repeat;
}
.index #description dd {
  height: 50px;
  background: url(../images/description-dl_index.jpg) 0 -70px no-repeat;
}

.index #description p {
  width: 400px;
}
.index #description p.location {
  height: 100px;
  background: url(../images/description-p_index.jpg) 0 50px no-repeat;
}
.index #description p.date {
  height: 35px;
  background: url(../images/description-p_index.jpg) 0 -50px no-repeat;
}

.index .enter {
  font-weight: bold;
  text-align: right;
}
.index .raquo {
  font-size: 124%;
}
.index .enter a {
  color: #fff;
  text-decoration: underline;
}

  

/*---------- 08  Outline -----------*/

.outline #content h2 { background: url(../images/h2_outline.jpg) 0 0 no-repeat; }

.outline #content dl { margin-left: 0; }

.outline #content dt {
  width: 6em;
  float: left;
  clear: both;
}
.outline #content dd {
  margin-left: 6em;
}
.outline #content dd ul {
  margin: 0;
  padding: 0;
}
.outline #content dd li {
  list-style: none;
  float: left;
  display: inline;
  margin-right: 1em;
}


/*---------- 09  Artists -----------*/

.artists #content h2 { background: url(../images/h2_artists.jpg) 0 0 no-repeat; }

.artists #content .notes {
  color: #444;
  font-size: 93%;
  font-weight: normal;
  margin-bottom: 1.5em;
}

.artists #content .role { padding-left: 10px; }
  

.artists #artist ul.ui-tabs-nav {
  width: 120px;
  margin: 0;
  padding: 0;
  float: left;
}
.artists #artist ul.ui-tabs-nav li {
  list-style: none;
  font-weight: bold;
  line-height: 25px;
  height: 25px;
  margin: 0 20px 0 0;
  padding: 0 0 0 10px;
  border-bottom: 1px solid #e3e3e3;
}

.artists #artist div.ui-tabs-panel {
  width: 470px;
  padding-bottom: 20px;
  float: right;
}

.artists #artist div.ui-tabs-panel dl {
  margin: 1em 1em 1em 0;
  clear: both;
}

.artists #artist div.ui-tabs-panel dl:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	}
.artists #artist div.ui-tabs-panel dl { display: inline-block; }
/* Hides from IE-mac \*/
* html .artists #artist div.ui-tabs-panel dl { height: 1%; }
.artists #artist div.ui-tabs-panel dl { display: block; }
/* End hide from IE-mac */


.artists #artist div.ui-tabs-panel dt {
  width: 4em;
  float: left;
}
.artists #artist div.ui-tabs-panel dd { margin-left: 4em; }

.artists .works {  padding: 10px 0 20px 0; }

.artists .works p {
  margin: 0 10px 5px 0;
  padding: 0;
}
.artists .works p img { display: block; }

.artists .works .present {
  float: left;
  margin-right: 10px;
}
.artists .works .archive {  float: left; }
.artists .works .archive .caption {  font-size: 77%; }


/*---------- 10  Collection -----------*/

.collection #content h2 { background: url(../images/h2_collection.jpg) 0 0 no-repeat; }

.collection #archive ul,
.collection #archive li {
  margin: 0;
  padding: 0;
  list-style: none;
}
.collection #archive li {
  float: left;
  margin: 0 4px 0 0;
}
.collection #archive li img {
  display: block;
}
.collection #archive li a {
  border: 2px solid #fff;
  display: block;
}
.collection #archive li a:hover {
  border: 2px solid #044F99;
}

.collection #archive div.ui-tabs-panel {
  height: 450px;
  margin-top: 20px;
}



/*---------- 11  Events -----------*/

.events #content h2 { background: url(../images/h2_events.jpg) 0 0 no-repeat; }

.events #content dt {
  width: 3em;
  float: left;
  clear: both;
}
.events #content dd {
  margin-left: 3em;
}
.events #content .symposium dt {
  width: 5em;
  float: left;
  clear: both;
}
.events #content .symposium dd {
  margin-left: 5em;
}
.events #content dd ul {
  margin: 0;
  padding: 0;
}
.events #content dd li {
  list-style: none;
  float: left;
  display: inline;
  margin-right: 1em;
}


/*---------- 33  Error Page -----------*/

.e404 #content h2 { background: url(../images/h2_404.jpg) 0 0 no-repeat; }
.e403 #content h2 { background: url(../images/h2_403.jpg) 0 0 no-repeat; }




/*---------- 55  Tabs -----------*/


.ui-tabs { zoom: 1; }
.ui-tabs .ui-tabs-nav li a,
.ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; }

 /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */

.ui-tabs .ui-tabs-panel { display: block; }
.ui-tabs .ui-tabs-hide { display: none !important; }