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

#main_border {
	width:922px;
	border:1px solid #999999;
	padding:0px;
	background-color: #000000;
	height: 3250px;
	margin-top: 30px;
	margin-bottom: 0px;
	margin-left: 40px;
	margin-right: 40px;
	background-image: url(../images/dareback4.jpg);
	background-repeat: no-repeat;
}

#header{
	margin:0px;
	width:922px;
	height: 55px;
	position: relative;
	top: 23px;
	clear: both;
}

#headerBoxLeftBox{
	float: left;
	height: 55px;
	width: 255px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
}

#TitleImage a {
	display:block;
	background-image: url(../images/top_back2.jpg);
	background-repeat: no-repeat;
	height: 55px;
	width: 255px;
}#TitleImage a:hover {
	background-image: url(../images/top_back2.jpg);
	background-repeat: no-repeat;
}
	
#headerBoxRightBox{
	float: right;
	margin-top: 10px;
}

#headerBox{
	float: right;
	clear: both;
}

#headerBox ul {
	width: 599px;
	height:45px;
	float: right;
	clear: both;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

#headerBox li  {
	margin:0px;
	height: 45px;
	list-style-type:none;
	float: left;
}

#header li a {
	display: block;
	height: 45px;
	background-position: 0 0;
	background-repeat: no-repeat;
	text-decoration: none;
	margin:0px;
}    

#header #actors a  {
	background-image: url(../images/menu_act_1.jpg);
	width:100px;
}

#header #news a {
	background-image: url(../images/menu_news_1.jpg);
	width:120px;
}

#header #shopping a {
	background-image: url(../images/menu_shop_1.jpg);
	width:120px;
}

#header #aboutus a {
	background-image: url(../images/menu_about_1.jpg);
	width:120px;
}

#header #contact a {
	background-image: url(../images/menu_cont_1.jpg);
	width:139px;
}



#header #actors a:hover {
	background-image: url(../images/menu_act_2.jpg);
	width:100px;
}

#header #news a:hover {
	background-image: url(../images/menu_news_2.jpg);
	width:120px;
}

#header #shopping a:hover {
	background-image: url(../images/menu_shop_2.jpg);
	width:120px;
}

#header #aboutus a:hover {
	background-image: url(../images/menu_about_2.jpg);
	width:120px;
}

#header #contact a:hover {
	background-image: url(../images/menu_cont_2.jpg);
	width:139px;
}

.subTitle {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 18px;
	font-style: italic;
	font-weight: bold;
	color: #C00;
	float: left;
	padding-top: 50px;
	padding-left: 65px;
	clear: both;
	width: 500px;
	text-align: left;

}

.subTitle2 {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 18px;
	font-weight: bold;
	font-style: italic;
	color: #C00;
	float: left;
	padding-top: 38px;
	padding-left: 95px;
	clear: both;
	text-align: left;
	width: 700px;
	line-height: 1.2em;
}

.subTitle3 {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 15px;
	font-weight: bold;
	color: #CCC;
	float: left;
	padding-top: 40px;
	padding-left: 140px;
	clear: both;
	text-align: left;
	width: 750px;
}



