@charset "UTF-8";
@import "reset-min.css";
@import "fonts-min.css";

/*-----------------------------------------------------------------------------
Primary Style Sheet

version:   1.0
author:    21_21 DESIGN SIGHT.
website:   2121designsight.com

-----------------------------------------------------------------------------*/
html {width:100%;height:100%;}
body {
	width:100%;
	height:100%;
	font-size:13px;
	line-height: 1.65em;
	text-align:center;
	font-family: sans-serif;
}
h1{
	display: block;
	width: 242px;
	padding: 40px 0 66px 0;
	background-color: #fff;
}
h1 a{
	display: block;
	width: 242px;
	height: 68px;
	background: url(../images/21_21.gif);
	overflow: hidden;
	text-indent: -9999px;
}
h1 a:hover{
	background-color: #fff;
}
h2{
	width: 100%;
	height: 68px;
	line-height: 68px;
	background-color: white;
	margin-bottom: 71px;
	text-indent: -999px;
	overflow: hidden;
}
body.home h2{
	height: 62px;
	line-height: 62px;
}
h3{
	font-size:108%;
	font-weight: bold;
	margin: 0 0 20px 0;
}
h3.gray{
	font-size:123.1%;
	height: 34px;
	line-height: 34px;
	background-color: #dcdcdc;
}
h4{
	font-weight: bold;
	padding: 10px;
}
p{
	margin: 10px 0;
}
a.totop{
	font-size:100%;

}
.caption{
	font-size:85%;
	line-height:1.3;
}
caption{
	display: none;
}
table thead{
	display: none;
}

a{text-decoration:none;cursor:pointer;color:#0096df;}
a:hover{color:#fff;background-color: #0096df;}
h4.black a{color: #000;}

#scrollText a:link{color:#aaa;}
#scrollText a:visited{color:#aaa;}
#text a:link{color:#aaa;}
#text a:visited{color:#aaa;}
div.hr hr {visibility: hidden;}
.off-txt{visibility: hidden;}
/*---------------------------------------------------------------------------*/
#container{
	position: relative;
	width:860px;
	margin:0 auto;
/*	border: #eee 1px solid;*/
}
#header{
	position: absolute;
	width: 100%;
	height: 28px;
	z-index: 999;
	background-color: white;
	text-align: left;
}
#header .lang a{
	display: block;
	width: 80px;
	height: 28px;
	text-indent: -999px;
	overflow: hidden;
	background: white url(../images/lang_en.gif) 0 0 no-repeat;
}
#header .lang a:hover{
	background-color: white;
}
#pagebody{
	position: relative;
	top:0;
	text-align: left;
	clear: both;
	width:100%;
	background: #fff url(../images/background.gif) 0 0 repeat-y;
	min-height:540px;
	height: auto !important;
	height: 540px;
}
#navi{
	float: right;
	padding-top: 28px;
	width: 242px;
	text-align: left;
/*	background-color:white;*/
/*	background-color: #ededee;*/
}
#navi .adimg{
	margin:0 0 5px 0;
}

#adbanner a:hover{
	background-color: #ededee;;
	}
