@charset "UTF-8";
/******************************************************************************

default.css
copyright (C) 2009 Y_N(18)

******************************************************************************/


/******************************************************************************

◆ ワイルドカード

******************************************************************************/

*
{
	margin:0;
	padding:0;
	border:0;
}

.clear
{
	clear:both !important;
}

.clear hr 
{
	display:none;
}


/******************************************************************************

◆ html

******************************************************************************/

html
{
	height: 100%;
}



/******************************************************************************

◆ body

******************************************************************************/

body
{
	background-color: #ffffff;
	background: url('../img/back.png');
	line-height: 21px;
	font-size: 16px;
	font-family: Verdana,Sans-Serif;
}

/******************************************************************************

◆ a

******************************************************************************/

a:link		{color: #0066ff; text-decoration: none;}
a:visited	{color: #0066ff; text-decoration: none;}
a:active	{color: #3300ff; text-decoration: underline;}
a:hover		{color: #000099; text-decoration: underline;}

/******************************************************************************

◆ コンテンツひとくくり

******************************************************************************/

#contents
{
	text-align: center;
	width:100%;
	height:100%;
}

#contents_in
{
	width: 850px;
	height: 100%;
	text-align: left;
	margin: 0 auto;
	padding: 20px 0 20px 0;
}

#main_in
{
	text-align: left;
	height: 100%;
	border-top: 1px solid #222222;
	border-bottom: 1px solid #222222;
	border-left: 1px solid #222222;
	border-right: 1px solid #222222;
	background-color: #ffffff;
	overflow: auto;
}
/**/
 * html #main_in{overflow: visible;}
/**/

.toppage
{
	/*height:2200px !important;*/
}

/******************************************************************************

◆ ヘッダー

******************************************************************************/

#header
{
	border-bottom: 1px solid #222222;
	height: 80px;
}

h1
{
	font-size: 0;
	background-color: #ffffff;
	background-image: url('../img/title.png');
	background-repeat: no-repeat;
	background-position: 20px 15px;
	color: #222222;
	height: 80px;
	width:400px;
	float:left;
}

h1 a
{
	display: block;
	width: 100%;
	height: 0 !important;
	height /**/: 80px;
	padding-top: 80px;
	overflow: hidden;
}

#minibox
{
	float:right;
	margin:30px 15px 0 0;
	padding:0;
	display:inline;
	width: 212px;
}

#minibox ul
{
	margin:0 !important;
	padding:0 !important;
	font-size:13px;
}

#minibox ul li
{
	display:inline;
	width:89px;
	height:12px;
	margin:0 !important;
	padding:0 !important;
}

#minibox ul li a
{
	display: block;
	width: 89px !important;
	width: 89px;
	height: 0 !important;
	height: 12px;
	background-image: url('../img/contact.png');
	background-repeat: no-repeat;
	padding-top:12px;
	padding-bottom:0 !important;
	overflow: hidden;
	text-indent:-9999px;
}

a#contact		{background-position:0 0;}
a#contact:hover	{background-position:0 -12px;}

body#contact_in a#contact{background-position:0 -12px;}

#search_form
{
	background:url(../img/search.png) left top no-repeat;
	display:block;
	width:212px;
	height:28px;
	margin:0;
}

#search_form p
{
	margin:0;
	padding:0;
}

#search_form input {float:left;} 

#search_form .form_input
{
	border:none;
	background:none;
	width:150px;
	margin-top:10px;
	margin-left:5px;
	margin-right:0;
	color:#464646;
	font-size: 11px;
}

#search_form .form_button
{
	background:none;
	border:none;
	margin-top:7px;
	margin-left:12px;
	width:39px;
	cursor: pointer;
}

/******************************************************************************

◆ メインのメニュー

******************************************************************************/

#top_contents
{
	width: 100%;
	padding:0;
	border-bottom: 1px solid #222222;
}

#top_contents h2
{
	float:left;
	width:auto;
	height:31px;
	line-height:31px;
	display: inline;
	border-top:0 !important;
	border-bottom:0 !important;
	margin:0 30px 0 0 !important;
	padding:0 !important;
	font-size: 18px;
	color: #222222;
	background:#ffffff url('../img/sq_07.png') no-repeat 23px 9px;
	text-indent: 45px;
	vertical-align: middle;
}

#mainmenu
{
	width:100%;
	height:31px;
}

#mainmenu ul
{
	margin:0 !important;
	padding:0 !important;
}

#mainmenu ul li
{
	float: left;
	display: inline;
	width:102px;
	height: 31px;
	margin:0 !important;
	padding:0 !important;
	border-left:1px dotted #222222;
}

#mainmenu ul li.last
{
	float: left;
	display: inline;
	width:102px;
	height: 31px;
	margin:0 !important;
	padding:0 !important;
	border-left:1px dotted #222222;
	border-right:1px dotted #222222;
}

a.textmenu			{color:#0066ff; background: #ffffff;}
a.textmenu:active	{color:#3300ff; background: #f5f5f5;}
a.textmenu:hover	{color:#3300ff; background: #f5f5f5;}

#mainmenu ul li a
{
	display: block;
	width: 102px !important;
	width: 102px;
	height: 0 !important;
	height: 31px;
	background-image:url(../img/mainmenu.png);
	background-repeat:no-repeat;
	padding-top:30px;
	padding-bottom:0 !important;
	overflow: hidden;
	text-indent:-9999px;
}

a#home			{background-position:0 0;}
a#home:hover	{background-position:0 -31px;}

body#home_in a#home {background-position:0 -31px;}

a#play			{background-position:-102px 0;}
a#play:hover	{background-position:-102px -31px;}

body#play_in a#play {background-position:-102px -31px;}

a#log			{background-position:-204px 0;}
a#log:hover		{background-position:-204px -31px;}

body#log_in a#log {background-position:-204px -31px;}

a#about			{background-position:-306px 0;}
a#about:hover	{background-position:-306px -31px;}

body#about_in a#about {background-position:-306px -31px;}

/******************************************************************************

◆ 各ページの上部のナビゲーションボックス

******************************************************************************/

#navi
{
	margin:0;
	padding:3px 10px 3px 0;
	font-size: 13px;
	text-align: right;
	border-bottom: 1px solid #222222;
}

#navi span
{
	padding-left: 20px;
	background: url('../img/sq_19.png') no-repeat 0px 1px;
}

/******************************************************************************

◆ フッター（著作権情報）

******************************************************************************/

address
{
	clear:both;
	font-size: 0;
	background-color: #ffffff;
	background-image: url('../img/copyright.png');
	background-repeat: no-repeat;
	background-position: center;
	color: #222222;
	height: 60px;
	text-indent:-9999px;
	margin: 0 auto;
}

#copyright
{
	clear:both;
	border-top: 1px solid #222222;
	background-color: #ffffff;
	width: 100%;
	height: 60px;
	margin: 0 auto;
}

#copyright hr
{
	display:none;
}

/******************************************************************************

◆ トップページの左側のコンテンツ全部

******************************************************************************/

#main_contents
{
	float:left;
	display:inline;
	width: 647px;
	height:auto;
	border-right:1px solid #222222;
}

#main_contents_in
{
	margin: 0 21px 20px 21px;
	width:605px;
}

/******************************************************************************

◆ 大きなバナー（605×115）

******************************************************************************/
.topbanner
{
	margin-top:10px;
}

.topbanner img
{
	margin-top:20px;
	display:block;
}

/******************************************************************************

◆ 更新履歴（NEWS&INFORMATIONS）

******************************************************************************/
h3.news
{
	border-bottom: 0 !important;
	background: url('../img/back_news.png') no-repeat 0px 0px !important;
	text-indent:-9999px;
	color:#222222;
	font-size:0;
	padding:0;
	line-height:0;
	width:605px;
	height:30px;
	margin:18px 0 0 0;
	overflow:hidden;
}

.newsbox
{
	font-size:13px;
	border-left:1px solid #0080ff;
	border-right:1px solid #0080ff;
	border-bottom:1px solid #0080ff;
}

.newsbox p
{
	text-indent:0;
	padding:5px;
	border-bottom:1px dotted #0080ff;
	display:block;
}

.newsbox p.last
{
	border-bottom: 0 !important;
}

/******************************************************************************

◆ 最新の公演情報（PLAYING NEWS）

******************************************************************************/
h3.pn
{
	border-bottom: 0 !important;
	background: url('../img/back_pn.png') no-repeat 0px 0px !important;
	text-indent:-9999px;
	color:#222222;
	font-size:0;
	padding:0;
	line-height:0;
	width:605px;
	height:30px;
	margin:18px 0 0 0;
	overflow:hidden;
}

table.pnbox
{
	width:605px;
	height:100%;
	font-size:13px;
	border-left:1px solid #00e667;
	border-right:1px solid #00e667;
	border-bottom:1px solid #00e667;
	overflow:auto;
	padding:0 !important;
	margin:0 !important;
}

.pnbox th
{
	border-bottom:1px solid #00e667;
	width:210px;
	height:90px;
	padding:0 !important;
	margin:0 !important;
	border-right: 1px dotted #00e667;
}

.pnbox td
{
	width:395px;
	border-bottom:1px dotted #00e667 !important;
}

.pnbox td.under
{
	border-bottom:1px solid #00e667 !important;
}

.pnbox th.last, td.last
{
	border-bottom: 0 !important;
}

.pnbox th img
{
	vertical-align: middle;
	display: block;
	margin: 5px;
	border:1px solid #888888;
}

.pnbox p
{
	text-indent:0;
	padding:5px;
	border-bottom:1px dotted #888888;
	display:inline;
	float:right;
	width:auto;
}

.pnbox p.last
{
	border-bottom: 0 !important;
}

em.date
{
	text-decoration:none;
	font-weight:bold;
	color:#ff203e;
	padding: 5px;
}

/******************************************************************************

◆ トップページの右側（バナー）のボックス

******************************************************************************/
#topsub_in
{
	float:right;
	width:200px;
	height:auto;
	font-size: 10px;
	/*border-left:1px solid #222222;*/
	/*border-bottom:1px solid #222222;*/
	margin: 0 auto;
}

#topsub_in_box
{
	text-align: center;
	padding:0 !important;
	margin: 0 auto;
}

#topsub_in ul
{
	margin:10px 0 10px 0;
	padding:8px;
	border-top:1px dotted #222222;
	border-bottom:1px dotted #222222;
	text-align:left;
}

#topsub_in li
{
	font-size: 10px;
}

#topsub_in div
{
	margin:20px 0 20px 0;
	text-align: center;
}

/******************************************************************************

◆ 公演案内

******************************************************************************/

.playinfo
{
	overflow:auto;
}

.playbox
{
	margin:20px 5px 0 0;
	width: 409px;
	float: left;
	display: inline;
}

.playbox_2
{
	margin:20px 0 0 5px;
	width: 409px;
	float: right;
	display: inline;
}

.playbox_img
{
	text-align: center;
	border: 1px solid #222222;
	background-color: #ffffff;
}

.playbox_img_in
{
	background: url('../img/back2.png') repeat 0px 0px;
	height:345px;
	width:407px;
	text-align:center;
	display:table-cell;
	vertical-align:middle;
	overflow:hidden;
}

.playbox_img img
{
	border:1px solid #222222;
	vertical-align:middle;
	margin:10px auto;
	display:block;
}

.playbox_img ul
{
	border-top:1px solid #222222;
	margin:0;
	line-height: 16px;
	padding:10px;
	background-color:#ffffff;
	text-align: left;
}

.playbox h3
{
	border: 1px solid #222222;
	border-bottom:0 !important;
	margin:0 !important;
	line-height:26px;
	padding:2px 0 0 0 !important;
	width: 200px;
	font-size:16px;
	text-indent:48px !important;
	background: url('../img/sq_15.png') no-repeat 28px 7px !important;
}

.playbox_2 h3
{
	border: 1px solid #222222;
	border-bottom:0 !important;
	margin:0 !important;
	line-height:26px;
	padding:2px 0 0 0 !important;
	width: 200px;
	font-size:16px;
	text-indent:40px !important;
	background: url('../img/sq_16.png') no-repeat 20px 7px !important;
}

.playbox h4
{
	text-align: left;
	font-size: 14px;
	padding: 8px 0 8px 30px;
	border-bottom: 1px solid #222222;
	margin-bottom: 0;
	line-height: 18px;
	text-indent: 13px;
	background: #ffffff url('../img/sq_13.png') no-repeat 18px 9px;
}

.playbox_2 h4
{
	text-align: left;
	font-size: 14px;
	padding: 8px 0 8px 30px;
	border-bottom: 1px solid #222222;
	margin-bottom: 0;
	line-height: 18px;
	text-indent: 13px;
	background: #ffffff url('../img/sq_13.png') no-repeat 18px 9px !important;
}

/******************************************************************************

◆ 公演スケジュール表

******************************************************************************/

.playlist
{
	margin:20px 0 20px 0;
}

.playlist h3
{
	border: 1px solid #222222;
	border-bottom:0 !important;
	line-height:26px;
	padding:2px 0 0 0 !important;
	margin:0 !important;
	width: 200px;
	font-size:16px;
	text-indent:42px !important;
	vertical-align: middle !important;
	background: url('../img/sq_14.png') no-repeat 20px 7px !important;
}

.playlist_in
{
	border: 1px solid #222222 !important;
	margin:0;
}

.playlist table
{
	margin: 0 !important;
	padding: 0 !important;
	border:0;
	width: 100%;
}
.playlist tr
{
	margin:0;
	padding:0 !important;
	height: 50px !important;
}

.playlist td
{
	margin:0;
	padding:0;
	border-bottom:1px solid #888888 !important;
	width:60%;
}

.playlist tr.one {background-color:#eeeeee;}
.playlist tr.two {background-color:#ffffff;}

.playlist tr.lastone th{background-color:#eeeeee !important; border-bottom:0 !important;}
.playlist tr.lasttwo th{background-color:#ffffff !important; border-bottom:0 !important;}

.playlist tr.lastone td.last{background-color:#eeeeee; border-bottom:0 !important;}
.playlist tr.lasttwo td.last{background-color:#ffffff; border-bottom:0 !important;}

.playlist th
{
	width: 30px !important;
	padding: 0 !important;
	margin: 0 !important;
	font-size: 0;
	color: #ffffff;
	overflow:hidden;
	vertical-align: middle;
	border-bottom:1px solid #888888;
	text-indent:-9999px;
	background-color:inherit !important;
	background-repeat: no-repeat;
	background-position: 10px 10px;
}

.playlist th.date
{
	width:120px !important;
	font-weight: normal;
	font-size: 12px;
	color: #222222;
	text-indent:10px;
	padding:5px 0 5px 0;
}

.playlist_exp
{
	border: 2px solid #222222;
	margin:0;
}

.playlist_exp th
{
	padding: 0;
	margin: 0;
	font-size: 0;
	color: #ffffff;
	overflow:hidden;
	vertical-align: middle;
	border-right:1px solid #888888;
	border-bottom:1px solid #888888;
	text-indent:-9999px;
	background-color:inherit !important;
	background-repeat: no-repeat;
	background-position: 20px 15px;
}

.playlist_exp td
{
	margin:0;
	padding:5px 10px 5px 10px;
	border-bottom:1px solid #888888;
}

.playlist th.free	{background-image:url('../img/i_free.png');}
.playlist th.class	{background-image:url('../img/i_class.png');}
.playlist th.final	{background-image:url('../img/i_final.png');}
.playlist th.kara	{background-image:url('../img/i_kara.png');}
.playlist th.other	{background-image:url('../img/i_other.png');}

.playlist th.act	{background-image:url('../img/i_act.png'); background-position: 5px 10px !important;}
.playlist th.dance	{background-image:url('../img/i_dance.png'); background-position: 5px 10px !important;}
.playlist th.dracom	{background-image:url('../img/i_dracom.png'); background-position: 5px 10px !important;}
.playlist th.movie	{background-image:url('../img/i_movie.png'); background-position: 5px 10px !important;}
.playlist th.none	{background-image:url('../img/i_none.png'); background-position: 5px 10px !important;}

th.free		{background-image:url('../img/i_free.png');}
th.class	{background-image:url('../img/i_class.png');}
th.final	{background-image:url('../img/i_final.png');}
th.kara		{background-image:url('../img/i_kara.png');}
th.other	{background-image:url('../img/i_other.png');}
th.act		{background-image:url('../img/i_act.png');}
th.dance	{background-image:url('../img/i_dance.png');}
th.dracom	{background-image:url('../img/i_dracom.png');}
th.movie	{background-image:url('../img/i_movie.png');}
th.none		{background-image:url('../img/i_none.png');}

/******************************************************************************

◆ main_page

トップページ、および各公演の記録以外の全コンテンツの描画ボックス。

******************************************************************************/
#main_page
{
	text-align: left;
	background-color: #ffffff;
	padding:10px 10px 10px 10px;
}

/******************************************************************************

◆ 各公演記録、左側のメニュー一覧

******************************************************************************/
#left_contents
{
	width:200px;
	float:left;
	margin:0;
	padding:0;
	font-size:13px;
	border-right:1px solid #222222;
	border-bottom: 1px solid #222222;
}

#left_contents ul{margin:20px 0 20px 10px;}
#left_contents ul li{padding-left:20px;}

li#a, li#b, li#c, li#d, li#e, li#f, li#g, li#h, li#i, li#j, li#k, li#l
{background:url('../img/sq_17.png') no-repeat 0px 5px;}

body#at_a li#a{background:url('../img/sq_18.png') no-repeat 0px 5px;}
body#at_b li#b{background:url('../img/sq_18.png') no-repeat 0px 5px;}
body#at_c li#c{background:url('../img/sq_18.png') no-repeat 0px 5px;}
body#at_d li#d{background:url('../img/sq_18.png') no-repeat 0px 5px;}
body#at_e li#e{background:url('../img/sq_18.png') no-repeat 0px 5px;}
body#at_f li#f{background:url('../img/sq_18.png') no-repeat 0px 5px;}
body#at_g li#g{background:url('../img/sq_18.png') no-repeat 0px 5px;}
body#at_h li#h{background:url('../img/sq_18.png') no-repeat 0px 5px;}
body#at_i li#i{background:url('../img/sq_18.png') no-repeat 0px 5px;}
body#at_j li#j{background:url('../img/sq_18.png') no-repeat 0px 5px;}
body#at_k li#k{background:url('../img/sq_18.png') no-repeat 0px 5px;}
body#at_l li#l{background:url('../img/sq_18.png') no-repeat 0px 5px;}

/******************************************************************************

◆ 各公演記録、右側のボックス全部

******************************************************************************/
#right_contents
{
	width:647px;
	float:right;
	margin:0;
	padding:20px 0 10px 0;
	overflow: hidden;
}

/******************************************************************************

◆ 公演記録のテーブル

******************************************************************************/

#main_page .playlist_in
{
	border: 1px solid #222222;
	margin: 0;
	width:700px;
}

.playtable table
{
	border:1px solid #222222;
	width:828px;
	margin:10px 0 10px 0 !important;
}

.playtable th
{
	text-align:center;
	border-bottom:1px solid #888888 !important;
	border-right:1px solid #888888 !important;
	padding:10px;
}

.playtable td
{
	border-bottom:1px solid #888888 !important;
	padding:10px;
}

.playtable tr.last th,td{border-bottom:0 !important;}
.playtable td.last{border-bottom:0 !important;}

.playtable td.title
{
	font-size: 15px;
	vertical-align: middle;
	height:auto;
}

.playtable td.title img
{
	float: left;
	margin: 5px 15px 5px 5px;
}

.playtable td.leaflet
{
	width:340px;
	padding:0;
	text-align:center;
	border-right:1px solid #666666;
	border-bottom:0 !important;
	background: url('../img/back2.png') repeat 0px 0px;
}

.playtable td.leaflet img
{
	margin:10px 5px 10px 5px;
	border:1px solid #888888;
}


/******************************************************************************

◆ introbox

大文字でのテキストボックス。
様々な用途に使用可能です。

******************************************************************************/

.introbox
{
	margin: 0 18px 0 18px;
	padding: 18px;
	text-align: left;
}


.introbox ul
{
	margin-bottom:20px;
}


/******************************************************************************

◆ topicbox

トピックをひとまとめにするボックス。
今は使ってないかもです。

******************************************************************************/

.topicbox
{
	margin: 20px 0px 5px 0px;
	padding: 10px;
	text-align: left;
}


/******************************************************************************

◆ data

公演情報の公演日時とかを囲んでいるボックスです。

******************************************************************************/

.data
{
	margin: 18px;
	padding: 18px;
	text-align: left;
}

/******************************************************************************

◆ u_navibox

下のほうにある「このページのトップへ」とかに使っています。

******************************************************************************/

.u_navibox
{
	margin-right:20px;
	font-size: 16px;
	width: 95%;
}

.u_navibox ul
{
    width:auto;
	float: right;
	padding: 0 0 0 16px;
}

.u_navibox li
{
	float: left;
	width:auto;
	margin: 16px;
	padding: 3px;
}


/******************************************************************************

◆ 各公演案内の地図表示

******************************************************************************/

.studiomap
{
	float: right;
	font-size: 13px;
	width: 390px;
	line-height: 16px;
	margin: 0;
	padding: 0;
	border: 3px double #222222;
	background-color: #ffffff;
}

.studiomap img
{
	margin: 1px;
}

.outline
{
	width:400px;
	margin:0;
	padding:0;
}


/******************************************************************************

◆ imgbox

公演の画像を貼り付けるのに使っています。
単純に画像をセンタリングして、少し隙間を入れているだけです。

******************************************************************************/

.imgbox
{
	text-align: center;
	padding: 10px;
}

/******************************************************************************

◆ leafbox

各公演記録の縮小していないチラシを表示するのに使っています。

******************************************************************************/

.leafbox
{
	text-align: center;
	padding: 10px;
	margin-top: 20px;
}

.leafbox img
{
	border:1px solid #222222;
}


/******************************************************************************

◆ textbox

最初はテキストを打つためのぼっくすだったのですが、
文字が小さすぎて読みづらくなるので、
長文には向いてません。

******************************************************************************/

div.textbox
{
	font-size: 13px;
	line-height: 25px;
	padding: 0px;
}

.textbox ul
{
	margin:0;
	padding:8px;
}

.textbox table,th,td
{
	margin:0;
	padding:0;
}

/******************************************************************************

◆ icon_ol

「概要」のページにある公演スケジュール表の
アイコン説明のボックスとテーブルです。
ちなみに「icon_ol」の「ol」は「outline」を略しただけです。

******************************************************************************/

.icon_ol
{
	margin: auto;
	width:700px;
}

.icon_ol table
{
	border: 1px solid #222222;
	padding: 0;
}

.icon_ol th, td.ol
{
	border-right: 1px dotted #888888 !important;
	border-bottom: 1px dotted #888888 !important;
}

.icon_ol td.ol_r {border-right:0 !important; border-bottom: 1px dotted #888888 !important;}
.icon_ol td.ol_b {border-right:1px dotted #888888 !important ;border-bottom:0 !important;}
.icon_ol td.ol_rb{border-right:0 !important; border-bottom:0 !important;}

.icon_ol tr.last th{border-bottom:0 !important;}

.icon_ol th
{
	width: 35px;
	text-align:center;
}

.icon_ol th img
{
	display: block;
	margin: auto;
}

.icon_ol td
{
	width: 315px;
}

/******************************************************************************

◆ div

いちおういちいち指定しないで済むように、全部のdiv要素を左詰にします。

******************************************************************************/

div
{
	text-align:left;
}

/******************************************************************************

◆ ul, li

p1とかp2でポインタが表示されますが、指定なしだと何も表示しません。

******************************************************************************/

ul
{
	margin-left: 10px;
	padding-left: 10px;
	font-size: 15px;
}

ul.ticket
{
	margin-top:10px;
}

ul.ticket li.p1
{
	list-style-type: none;
	background: url('../img/sq_06.png') no-repeat 0px 5px;
	text-indent: 18px;
	font-weight:bold;
	border-bottom:1px dotted #222;
	padding-bottom:0;
}

ul.ticket li.p3
{
	list-style-type: none;
	background: url('../img/sq_05.png') no-repeat 0px 5px;
	text-indent: 18px;
	font-weight:bold;
	border-bottom:1px dotted #222;
	padding-bottom:0;
}

li
{
	list-style-type: none;
	line-height: 26px;
}

li.p1
{
	list-style-type: none;
	background: url('../img/sq_06.png') no-repeat 0px 8px;
	text-indent: 16px;
}

li.p2
{
	list-style-type: none;
	background: url('../img/sq_04.png') no-repeat 0px 8px;
	text-indent: 16px;
}

li.p3
{
	list-style-type: none;
	background: url('../img/sq_05.png') no-repeat 0px 8px;
	text-indent: 16px;
}

li.p4
{
	list-style-type: none;
	background: url('../img/sq_01.png') no-repeat 0px 3px;
	text-indent: 16px;
}

li.p5
{
	list-style-type: none;
	background: url('../img/sq_02.png') no-repeat 0px 3px;
	text-indent: 16px;
}

li.p6
{
	list-style-type: none;
	background: url('../img/sq_03.png') no-repeat 0px 3px;
	text-indent: 16px;
}

/******************************************************************************

◆ dl, dt, dd

そこそこ本格的にリスト作りする時に使います。

******************************************************************************/

div.left dt
{
	border-bottom: 1px solid #222222;
	padding: 0 0 0 10px;	
	margin: 10px 0 0 10px;
	list-style-type: none;
	background: url('../img/sq_08.png') no-repeat 6px -1px;
	text-indent: 14px;
	font-size: 15px;
}

div.left dd
{
	margin: 5px 0 20px 20px;
	font-size: 13px;
}

/******************************************************************************

◆ hr

水平線です。ただのhr要素は表示に難があるため、使いません。
よって、区切りを使う場合は

	<div class="hr"><hr /></div>

と指定します。ストライプの区切りができます。

******************************************************************************/

.hr
{
	border: 1px solid #aaaaaa;
	height: 16px;
	margin: 30px 20px 30px 20px !important;
	background: url('../img/back3.png') repeat 0px 0px;
}

.hr hr{display:none;}

/******************************************************************************

◆ p

長い文章を書く時はこの<p>タグを使います。

******************************************************************************/

p
{
	text-indent : 1em;
	line-height: 1.4em;
}

/******************************************************************************

◆ table, tr, th, td

テーブルタグに関するもの全て一まとめにしています。
が、どこかで表示が危うくなったため、各td要素のborder-bottomについては
毎回「!important」と入れてやらないと灰色の線が修正されません。

******************************************************************************/

table
{
	margin: 8px;
	font-style: normal;
	font-size: 13px;
}

th
{
	margin:0.5em;
	padding: 0.5em;
	border-bottom: 1px solid #cccccc;
	border-right:0;
}

td
{
	margin:0.5em;
	padding: 0.5em;
	border-bottom: 1px solid #cccccc !important;
	border-right:0;
}

/******************************************************************************

◆ table.data

公演日時の表示に使っています。

******************************************************************************/

table.data
{
	margin: 10px 10px 10px 10px;
	border: 1px solid #444444;
	padding: 0;
}

table.data th
{
	border: 1px solid #444444;
	margin: 1px;
	padding: 8px;
}

table.data td
{
	border: 1px solid #444444;
	border-bottom: 1px solid #444444 !important;
	margin: 1px 1px 1px 5px;
	padding: 8px;
	text-align : center;
}

/******************************************************************************

◆ table.staff

公演案内、記録のスタッフ表に使っています。

******************************************************************************/

table.staff
{
	margin: 16px auto;
	font-size: 0.8em;
	width:580px;
}

table.staff th
{
	border-bottom: 1px dotted #444444;
	margin: 3px;
	padding: 0.5em 1em 0.5em 1em;
	text-align: right;
	width: 20%;
}

table.staff td
{
	border-bottom: 1px dotted #444444 !important;
	margin: 1px 1px 1px 5px;
	padding: 0.5em 1em 0.5em 1em;
	width: 80%;
}

/******************************************************************************

◆ table.cast table.cast2

公演記録のキャスト表示に使っています。
table.cast2のほうはダブルキャストの表記に使用します。

******************************************************************************/
table.cast, table.cast2
{
	margin: 16px auto;
	font-size: 13px;
	width:580px;
}

table.cast th
{
	border-bottom: 1px dotted #444444;
	margin: 3px;
	padding: 0.5em 1em 0.5em 1em;
	text-align: right;
	width: 40%;
}

table.cast td
{
	border-bottom: 1px dotted #444444 !important;
	margin: 1px 1px 1px 5px;
	padding: 0.5em 1em 0.5em 1em;
	width: 60%;
}

table.cast2 th
{
	border-bottom: 1px dotted #444444;
	margin: 3px;
	padding: 0.5em 1em 0.5em 1em;
	text-align: right;
	width: 40%;
}

table.cast2 td
{
	border-bottom: 1px dotted #444444 !important;
	margin: 1px 1px 1px 5px;
	padding: 0.5em 1em 0.5em 1em;
}

table.cast2 td.em
{
	font-weight: bold;
}
/******************************************************************************

◆ h2

ページタイトルの表記に使用します。
が、各ページの構成上、基本的には邪魔ですので、h2.noneを指定します。

******************************************************************************/

h2
{
	border-bottom: 1px solid #222222;
	vertical-align: middle;
	margin: 30px 0 10px 0;
	padding: 9px 0 9px 18px;
	font-size: 18px;
	background:#ffffff url('../img/sq_11.png') no-repeat 11px 12px;
	text-indent: 16px;
	color: #444444;
}

h2.none
{
	display: none;
}

/******************************************************************************

◆ h3

そのトピック内の表題に使います。
ほとんどこちらが主流です。

******************************************************************************/

h3
{
	border-bottom: 1px solid #888888;
	margin: 18px 0 18px 0;
	padding: 9px 0 2px 18px;
	font-size: 18px;
	text-indent: 16px;
	background: url('../img/sq_10.png') no-repeat 11px 12px;
	color: #444444;
}

/******************************************************************************

◆ h4

各トピック内の見出しに使います。

******************************************************************************/


h4
{
	border-bottom: 1px solid #222222;
	padding: 0 0 2px 18px;
	margin-bottom: 10px;
	font-size: 14px;
	background-image: url('../img/sq_09.png');
	background-repeat: no-repeat;
	background-position: 14px -2px;
	text-indent: 10px;	
}



/******************************************************************************

◆ strong, em

強調文字です。
ちなみに強調の強さは

   strong ＞ em
   
です。

******************************************************************************/

strong
{
	text-decoration: underline;
	color: #ff0000;
	font-style: normal;
	font-weight: bold;
}

em
{
	text-decoration: underline;
	font-style: normal;
	font-weight: bold;
}

/******************************************************************************

◆ message_text

「演出家より」でのみ使っています。

******************************************************************************/

.message_text
{
	margin:20px;
	background-color:#ffffff;
	font-size:15px;
	text-align: justify;
	text-justify: inter-ideograph;
}

.center
{
	text-align:center;
}

.message_text p
{
	line-height:25px;
}

.message_text p.name
{
	text-align:right;
	margin-bottom: 10px;
}

.message_text h3
{
	font-size: 15px;
	margin-top:0;
	margin-bottom: 15px;
	background:0;
	border-bottom:0;
}