@charset "utf-8";
/* CSS Document */

/*
	Site Name: New National Theatre, tokyo
	Description: index.html setting
	Version: 
	Author: 
*/

/*
===== CONTENTS ===========================================

	1: content base layout
	2: left content layout
	    2-1: pick up erea setting
		2-2: the atre erea setting
		2-3: from staff erea setting
	3: center content layout
		3-1: news erea setting
		3-2: schedule erea setting
		3-3: invitation erea setting 
		3-4: convenience erea setting
		3-5: fun erea setting
	4: right content layout
	    4-1: setTicket erea setting
	    4-2: entry erea setting
	    4-3: buy ticket erea setting 
	5: for opera
	6: for IE6
	7: for IE7
	8: for safari

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

a.txtlink {
}



/* -------------------------------------------------------
  1: content base layout
------------------------------------------------------- */
/*    1-1: base layout    */

#layoutMainMiddle .top {
	padding-top: 10px;
}
#mainLeft {
    text-align:left;
	float: left;
	width: 220px;
	margin-left: 18px;
}
*html #mainLeft {
    text-align:left;
	float: left;
	width: 220px;
	margin-left: 10px;
}
#mainCenter {
    text-align:left;
	float: left;
	width: 430px;
	margin-right: 18px;
	margin-left: 18px;
}

#mainCenter caption {
	width: 400px;
}

#mainRight {
    text-align:left;
	float: left;
	width: 240px;
}

/*    1-2: main img      */

#mainImg {
	width:940px;
	height:222px;
	background:url(../../img/ttl_top.jpg) left center no-repeat;
	text-align: center;
	margin : 10px auto;
}

#mainImg div#ticketBtn {
	float: right;
	width: 200px;
	padding-right: 32px;
	margin-top: 48px
}

#mainImg div#ticketBtn li {
	display:inline;
}

#mainImg div#ticketBtn li img{
	display: block;
	margin-bottom: 4px;
}

#mainImg div#ticketBtn li.sideL,
#mainImg div#ticketBtn li.sideR {
	float: left;
	height: 23px;
	padding-top: 2px;
	padding-left: 2px;
}

#mainImg div#ticketBtn li.sideR {
	float: right;
	padding-right: 2px;
}

#mainImg div#ticketBtn li.sideL img {
}

#mainImg div#ticketBtn p {
	margin-top: 7px;
	margin-left: 1px;
}








/* -------------------------------------------------------
  2: left content layout
------------------------------------------------------- */
/*   2-1: pick up erea setting   */

#pickUp {
	margin-bottom: 20px;
}

#pickUp .innerColor01 {
	text-align: left;
	background-color: #FFFFFF;
	width: 190px;
	padding: 10px 15px;
	border-top: 1px solid #FFFFFF;
	border-bottom: 1px solid #C7C7C7;
}

#pickUp #firstChild02 {
	border-top-style: none;
}

#pickUp .innerColor01 p,
#pickUp .innerColor02 p {
	float: left;
	width: 120px;
}

#pickUp .innerColor02 {
	background-color: #EFEFEC;
	width: 190px;
	padding: 10px 15px;
	border-top: 1px solid #FFFFFF;
	border-bottom: 1px solid #C7C7C7;
}

#pickUp h3 {
	margin-bottom: 5px;
}

 {
	float: left;
	width: 120px;
}

#pickUp a img {
	float : left;
	width: 60px;
	margin-right: 10px;
}

#pickUp #txtBtn {
	line-height: 28px;
	text-align : center;
	background: url(../../img/bg_emailclub.gif) left top repeat-x;
	height: 28px;
	padding: 0;
	clear: both;
}

/*   2-2: the atre erea setting   */
#theAtre {
	margin: 10px 0 25px;
	clear: both;
}

#theAtre #theAtreMiddle {
	padding-top: 10px;
}
#theAtre .theAtreMiddle {
	padding-top: 10px;
}
#theAtre #phTheAtre {
	float : left;
	width : 71px;
	margin: 0 10px 10px 5px;
}
/*20111124_追記*/
#theAtre .phTheAtre {
	float : left;
	width : 71px;
	margin: 0 10px 10px 5px;
}

