@charset "utf-8";

/*

	CSS for 輪廻のラグランジェ
	revised on 2010.07.28 by Mr.T
	Version: 1.0.0

*/

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

	YUI2 CSS reset
	
============================================== */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img {  border:0; }
address,caption,cite,code,dfn,em,/*strong,*/th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul { list-style:none; }
caption,th { text-align:left; }
h1,h2,h3,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after { content:''; }
abbr,acronym { border:0; }
.clear {
	clear: both;
	line-height: 0;
	height: 0;
	width: 0;
}
.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}
.clearfix { display: inline-block; }
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */

a {
 outline: 0;
}
.caption {
	text-align: center;
}

/* ==============================================
	
	common
	
============================================== */
body {
	line-height: 1.4em;
	background: #e2f0f0 ;
	font-family: 'ＭＳ Ｐゴシック', 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro' verdana, san-serif;
	font-size: 80%;
	color: #4e4e4e;

}
body#goodsPop {
	background: #fff;
}
a {
	text-decoration: none;
	color: #ff7700;
}

#wrapper {
margin: 0 auto;
	width: 960px;
	background-color: #fff;
}
#header {
	width: 960px;
	height: 100px;
	background: url(../img/bg_header.jpg) no-repeat ;
}
#header h1{
	padding: 3px 0 0 15px;
}
#header h4{
	padding: 3px 0 0 15px;
	font-size: 110%;
	font-weight: bold;
}
/* フッター */
#footer {
	width: 960px;
	height: 165px;
	overflow: hidden;
	background: url(../img/bg_footer.jpg) no-repeat ;
}
/* コピーライト */
#copyright {
	text-indent: -9999px;
	width: 272px;
	height: 14px;
	padding-top:134px;
	background: url(../img/copy.gif) no-repeat 15px bottom;
	color:#fff;
}

/* フッターバナーエリア */
#footer ul {
	padding: 20px 0 0 20px;
	width: 500px;
	margin-right: 150px;
	overflow: hidden;
}

#footer li{
	padding-right: 10px;
	margin-bottom: 5px;

	float: left;
}
#bnArea {
	float: left;
}

#bnMobile {
	padding-top: 18px;
	width: 288px;
	float: left;
}
/* 基本レイアウト */


.bold {
	font-weight: bold;
}
.boldB {
	font-weight: bold;
	color: #344aa0;
}
.boldG {
	font-weight: bold;
	color: #00a77b;
}
.boldO {
	font-weight: bold;
	color: #ff7900;
}
.small {
	font-size: 85%;
}
.smallCenter {
	font-size: 85%;
	text-align: center;
}
.midashi {
	font-weight: bold;
	color: #00a77b;
	padding-bottom: 0.8em;
	font-size: 120%;
}
.midashiB {
	font-weight: bold;
	color: #344aa0;
	padding-bottom: 0.5em;
	font-size: 120%;
}
.midashiCD {
	font-weight: bold;
	color: #ff7900;
	font-size: 150%;
	line-height: 120%;
}
.txtLink {
	line-height: 1em;
	background: url(../img/icon_arrow.gif) no-repeat ;
	padding: 0 0 5px 10px!important;
}

.newLine {
	margin-bottom: 20px;
}
.caution {
	font-size: 85%;
	color: #ff381e;
	padding-bottom: 1.5em;
}

.pink {
	color: #fd3362;
}
.red {
	color: #ff4343;
}

/**** 共有設定 ****/

/* コンテナの設定 */
#introContainer,#akatokiContainer {
	width: 960px;
	padding: 10px 0;
	overflow: hidden;
	margin-bottom: 10px;
}
/* タイトルの設定 */
#introContainer h2,#charaContainer h2,#akatokiContainer h2{
	padding: 5px 0 10px 5px;
}
/* テキストの設定 */
.rightBox p,.with680Box p,#storyRight p,#eventRight p {
	padding-bottom: 10px;
}

/**** 画像が右に来るページ ****/
.leftBox320 {
	width: 370px;
	float: left;
	padding-right: 10px;
}
.leftBox {
	width: 470px;
	float: left;
	padding-right: 10px;
}
.rightBox {
width: 200px;
float: left;
}
.leftBox02 {
	width: 410px;
	float: left;
	padding-right: 10px;
}
.rightBox {
	padding-right: 10px;
}
.bddvdmenu {
	width: 320px;
	overflow: hidden;
}
.bddvdmenu li{
	width: 150px;
	float: left;
}

.linkDummy {
	text-indent: -9999px;

}

/* 右全部使用用 */
#right680 {
	width: 724px;
	float: left;
	padding-bottom: 10px;
	position: relative;
}
.with680Box {
	padding: 0 10px 40px 20px;
	background: url(../img/bg_minibox_middle.jpg) repeat-y;
	overflow: hidden;
}

/* 右全部使用用 470pxで画像付きとかの時の商品詳細などdl*/

.leftBox .goodsInfo dd {
	padding: 0 0 10px 10px; 
}

/*----------- 【共通】全部サブメニュー --------------*/
#leftMenu {
	width: 200px;
	margin: 0 auto;
	float: left;
	padding-right: 15px;
}
#leftMenuTop img{
	vertical-align: bottom;
}
#leftMenuBottom img{
	vertical-align: top;
}
/* 【共通】紫の */
ul#leftMenuP {
	padding: 8px 0 5px 5px;
	width: 200px;
	background: url(../img/bg_charalist_middle.jpg) repeat-y;
}
#leftMenuP li{
	width: 190px;
	margin-bottom: 3px;
}
#leftMenuP a {
	color: #fff;
	padding: 5px 0 0 20px;
	display: block;
	height: 30px;
	background: url(../img/btn_productlist_off.png) no-repeat;
}
#leftMenuP a:hover{
	display: block;
	color: #000;
	background: url(../img/btn_productlist_on.png) no-repeat ;
}
.leftMenuTitle {
	margin-bottom: 10px;
	padding: 3px 0 10px 40px;
	font-size: 120%;
	color: #fff;
	background: url(../img/bg_subtitle_s.jpg) no-repeat ;
}

