@charset "utf-8";
/* CSS Document */

/*
	Site Name: New National Theatre, tokyo
	Description: common setting
	Version: 
	Author: 
*/

/*
===== CONTENTS ===========================================

	01. base layout
	02. tools

==========================================================
*/

/* -------------------------------------------------------
 	01. base layout
------------------------------------------------------- */
#layoutWrapper {
	text-align: left;
	width     : 979px;
	margin    : 10px auto 0 auto;
	border    : 1px solid #333333;
}

/* header layout */
#layoutHeader img {
	float: left;
}

/* GlobalNavi layout */
#layoutGlobalNavi li {
	display: inline;
	margin : 0px;
	padding: 0px;
}
#layoutGlobalNavi li img {
	display: block;
	float  : left;
	margin : 0px;
	padding: 0px;
}

/* contentarea layout */

#layoutMain {
	background      : url(../../story/img/bg_content_bottom.jpg) no-repeat center bottom;
	background-color: #0F0900;
	padding-bottom  : 35px;
}
#bottomText {
	text-align : center;
	padding-top: 20px;
}
#bottomText h3 {
	line-height   : 1.5;
	width         : 90%;
	margin        : 0 auto 10px;
	padding-bottom: 10px;
	border-bottom : 1px solid #404040;
}
#bottomText p span {
	padding-right: 12px;
}

/* footer layout */
#layoutFooter {
	background: url(../img/bg_footer.jpg) repeat-x left top;
	height    : 52px;
	border-top: 1px solid #333333;
}
#layoutFooter div.floatLeft{
	width       : 650px;
}
#layoutFooter div.floatLeft address{
	color     : #6c6c6c;
	font-size : 85%;
	font-style: normal;
	display   : block;
	float     : left;
	padding   : 20px 0 0 15px;
}
/*.mac #layoutFooter div.floatLeft address{
	font-size : 75%;
}*/

#layoutFooter div.floatLeft img{
	display: block;
	float  : left;
}
#layoutFooter .floatRight{
	width       : 285px;
	margin-top  : 10px;
	margin-right: 15px;
}
#layoutFooter .floatRight ul.floatRight{
	width       : 265px;
	margin-top  : 0px;
	margin-right: 0px;
}
#layoutFooter .floatRight li.floatRight {
	width       : 130px;
	margin-top  : 0px;
	margin-right: 5px;
}
#layoutFooter .floatRight p {
	clear      : both;
	padding-top: 6px;
}



/* pagetop layout */
.pagetop {
	font-size    : 85%;
	text-align   : right;
	padding-top  : 15px;
	padding-right: 20px;
}
.pagetop a {
	background  : url(../img/icon_pagetop.gif) no-repeat left center;
	padding-left: 15px;
}
.iconArrow a {
	background  : url(../img/icon_arrow.jpg) no-repeat left top;
	padding-left: 19px;
}









/* -------------------------------------------------------
 	02. tools
------------------------------------------------------- */

.txt-bold     {font-weight:bold;}
.txtGray {
	color: #808080;
}
.txtPink {
	color: #FFC2C2;
}

.txtLightGray {
	color: #b6b6b6;
}
.txtLightRed {
	color: #B48A80;
}



.txt-xxxxxxxxx-large {font-size : 350%; font-weight: bold;}/* size +10 */
.txt-xxxxxxxx-large  {font-size : 280%; font-weight: bold;}/* size +9 */
.txt-xxxxxxx-large   {font-size : 260%; font-weight: bold;}/* size +8 */
.txt-xxxxxx-large    {font-size : 240%; font-weight: bold;}/* size +7 */
.txt-xxxxx-large     {font-size : 220%; font-weight: bold;}/* size +6 */
.txt-xxxx-large      {font-size : 200%; font-weight: bold;}/* size +5 */
.txt-xxx-large       {font-size : 180%; font-weight: bold;}/* size +4 */
.txt-xx-large        {font-size : 160%; font-weight: bold;}/* size +3 */
.txt-x-large         {font-size : 140%; font-weight: bold;}/* size +2 */
.txt-large           {font-size : 120%; font-weight: bold;}/* size +1 */
.txt-small           {font-size :  85%; }/* size -1 */

.indent-text {
	display     : block;
	text-indent : -1em;
	padding-left: -1em;
}

.mt5  { margin-top:  5px;}
.mt6  { margin-top:  6px;}
.mt7  { margin-top:  7px;}
.mt10 { margin-top: 10px;}
.mt11 { margin-top: 11px;}
.mt12 { margin-top: 12px;}
.mt15 { margin-top: 15px;}
.mt17 { margin-top: 17px;}
.mt20 { margin-top: 20px;}
.mt25 { margin-top: 25px;}
.mt30 { margin-top: 30px;}

.mb5  { margin-bottom:  5px;}
.mb6  { margin-bottom:  6px;}
.mb10 { margin-bottom: 10px;}
.mb15 { margin-bottom: 15px;}
.mb20 { margin-bottom: 20px;}
.mb25 { margin-bottom: 25px;}
.mb30 { margin-bottom: 30px;}

.pt5  { padding-top:  5px;}
.pt10 { padding-top: 10px;}
.pt14 { padding-top: 14px;}
.pt15 { padding-top: 15px;}
.pt20 { padding-top: 20px;}
.pt25 { padding-top: 25px;}
.pt30 { padding-top: 30px;}

.pb5  { padding-bottom:  5px;}
.pb10 { padding-bottom: 10px;}
.pb14 { padding-bottom: 14px;}
.pb15 { padding-bottom: 15px;}
.pb20 { padding-bottom: 20px;}
.pb25 { padding-bottom: 25px;}
.pb30 { padding-bottom: 30px;}

.pl5  { padding-left:  5px;}
.pl10 { padding-left: 10px;}
.pl15 { padding-left: 15px;}
.pl20 { padding-left: 20px;}
.pl25 { padding-left: 25px;}
.pl30 { padding-left: 30px;}

.align-center {text-align: center;}
.align-left   {text-align: left;}
.align-right  {text-align: right;}

.floatLeft  {float: left;}
.floatRight {float: right;}