#theAtre .innerTheAtre01 {
	float: left;
	width: 130px;
	margin-bottom: 10px;
}

#theAtre .innerTheAtre01 dl {
}

#theAtre .innerTheAtre01 dt {
	font-weight   : bold;
}

#theAtre .innerTheAtre01 dd {
	line-height: 1.5;
	padding-top: 8px;
	padding-bottom: 8px;
}

.mac.safari #theAtre .innerTheAtre01 dd {
	font-size: 83%;
}

#theAtre .innerTheAtre02 {
	text-align : center;
	background-color: #E3E5E1;
	padding: 10px 27px;
	clear: both;
}

#theAtre  .innerTheAtre02 ul {
	width: 166px;
}

#theAtre  .innerTheAtre02 li {
	float : left;
	margin-right: 14px;
}

#theAtre .innerTheAtre02 .lastChild {
	margin-right: 0px;
}

#theAtre .backNumber {
	line-height: 29px;
	text-align : center;
	height: 29px;
	border-bottom: 1px dotted #8B8B8B;
	clear: both;
}

#theAtre #theAtreBottom #theAtreMiddle .innerTheAtre01 dd {
	line-height: 1.2em;
}

#theAtre #theAtreBottom .theAtreMiddle .innerTheAtre01 dd {
	line-height: 1.2em;
}

/*   2-3: from staff erea setting   */
#staff {
	margin-top: 10px;
	margin-bottom: 10px;
	border-bottom: 1px dotted #8B8B8B;
}

#staff h2 {
	display: block;
	margin-bottom: 7px;
}

#staffMiddle img {
	margin-bottom: 0px;
	padding-bottom: 0px;
}

#staff #innerStaff {
	text-align: left;
	padding: 5px;
}

#innerStaff p .arwLink {
	margin-left: 6px;
}

#mainLeft .bnr {
	padding-bottom: 10px;
	border-bottom: 1px dotted #8B8B8B;
}





/*   2-5: paper area setting   */
#sectionPaper{
	clear  : both;
	padding: 0 0 20px;
}
#sectionPaper h2{
	padding: 0 0 10px;
}
#sectionPaper span{
	display: block;
	padding: 5px 0 0;
}



/*   2-6: Article area setting   */
#sectionArticle{
	border-bottom : 1px dotted #8B8B8B;
	margin-bottom : 20px;
	padding-bottom: 5px;
}
#sectionArticle #phTheAtre {
	float : left;
	width : 71px;
	margin: 0 10px 10px 5px;
}
#sectionArticle .bohemeDetail{
	display: block;
	padding: 5px 0 0;
}



/*20111124_追記*/
#sectionArticle .phTheAtre {
	float : left;
	width : 71px;
	margin: 0 10px 10px 5px;
}
#sectionArticle .innerTheAtre01 {
	float        : left;
	margin-bottom: 10px;
	width        : 130px;
}
#sectionArticle .innerTheAtre01 dt {
	font-weight   : bold;
}
#sectionArticle .innerTheAtre01 dd {
	line-height   : 1.5;
	padding-top   : 8px;
	padding-bottom: 8px;
}
.ie #sectionArticle .innerTheAtre01 dd {
	font-size: 93%;
}
#sectionArticle #theAtreMiddle{
	padding-top: 10px;
}
#sectionArticle .theAtreMiddle{
	padding-top: 10px;
}

#banner_area {
	width: 218px;
	border: 1px solid #C4C1BC;
	padding: 10px;
	margin-top: 10px;
}


/* -------------------------------------------------------
  3: center content layout
------------------------------------------------------- */
/*   3-1: news erea setting   */
/*   3-2: schedule erea setting   */

.topicsInner {
	background: url(../../img/bg_topics.jpg) no-repeat right top;
	width: 430px;
	height: 31px;
}

#schedule {
	margin-top: 7px;
}

.topicsInner h2 {
	margin:   0px;
	float :  left;
	width : 291px;
}

#schedule .topicsInner h2 {
	width : 287px;
}