/* ==============================================
	
	各ページCSS
	
============================================== */


/* ===================================
	TOP
=================================== */
#topContainer {
	width: 960px;
	padding: 10px 0;
	overflow: hidden;

}
#leftBox {
	width: 466px;
	padding-left: 7px;
	float: left;
	position: relative;
}

#btn_keyDays {
	width: 130px;
	height: 130px;
	padding-bottom: 5px;
	position: absolute;
	top:-15px;
	left: 360px;
	z-index: 51;
}
#eventWonfes {
	width: 466px;
	height: 74px;
	padding-bottom: 5px;
}
#topKeyBn {
	width: 280px;
	height: 50px;
	position: absolute;
	top:90px;
	left: 190px;
	z-index: 51;
}
#topKeyBn02 {
	width: 280px;
	height: 50px;
	position: absolute;
	top: 150px;
	left: 190px;
	z-index: 53;
}
#key {
	width: 466px;
	height: 690px;

}

#rightBox {
	width: 487px;
	float: left;
}

#catch01 {
	position: relative;
	width: 487px;
	height: 170px;
	margin-bottom: 10px;
}
#topHoso {
	width: 94px;
	position: absolute;
	top: 70px;
	left: 375px;
}
#catch02{
	width: 460px;
	padding: 0 0 5px 15px;
	overflow: hidden;
}
#catch02 li{
	float: left;
	padding-right: 10px;
}
* html #catch02 li{
	float: left;
	padding-right: 5px;
}
#catch02 li{
	float: left\9;
	padding-right: 5px\9;
}
#catch02 li:last-child{
	padding: 0;
}
*:first-child+html #catch02 li{
	float: left;
	padding-right: 5px;
}
#catch03{
	padding-left: 16px;
	margin-bottom: 10px;
}
#prArea {
	margin-left: 15px;
	width:432px;
	height: 217px;
	background: url(../img/bg_pr.jpg) no-repeat;
	overflow: hidden;
	padding:25px 15px 0 15px;
}

.tw{
	height: 200px;
	overflow: scroll;
	overflow-x: hidden;
}

#slideArea ul{
	width: 170px;
	height:195px;
}
#slideArea li{
	width: 200px;
	height:65px;
}
#slideArea li img{
	margin-bottom:5px;
}
#prArea #topMovie{
	width: 240px;
	float:right;
}
.bx-wrapper{
	width: 170px !important;
	height:195px;
	float: left;
}

/* Twitter */

#twitterArea {
	width:220px;
	height: 120px;
	padding: 10px 20px 0 15px;
	float: left;
}
* html #twitterArea {
	width:220px;
	height: 120px;
	padding: 10px 0 0 15px;
	float: left;
}
#twitterTitle img{
	vertical-align: ;
}
#hTug {
	width: 220px;
	height: 32px;
	background: url(../img/twitter_bottom.jpg) no-repeat;
	position: relative;
}
#hTug p {
	text-align: center;
	width: 170px;
	color: #fff;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	-moz-border-radius-bottomright: 10px;
	-moz-border-radius-bottomleft: 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	border-radius: 10px 10px 10px 10px; 
	background: #333;
	position: absolute;
	top: 7px;
	left: 25px;
	padding-bottom: -10px !important;
}


#twitterContainer {
	width: 216px;
	height: 120px;
	border-left: #93cec6 2px solid;
	border-right: #93cec6 2px solid;
}
#twitterInner {

}

#twtr-widget-1 .twtr-hd,
#twtr-widget-1 .twtr-ft {
    display: none !important;
}

/* 新着情報 */
#newsArea {
	width:330px;
	height: 190px;
	padding: 10px 15px 0 15px;
	float: left;
}
#newsArea dl{
	height: 120px;
	border-left: #ffbc82 2px solid;
	border-right: #ffbc82 2px solid;
	overflow: auto;
}
#newsArea dt{
	padding: 2px 0 0 5px;
}
#newsArea dd{
	padding: 2px 0 3px 5px;
	margin-bottom: 3px;
	border-bottom: #ff7700 dotted 1px;
}
#newsMore {
	width: 330px;
	height: 32px;
	padding: 6px 0 0 205px ;
	background: url(../img/news_bottom.jpg) no-repeat;
	z-index: 8;
}
/* =====ポップアップ========*/


#hosoPop {
	background: #fff;
	padding:20px;
}
#hosoPop  dd{
	width: 95%;
	color: #333;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px; 
	background: #e1eafe;
	padding: 0.5em 0.8em;
	margin-bottom: 0.3em;


}
#catch01 #topHosoText a{

}
#topHosoText{

	width: 420px;
	height: 150px;
	padding:20px 20px 0;
}
#topHosoText span{
	display:block;
	margin-bottom:5px;
}
/* ===================================
	グローバルナビ
=================================== */
#nav {
	width: 960px;/*960px*/
	height: 38px;
	margin: 0 auto;
	background: url(../img/g_navi_off.png) no-repeat top center;
	z-index: 100;
}

#nav li {
	display: block;
	float: left;
	position: relative;
	z-index: 100;
}

#nav a {
	display: block;
}
	#navNews,#navIntroduction,#navStory,#navStaffcast,#navCharacter,#navMechanic,#navMovie,#navProduct,#navSpecial,#navEvent  {
		height: 38px;
		text-indent: -9999px;
	}