#menu{
	background-color: #fff;
	padding-bottom: 92px;
}
#menu ul{
	display: block;
	padding: 15px 0;
	background-color: #0090df;
}
#menu ul li{
	display: block;
	padding-bottom: 14px;	
	width: 100%;
}
#menu ul li.active{
	padding-bottom: 8px;	
}
#menu ul li a{
	display: block;
	width: 100%;
	height: 24px;
	line-height: 24px;
	overflow: hidden;
	text-indent: -9999px;
}
#menu ul li.designsight a{background: url(../images/menu.gif) 0 -11px no-repeat;}
#menu ul li.designsight a:hover, #menu ul li.designsight a.active {background-position: -242px -11px;}
#menu ul li.designsight_1 a{background: url(../images/menu.gif) 0 -41px no-repeat;}
#menu ul li.designsight_1 a:hover, #menu ul li.designsight_1 a.active {background-position: -242px -41px;}
#menu ul li.designsight_2 a{background: url(../images/menu.gif) 0 -64px no-repeat;}
#menu ul li.designsight_2 a:hover, #menu ul li.designsight_2 a.active {background-position: -242px -64px;}
#menu ul li.designsight_3 a{background: url(../images/menu.gif) 0 -87px no-repeat;}
#menu ul li.designsight_3 a:hover, #menu ul li.designsight_3 a.active {background-position: -242px -87px;}
#menu ul li.designsight_4 a{background: url(../images/menu.gif) 0 -110px no-repeat;}
#menu ul li.designsight_4 a:hover, #menu ul li.designsight_4 a.active {background-position: -242px -110px;}
#menu ul li.program a{background: url(../images/menu.gif) 0 -140px no-repeat;}
#menu ul li.program a:hover, #menu ul li.program a.active {background-position: -242px -140px;}
#menu ul li.program_1 a{background: url(../images/menu.gif) 0 -172px no-repeat;}
#menu ul li.program_1 a:hover, #menu ul li.program_1 a.active {background-position: -242px -172px;}
#menu ul li.program_2 a{background: url(../images/menu.gif) 0 -195px no-repeat;}
#menu ul li.program_2 a:hover, #menu ul li.program_2 a.active {background-position: -242px -195px;}
#menu ul li.architecture a{background: url(../images/menu.gif) 0 -226px no-repeat;}
#menu ul li.architecture a:hover, #menu ul li.architecture a.active {background-position: -242px -226px;}
#menu ul li.architecture_1 a{background: url(../images/menu.gif) 0 -258px no-repeat;}
#menu ul li.architecture_1 a:hover, #menu ul li.architecture_1 a.active {background-position: -242px -258px;}
#menu ul li.architecture_2 a{background: url(../images/menu.gif) 0 -281px no-repeat;}
#menu ul li.architecture_2 a:hover, #menu ul li.architecture_2 a.active {background-position: -242px -281px;}
#menu ul li.information a{background: url(../images/menu.gif) 0 -311px no-repeat;}
#menu ul li.information a:hover, #menu ul li.information a.active {background-position: -242px -311px;}
#menu ul li.information_1 a{background: url(../images/menu.gif) 0 -344px no-repeat;}
#menu ul li.information_1 a:hover, #menu ul li.information_1 a.active {background-position: -242px -344px;}
#menu ul li.information_2 a{background: url(../images/menu.gif) 0 -368px no-repeat;}
#menu ul li.information_2 a:hover, #menu ul li.information_2 a.active {background-position: -242px -368px;}
#menu ul li.access a{background: url(../images/menu.gif) 0 -397px no-repeat;}
#menu ul li.access a:hover, #menu ul li.access a.active {background-position: -242px -397px;}

#menu ul li ul{
	display: block;
	padding: 0;
	background: #000;
}
#menu ul li ul li, #menu li.last{
	padding-bottom: 0;	
}

#ad{
	margin:0;
	padding: 0;
}
#navi h2{
	height: 30px;
	line-height: 30px;
	background-color: transparent;
	margin:0;
	padding-top:16px;
	background-position: 0 100%;
}

#navi .now_margin{
	margin-bottom: 16px;
}
	
#ad h2{
	background-color: transparent;
}

#ad a img{
	display:block;
	width:100%;
	margin-bottom: 5px;
}
#ad p{
	font-size:85%;
	line-height: 1.5em;
	padding: 0 10px;
}
#ad p a{
	font-weight:bold;
}

#main{
	position:relative;
	width:550px;
	padding:67px 0 28px 0;
}

body.home #main{
	padding-top: 28px;
}
#now{
	width:100%;
	height: 366px;
	background-color: white;
	padding-top:106px;
}
#main p, #main h3{
	clear:left;
	padding: 0 10px;
}
#main ul, #main dl, #main ul, #main table{
	padding: 0 10px;
}
#news h2, #program h2, #next_program h2{
	margin-bottom: 0;
}
#news table{
	background-color: white;
}

#news table td{
	padding: 7px 0 6px 10px;
	border-bottom: 1px #ededed solid;
	vertical-align: top;
}
#news table td.news_desc{
	padding: 7px 7px 6px 0;
}
#news table td{
	font-size:90%;
}
#news table td.alert{
	text-align: 1.0em;
}
#news span.news {
background-color:#FFFF33;
color:#FF3366;
font-size:smaller;
margin-left:1em;
}
#program ul{
	margin:0;
	padding: 0;
}
#program ul li{
	margin:0;
	padding: 0;
}
#program ul li a:hover{
	background: none;
}
#main li{
	padding: 2px 0;
}
#main .asset-header ul{
    padding:30px 0 20px 10px;
}
#main .asset-header ul li{
	display: inline;
	font-size:12px;
	line-height: 1em;
	padding: 0 7px 0 0;
	margin:0 0 0 4px;
	background: url(../images/separate.gif) 100% 50% no-repeat;
}
#main .asset-header ul li.last, #main .asset-header ul li:last{
	background: none;
}
#main .asset-header ul li.hide_list{
	display: none;
}
#main .asset-header ul li a.active{
	color:#333;
}
#main .asset-header ul li a.active:hover{
	color:#fff;
}
h3.program_detail{
	height: 34px;
	line-height:34px;
	padding:0;
	background-color: #dcdcdc;
	margin:0;
	font-size:123.1%;
	margin-bottom: 24px;
}
#main .asset-header ul li:first-child{
	margin-left:0;
	padding-left:0;
}
#main .asset-header ul li:last-child{
	margin-right:0;
	padding-right:0;
	background: none;
}
#main .asset-body{
	margin-bottom: 28px;
	float:left;
}