span.btn1{
	border: 1px solid #000000;
	border-radius:35px;
	-moz-border-radius:35px;
	-webkit-border-radius:35px;
	box-shadow:1px 1px 3px #ccc;
	-moz-box-shadow:1px 1px 3px #ccc;
	-webkit-box-shadow:1px 1px 3px #ccc;
	font-size:14px;
	font-weight:bold;
	text-align:center;
	padding:13px 28px;
	margin-right:10px;
	margin-left:10px;
	/*-- 背景のグラデーション（webkitとmozillaで異なる） --*/
	background: -webkit-gradient(linear, left top, left bottom,
	                             color-stop(0, #81b5b2),
	                             color-stop(0.49, #a1c8c6),
															 color-stop(0.51, #65a5a1),
															 color-stop(1, #a1c8c6)) ;
	background: -moz-linear-gradient(top,#81b5b2 0%, #a1c8c6 49%, #65a5a1 51%, #a1c8c6 100%) ;
	background-color:#399;	/*-- IE用背景色 --*/
	text-shadow:-1px -1px 0 #666,	/*-- 左1px、上1pxの位置に#666でぼかさず描画 --*/
	             0 0 5px #333;	/*-- 全体のぼかし --*/
}

span.btn1 a{
	color:#FFF;
}
span.btn1 a:hover{
	text-shadow:-1px -1px 0 #666,	/*-- 左1px、上1pxの位置に#666でぼかさず描画 --*/
	             0 0 5px #FFF;	/*-- ロールオーバーで光のようなぼかしに変更 --*/
}

span.btn2{
	border: 1px solid #666666;
	border-radius:35px;
	-moz-border-radius:35px;
	-webkit-border-radius:35px;
	box-shadow:1px 1px 3px #ccc;
	-moz-box-shadow:1px 1px 3px #ccc;
	-webkit-box-shadow:1px 1px 3px #ccc;
	font-size:16px;
	font-weight:bold;
	text-align:center;
	padding:13px 28px;
	margin-right:10px;
	margin-left:10px;
	/*-- 背景のグラデーション（webkitとmozillaで異なる） --*/
	background: -webkit-gradient(linear, left top, left bottom,
	                             color-stop(0, #ffbca6),
	                             color-stop(0.49, #ffd8ca),
															 color-stop(0.51, #ff6633),
															 color-stop(1, #ffbda4));
	background: -moz-linear-gradient(top,#ffbca6 0%, #ffbda4 49%, #ff6633 51%, #ffbda4 100%);
	background-color:#F60;	/*-- IE用背景色 --*/
	text-shadow:-1px -1px 0 #666,	/*-- 左1px、上1pxの位置に#666でぼかさず描画 --*/
	             0 0 5px #000;	/*-- 全体のぼかし --*/
}
span.btn2 a{
	color:#FFFFFF;
}
span.btn2 a:hover{
	text-shadow:-1px -1px 0 #666,	/*-- 左1px、上1pxの位置に#666でぼかさず描画 --*/
	             0 0 5px #FFF;	/*-- ロールオーバーで光のようなぼかしに変更 --*/
}


span.btn3{
	color:#F63;
	border: 1px solid #b06951;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	box-shadow:1px 1px 3px #ccc;
	-moz-box-shadow:1px 1px 3px #ccc;
	-webkit-box-shadow:1px 1px 3px #ccc;
	font-size:24px;
	text-align:center;
	padding:15px 40px;
	/*-- 背景のグラデーション（webkitとmozillaで異なる） --*/
	background: -webkit-gradient(linear, left top, left bottom,
	                             color-stop(0, #ffe0b3),
															 color-stop(0.7, #ffb852),
															 color-stop(1, #ffe0b3)) ;
	background: -moz-linear-gradient(top,#ffe0b3 0%, #ffb852 70%, #ffe0b3 100%) ;
	background-color:#FC3;	/*-- IE用背景色 --*/
	text-shadow:-1px -1px 0 #FFF,	/*-- 左1px、上1pxの位置に#FFFでぼかさず描画 --*/
	            1px 1px 0 #cb3f11;	/*-- 右1px、下1pxの位置に#cb3f11でぼかさず描画 --*/
}
span.btn3 a{
	color:#F63;
}
span.btn3 a:hover{
	color:#F90;
}


/* nextstage */

#titleBox {
	float: left;
	margin-top: 100px;
	margin-left: 117px;
	clear: both;
	height: 70px;
	width: 685px;
	display: inline;
}

.subtitleBox {
	float: left;
	margin-top: 20px;
	margin-left: 117px;
	clear: both;
	height: 16px;
	width: 685px;
	display: inline;
}

.subtitleBoxLeft {
	float: left;
	clear: both;
	height: 30px;
	width: 429px;
	font-size: 16px;
	color: #FFF;
	font-weight: bold;
	text-align: left;
	padding-left: 38px;
}

.subtitleBoxRight {
	float: right;
	height: 30px;
	width: 200px;
	font-size: 11px;
	color: #999;;
	text-align: right;
	padding-right: 13px;
}
.textBox {
	float: left;
	margin-top: 5px;
	margin-left: 183px;
	clear: both;
	width: 600px;
	padding-left: 0px;
	text-align: left;
	display: inline;
	font-size: 12px;
	color: #FFF;
	height: 20px;
	margin-bottom: 10px;
	margin-right: 30px;
}

.textBox_title {
	float: left;
	margin-top: 30px;
	margin-left: 250px;
	clear: both;
	width: 430px;
	padding-left: 0px;
	text-align: center;
	display: inline;
	font-size: 14px;
	line-height: 18px;
	color: #FFF;
	height: 20px;
}

.button {
	float: left;
	margin-top: 30px;
	margin-left: 110px;
	clear: both;
	width: 740px;
	text-align: left;
	display: inline;
	height: 40px;
}

.button2 {
	float: left;
	margin-top: 30px;
	margin-left: 330px;
	clear: both;
	width: 640px;
	text-align: left;
	display: inline;
	height: 40px;
}

.kirokuBox {
	float: left;
	height: 70px;
	width: 650px;
	padding-top: 20px;
	padding-left: 180px;
}

.kirokuBoxLeft {
	float: left;
	height: 70px;
	width: 325px;
	padding-top: 0px;
	padding-left: 0px;
	font-size: 12px;
	line-height: 18px;
	color: #FFF;
	text-align: left;	
}

.kirokuBoxRight {
	float: right;
	height: 70px;
	width: 305px;
	padding-top: 0px;
	padding-left: 20px;
	font-size: 12px;
	line-height: 18px;
	color: #FFF;
	text-align: left;
}

.textBox2 {
	float: left;
	margin-top: 10px;
	margin-left: 160px;
	clear: both;
	width: 630px;
	padding-left: 0px;
	text-align: left;
	display: inline;
	font-size: 12px;
	line-height: 18px;
	color: #FFF;
	margin-bottom: 20px;
}

.story {
	font-size: 12px;
	color: #000000;
	padding-top: 30px;
	padding-left: 30px;
	padding-right: 30px;
	float: left;
	height: 200px;
	width: 640px;
	display: inline;
	margin-top: 30px;
	margin-left: 120px;
	margin-bottom: 15px;
	text-align: left;
	background-color: #D2DEFD;
	/*角丸を表現する*/
    border-radius: 8px;/* CSS3草案 */
	-webkit-border-radius: 10px; /* Safari,Google Chrome用 */
	-moz-border-radius: 10px; /* Firefox用 */
	/*横幅 縦幅 ぼかし具合 色*/
    -webkit-box-shadow: 0px 0px 20px #000;/* Safari,Google Chrome用 */
	-moz-box-shadow: 0px 0px 20px #000;/* Firefox用 */
	box-shadow: 0px 0px 20px #000;/* CSS3草案 */
}

.storyleft {
	float: left;
	width: 450px;	
}

.storyright {
	float: right;
	width: 157px;
	margin-right: 10px;
	margin-top: 0px;
}

.story2 {
	color: #000000;
	padding-top: 35px;
	padding-left: 59px;
	padding-right: 55px;
	float: left;
	height: 195px;
	width: 564px;
	display: inline;
	margin-top: 15px;
	margin-left: 120px;
	margin-bottom: 10px;
	text-align: left;
	background-color: #E8E8E8;
	/*角丸を表現する*/
    border-radius: 8px;/* CSS3草案 */
	-webkit-border-radius: 10px; /* Safari,Google Chrome用 */
	-moz-border-radius: 10px; /* Firefox用 */
	/*横幅 縦幅 ぼかし具合 色*/
    -webkit-box-shadow: 0px 0px 20px #000;/* Safari,Google Chrome用 */
	-moz-box-shadow: 0px 0px 20px #000;/* Firefox用 */
	box-shadow: 0px 0px 20px #000;/* CSS3草案 */
	font-size: 14px;
}

.story22 {
	padding-top: 35px;
	float: left;
	height: 2500px;
	width: 678px;
	display: inline;
	margin-top: 15px;
	margin-left: 120px;
	margin-bottom: 10px;
	text-align: left;
	background-color: #E8E8E8;
	/*角丸を表現する*/
    border-radius: 8px;/* CSS3草案 */
	-webkit-border-radius: 10px; /* Safari,Google Chrome用 */
	-moz-border-radius: 10px; /* Firefox用 */
	/*横幅 縦幅 ぼかし具合 色*/
    -webkit-box-shadow: 0px 0px 20px #000;/* Safari,Google Chrome用 */
	-moz-box-shadow: 0px 0px 20px #000;/* Firefox用 */
	box-shadow: 0px 0px 20px #000;/* CSS3草案 */
	font-size: 12px;
}

li {
list-style-position: outside;
list-style-image: url(your_bullet.gif);
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
} 

.story3 {
	color: #000000;
	padding-top: 20px;
	padding-left: 50px;
	padding-right: 30px;
	float: left;
	height: 260px;
	width: 598px;
	display: inline;
	margin-top: 30px;
	margin-left: 120px;
	margin-bottom: 0px;
	text-align: left;
	background-color: #E8E8E8;
	/*角丸を表現する*/
    border-radius: 8px;/* CSS3草案 */
	-webkit-border-radius: 10px; /* Safari,Google Chrome用 */
	-moz-border-radius: 10px; /* Firefox用 */
	/*横幅 縦幅 ぼかし具合 色*/
    -webkit-box-shadow: 0px 0px 20px #000;/* Safari,Google Chrome用 */
	-moz-box-shadow: 0px 0px 20px #000;/* Firefox用 */
	box-shadow: 0px 0px 20px #000;/* CSS3草案 */
}

.tableBox {
	float: left;
	width: 620px;
	margin-left: 30px;
	display: inline;
	margin-top: 5px;
}

table#sample1 {border-collapse:collapse}
table#sample2 {border-collapse:separate}
table, th, td {border:1px solid #999999}
th {
	color:#000000;
	background-color:#F2F2F2;
	font-weight: normal;
	text-align: left;
}
caption {
	font-size:14px;
	font-weight:normal;
	color:#000;
	background: transparent;
	text-align: left;
	padding-top: 10px;
	padding-bottom: 6px;
}

.buttonBox {
	width: 500px;
	height: 25px;
	clear: both;
	float: left;
	margin-top: 20px;
	margin-left: 220px;
	display: inline;
}

.buttonBoxLeft {
	float: left;
	height: 25px;
	width: 222px;
}

.buttonBoxLeft a {
	display:block;
	background-image: url(../images/map_button_1.jpg);
	background-repeat: no-repeat;
	width: 222px;
	height: 25px;
}

.buttonBoxLeft a:hover {
	background-image: url(../images/map_button_2.jpg);
	background-repeat: no-repeat;
	width: 222px;
	height: 25px;
}

.buttonBoxRight {
	float: right;
	height: 25px;
	width: 222px;
}

.buttonBoxRight a {
	display:block;
	width: 222px;
	height: 25px;
	background-image: url(../images/zaseki_button_1.jpg);
	background-repeat: no-repeat;
}

.buttonBoxRight a:hover {
	width: 222px;
	height: 25px;
	background-image: url(../images/zaseki_button_2.jpg);
	background-repeat: no-repeat;
}

.pagetopBox {
	float: left;
	margin-top: 20px;
	margin-left: 117px;
	clear: both;
	height: 16px;
	width: 685px;
	display: inline;
}

.pagetopBoxLeft {
	float: left;
	clear: both;
	height: 30px;
	width: 532px;
	font-size: 12px;
	color: #FFF;;
	text-align: left;
	padding-left: 38px;
}

.pagetopBoxRight {
	float: right;
	height: 30px;
	width: 97px;
	font-size: 12px;
	color: #999;;
	text-align: right;
	padding-right: 13px;
}

.pagetop {
	font-size: 12px;
	margin-top: 30px;
	margin-left: 100px;
	display: inline;
	float: left;
	clear: both;
	padding-left: 15px;
	width: 200px;
	text-align: left;
}


#footer_frame {
	width:922px;
	padding:0px;
	background-color: #000000;
	height: 200px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 40px;
	margin-right: 40px;
	clear: both;
	float: left;
}

#footer{
	width:922px;
	height: 60px;
	position: relative;
	clear: both;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

#footerBox{
	float: right;
	clear: both;
}

#footerImage a {
	display:block;
	background-image: url(../images/top_back_f.jpg);
	background-repeat: no-repeat;
	height: 60px;
	width: 245px;
}

#footerImage a:hover {
	background-image: url(../images/top_back_f.jpg);
	background-repeat: no-repeat;
}


#copyright {
	background-image: url(../images/copyright.jpg);
	background-repeat: no-repeat;
	clear: both;
	float: left;
	margin-top: 15px;
	height: 14px;
	width: 256px;
}



/*clearfix */

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {
	display: inline-block;
}

* html .clearfix {
	height: 1%;
}

.clearfix {
	display:block;
}

/*clearfix end */