#nav a:hover{
	display: block;
	background: url(../img/g_navi_on.png) no-repeat top center;
}
#nav #navNews { width: 73px; background-position: 0 0; }
#nav #navIntroduction { width: 132px; background-position: -73px 0; }
#nav #navStory { width: 70px; background-position: -205px 0; }
#nav #navStaffcast { width: 113px; background-position: -275px 0;}
#nav #navCharacter { width: 106px; background-position: -388px 0; }
#nav #navMechanic { width: 100px; background-position: -494px 0; }
#nav #navMovie { width: 71px; background-position: -594px 0; }
#nav #navProduct { width: 93px; background-position: -665px 0; }
#nav #navSpecial { width: 85px; background-position: -758px 0; }
#nav #navEvent { width: 117px; background-position: -843px 0; }
/* hover */
#nav a#navNews:hover { width: 73px; background-position: 0 0; }
#nav a#navIntroduction:hover { width: 132px; background-position: -73px 0px; }
#nav a#navStory:hover { width: 70px; background-position: -205px 0px; }
#nav a#navStaffcast:hover { width: 113px; background-position: -275px 0;}
#nav a#navCharacter:hover { width: 106px; background-position: -388px 0; }
#nav a#navMechanic:hover { width: 100px; background-position: -494px 0; }
#nav a#navMovie:hover { width: 71px; background-position: -594px 0; }
#nav a#navProduct:hover { width:93px; background-position: -665px 0; }
#nav a#navSpecial:hover { width: 85px; background-position: -758px 0; }
#nav a#navEvent:hover { width: 117px; background-position: -843px 0; }

	#nav ul {
		display: none;
		width: 140px;
		background: #28898e;
		border-left: 1px solid #9aa5c0;
		position: absolute;
		top: 32px;
		z-index: 101;
	}
	#nav ul li {
		float: left;
	}
	#nav ul li a {
		width: 124px;
		padding: 8px;
		border-bottom: 1px solid #227178;
		border-right: 1px solid #227178;
		color: #def;
	}
	#nav ul li a:hover {
		background: #43cdb2;
		color:#fff;
	}

/* ===================================
	NEWS
=================================== */
#newsContainer {
	width: 960px;
	padding: 10px 0;
	margin-bottom: 20px;
}
#newsContainer h2{
	padding: 5px 0 10px 5px;
}
#newsInner {
	width: 920px;

	margin: 0 auto ;
}
#newsInner dl {

	padding: 20px 40px 20px;
	background: url(../img/bg_box_middle.jpg) repeat-y;
}
#newsContainer dt{
	font-weight: bold;
}
#newsContainer dd{
	padding-bottom: 5px;
	margin-bottom: 5px;
	border-bottom: #557fb9 1px dotted;
}
/* =====ポップアップ========*/

#newsInner #s01Txt,
#newsInner #s02Txt,
#newsInner #s03Txt{
	display:none;
}
#s01Txt{
	width: 420px;
	height: 150px;
	padding:20px 20px 0;
}
#s02Txt{
	width: 420px;
	height: 300px;
	padding:20px 20px 0;
}
#s03Txt{
	width: 600px;
	height: 150px;
	padding:20px 20px 0;
}
#s01Txt span,
#s02Txt span,
#s03Txt span{
	display:block;
	margin-bottom:5px;
}
/* ===================================
	イントロダクション
=================================== */
#introInner {
	width: 920px;
	margin: 0 auto 40px;
}
#introBox {
	padding: 40px 40px 40px;
	background: url(../img/bg_box_middle.jpg) repeat-y;
}
#introBox p{

	line-height: 160%;
	padding-bottom: 20px;
}

/* ===================================
	ストーリー
=================================== */
#storyContainer {
	width: 960px;
	padding: 10px 0;
	overflow: hidden;
	margin-bottom: 10px;
}
#storyContainer h2{
	padding: 5px 0 10px 5px;
}
#storyRight {
	width: 724px;
	float: left;
	padding-bottom: 10px;
}
.storyBox {
	padding: 20px 0 15px 20px;
	background: url(../img/bg_minibox_middle.jpg) repeat-y;
	overflow: hidden;
	border-bottom: #557fb9 1px dotted;
}
/* ストーリー一覧 */
#storyLeft {
	width: 200px;
	margin: 0 auto;
	float: left;
	padding-right: 15px;
}
#storylistTop img{
	vertical-align: bottom;
}
#storylistBottom img{
	vertical-align: top;
}
#storyLeft ul{
	padding: 8px 0 5px 5px;
	width: 200px;
	background: url(../img/bg_charalist_middle.jpg) repeat-y;
}
#storyLeft li {
	width: 190px;
	height: 20px;
	background: url(../img/btn_charalist_off.png) no-repeat;
	margin-bottom: 3px;

}
#storyLeft a {
	color: #fff;
	padding: 2px 0 0 20px;
	display: block;
}
#storyLeft a:hover{
	color: #000;
	background: url(../img/btn_charalist_on.png) no-repeat ;
}
.storyBox .leftBox {
	width: 380px;
	float: left;
	padding-right: 10px;
}
.storyBox .rightBox {
	padding-right: 10px;
}

.storyBox .rightBox ul{
	width: 280px ;
	height: 325px ;
	background: url(../img/story_bg.jpg) no-repeat ;
	padding: 10px 0 0 10px;
}
.storyBox .rightBox li{
	padding-bottom: 7px;
}
.storyBox .rightBox img {
-webkit-box-shadow: 3px 3px 3px 3px #000;
-moz-box-shadow: 3px 3px 3px 3px #000;
box-shadow:3px 3px 3px rgba(0,0,0,0.6);
}

.storyBox .Box {
	width: 680px;
}

