@charset "utf-8";

/* AQUAPLUS [うたわれるもの 公式サイト用]
---------------------------------------
	0.common読込
	1.要素への定義
	2.クラスの定義
	3.ベースデザイン
	4.内部デザイン
---------------------------------------
(c)AQUAPLUS All Rights Reserved.
	http://aquaplus.jp/
*/

/* ==========================================================================
 0.common読込
========================================================================== */
@import url("../../css/common/element.css");			/* 要素への定義 */

@import url("../../css/common/list1.css");		/* テーブル用デザイン */
@import url("../../css/common/table_design.css");		/* テーブル用デザイン */
table.table_list {		margin : 3px 0 20px; }	/* ＋形状 */
table.table_list th {	border-bottom : 1px solid #847f7c; height:16px; background-color:#ebecee; }	/*IEでは無視？*/
table.table_list td {	border-bottom : 1px solid #8e8986; }

table {
	border-collapse:collapse;
	border:0px;
}
th,td {vertical-align: top;}

/* ==========================================================================
 1.要素への定義
========================================================================== */
body {
	margin : 0;
	background : #333 url("bg.gif");
	padding : 0;
	font-weight: normal;
	font-size: 9pt;
	font-family: Meiryo,'メイリオ','ＭＳ Ｐゴシック';
	line-height: 12pt;
	color : #2f2422;
	text-align : center;	/* IE:センタリング*/
	overflow-y : scroll;	/* Mozilla 縦スクバー常時表示 */
}

a {			text-decoration : none; }
a:link {	color : #f66; }
a:visited {	color : #ffa0a0; }
a:active {	color : #777; }
a:hover	{	color : #a68860;}


h2 {
	width: 800px;
	height: 57px;
	margin: 17px 0 15px;

	background-position: 18px 0;
	background-repeat: no-repeat;

	text-align: left;			/* テキスト非表示 */
	text-indent: -9999px;
}

#new h2 { background-image: url("h2_new.gif");}
#pro h2 { background-image: url("h2_pro.gif");}
#spe h2 { background-image: url("h2_spe.gif");}
#sto h2 { background-image: url("h2_sto.gif");}
#cas h2 { background-image: url("h2_cas.gif");}


h3 {
	width: 800px;
	margin: 15px 0;
	height: 19px !important; height: 22px;
	padding-top: 3px !important; padding-top: 4px;

	background: url("h3.gif") 24px 0px no-repeat;
	text-align: left;
	text-indent: 44px;
	font-weight: normal;
	font-size: 10pt;
	color: #fff;
}


h4 {
	font-size: 10pt;
	line-height: 1.4em;
	margin: 0 10px 0 0;
	border-bottom: 1px solid ;
}

strong {
	color: #e70012;
}


/* ==========================================================================
 2.クラスの定義
========================================================================== */



/*=======================================================================
 3.ベースデザイン
========================================================================== */

/* --------------------------------------------------------------------------
 背面部 */

/* エリア-背景1（非スクロール時・下余白用）*/
#areaBg1 {
	margin : 0 auto;	/* 自センタリング・Gekko対策 */
	background : #fff url("bg_main.gif") repeat-y;
	width : 852px;
	height : 100%;
}

/* エリア-背景2（Gekko対策・スクロール時に背景が１画面分なのを回避）*/
#areaBg2 {
	background : #fff url("bg_main.gif") repeat-y;
	width : 852px;
	text-align : center;		/* エリア内センタリング・IE対策 */
	min-height: 100vh;
}

/* --------------------------------------------------------------------------
 ヘッダ部 */
 
/* ヘッダ全体（背景）*/
#header {
	position : relative;
	margin : 0;
	background: url("bg_header.gif") no-repeat;
	width: 800px;
	height: 100px;
}

/* 最終更新日（ヘッダ中・右枠）*/
#header_update {
	position : absolute;
	right:6px;
	bottom:6px;

}
/* 日付 */
#header_update span {
	font-weight : bold;
	color : #c00;
}

#aquaplus {
	position : absolute;
	right: 15px;
	top :13px;

	display: block;
	width: 103px;
	height: 22px;

	background: url("logo_aquaplus.png") no-repeat !important; background: none;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="css/logo_aquaplus.png",sizingMethod="image");		/*IE用*/

	text-align: left;			/* テキスト非表示 */
	text-indent: -9999px;

}



/* --------------------------------------------------------------------------
 グローバルナビゲーション */
#globalNavi {
	position: absolute;
	right: 20px;
	top: 41px;
	padding: 0;
	width: 522px;
	height:42px;
	overflow-x: hidden;
	overflow-y: hidden;
}