#main .asset-footer{
	clear:both;
	text-align:right;
}

#main .asset-footer2{
	clear:left;
	text-align:right;
}

#main .asset-footer2 p a{
    color:#ededed;
}

#main .asset-footer2 p a:hover{
    color:#ededed;
	background-color:#ededed;
}

#main div.photoC{
	font-size:85%;
	margin:0 0 0 15px;
}
#main div.photoR{
	font-size:85%;
	float:right;
	margin:0 0 15px 10px;
}
#main div.photoL{
	font-size:85%;
	float:left;
	margin:0 10px 15px 0;
}
#main div.photoR img, #main div.photoL img, #main div.photoC img{
	margin-bottom: 0px;
	font-size:93%;
}
#main h5{
	font-weight: bold;
}
#main h5 span{
	font-weight: normal;
	margin-left: 10px;
}

/* if end -----------------------------------*/

#main div.column_one{
	width: 100%;
	margin-top: 20px;
}

#main div.totop{
	clear: both;
	width: 530px;
	padding: 0 10px;
	text-align: right;
}
#main div.column_two_left{
	width: 180px;
	float: left;
	text-align: center;
}
#main div.column_two_right{
	width: 370px;
	float: right;
	text-align: left;
}

#main div.column_left{
	float: left; 
	margin: 0px 20px 20px 10px;
	font-size:x-small;
	line-height:1.2em;
}
#main div.column_right{
	float: right; 
	margin: 0px 20px 20px 10px;
	font-size:x-small;
	line-height:1.2em;
}

#main div.column_two_right p{
	padding-left: 0;
}

#main div.column{
	width: 550px;
	padding-bottom: 20px;
}
#main div.column_half_left{
	width: 275px;
	float: left;
}
#main div.column_half_right{
	width: 275px;
	float: right;
}


/*関連プログラム一覧ページ*/
#main div.event_column_right{
	width: 140px;
	float: right;
	padding-bottom:10px;
	margin-bottom: 5px;
	text-align:center;
}

#main div.event_column_left{
	width: 400px;
	float: left;
}
#main div.event_list{
	position: relative;
	display: inline-table;
	width: 550px;
	margin-bottom: 20px;
}
#main div.event_list_left{
	position: relative;
	display: inline;
	width: 120px;
}
#main div.event_list_right{
	width: 430px;
	float: right;
}
#main div.event_next_list{
	position: relative;
	display: inline-table;
	width: 550px;
	margin-bottom: 20px;
}
#main div.event_next_list_left{
	position: relative;
	display: inline;
	width: 200px;
}
#main div.event_next_list_right{
	width: 350px;
	float: right;
}
#main div.event_list_right p{
	margin-top: 0;
}
#main div.event_list hr{
	width: 550px;
	margin: 0;
	padding: 0;
	float: left;
	clear: both;
	visibility: hidden;
}
#main div.item_block{
	width: 100%;
	float: left;
}


/*キャプション*/
#main p.picture{
padding-bottom:15px;	
}

#main span.pict-caption{
font-size:10px;
line-height:1.5;
color:#666;
margin-bottom:150px;
}

#main div.hr{
	clear:left;
	/*clear: both;*/
	width: 530px;
	height:1px;
	padding:0 10px;
	margin: 10px 0 20px 0;
}

/*ライン*/
#main div.hr hr{
	display: block;
	width: 530px;
	visibility: visible;
	border:none;
	border-bottom: 1px #666 dotted;
}

#main div.hr2 hr{
	display: block;
	width: 530px;
	visibility: visible;
	border:none;
	padding:1em 0;
	border-bottom: 1px #ccc solid;
}

#slideshow {
  width: 550px;
  height: 366px;
}