.storyBox .Box ul {
	margin: 0 10px;
	overflow: hidden;
	background: #444444; /* Old browsers */
	background: -moz-linear-gradient(top,  #444444 0%, #333333 50%, #292929 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#444444), color-stop(50%,#333333), color-stop(100%,#292929)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #444444 0%,#333333 50%,#292929 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #444444 0%,#333333 50%,#292929 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #444444 0%,#333333 50%,#292929 100%); /* IE10+ */
	background: linear-gradient(top,  #444444 0%,#333333 50%,#292929 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444', endColorstr='#292929',GradientType=0 ); /* IE6-9 */
	
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px 20px;
    
}
.storyBox .Box li {
	float: left;
	width: 300px;
	padding-right: 20px;
}
.storyBox .Box li.lastChild {
	padding-right: 0;
}
.storyBox .Box .caption {
	text-align: center;
	color:#888888;
	font-size: 90%;
}

/* 右寄せテキスト小説にも使用 */
.storyBox .Box .writer{
	padding: 10px 10px 20px 0;
	text-align: right;
}
.storyBox .Box .textArea {
	padding-left:40px ;
	width: 90%;
}
.storyBox .Box .textSpace {
	font-size: 85%;
	text-align: center;
	padding: 1.5em 0 ;
}
.hekirekiImage {
	text-align: center;
}

/* 年表 */
#chronologyTable {
	width: 724px;
	position: relative;
}
#chronoTitle {
	margin: 1em auto ;
}
#chronologyTable table{
	width: 680px;
	border: 1px #E3E3E3 solid;
    border-collapse: collapse;
    border-spacing: 0;
}
#chronologyTable th{
	width: 340px;
	padding: 5px;
    border: #E3E3E3 solid;
    border-width: 0 0 1px 1px;
    font-weight: bold;
    line-height: 120%;
    text-align: center;
    color: #fff;
}
#chronologyTable #titleEarth {
background: #10b797; /* Old browsers */
background: -moz-linear-gradient(top,  #10b797 0%, #23767e 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#10b797), color-stop(100%,#23767e)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #10b797 0%,#23767e 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #10b797 0%,#23767e 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #10b797 0%,#23767e 100%); /* IE10+ */
background: linear-gradient(top,  #10b797 0%,#23767e 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#10b797', endColorstr='#23767e',GradientType=0 ); /* IE6-9 */
}
#chronologyTable #titlePori {
background: #7a79e0; /* Old browsers */
background: -moz-linear-gradient(top,  #7a79e0 0%, #383c7b 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7a79e0), color-stop(100%,#383c7b)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #7a79e0 0%,#383c7b 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #7a79e0 0%,#383c7b 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #7a79e0 0%,#383c7b 100%); /* IE10+ */
background: linear-gradient(top,  #7a79e0 0%,#383c7b 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7a79e0', endColorstr='#383c7b',GradientType=0 ); /* IE6-9 */

}
#chronologyTable td{
	width: 340px;
	padding: 5px;
    border: 1px #E3E3E3 solid;
    border-width: 0 0 1px 1px;
}
#chronologyTable .earth {
	background: #e6fcf8;
}
#chronologyTable .pori {
	background: #f0f1ff;
}
#chronologyTable .earth dt{
	color: #10b797;
	font-weight: bold;
}
#chronologyTable .pori dt{
	color: #8289f3;
	font-weight: bold;
}
#chronologyTable dd{
	color: #999;
	font-size: 85%;
}
#chronoLan01 {
	position: absolute;
	top:560px;
	left: 120px;
}
#chronoLan02 {
	position: absolute;
	top:910px;
	left: 430px;
}
.chronoAbout {
	font-size: 85%;
	color: #888;
	padding-bottom: 0.5em;
	line-height: 110%;
}
/* ===================================
	スタッフ＆キャスト
=================================== */
#staffcastContainer {
	width: 960px;
	padding: 10px 0;
	overflow: hidden;
	margin-bottom: 10px;
}
#staffcastContainer h2{
	padding: 5px 0 10px 5px;
}
#staffcastLeft {
	width: 200px;
	margin: 0 auto;
	float: left;
	padding-right: 15px;
}
#staffcastRight {
	width: 724px;
	float: left;
	padding-bottom: 10px;
	overflow: hidden;
}
#staffcastBox {
	padding: 20px 0 15px 20px;
	background: url(../img/bg_minibox_middle.jpg) repeat-y;
	overflow: hidden;
	border-bottom: #557fb9 1px dotted;
}
#staffBox {
	width:380px ;
	float: left;
}
#staffBox ul{
	padding-left: 10px;
}
.titleStaff {
	height: 24px;
	padding: 3px 0 10px 40px;
	color: #fff;
	font-size: 120%;
	font-weight: bold;
	background: url(../img/title_staff02.jpg) no-repeat;
}
#castBox {
	width: 280px;
	float: left;
	padding-left: 20px;
}
.titleCast {
	height: 24px;
	padding: 3px 0 10px 40px;
	color: #fff;
	font-size: 120%;
	font-weight: bold;
	background: url(../img/title_cast02.jpg) no-repeat;
}
.staffCastName {
	padding-left: 10px;
	width: 300px;
	overflow: hidden;
}
.staffCastName dt{
	width: 90px;
	float: left;
}
dl.staffCastName dd{
	padding-left: 20px;
}

/* 【共通】サブメニュー */

#staffcastTop img{
	vertical-align: bottom;
}
#productlistBottom img{
	vertical-align: top;
}
#staffcastLeft ul{
	padding: 8px 0 5px 5px;
	width: 200px;
	background: url(../img/bg_charalist_middle.jpg) repeat-y;
}
#staffcastLeft li{
	width: 190px;
	margin-bottom: 3px;
}
#staffcastLeft a {
	color: #fff;
	padding: 5px 0 0 20px;
	display: block;
	height: 30px;
	background: url(../img/btn_productlist_off.png) no-repeat;
}
#staffcastLeft a:hover{
	display: block;
	color: #000;
	background: url(../img/btn_productlist_on.png) no-repeat ;
}
.storyTitle {
	margin-bottom: 10px;
	padding: 3px 0 10px 40px;
	font-size: 120%;
	color: #fff;
	background: url(../img/bg_subtitle_s.jpg) no-repeat ;
}

/* ===================================
	キャラクター紹介
=================================== */
#charaContainer {
	width: 960px;
	padding: 10px 0;
	overflow: hidden;
	margin-bottom: 10px;
}