#globalNavi li {
	padding:0;
	background:none;
	display:inline;
	text-indent:-9999px;
}

#globalNavi li a {
	display: block;
	float: left;
	width: 87px;
	height: 41px;
	background: none;
	background-repeat: no-repeat;
	overflow-x: hidden;
}


/* オン,現ページ */
#gn-top	a:hover,#gn-top	a.on {background:url("globalNaviOn.gif")    0px 0px;}
#gn-new	a:hover,#gn-new	a.on {background:url("globalNaviOn.gif")  -87px 0px;}
#gn-prd	a:hover,#gn-prd	a.on {background:url("globalNaviOn.gif") -174px 0px;}
#gn-spe	a:hover,#gn-spe	a.on {background:url("globalNaviOn.gif") -261px 0px;}
#gn-str	a:hover,#gn-str	a.on {background:url("globalNaviOn.gif") -348px 0px;}
#gn-cas	a:hover,#gn-cas	a.on {background:url("globalNaviOn.gif") -435px 0px;}



/* --------------------------------------------------------------------------
 ローカルナビゲーション */
/*#localNavSpace {
	height: 70px;
}

#localNav.fixed {
	position: fixed;
	top: 0;
}*/

#localNav {
	position: sticky;
	top: 0;
	overflow: hidden;
	background: rgba(250,245,245,0.9);
	width: 740px;
	padding: 0 30px;
	box-shadow: 0 2px 3px rgba(0,0,0,0.15);
}
#localNav li {
	padding: 10px 0;
	background: none;
	float: left;
}
#localNav li:not(:last-child):after {
	content: "|";
	display: block;
	padding: 5px 2px;
	float: left;
}
#localNav a {
	display: block;
	float: left;
	padding: 5px 5px;
}
#localNav a:hover {
	background : #ece6dd;
}


#pageTop {
	display: block;
	position: fixed;
	right: 20px;
	bottom: 20px;
	margin: 0;
	opacity: 0;
	transition: opacity 0.3s;
	visibility: hidden;
}
#pageTop.view {
	visibility: visible;
	opacity: 1;
}
#pageTop a {
	-webkit-transition: 0.3s ease-in-out;  
	        transition: 0.3s ease-in-out;
}

#pageTop a:hover {
	opacity: .75; /* Standard: FF gt 1.5, Opera, Safari */
	filter: alpha(opacity=75); /* IE lt 8 */
	-ms-filter: "alpha(opacity=75)"; /* IE 8 */
	-khtml-opacity: .75; /* Safari 1.x */
	-moz-opacity: .75; /* FF lt 1.5, Netscape */

}


/* --------------------------------------------------------------------------
 フッタ部 */

/* フッタ全体（最下段文字列含む） */
#footer {
	margin : 0;
	padding : 10px 0 10px;
	width : 100%;
	text-align : center;
	color : #4d4341;
}

/* Copyright表記（イメージ使用）*/
#footer #copyright-img {
	background : #ebdfdf url("copyright.gif") no-repeat;
	height : 18px;

	text-align: left;			/* テキスト非表示 */
	text-indent: -9999px;
}


#footer .banner a {
	display: block;
	width: 468px;
	background-color: transparent;
	margin: 5px auto;
}
#footer .banner a:hover {
	opacity: .75; /* Standard: FF gt 1.5, Opera, Safari */
	filter: alpha(opacity=75); /* IE lt 8 */
	-ms-filter: "alpha(opacity=75)"; /* IE 8 */
	-khtml-opacity: .75; /* Safari 1.x */
	-moz-opacity: .75; /* FF lt 1.5, Netscape */
}



/* ==========================================================================
 4.内部デザイン
========================================================================== */

/* エリア-幅1 */
.areaWidth1 {
	position: relative;
	margin : 0 auto;			/* 自センタリング・Gekko対策 */
	width : 800px;
	padding : 0;
}

/* 本文 */
.detail {
	margin : 0 auto 24px;			/* 自センタリング・Gekko対策 */
	width : 730px;
	padding : 0;
	text-align : left
}




/* ==========================================================================
 トップ-イメージ
========================================================================== */
#areaTopImg {
	position: relative;
	margin: 12px auto;
	width: 800px;
	height: 606px;
	background: url("ttl_uta.jpg") no-repeat;
}