/*関連プログラムメニュー項目*/
#nav_blk{
align:right; 
margin:0 10px 20px 30px; 
padding:0 0 1em 1em;
}

#nav_blk ul{
margin:0;
padding:0;
list-style:none;
}

#nav_blk li{
margin:0px 1px 0px 0px;
padding:0;
height:23px;
text-indent:-9999px;
}

#nav_blk li a{
text-decoration:none;
display:block;
height:23px;
}

#nav_blk li#next{
float:right;
width:23px;
background:url(../../img/spacer.gif) no-repeat;
}

#nav_blk li#next a{
float:right;
width:23px;
background:url(../../img/cmn/btn_next.gif) no-repeat;
}

#nav_blk li#next a:hover{
float:right;
width:23px;
background:url(../../img/cmn/btn_next_a.gif) no-repeat;
}

#nav_blk li#idx{
float:right;
width:23px;
background:url(../../img/cmn/btn_idx.gif) no-repeat;
}

#nav_blk li#idx a:hover{
float:right;
width:23px;
background:url(../../img/cmn/btn_idx_a.gif) no-repeat;
}

#nav_blk li#back{
float:right;
width:23px;
background:url(../../img/spacer.gif) no-repeat;
}

#nav_blk li#back a{
float:right;
width:23px;
background:url(../../img/cmn/btn_back.gif) no-repeat;
}

#nav_blk li#back a:hover{
float:right;
width:23px;
background:url(../../img/cmn/btn_back_a.gif) no-repeat;
}

#main .page_session{
	font-size: 14px;
}

#more.asset-more{
	font-size: 14px;
	line-height:24px;
}

h2.designsight {background: url(../images/title_ds.gif) 0 50% no-repeat;}
h2.designsight_1 {background: url(../images/title_ds_symbol.gif) 0 50% no-repeat;}
h2.designsight_2 {background: url(../images/title_ds_director.gif) 0 50% no-repeat;}
h2.designsight_3 {background: url(../images/title_ds_history.gif) 0 50% no-repeat;}
h2.designsight_4 {background: url(../images/title_ds_partner.gif) 0 50% no-repeat;}

h2.designsight_words {background: url(../images/title_ds_words.gif) 0 50% no-repeat;}
h2.designsight_090403talk {background: url(../images/090403talk.gif) 0 50% no-repeat;}
h2.designsight_080620talk1 {background: url(../images/080620talk1.gif) 0 50% no-repeat;}
h2.designsight_080620talk2 {background: url(../images/080620talk2.gif) 0 50% no-repeat;}
h2.designsight_080620talk3 {background: url(../images/080620talk3.gif) 0 50% no-repeat;}
h2.designsight_080620niimi {background: url(../images/080620niimi.gif) 0 50% no-repeat;}
h2.designsight_houdan-1 {background: url(../images/houdan-1.gif) 0 50% no-repeat;}
h2.designsight_houdan-2 {background: url(../images/houdan-2.gif) 0 50% no-repeat;}
h2.designsight_houdan-3 {background: url(../images/houdan-3.gif) 0 50% no-repeat;}
h2.designsight_houdan-4 {background: url(../images/houdan-4.gif) 0 50% no-repeat;}


h2.program {background: url(../images/title_pr.gif) 0 50% no-repeat;}
h2.program_1 {background: url(../images/title_pr_next.gif) 0 50% no-repeat;}
h2.program_2 {background: url(../images/title_pr_prev.gif) 0 50% no-repeat;}
h2.program_3 {background: url(../images/title_pr_soon.gif) 0 50% no-repeat;}
h2.architecture {background: url(../images/title_ar.gif) 0 50% no-repeat;}
h2.architecture_1 {background: url(../images/title_ar_architect.gif) 0 50% no-repeat;}
h2.architecture_2 {background: url(../images/title_ar_facility.gif) 0 50% no-repeat;}
h2.information {background: url(../images/title_in.gif) 0 50% no-repeat;}
h2.information_1 {background: url(../images/title_in_membership.gif) 0 50% no-repeat;}
h2.information_2 {background: url(../images/title_in_contact.gif) 0 50% no-repeat;}
h2.information_3 {background: url(../images/title_iapp.gif) 0 50% no-repeat;}
h2.information_5 {background: url(../images/title_cofesta.gif) 0 50% no-repeat;}
h2.access {background: url(../images/title_ac.gif) 0 50% no-repeat;}
h2.recruit {background: url(../images/title_recruit.gif) 0 50% no-repeat;}
h2.topics {background: url(../images/title_equake.gif) 0 50% no-repeat;}