#charaLeft {
	float: left;
}
.charaRight {
	margin-left: 15px;
	margin-bottom: 20px;
	width: 724px;
	float: left;
	background: url(../img/bg_chara.jpg) no-repeat;
	position: relative;
}
.charaRight02 {
	margin-left: 15px;
	margin-bottom: 20px;
	width: 724px;
	float: left;
	background: url(../img/bg_chara02.jpg) no-repeat;
	position: relative;
}
.charaRight p {
	width: 410px;
	position: absolute;
	top: 100px;
	left: 40px;
}
.charaRight02 p {
	width: 410px;
	position: absolute;
	top: 100px;
	left: 40px;
}
#btn_genga {
	width: 210px;
	height: 20px;
	position: absolute;
	top: 395px;
	left: 485px;
	z-index: 11;
}
#btn_genga a{
	height: 20px;
	position: 		relative;
	z-index: 		2;
	display: 		block;
	width: 			210px;
	height: 		20px;
	background:		url(../img/btn_chara_genga.png) no-repeat;
	background-position: 0 0;
	text-indent: -9999px;
}

#btn_genga a:hover{
	background:url(../img/btn_chara_genga.png) no-repeat;
	background-position: 0 -20px;
}


/* キャラ一覧 */

#charaLeft {
	width: 200px;
	margin: 0 auto;
}
#charalistTop img{
	vertical-align: bottom;
}
#charalistBottom img{
	vertical-align: top;
}
#charaLeft ul{
	padding: 8px 0 5px 5px;
	width: 200px;
	background: url(../img/bg_charalist_middle.jpg) repeat-y;
}
#charaLeft li{
	width: 190px;
	height: 20px;
	background: url(../img/btn_charalist_off.png) no-repeat;
	margin-bottom: 3px;

}
#charaLeft a {
	color: #fff;
	padding: 2px 0 0 20px;
	display: block;
}
#charaLeft a:hover{
	color: #000;
	background: url(../img/btn_charalist_on.png) no-repeat ;
}

/* キャラロールオーバー(まどか) */
#charaCostume a{
	display:block;
	background:url(../img/chara_madoka.png) no-repeat;
	text-indent: -9999px;
	width: 724px;
	height: 430px;
}

#charaCostume a:hover{
	background:url(../img/chara_madoka02.png) no-repeat;
}
/* ===================================
	メカ
=================================== */
#mechaContainer {
	width: 960px;
	padding: 10px 0;
	overflow: hidden;
	margin-bottom: 10px;
}
#mechaContainer h2{
	padding: 5px 0 10px 5px;
}
#mechaLeft {
	float: left;
}
.mechaRight,.mechaRight00 {
	margin-left: 15px;
	margin-bottom: 20px;
	width: 724px;
	float: left;
	position: relative;
}
.mechaRight {
	background: url(../img/bg_mecha.jpg) no-repeat;
}

.mechaRight00 {
	background: url(../img/bg_mecha_00.jpg) no-repeat;
}
#mechaTxt01,#mechaTxt02,#mechaTxt03 {
	position: absolute;
	left: 30px;
}
#mechaTxt01 {
	width: 260px;
	top: 325px;
}
#mechaTxt02 {
	width: 320px;
	top: 325px;
}
#mechaTxt03 {
	width: 320px;
	top: 265px;
}
#mechaSize01,#mechaSize02 {
	width: 210px;
	height: 20px;
	position: absolute;
	left: 50px;
	z-index: 11;
}
#mechaSize01 {
	top: 430px;
}
#mechaSize02 {
	top: 440px;
}
#mechaDesign {
	color: #999;
	font-size: 85%;
	line-height: 1.2em;
	position: absolute;
	top: 490px;
	left:20px;
}

#btn_mechaGengaV,#btn_mechaGengaO,#btn_mechaGengaM {
	width: 210px;
	height: 20px;
	position: absolute;
	top: 485px;
	left: 485px;
	z-index: 12;
}

#btn_mechaGengaV a ,#btn_mechaGengaO a,#btn_mechaGengaM a{
	height: 30px;
	position: 		relative;
	z-index: 		2;
	display: 		block;
	width: 			210px;
	height: 		30px;
	background-position: 0 0;
	text-indent: -9999px;
}

#btn_mechaGengaV a{
	background:url(../img/btn_mecha_genga_vox.png) no-repeat;
}
#btn_mechaGengaO a{
	background:url(../img/btn_mecha_genga_ovid.png) no-repeat;
}
#btn_mechaGengaM a{
	background:url(../img/btn_mecha_genga_murabayashi.png) no-repeat;
}
#btn_mechaGengaV a:hover{
	background:url(../img/btn_mecha_genga_vox.png) no-repeat;
	background-position: 0 -30px;
}
#btn_mechaGengaO a:hover{
	background:url(../img/btn_mecha_genga_ovid.png) no-repeat;
	background-position: 0 -30px;
}
#btn_mechaGengaM a:hover{
	background:url(../img/btn_mecha_genga_murabayashi.png) no-repeat;
	background-position: 0 -30px;
}

/* ===================================
	スペシャル
=================================== */
#specialContainer {
	width: 960px;
	padding: 10px 0;
	overflow: hidden;
	margin-bottom: 10px;
}
#specialContainer h2{
	padding: 5px 0 10px 5px;
}

#specialLeft {
	width: 200px;
	margin: 0 auto;
	float: left;
	padding-right: 15px;
}
#specialRight {
	width: 724px;
	float: left;
	padding-bottom: 10px;
}
.specialBox {
	padding: 20px 20px 15px 20px;
	background: url(../img/bg_minibox_middle.jpg) repeat-y;
	overflow: hidden;
	border-bottom: #557fb9 1px dotted;
}
.specialBox .leftBox {
	width: 310px;
	float: left;
	padding-right: 10px;
}
.specialBox .rightBox {
	padding-right: 10px;

}

.specialBox dl{
	padding-left: 10px;
}
.specialBox dd{
	padding-bottom: 10px;
}

/*鴨川市コラボ*/
#btn_collabo_press {
	width: 210px;
	height: 20px;
	z-index: 11;
	padding-bottom: 100px;
}