.topicsInner li {
	float :  left;
	line-height: 1;
	margin-top: 6px;
}

.topicsInner .list {
	margin-right: 8px;
}

.bgColor {
	margin-bottom: 15px;
}

#news .bgColor table,
#schedule .bgColor table {
	width: 430px;
}

#news .bgColor th,
#schedule .bgColor th{
	border-bottom: 1px dotted #8B8B8B;
	padding: 5px;
	vertical-align: text-top;
	width : 90px;
}

#news .bgColor td,
#schedule .bgColor td {
	border-bottom : 1px dotted #8B8B8B;
	font-weight   :   normal;
	padding       : 5px;
	vertical-align: text-top;
}

#schedule .bgColor td {
}
#schedule .bgColor td a {
	height: 20px;
/*	padding-left: 21px;*/
	text-indent: 20px;
}
#schedule .bgColor td img {
	padding-top: 2px;
	vertical-align: -4px;
}
#ie6 #schedule .bgColor td img {
	padding-top: 3px;
	vertical-align: -4px;
}
#ie7 #schedule .bgColor td img {
	padding-top: 3px;
	vertical-align: -4px;
}

#schedule .bgColor td .opera {
	background-image: url(../img/icon_s04.gif);
	background-repeat: no-repeat;
	background-position: left 5px;
}
#schedule .bgColor td .opera img {
	display: block;
	margin-right: 20px;
}
#schedule .bgColor td .play {
	background-image: url(../img/icon_s01.gif);
	background-repeat: no-repeat;
	background-position: left center;
}




/*   3-3: invitation erea setting   */
#invitation {
	margin-bottom: 20px;
}

#invitation .bgColor div {
	float: left;
	margin-right: 7px;
	padding-bottom: 8px;
	width: 130px;
}
#invitation .bgColor div.lastest {
	margin-right: 0px;
}

#invitation h2 {
	display: block;
	margin-bottom: 7px;
}

#inviTable td {
	vertical-align: top;
	padding: 0 18px 3px 0;
}

#inviTable td.lactChild {
	padding: 0 0 3px 0;
}

#invitation .link p {
	text-align: center;
	width: 131px;
	border-top: 1px dotted #8B8B8B;
	border-bottom: 1px dotted #8B8B8B;
}

/*   3-4: convenience erea setting   */
#convenience {
	width: 430px;
	margin-bottom: 15px;
	clear: both;
}

#convenience h2 {
	display: block;
	margin-bottom: 7px;
}

#convenience table {
	width: 430px;
}

#convenience table th,
#convenience table td {
	vertical-align: top;
	padding-bottom: 10px;
}

#convenience table th {
	width: 61px;
	padding-right: 10px;
}

#convenience table td {
	width: 131px;
}

#convenience table th.groupR {
	padding-left: 26px;
}

#convenience table td p {
	padding-right: 10px;
}

#convenience h3 {
	width: 131px;
	margin-bottom: 5px;
	border-bottom: 1px dotted #8B8B8B;
}

/*   3-5: fun erea setting   */

#fun {
	clear: both;
	border-bottom: 1px dotted #8B8B8B;
}

#fun h2 {
	display: block;
	margin-bottom: 7px;
}

#fun #innerFun {
	padding-bottom:  10px;
	padding-left: 2px;
	margin-bottom: 10px;
	border-bottom: 1px dotted #8B8B8B;
}

#fun #innerFun img {
	float:  left;
	width: 160px;
	margin-right: 15px;
}

#fun #txtEnjoy {
	float: right;
	width: 250px;
}

#fun ul {
	clear: both;
}

#fun #innerFun h3 {
	color:#398DD3;
	font-size: 110%;
}

#fun .bgColor #innerFun .txtLink {
	margin-top: 5px;
}

#fun #innerFun .txtLink a {
	text-decoration: none;
}

#fun #innerFun .txtLink a:hover {
	text-decoration: underline;
}

#fun ul {
	padding-left: 1px;
	height: 122px;
}

#fun li {
	float: left;
	display: inline;
	width: 135px;
	height: 51px;
	margin-right: 12px;
	margin-bottom: 10px;
}