h2.top_news {background: url(../images/title_to_news.gif) 0 50% no-repeat;}
h2.top_topic {background: url(../images/top_info_title.gif) 0 50% no-repeat;}
h2.top_next_1 {background: url(../images/title_to_next_1.gif) 0 50% no-repeat;}
h2.top_now {background: url(../images/title_to_now.gif) 0 50% no-repeat;}
h2.top_next_2 {background: url(../images/title_to_next_2.gif) 0 50% no-repeat;}
h2.top_info {background: url(../images/title_to_info.gif) 0 50% no-repeat;}
h2.top_topic_2 {background: url(../images/title_to_topics.gif) 0 50% no-repeat;}
h2.program_detail {
	width: 100%;
	height: 136px;
	background: none;
	background-color: white;
	margin-bottom: 71px;
	text-indent: 0;
}
#main .top_next h2 {
	width: 100%;
	height: 65px;
}

#main .top_next ul{
	padding:68px 0 0 10px;
}

h4.header-full-gray  {
background-color:#DCDCDC;
font-size:large;
padding:5px 0;
margin:0 0 30px 0;
position:relative;
text-indent:10px;
width:550px;
}

#footer{
	position: relative;
	clear: both;
	width:100%;
	padding: 10px 0;
	text-align: left;
}
#footer .information{
	width: 100%;
	height: 130px;
	background: url(../images/footer_information.gif) 0 100% no-repeat;
	padding-top: 58px;
}
#footer .information span{
	display: block;
	text-indent: -9999px;
	overflow: hidden;
}
#footer .information a{
	display: block;
	position: absolute;
	top: 135px;
	width: 154px;
	height: 20px;
	text-indent: -9999px;
	overflow: hidden;
}
#footer .information a:hover{
	background: none;
}

.copyright{
	font-size:77%;
}

.textright{
	text-align:right; 
	padding:0 3em 1em 0;
}




dt {
  clear: left;
  float: left;
  margin: 0 0 0.8em;
  padding-left: 5px;
}

dd {
  margin-bottom: 0.8em;
  margin-left: 7.5em;
}



/*--------------------------------------
概要などの項目リスト
-------------------------------------*/

dl.sc_txt{
	width:500px;
}

dt.sc_txt {
  clear: left;
  float: left;
  margin: 0 0 0.8em;
  width: 7em;
  padding-left: 5px;
  font-weight:bold;
}

dd.sc_txt {
  margin-bottom: 0.8em;
  margin-left: 7.5em;
}

div.apptxt{
font-size:11px;
line-height:12px;
margin-bottom:20px;
}

.fl-left {
float:left;
margin:0;
}

.touch-left {
left:-10px;
position:relative;
}


/*--------------------------------------
ディレクターの作品紹介
-------------------------------------*/

.prof-works-pic {
	margin : 0 4px 0 0;
	vertical-align : top;
	float : left; 
}

.prof-work-pic {
	margin : 0 3px 0 0;
	vertical-align : top;
	float : left; 
}

.prof-work-pic_last {
	margin :0; 
	vertical-align : top; 
	float : left; 
}


/*--------------------------------------
作品リスト（テキストのみ）
-------------------------------------*/

.work_list{
	font-size:10pt;
	padding:0 15px;
}

.image-left{
	float: left; 
	margin: 0px 20px 0px 10px;"
}

.image-right {
float:right;
margin: 0px 20px 0px 10px;"
}

/*--------------------------------------
21_21 DESIGN SIGHT
-------------------------------------*/

.directors-works-pic {
float:left;
margin:0 0 0 12px;
vertical-align:top;
}

.fl-right {
float:right;
margin:0;
}

.touch-right {
left:10px;
position:relative;
}

.displayhidden{
visibility:hidden;
}

ol.membership{
margin:0 0 0 10px;
}

/*---------------------------------------------------------------------------*/

.test10 {font-size:77%;}
.test11 {font-size:85%;}
.test12 {font-size:93%;}
.test13 {font-size:100%;}
.test14 {font-size:108%;}
.test15 {font-size:116%;}
.test16 {font-size:123.1%;}
.test17 {font-size:131%;}
.test18 {font-size:138.5%;}
.test19 {font-size:146.5%;}
.test20 {font-size:153.9%;}
.test21 {font-size:161.6%;}
.test22 {font-size:167%;}
.test23 {font-size:174%;}
.test24 {font-size:182%;}
.test25 {font-size:189%;}
.test26 {font-size:197%;}