#btn_collabo_press a{
	background:url(../img/btn_collabo_press.png) no-repeat;
}
#btn_collabo_press a:hover{
	background:url(../img/btn_collabo_press.png) no-repeat;
	background-position: 0 -30px;
}

#btn_collabo_press a {
	height: 30px;
	z-index: 		2;
	display: 		block;
	width: 			210px;
	height: 		30px;
	background-position: 0 0;
	text-indent: -9999px;
}



/* ===================================
	プロダクト
=================================== */
.goods_kakaku{
		color:#fff;
}
#productContainer {
	width: 960px;
	padding: 10px 0;
	overflow: hidden;
	margin-bottom: 10px;
}
#productContainer h2{
	padding: 5px 0 10px 5px;
}
#productLeft,#bddvdLeft {
	width: 200px;
	margin: 0 auto;
	float: left;
	padding-right: 15px;
}
#productRight {
	width: 724px;
	float: left;
	padding-bottom: 10px;
	overflow: hidden;
	position: relative;
}
.productBox {
	width: 724px;
	padding: 20px 0 15px 0;
	background: url(../img/bg_minibox_middle.jpg) repeat-y;
	overflow: hidden;
}
.leftBox {
	width: 470px;
	float: left;
	padding-right: 10px;
}
.rightBox {
width: 200px;
float: left;

}
.leftBox02 {
	width: 410px;
	float: left;
	padding-right: 10px;
}
.leftBox ul{
	padding:  10px 0 10px 10px;
}
.productBox p{
	padding-bottom: 10px;
}
/* 【共通】サブメニュー */

#productlistTop img{
	vertical-align: bottom;
}
#productlistBottom img{
	vertical-align: top;
}
#productLeft ul{
	padding: 8px 0 5px 5px;
	width: 200px;
	background: url(../img/bg_charalist_middle.jpg) repeat-y;
}
#productLeft li{
	width: 190px;
	margin-bottom: 3px;
}
#productLeft a {
	color: #fff;
	padding: 5px 0 0 20px;
	display: block;
	height: 30px;
	background: url(../img/btn_productlist_off.png) no-repeat;
}
#productLeft a:hover{
	display: block;
	color: #000;
	background: url(../img/btn_productlist_on.png) no-repeat ;
}
/* 【BDDVD】サブメニュー */
#bddvdlistTop img{
	vertical-align: bottom;
}
#bddvdlistBottom img{
	vertical-align: top;
}
#bddvdLeft ul.productList{
	padding: 8px 0 5px 5px;
	width: 200px;
	background: url(../img/bg_charalist_middle.jpg) repeat-y;
}
#bddvdLeft ul.dvdList{
	padding: 0 0 10px 5px;
	width: 200px;
	background: url(../img/bg_charalist_middle.jpg) repeat-y;
}
#bddvdLeft li{
	width: 190px;
	margin-bottom: 3px;
}
#bddvdLeft .productList a {
	color: #fff;
	padding: 5px 0 0 20px;
	display: block;
	height: 30px;
	background: url(../img/btn_productlist_off.png) no-repeat;
}
#bddvdLeft .productList a:hover{
	display: block;
	color: #000;
	background: url(../img/btn_productlist_on.png) no-repeat ;
}

#bddvdLeft .dvdList a {
	color: #000;
	padding: 0 0 0 20px;
	display: block;
	height: 20px;
	background: url(../img/btn_productlist_s_on.png) no-repeat;
}
#bddvdLeft .dvdList a:hover{
	display: block;
	color: #fff;
	background: url(../img/btn_productlist_s_off.png) no-repeat ;
}
.menuSubtitle {
	padding-left:  5px;
	width: 200px;
	background: url(../img/bg_charalist_middle.jpg) repeat-y;
	color: #fff;
	font-weight: bold;
}

/* BD&DVDの上バナー */
#bddvd01Bn {
	width: 280px;
	height: 50px;
	position: absolute;
	top:30px;
	right: 0;
	z-index: 51;
}

/* コミック・CD・グッズ */
.comicInner,.cdInner,.goodsInner {
	width: 744px;
	padding: 0 0 5px 20px;
	margin : 0 auto 10px;
	border-bottom: #557fb9 1px dotted;

	overflow: hidden;
}
.bddvdmenu {
	overflow: hidden;
}
.bddvdmenu li{
	width: 155px;
	padding-right: 5px;
	float: left;
}

.goodsSamList,.figureSamList {
		padding-left: 10px;
}
.goodsSamList ul,.figureSamList ul{
	overflow: hidden;
}
.goodsSamList li,.figureSamList li{
	float: left;
	padding: 0 20px 10px 0;
}
.bgGoods,.bgFigure {
	width: 320px;
}

/* 携帯ツール */

dl.kisekae02 {
	width: 100%;
	overflow: hidden;
}
.kisekae02 dt {
	width: 480px;
	float: left;
}
.kisekae02 dd {
	float: left;
	width: 200px;
}

/*グッズ表*/
.goodsTable {
	width: 640px;
	border: 1px #E3E3E3 solid;
    border-collapse: collapse;
    border-spacing: 0;
    margin-bottom: 1.5em;
}
.goodsTable th{
	padding: 5px;
	background: #555;
    border: #E3E3E3 solid;
    border-width: 0 0 1px 1px;
    font-weight: bold;
    line-height: 120%;
    text-align: center;
    color: #fff;
}
.goodsTable td{
	padding: 5px;
    border: 1px #E3E3E3 solid;
    border-width: 0 0 1px 1px;
}
/* ムックなどグッズの詳細 */
.comicInner .leftBox dl.goodsInfo{
	padding:  10px 0 10px 10px;
}

/* =====グッズポップアップ========*/
#popContainer01,#popContainer02,#popContainer03 {
	background: #fff;
	padding: 2em 1em;
	margin: 0 auto;
	overflow: hidden;
}
#popContainer03 .popLeft{
	float: left;
}
#popContainer03 .popRight{
	float: right;
}