#areaTopImg #theme_cd {
	position: absolute;
	left: 25px;
	top: 355px;
}
#areaTopImg #theme_cd dt,
#areaTopImg #theme_cd dd {
	width: 150px;
	margin: 0;
	padding: 0;
}
#areaTopImg #theme_cd dt {
	position: absolute;
	top: 0;
	font-size: 8pt;
	font-weight: bold;
	color: #fff;
}
#areaTopImg #theme_cd dt.op { left: 0; }
#areaTopImg #theme_cd dt.ed { right: 0; }

#areaTopImg #theme_cd dd {
	float: left;
}



#areaTopImg #theme_cd a {
	width: 120px;
	padding: 1px;
	display: block;
	box-shadow: 0 0 5px rgba(255,255,255,1);
	margin: 18px auto 0;
}
#areaTopImg #theme_cd img {
	display: block;
	width: 120px;
	height: auto;
}

#video {
	position: absolute;
	left: 22px;
	top: 360px;
	box-shadow: 0 0 5px rgba(0,0,0,1);
	background-color: rgba(0,0,0,1);
}
#bn_bdbox {
	display: block;
	position: absolute;
	right: 50px;
	bottom: 35px;
	width: 380px;
	height: 34px;

	background-image: url("bdbox.png");
	background-repeat: no-repeat;

	text-align: left;
	text-indent: -9999px;

	-webkit-transition: 0.3s ease-in-out;
	        transition: 0.3s ease-in-out;
}
/*#bn_ova2 {top :377px; background-image: url("bn_ova2.gif");}
#bn_ova3 {top :465px; background-image: url("bn_ova3.gif");}*/


a#bn_bdbox:hover {
	opacity: .75; /* Standard: FF gt 1.5, Opera, Safari */
	filter: alpha(opacity=75); /* IE lt 8 */
	-ms-filter: "alpha(opacity=75)"; /* IE 8 */
	-khtml-opacity: .75; /* Safari 1.x */
	-moz-opacity: .75; /* FF lt 1.5, Netscape */
}

/* 更新履歴 */
#whatsnew {
	position : absolute;
	left : 35px;
	top : 70px;
	width: 280px;
	height: 235px;
	overflow-y: scroll;
	text-align: left;
	color: #fff;
}

#whatsnew dt {
	float: left;
	width: 60px;
}
#whatsnew dd {
	display: block;
	margin: 0 0 8px;
	overflow: hidden;
}
#whatsnew br {
	clear:both;
}

#whatsnew .new {
	color: #e70012;
}


#release {
	text-align: left;
	text-indent: -9999px;
}


/* ==========================================================================
 製品
========================================================================== */
.iconDisc {
/*	position: absolute;
	left: 170px;
	margin-top: -14px;*/
	float: right;
	margin-top: 5px;
	margin-right: 25px;
}

/*#pro th {  }
#pro td {  }
*/

.detail dl {
	overflow: hidden;
}
.detail dt {
	width: 80px;
	background-color: #ebecee;
	float: left;
	text-align: center;
}
.detail dd {
	overflow: hidden;
}
.detail dt ,
.detail dd {
	padding: 8px;
	border-bottom: 1px solid #847f7c;
}

/* ==========================================================================
 物語
========================================================================== */
#story1 , #story2 , #story3 {
	width: 737px;
	height: 501px;
	text-align: left;
	text-indent: -9999px;
}

#story3 { background: url("txt_story3.jpg") no-repeat; }
#story2 { background: url("txt_story2.jpg") no-repeat; }
#story1 { background: url("txt_story1.jpg") no-repeat; }


/* ==========================================================================
 出演・制作
========================================================================== */
#cast ,
#staff ,
#themeSong {
	width: 800px;
	margin: 0 0 20px;
	background-repeat: no-repeat;
	background-position: 38px 0px;

	text-align: left;
	text-indent: -9999px;
}
#cast		{ height: 277px; background-image: url("txt_cast.gif"); }
#staff		{ height: 140px; background-image: url("txt_staff.gif"); }
#themeSong	{ height:  45px; background-image: url("txt_themeSong.gif"); }




/* --------------------------------------------------------------------------
 スペシャル */

#spe table {
	border: 1px solid #ccc;
	width: 100%;
	border-collapse: collapse;
}
#spe table td {
	text-align: center;
	vertical-align: top;
}



/*『ムービーダウンロード』ボタン */

.dl_movie {
	position:relative;
	display:block;
	width:200px;
	height:50px;
	margin:0 auto;
	background:transparent url(../dl_movie.gif) no-repeat;
}

.dl_movie span {
	display:block;
	position:relative;
	right:6px;
	top:31px;
	margin:0;
	text-align:right;
	color:#fff;
}

.dl_movie:hover {
	background:transparent url(../dl_movie.gif) no-repeat;
}



/* [EOF] */