#fun li.lactChild {
	margin-right: 0px;
}



/* -------------------------------------------------------
  4: right content layout
------------------------------------------------------- */
/*   4-1: setTicket erea setting   */

#entryRequest ul{
	padding-left: 3px;
	margin-bottom: 10px;
}
#entryRequest li {
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 8px;
	border-bottom: 1px dotted #898989;
}
#entryRequest li.lastChild{
	padding-top: 10px;
}
#entryRequest li a{
	background: url(../img/arw_txtlink.gif) left top no-repeat;
	padding-left: 15px;
}
#entryRequest h2 {
	margin-bottom: 2px;
}


/*   4-2: entry erea setting   */
#entry {
	background-color: #E0DDD5;
	width: 220px;
	padding: 10px 9px;
	margin-bottom: 15px;
	border: 1px solid #C7C3BF;
}

#entry ul {
	width: 220px;
	height: 147px;
	overflow: hidden;
}

#entry li {
	width: 220px;
	height: 45px;
	margin-bottom: 6px;
	overflow: hidden;
}

#entry li.lastChild {
	margin-bottom: 0px;
}

/*   4-3: buy ticket erea setting   */
#buy {
	background-color: #E0DDD5;
	width: 220px;
	padding: 10px 9px;
	border: 1px solid #C7C3BF;
}

#buyBottom {
	background: url(../img/bg_buy_bottom.gif) no-repeat left bottom;
	width: 240px;
	padding-bottom: 9px;
}
#buyMiddle {
	background: url(../img/bg_buy_middle.gif) repeat-y left top;
	padding: 5px 10px
}
#buy p {
	text-align: left;
	padding: 4px 1px 10px 1px;
}

#buy ul {
	background-color: #FFFFFF;
	width: 220px;
	padding-top: 10px;
	padding-bottom: 10px;
}

#buy li {
	display: inline;
}

#buy li img {
	display: block;
	margin: 0 10px 5px;
}

#buy li.ttlTicket img {
	margin: 0 0 5px 15px;
}

#buy li.lactChild img {
	margin: 0 10px 0;
}

#buy li.break img {
	margin: 0 10px 15px;
}

.secitonTweet{
	height:400px;
}
.secitonTweet .twtr-join-conv{
	display: none;
}



/* -------------------------------------------------------
  5: for opera
------------------------------------------------------- */
/*   header setting   */


/* -------------------------------------------------------
  6: for IE6
------------------------------------------------------- */
/*   pick up setting   */
#ie6 #mainLeft {
	margin-left: 8px;
}
#ie6 #pickUp h3 {
	margin-bottom: 10px;
}
/*   the Atre setting   */
#ie6 #theAtre .innerTheAtre01 {
	margin-bottom: 0px;
}
#ie6 #theAtre .innerTheAtre02{
	padding-top:   7px;
}
/*   staff setting   */
#ie6 #staff #innerStaff {
    position:relative;
	top:-5px;
}
/*   invitation Atre setting   */
#ie6 #invitation .bgColor div {
	margin-right: 7px;
	padding-bottom: 3px;
}
#ie6 #invitation .bgColor {
	padding-right:0px;
	padding-left: 10px;
}
/*   fun Atre setting   */
#ie6 #fun .bgColor {
	padding-bottom: 8px;
}

/* -------------------------------------------------------
  7: for IE7
------------------------------------------------------- */
/*   pick up setting   */
#ie7 #pickUp h3 {
	margin-bottom: 9px;
}
/*   the Atre setting   */
#ie7 #theAtre .innerTheAtre01 {
	margin-bottom: 0px;
}
#ie7 #theAtre .innerTheAtre02{
	padding-top:   7px;
}
/*   staff setting   */
#ie7 #staff #innerStaff {
    position:relative;
	top:-5px;
}
/*   fun setting   */
#ie7 #fun .bgColor {
	padding-bottom: 8px;
}


/* -------------------------------------------------------
  8: for safari
------------------------------------------------------- */
/*safari2*/
/*   header setting   */
html:\66irst-child {
}

/*safari3*/
/*   header setting   */
html* {
}