#popContainer01 .detail,#popContainer02 .detail,#popContainer03 .detail{
	padding-bottom: 1em;
}
#popContainer01 dl{
}
#popContainer01 .txt{
	padding: 2em 1em 3em;
}
#popContainer01 dt,#popContainer02 dt,#popContainer03 dt{
	font-weight: bold;
	color: #344aa0;
	font-size: 130%;
	padding-bottom: 0.5em;
}
#popContainer02 {
	width: 700px;
	overflow: hidden;
	padding: 4em 0.5em;

	}
#popContainer02 #popLeft{
	width: 330px;
	float: left;
}
#popContainer02 #popRight{
	width: 350px;
	float: left;
	order: 1px #f00 solid;
}
#popContainer02 #popRight dt{
	padding-top: 4em;
}
#goodsPop #rightCorner {
	width: 120px;
	position: absolute;
	top:10%;
	right: 20%;

}

/* ===================================
	特別ムービー
=================================== */
#specialMovieContainer {
	width: 960px;
	padding: 10px 0;
	overflow: hidden;
	margin-bottom: 10px;
}
#specialMovieContainer h2{
	padding: 5px 0 10px 5px;
}
#movieLeft {
	width: 200px;
	margin: 0 auto;
	float: left;
	padding-right: 15px;
}
#movieRight {
	width: 724px;
	float: left;
	padding-bottom: 10px;
}
.movieBox {
	padding: 20px 0 15px 20px;
	background: url(../img/bg_minibox_middle.jpg) repeat-y;
	overflow: hidden;
	border-bottom: #557fb9 1px dotted;
}
.movieBox .leftBox {
	width: 310px;
	display: block;
	float: left;
	padding-right: 10px;
}
.movieBox .rightBox {
	padding-right: 10px;

}
.movieBox p{
	padding-bottom: 10px;
}

/*ニコ生ボタン*/
#btn_distribution_nikonama,
#btn_distribution_bch,
#btn_distribution_bchst {
	width: 210px;
	height: 20px;
	z-index: 11;
	padding-bottom: 100px;
}
#btn_distribution_nikonama a,
#btn_distribution_bch a,
#btn_distribution_bchst a {
	height: 30px;
	z-index: 		2;
	display: 		block;
	width: 			210px;
	height: 		30px;
	background-position: 0 0;
	text-indent: -9999px;
}
#btn_distribution_nikonama a{	background:url(../img/btn_distribution_nikonama.png) no-repeat;}
#btn_distribution_bch a{	background:url(../img/btn_distribution_bch.png) no-repeat;}
#btn_distribution_bchst a{	background:url(../img/btn_distribution_bchst.png) no-repeat;}
#btn_distribution_nikonama a:hover{
	background:url(../img/btn_distribution_nikonama.png) no-repeat;
	background-position: 0 -30px;}
#btn_distribution_bch a:hover{
	background:url(../img/btn_distribution_bch.png) no-repeat;
	background-position: 0 -30px;}
#btn_distribution_bchst a:hover{
	background:url(../img/btn_distribution_bchst.png) no-repeat;
	background-position: 0 -30px;}

/* 【共通】サブメニュー */

#movielistTop img{
	vertical-align: bottom;
}
#movielistBottom img{
	vertical-align: top;
}
#movieLeft ul{
	padding: 8px 0 5px 5px;
	width: 200px;
	background: url(../img/bg_charalist_middle.jpg) repeat-y;
}
#movieLeft li{
	width: 190px;
	margin-bottom: 3px;
}
#movieLeft a {
	color: #fff;
	padding: 5px 0 0 20px;
	display: block;
	height: 30px;
	background: url(../img/btn_productlist_off.png) no-repeat;
}
#movieLeft a:hover{
	display: block;
	color: #000;
	background: url(../img/btn_productlist_on.png) no-repeat ;
}

.movieTitle {
	margin-bottom: 10px;
	padding: 3px 0 10px 40px;
	font-size: 120%;
	color: #fff;
	background: url(../img/bg_subtitle_s.jpg) no-repeat ;
}
dl.normal {
	padding-left: 20px;
}
.normal dd{
	padding-bottom: 0.8em;
}

/* ===================================
	まどかの一日
=================================== */
#diaryContainer {
	width: 960px;
	padding: 10px 0 0;
	overflow: hidden;

}
#diaryContainer h2{
	padding: 5px 0 10px 5px;
}
#diaryLeft {
	width: 200px;
	margin: 0 auto;
	float: left;
	padding-right: 15px;
}
#diaryRight {
	width: 735px;
	padding-left: 5px;
	float: left;
}
#diaryBoxTop img {
	vertical-align: bottom;
}
#diaryBox {
	padding-left: 45px;
	background: url(../img/bg_diary.jpg) repeat-y;
}

/* 【共通】サブメニュー */

#diarylistTop img{
	vertical-align: bottom;
}
#diarylistBottom img{
	vertical-align: top;
}
#diaryLeft ul{
	padding: 8px 0 5px 5px;
	width: 200px;
	background: url(../img/bg_charalist_middle.jpg) repeat-y;
}
#diaryLeft li{
	width: 190px;
	margin-bottom: 3px;
}
#diaryList a {
	color: #fff;
	padding: 5px 0 0 20px;
	display: block;
	height: 30px;
	background: url(../img/btn_diary_off.png) no-repeat;
}
#diaryList a:hover{
	color: #000;
	display: block;
	background: url(../img/btn_diary_on.png) no-repeat;
}

/* 【スペシャル専用】サブメニュー */

#specialList li{
	width: 190px;
	margin-bottom: 3px;
}
#specialList a {
	color: #fff;
	padding: 5px 0 0 20px;
	display: block;
	height: 30px;
	background: url(../img/btn_productlist_off.png) no-repeat;
}
#specialList a:hover{
	display: block;
	color: #000;
	background: url(../img/btn_productlist_on.png) no-repeat ;
}

/* ===================================
	ラジオ
=================================== */
#radioContainer {
	width: 960px;
	padding: 10px 0;
	overflow: hidden;
	margin-bottom: 10px;
}
#radioContainer h2{
	padding: 5px 0 10px 5px;
}

#radioLeft {
	width: 200px;
	margin: 0 auto;
	float: left;
	padding-right: 15px;
}
#radioRight {
	width: 724px;
	float: left;
	padding-bottom: 10px;
}


.radioBox {
	padding: 0 10px 40px 20px;
	background: url(../img/bg_minibox_middle.jpg) repeat-y;
	overflow: hidden;
}
.radioBox .leftBox {
	width: 380px;
	float: left;
	padding: 40px 20px 0 0;

}
#radioBn {
	padding: 15px 0 0 200px;
	width: 380px;
	height: 110px;
	background: url(../img/bg_radiobanner.jpg) no-repeat;
}
.radioBox p {
	padding-bottom: 30px;
}

#radioContainer h3 {
	padding-bottom: 20px;
}

/* ===================================
	バナーページ
=================================== */
#specialRight {
	width: 724px;
	float: left;
	padding-bottom: 10px;
}
.specialBox {
	padding: 20px 20px 15px 20px;
	background: url(../img/bg_minibox_middle.jpg) repeat-y;
	overflow: hidden;
	border-bottom: #557fb9 1px dotted;
}
.specialBox dt {
	padding-bottom: 5px;
}
.specialBox dl#banner20060  {
	width: 200px;
	float: left;
	padding-right: 10px;
}
.specialBox dl#banner20060 textarea {
	width: 200px;
}
.specialBox dl#banner180180 {
	width: 180px;
	float: left;
	padding-right: 10px;
}
.specialBox dl#banner180180 textarea {
	width: 180px;
}

.specialBox dl#banner680100  {
	width: 680px;
	padding-bottom: 10px;
}
.specialBox dl#banner680100 textarea {
	width: 680px;
}
.specialBox dl#banner150500 {
	width: 150px;
	float: left;
	padding-right: 20px;
}
.specialBox dl#banner150500 textarea {
	width: 150px;
}


/* ===================================
	イベント
=================================== */
#eventContainer {
	width: 960px;
	padding: 10px 0;
	overflow: hidden;
	margin-bottom: 10px;
}
#eventContainer h2{
	padding: 5px 0 10px 5px;
}
#eventLeft {
	width: 200px;
	margin: 0 auto;
	float: left;
	padding-right: 15px;
}
#eventRight {
	width: 724px;
	float: left;
	padding-bottom: 10px;
}
.eventBox {
	padding: 20px 0 15px 0;
	background: url(../img/bg_minibox_middle.jpg) repeat-y;
	overflow: hidden;

}
.eventBox02 {
	overflow: hidden;
}
.eventInner {
	padding-bottom: 5px;
	margin-bottom: 15px;
	border-bottom: #557fb9 1px dotted;
	padding: 0 0 20px 20px;
}
.eventInner p{
	padding: 0 20px 10px 0;
}
.leftBox {
	width: 470px;
	float: left;
	padding-right: 10px;
}
.rightBox {
	padding-right: 10px;

}
.leftBox02 {
	width: 410px;
	float: left;
	padding-right: 10px;
}
.leftBox ul{
	padding:  10px 0 10px 10px;
}


.eventTitle {
	padding-left: 10px;
	margin-bottom: 10px;

}
#eventRight ul {
	padding : 0 0 20px 10px;
}
.picUp {

	width: 90%;
	color: #333;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px; 
	background: #c6d3f2;
	padding: 0.5em 0.8em !important;
	margin: 0.5em 0.8em 1.5em !important;
}
.picUp02 {
	width: 90%;
	color: #333;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px; 
	background: #e1eafe;
	padding: 0.5em 0.8em;
	margin: 0.5em 0.8em 1.5em;
}
ul.tiket {
	font-size: 120%;
	line-height: 120%;
	font-weight: bold;
}
ul.tiket a{
	text-decoration: underline;
}
/* ※【共通】サブメニューはmovieと同じです※ */

/* 大阪モーターショー */
#motorshowInner {
	width: 680px;
	height: 540px;
	background: url(../img/bg_motorshow.jpg) no-repeat;
	position: relative;
	margin-left: 2px;
}
#bn_motorshow {
	width: 262px;
	position: absolute;
	top:460px;
	left: 400px;
}
/* イベントページキャスト部分 */
#eventContainer dl.castList  {
	overflow: hidden;
	padding: 0 0 15px 10px;
}
#eventContainer .castList dt{
	float: left;
	width: 80px;
}
#eventContainer .castList dd{
	float: left;
}

/* 暁月ドラマCDページ */
#akatokiContainer .storyTitle {
	margin-top: 1em;
}
#akatokiLogo {
	width: 152px;
	height: 74px;
	position: absolute;
	top:5px;
	right: 10px;
	z-index: 52;
}
#akatokiContainer dl{
	width: 680px;
	overflow: hidden;
}
#akatokiContainer dt{
	width: 380px;
	float: left;
	padding-right: 1em;
}
#akatokiContainer dd{
	float: left;
}
#akatokiContainer .with680Box ul{
	padding-bottom: 1em;
	overflow: hidden;
	}
#akatokiContainer .with680Box li{
	width: 110px;
	padding-right: 4px;
	float: left;
}
#akatokiContainer .with680Box li:last-child {
	padding-right: 0;
}
#akatokiContainer li .prof {
	height: 10em;
	font-size: 85%;
	background-color: #c9e7e8;
	padding: 0.3em;
}
#ComicAkatoki { /* コミックページ側のリンク */
	width: 150px;
	height: 40px;
	position: absolute;
	top:30px;
	right: 20px;
	z-index: 53;
}
/* コミケページ */
#comicmarket82 .picUp{
	width: 640px;
}
#comicmarket82 img {
	text-align: center;
	vertical-align: top;
	
}
#comicmarket82 ul {
	width: 680px;
	background: #01b08f;
}