@charset 'utf-8';

/*
	style.css for WCW
	date created: 2013-10-26

*/


/* -------------------------------------------------------------------
 * 	reset
 * 	------------------------------------------------------------------- */
/*limited reset*/
html, body, div, section, article, aside, header, hgroup, footer, nav, h1, h2, h3, h4, h5, h6, p, blockquote, address, time, span, em, strong, img, ol, ul, li, figure, canvas, video, th, td, tr,dl, dt, dd, input, textarea {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align:baseline;
	font: inherit;
}

/*html5 display rule*/
address, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, nav, menu, nav, section, summary {
	display: block;
}

ul, li {list-style: none;}
/*micro-clearfix by Nicolas Gallagher http://nicolasgallagher.com/micro-clearfix-hack/*/
/* For modern browsers */
.cf:before, .cf:after {
	content:"";
	display:table;
}

.cf:after {
	clear:both;
}

/* For IE 6/7 (trigger hasLayout) */
.cf {
	zoom:1;
}


/* -------------------------------------------------------------------
 * 	common
 * 	------------------------------------------------------------------- */

/* リンク
----------------------------------*/
/* 通常リンク */
a {
	color: #000;
	text-decoration: none;
}
/* 半透明リンク */
.op {
	opacity: 1;
	-webkit-transition: opacity .2s ease-out;
	-moz-transition: opacity .2s ease-out;
	-ms-transition: opacity .2s ease-out;
	-o-transition: opacity .2s ease-out;
	transition: opacity .2s ease-out;
}
.op:hover {
	opacity: .8;
	filter: alpha(opacity=80);		/* ie lt 8 */
	-ms-filter: 'alpha(opacity=70)';/* ie 8 */
}


/* 背景・メインレイアウト
----------------------------------*/
html {
	width: 100%;
	height: 100%;
	background: #B16E89 url(../img/common/bg.jpg) no-repeat 50% 0;
	background-attachment: fixed;
}
body {
	font-size: 90%;
	color: #555;
}

body > header {
	width: 1062px;
	margin: 0 auto;
	padding-top: 60px;
	position: relative;
}
#logo {
	position: absolute;
	left: 55px;
	top: 8px;
}
#logo a {
	display: block;
	background: url(../img/common/logo.png) no-repeat 0 0;
	width: 234px;
	height: 76px;
	text-indent: -9999px;
}

/* グロナビ
----------------------------------*/
#gnav {
	/*width: 1062px;*/
	height: 98px;
	/*margin: 0 auto;*/
	background: url(../img/common/gnav_bg.png) no-repeat 50% 0;
}
#gnav > ul {
	text-align: center;
	padding-top: 26px;
	padding-left:20px;
}
#gnav > ul > li {
	display: inline-block;
	margin-right: 22px;
	position: relative;
}
#gnav > ul > li:after {
	content: '';
	display: block;
	position: absolute;
	top: 15px;
	right: -20px;
	width: 13px;
	height: 19px;
	text-indent: -9999px;
	vertical-align: middle;
	background: url(../img/common/gnav_sep.png) no-repeat 0 0;
}
#gnav > ul > li.last:after {display: none;}

#gnav > ul > li strong.new {
	display: block;
	width: 71px;
	height: 35px;
	position: absolute;
	top: -12px;
	left: 50%;
	margin-left: -35px;
	background: url(../img/common/gnav_new.png) no-repeat 0 0;
	text-indent: -9999px;
}

#gnav > ul > li > a {
	display: inline-block;
	height: 50px;
	vertical-align: middle;
	background-image: url(../img/common/gnav_text.png);
	background-repeat: no-repeat;
	text-indent: -9999px;
	position: relative;
}
#gnav > ul > li > a > span {
	display: none;
	height: 50px;
	background-image: url(../img/common/gnav_text.png);
	background-repeat: no-repeat;
	position: absolute;
	top: 0; left: 0;
}
#gnav > ul > li > a:hover > span {
	z-index: 10;
}
#gnav li a#gnavTop { width: 50px; }
#gnav li a#gnavTop span,
#pageTop #gnav li a#gnavTop.currentTop {
	width: 50px;
	background-position: 0 -50px;
}
#gnav li a#gnavWorld {
	width: 76px;
	background-position: -50px 0;
}
#gnav li a#gnavWorld span,
#pageWorld #gnav li a#gnavWorld.currentWorld {
	width: 76px;
	background-position: -50px -50px;
}
#gnav li a#gnavIntro {
	width: 70px;
	background-position: -126px 0;
}
#gnav li a#gnavIntro span,
#pageIntro #gnav li a#gnavIntro.currentIntro {
	width: 70px;
	background-position: -126px -50px;
}
#gnav li a#gnavStaff {
	width: 116px;
	background-position: -196px 0;
}
#gnav li a#gnavStaff span,
#pageStaff #gnav li a#gnavStaff.currentStaff{
	width: 116px;
	background-position: -196px -50px;
}
#gnav li a#gnavChara {
	width: 73px;
	background-position: -312px 0;
}
#gnav li a#gnavChara span,
#pageChara #gnav li a#gnavChara.currentChara {
	width: 73px;
	background-position: -312px -50px;
}
#gnav li a#gnavOnair {
	width: 73px;
	background-position: -385px 0;
}
#gnav li a#gnavOnair span,
#pageOnair #gnav li a#gnavOnair.currentOnair {
	width: 73px;
	background-position: -385px -50px;
}
#gnav li a#gnavMovie {
	width: 66px;
	background-position: -458px 0;
}
#gnav li a#gnavMovie span,
#pageMovie #gnav li a#gnavMovie.currentMovie {
	width: 66px;
	background-position: -458px -50px;
}
#gnav li a#gnavBddvd {
	width: 80px;
	background-position: -524px 0;
}
#gnav li a#gnavBddvd span,
#pageBddvd #gnav li a#gnavBddvd.currentBddvd {
	width: 80px;
	background-position: -524px -50px;
}
#gnav li a#gnavSpecial {
	width: 81px;
	background-position: -604px 0;
}
#gnav li a#gnavSpecial span,
#pageSpecial #gnav li a#gnavSpecial.currentSpecial {
	width: 81px;
	background-position: -604px -50px;
}
#gnav li a#gnavProduct {
	width: 92px;
	background-position: -685px 0;
}
#gnav li a#gnavProduct span,
#pageProduct #gnav li a#gnavProduct.currentProduct {
	width: 92px;
	background-position: -685px -50px;
}

#gnav li a#gnavLink {
	width: 53px;
	background-position: -777px 0;
}
#gnav li a#gnavLink span,
#pageLink #gnav li a#gnavLink.currentLink {
	width: 53px;
	background-position: -777px -50px;
}

/* グロナビ サブ */
#gnav ul > li > ul {
	visibility: hidden;
	opacity: 0;
	max-height: 0;

	width: 165px;
	margin-left: -82px;
	padding-bottom: 10px;
	position: absolute;
	left: 50%;
	top: 35px;
	z-index: 6000;

	-webkit-transition: all .4s ease-out, visibility 0s;
	-moz-transition: all .4s ease-out, visibility 0s;
	-ms-transition: all .4s ease-out, visibility 0s;
	-o-transition: all .4s ease-out, visibility 0s;
	transition: all .4s ease-out, visibility 0s;
}
#gnav ul > li:hover > ul {
	opacity: 1;
	visibility: visible;
	max-height: 50em;
	display: block;
}

#gnav .gnavSub {
	margin-top: 25px;
	background: url(../img/common/gnav_sub_bg.png) no-repeat 0 100%;
}
#gnav .gnavSub:before {
	content: '';
	position: absolute;
	top: -25px;
	left: 0;
	display: block;
	width: 165px;
	height: 25px;
	margin-right: 5px;
	text-indent: -9999px;
	background: url(../img/common/gnav_sub_top.png) no-repeat 0 0;
}
#gnav .gnavSub li {
	width: 146px;
	margin: 0 auto 5px;
}
#gnav .gnavSub li:last-child {margin-bottom: 0;}
#gnav .gnavSub li a {
	display: block;
	height: 32px;
	text-indent: -9999px;
	background-repeat: no-repeat;
}
	/* STORY */
#gnav .gnavSub.stories li a { background-image: url(../img/common/gnav_story.gif); }
#gnav .gnavSub.stories li.story a { background-position: 0 0; }
#gnav .gnavSub.stories li.intoro a { background-position: 0 -32px; }

	/* MOVIE */
#gnav .gnavSub.movie li a { background-image: url(../img/common/gnav_movie.gif); }
#gnav .gnavSub.product li.pv a { background-position: 0 0; }

	/* PRODUCT */
#gnav .gnavSub.product li a { background-image: url(../img/common/gnav_product.gif); }
#gnav .gnavSub.product li.bluray a { background-position: 0 0; }
#gnav .gnavSub.product li.comic a { background-position: 0 -32px; }
#gnav .gnavSub.product li.cd a { background-position: 0 -64px; }
#gnav .gnavSub.product li.goods a { background-position: 0 -96px; }
#gnav .gnavSub.product li.appli a { background-position: 0 -128px; }

	/* SPECIAL */
#gnav .gnavSub.special li a { background-image: url(../img/common/gnav_special.gif); }
#gnav .gnavSub.special li.event a { background-position: 0 0; }
#gnav .gnavSub.special li.topic a { background-position: 0 -32px; }


/* サブメニュー
----------------------------------*/
.submenu {
	float: left;
	width: 180px;
	position: relative;
	margin-left: 60px;
	margin-right: 50px;

	-webkit-box-shadow: 0 0 4px 0 rgba(0,0,0,.4);
	-moz-box-shadow: 0 0 4px 0 rgba(0,0,0,.4);
	box-shadow: 0 0 4px 0 rgba(0,0,0,.4);
}
.submenu:before,
.submenu:after {
	content: '';
	display: block;
	width: 210px;
	position: absolute;
	text-indent: -9999px;
	left: -15px;
	z-index: 1000;
	background-repeat: no-repeat;
}
.submenu:before {
	top: -10px;
	height: 14px;
	background-image: url(../img/common/submenu_top.png);
}
.submenu:after {
	bottom: -5px;
	height: 9px;
	background-image: url(../img/common/submenu_btm.png);
}
.submenu li {
	border-bottom: 1px solid #555;
}
.submenu li:last-child {
	border-bottom: none;
}
.submenu li a {
	padding: ;
	display: block;
	padding: .5em 20px;
	background-color: #fff;
	text-align: center;
	word-wrap: break-word;

	-webkit-transition: all .2s ease-out;
	-moz-transition: all .2s ease-out;
	-ms-transition: all .2s ease-out;
	-o-transition: all .2s ease-out;
	transition: all .2s ease-out;
}
.submenu li a:hover,
.submenu li a.current {
	-webkit-box-shadow: inset 0 0 10px 0 rgba(0,0,0,.5);
	-moz-box-shadow: inset 0 0 10px 0 rgba(0,0,0,.5);
	box-shadow: inset 0 0 10px 0 rgba(0,0,0,.5);
}
.submenu li a:hover {background-color: #555; color: #fff;}
.submenu li a.current {
	background: #333 url(../img/common/submenu_current.png) no-repeat 10px 50%;
	font-weight: bold;
	color: #fff;
}

/* メイン領域
----------------------------------*/
#main {
	width: 1000px;
	margin: 0 auto;
	padding-bottom: 20px;
}

/* 横いっぱい型 */
#mainSect01 {
	position: relative;
	margin: 25px 0px 60px;
	min-height: 486px;
	background: url(../img/common/sectmain.png) repeat-y 50% 0;
}
#mainSect01:before,
#mainSect01:after {
	content: '';
	display: block;
	width: 100%;
	position: absolute;
	left: 0;
	text-indent: -9999px;
}
#mainSect01:before {
	top: -60px;
	height: 60px;
	background: url(../img/common/sectmain_top.png) no-repeat 50% 0;
}
#mainSect01:after {
	bottom: -60px;
	height: 60px;
	background: url(../img/common/sectmain_btm.png) no-repeat 50% 100%;
}

/* サブセクション
----------------------------------*/
#subSect01 {
	float: left;
	width: 665px;
}

/* サブページ見出し
----------------------------------*/
.subh1 {
	margin: 0 auto;
	height: 50px;
	/* 幅は個別指定 */
	text-indent: -9999px;
	position: relative;
	z-index: 500;
}


/* フッター
----------------------------------*/
footer {
	padding: 30px 0;
}
footer p {
	text-align: center;
}
footer p small {
	color: #000;
}
.ftletf{
	display:inline-block;
	/* text-align:left; */
}

/* その他
----------------------------------*/
/* ローダー */
.loader {
	display: block;
	position: absolute;
	padding: 10px;
	background-color: #fff;
	background-color: rgba(255,255,255,.8);
	-webkit-box-shadow: 0 0 4px 0 rgba(0,0,0,.5);
	-moz-box-shadow: 0 0 4px 0 rgba(0,0,0,.5);
	box-shadow: 0 0 4px 0 rgba(0,0,0,.5);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	z-index: 2000;
}
.loader img {
	vertical-align: bottom;
}

/* -------------------------------------------------------------------
 * 	TOPページ
 * 	------------------------------------------------------------------- */
#pageTop > header {padding-top: 0;}
#pageTop h1 {
	float: right;
	width: 570px;
	height: 760px;
	text-indent: -9999px;
	background: url(../img/top/key220329.png) no-repeat 50% 0;
}
#pageTop h1.whiteday {
	background: url(../img/top/key03.png) no-repeat 50% 0;
}


#topAside {
	float: left;
	width: 400px;
	padding-top: 10px;
	margin-left: 15px;
}
#topAside > section {
	position: relative;
	margin: 0 auto;
}
#topAside > section > h2 {
	opacity: 0;
	text-indent: -9999px;
	font-size: 0;
}


/* info
----------------------------------*/
#topInfo {
	width: 403px;
	height: 226px;
	background: url(../img/top/info_bg.png) no-repeat 50% 0;
	position: relative;
}
#topInfo01,
#topInfoBn {
	position: absolute;
}
#topInfo01 {
	top: 50px;
	left: 20px;
}
#topInfo01 img { vertical-align: bottom; }

#topInfoBn {
	top: 115px;
	left: 25px;
	width: 310px;
	height: 86px;
	padding: 13px 20px 0;
	background: url(../img/top/topinfo_bn_bg.png) no-repeat 0 0;
}

/* infoスライダー
----------------------------------*/
#slideWrapper {
	width: 310px;
	height: 70px;
	overflow: hidden;
	position: relative;
}
#topBnSlider {
	height: 60px;
	position: absolute;
}

#topBnSlider li,
#topBnSlider li a {
	width: 310px;
}
#topBnSlider li {
	float: left;
}
#topBnSlider li a {
	display: block;
	height: 60px;
}
#topBnSlider li a img {
	vertical-align: bottom;
}
#topInfoBn .btn {
	display: block;
	position: absolute;
	top: 30px;
	width: 24px;
	height: 24px;
	text-indent: -9999px;
	overflow: hidden;
	outline: none;
	z-index: 1000;
}
#topInfoBn .btn.prev {
	left: -12px;
	background: url(../img/top/topinfo_bn_prev.png) no-repeat 0 0;
}
#topInfoBn .btn.next {
	right: -12px;
	background: url(../img/top/topinfo_bn_next.png) no-repeat 0 0;
}


	/* bxSlider Override */
#topInfoBn .bx-wrapper .bx-viewport {
	background: transparent;
	border: none;
	left: 0;
	-webkit-box-shadow: 0 0 2px 0 rgba(0,0,0,5);
	-moz-box-shadow: 0 0 2px 0 rgba(0,0,0,5);
	box-shadow: 0 0 2px 0 rgba(0,0,0,5);
}
#topInfoBn .bx-wrapper .bx-controls-direction a {
	margin-top: -12px;
	width: 24px;
	height: 24px;
	z-index: 3000;
}
#topInfoBn .bx-wrapper .bx-prev {
	left: -32px;
	background: url(../img/top/topinfo_bn_prev.png) no-repeat 0 -0; }
#topInfoBn .bx-wrapper .bx-next {
	right: -32px;
	background: url(../img/top/topinfo_bn_next.png) no-repeat 0 -0; }

/* movie
----------------------------------*/
#topMovie {
	width: 402px;
	height: 340px;
	background: url(../img/top/movie_bg.png) no-repeat 50% 0;
	position: relative;
}
#moviePlayer {
	width: 350px;
	height: 260px;
	margin: 20px 0 10px 25px;
}
#iframeMovie {
	overflow-y: hidden;
}

#movieSelector {
	position: absolute;
	right: 27px;
	bottom: 28px;
	width: 200px;
	cursor: pointer;
}
#movieSelector dt {
	padding: .25em 1em .25em .5em;
	font-size: 85%;
	color: #fff;
	position: relative;
	z-index: 100;

	background: #313131;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 0 0 3px 0 rgba(0,0,0,.3);
	-moz-box-shadow: 0 0 3px 0 rgba(0,0,0,.3);
	box-shadow: 0 0 3px 0 rgba(0,0,0,.3);

	background: url(../img/top/movie_dd.png) no-repeat 180px center, #6b6b6b;
	background: -webkit-linear-gradient(top, #6b6b6b 0%,#313131 49%,#000000 50%), url(../img/top/movie_dd.png) no-repeat right center;/*chrome10,safari5*/
	background:url(../img/top/movie_dd.png) no-repeat 180px center, -webkit-gradient(linear, left top, left bottom, color-stop(0%, #6b6b6b), color-stop(49%, #313131), color-stop(50%, #000));
	background:url(../img/top/movie_dd.png) no-repeat 180px center, -moz-linear-gradient(top, #6b6b6b 0%, #313131 49%, #000 50%);
	background: url(../img/top/movie_dd.png) no-repeat 180px center, -ms-linear-gradient(top, #6b6b6b 0%,#313131 49% ,#000 50%);
	-pie-background: url(../img/top/movie_dd.png) no-repeat 180px center, linear-gradient(#6b6b6b 0%,#313131 49% ,#000 50%);


	behavior: url(/js/PIE.htc);
	position: relative;
}

#movieSelector.active dt {
	background: #313131;
	background: url(../img/top/movie_dd.png) no-repeat 180px center, -webkit-linear-gradient(top, #313131 0%, #6b6b6b 100%);/*chrome10,safari5*/
	background: url(../img/top/movie_dd.png) no-repeat 180px center, -webkit-gradient(linear, left top, left bottom, color-stop(0%, #313131), color-stop(100%, #6b6b6b));
	background: url(../img/top/movie_dd.png) no-repeat 180px center, -moz-linear-gradient(top, #313131 0%, #6b6b6b 100%);
	background: url(../img/top/movie_dd.png) no-repeat 180px center, -ms-linear-gradient(top, #313131 0%,#6b6b6b 100%);
}
#movieSelector dd {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 99;

	height: 0;
	visibility: hidden;
	opacity: 0;

	-webkit-transition: all .3s ease-out, visibility 0s;
	-moz-transition: all .3s ease-out, visibility 0s;
	-ms-transition: all .3s ease-out, visibility 0s;
	-o-transition: all .3s ease-out, visibility 0s;
	transition: all .3s ease-out, visibility 0s;

}
#movieSelector.active dd {
	height: 20em;
	visibility: visible;
	opacity: 1;
	position: absolute;
	top: 100%;
}
#movieSelector dd ul {
	background-color: #3e3e3e;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;

}
#movieSelector dd li {
	width: 200px;/* same as movie selector */
	border-bottom: 1px solid #888;
}
#movieSelector dd li:last-child {
	border-bottom: none;
}
#movieSelector dd li:first-child a {
	-webkit-border-radius: 5px 5px 0 0;
	-moz-border-radius: 5px 5px 0 0;
	border-radius: 5px 5px 0 0;
}
#movieSelector dd li:last-child a {
	-webkit-border-radius: 0 0 5px 5px;
	-moz-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
}
#movieSelector dd li a {
	display: block;
	padding: .25em .5em;
	background-color: #3e3e3e;
	font-size: 85%;
	color: #fff;
}
#movieSelector dd li a:hover {
	background-color: #555;
}

/* blog
----------------------------------*/
#topBlog {
	width: 394px;
	height: 166px;
	margin-bottom: 10px;
	position: relative;
	background: url(../img/top/blog_bg.png) no-repeat 50% 0;
}
#topBlogLink {
	display: block;
	width: 137px;
	height: 33px;
	position: absolute;
	top: 5px;
	right: 10px;
	background: url(../img/top/blog_btn.png) no-repeat 0 0;
	text-indent: -9999px;
	overflow: hidden;
	color: #fff;
}
#topBlogRoll {
	margin-top: 46px;
	margin-left: 25px;
	width: 350px;/*
	height: 100px;
	overflow: auto;*/
}
#topBlogRoll ul { padding: 5px 5px 5px 0; }
#topBlogRoll li {
	padding-bottom: .5em;
	margin-bottom: .5em;
	border-bottom: 1px dotted #555;
	font-size: 85%;
}
#topBlogRoll li time {
	display: block;
	font-weight: bold;
	margin-bottom: .15em;
}
#topBlogRoll li a { text-decoration: underline; }
#topBlogRoll li a:hover { text-decoration: none; }

@media screen and (max-device-width: 480px) {
#topBlogRoll {
	height: 100px;
overflow:auto;
-webkit-overflow-scrolling: touch;
}
}

/* twitter
----------------------------------*/
#topTwitter {
	text-align: center;
	margin-bottom: 0;
}


/* ポップアップ
----------------------------------*/
#popBG {
	display: none;
	position: fixed;
	background-color: rgba(0,0,0,.8);
	width: 100%;
	height: 100%;
	top: 0; left: 0; bottom: 0; right: 0;
	z-index: 9999;
}
.popupWin {
	display: none;
	position: absolute;
	left: 50%; top: 50%;
	background: #000;
	padding: 5px;
	-webkit-box-shadow: 0 0 5px 0 rgba(0,0,0,.7);
	-moz-box-shadow: 0 0 5px 0 rgba(0,0,0,.7);
	box-shadow: 0 0 5px 0 rgba(0,0,0,.7);

}
.popupWin img {
	vertical-align: bottom;
}
.closePopup {
	display: block;
	width: 40px;
	height: 40px;
	background: url(../img/top/btn_popclose.png) no-repeat 50% 50%;
	position: absolute;
	top: -20px; right: -20px;
	text-indent: -9999px;
}

/* -------------------------------------------------------------------
 * 	INTRODUCTION イントロダクション
 * 	------------------------------------------------------------------- */
#pageIntro {}
#pageIntro #mainSect01 {
	min-height: 530px;
}
h1#hIntro {
	width: 411px;
	background: url(../img/intro/h_intro.png) no-repeat 50% 0;
}

#introTxt {
	width: 873px;
	height: 530px;
	position: absolute;
	top: -27px;
	left: 71px;
	text-indent: -9999px;
	background: url(../img/intro/intro_bg.png) no-repeat 0 0;
}

/* -------------------------------------------------------------------
 * 	STORY ストーリー
 * 	------------------------------------------------------------------- */
#hStory {
	width: 289px;
	background: url(../img/story/h_story.png) no-repeat 50% 0;
}

.sectProductUnit .storyTxt{
	display:block;
	line-height:1.4em;
	padding-top:15px;
}
.sectStory .sectProductUnit figure {
	width: 390px;
	height: 235px;
	background: url(../img/story/story_bg.png) no-repeat 0 0;
}
/* サムネイル画像表示（thumbnaillist）
-----------------------------------------*/
#thumbnaillist{
	padding:20px 0 0 0;
	clear:both;
	overflow:hidden;
}
#thumbnaillist ul{
}
#thumbnaillist li{
	float:left;
	background:none;
	padding:0 0px 0 10px;
	margin:0 0 10px 0;
}
#thumbnaillist li img{
	width:120px;
}
#thumbnaillist li a{
	display:block;
}
#thumbnaillist li a:link    {}
#thumbnaillist li a:visited {}
#thumbnaillist li a:hover   {opacity:0.8;}
#thumbnaillist li a:active  {opacity:0.8;}
/* IE用 ↓*/
#thumbnaillist li a:hover img {filter:alpha(opacity=80);}


/* -------------------------------------------------------------------
 * 	STAFF/CAST
 * 	------------------------------------------------------------------- */
#pageStaff {}
h1#hStaff {
	width: 392px;
	background: url(../img/staffcast/h_staff.png) no-repeat 50% 0;
}

.sectSC {
	margin: 0 auto 30px;
	width: 800px;
}
.sectSC h2 {
	text-align: center;
	margin-bottom: 10px;
	font-family: 'Marcellus', serif;
	font-size: 180%;
	text-shadow: 1px 1px 0 #fff;
	color: #000;
}
.sectSC h2:before,
.sectSC h2:after {
	content: '~';
	padding: 0 .6em;
}
.listSC dt,
.listSC dd {
	margin-bottom: 1em;
}
.listSC dt {
	width: 54%;
	float: left;
	text-align: right;
}
.listSC dt:after {
	content: '';
	display: inline-block;
	width: 20px;
	height: 20px;
	margin: 0 20px;
	text-indent: -9999px;
	vertical-align: middle;
	background: url(../img/common/blt_fire01.png) no-repeat 50% 50%;
}
.listSC dd {
	width: 46%;
	float: right;
}

/* -------------------------------------------------------------------
 * 	キャラクター
 * 	------------------------------------------------------------------- */
#pageChara {}

h1#hChara {
	width: 366px;
	background: url(../img/chara/h_chara.png) no-repeat 50% 0;
}

.charaList {
	width: 870px;
	margin: 0 auto;
}
.charaList li {
	float: left;
	margin-right: 30px;
	margin-bottom: 20px;
}

.charaHr {
	width: 920px;
	height: 17px;
	margin: 0 auto 30px;
	background: url(../img/chara/chara_bdr.png) no-repeat 50% 0;
	text-indent: -9999px;
}
.charaHr hr {display: none;}


/* キャラクタ詳細
----------------------------------*/
#charaDtl {
	float: left;
	width: 706px;
	position: relative;
	margin: 60px 0 80px;
	background: url(../img/chara/chara_bg.png) repeat-y 0 0;
	min-height: 500px;
}
#charaDtl:before,
#charaDtl:after {
	content: '';
	width: 100%;
	display: block;
	position: absolute;
	left: 0;
	text-indent: -9999px;
	height: 60px;
}
#charaDtl:before {
	top: -60px;
	background: url(../img/chara/chara_bg_top.png) no-repeat 50% 0;
}
#charaDtl:after {
	bottom: -60px;
	background: url(../img/chara/chara_bg_btm.png) no-repeat 50% 100%;
}

#btnCharaList {
	position: absolute;
	display: block;
	bottom: -120px;
	left: 33%;
}

#charaName,
#charaDesc,
#charaFace,
#charaSwitch,
#charaExtra {
	float: left;
}
#charaName,
#charaDesc,
#charaFace,
#charaExtra {
	margin-left: 40px;
}
#charaDesc {
	margin-bottom: 30px;
}

#charaName {
	padding-top: 10px;
	margin-bottom: 25px;
}
#charaName small {
	display: block;
	padding-top: 15px;
}
#charaFace {
	margin-right: 10px;
}

#charaSwitch {width: 152px;}
#charaSwitch li {
	display: none;
	text-align: center;
	position: relative;
}
#charaSwitch li.active {
	display: block;
}
#charaSwitch li a {
	display: block;
	text-align: center;
	position: absolute;
	left: 0;
	top: 0;
}
#charaSwitch li.txt {
	display: block;
	margin-top: 270px;
	text-align: center;
}



#charaMain {
	float: right;
	width: 270px;
	margin-right: 30px;
	min-height: 570px;
	position: relative;
}
#charaMain .loader {
	left: 50%;
	top: 160px;
	margin-left: -30px;
}
#charaMain ul {
	display: none;
}
#charaMain li {
	position: relative;
}
#charaMain figure {
	display: none;
	position: absolute;
	width: 260px;
	top: -15px;
	left: 0;
	z-index: 100;
	text-align: center;
}
#charaMain figure.active {
	display: block;
}

/* あいまいみい特殊 */
#charaAimaimi ul {
	text-align: center;
}
#charaAimaimi ul li {
	display: inline-block;
	vertical-align: top;
	text-align: center;
	padding: 0 5px;
	height: 580px;
	position: relative;
}
#charaAimaimi ul li a {
	display: none;
	margin-bottom: 10px;
	cursor: default;
}
#charaAimaimi ul li a img{
	vertical-align: top;
}
#charaAimaimi ul li a.active {
	display: block;
}
#charaAimaimi ul li div {
	width: 100%;
	text-align: center;
	position: absolute;
	top: 430px;
}


#charaSide {
	float: right;
	width: 283px;
	padding-top: 30px;
}
#charaSide nav ul {
	margin-bottom: 20px;
}

#charaNav > ul {
	width: 283px;
	margin-bottom: 10px;
	position: relative;
	background-repeat: no-repeat;
	background-position: 0 100%;
	padding-bottom: 20px;
}
#charaNav > ul:before {
	content: '';
	display: block;
	width: 100%;
	position: absolute;
	height: 20px;
	top: -20px;
	left: 0;
	text-indent: -9999px;
	background-repeat: no-repeat;
}
#charaNav > ul li {
	width: 250px;
	margin: 0 auto 5px;
}
#charaNav > ul li:last-child {
	margin-bottom: 0;
}
#charaNav > ul li a {
	display: block;
	height: 57px;
	background: url(../img/chara/chara_list_bg.png) no-repeat 0 0;
	position: relative;
}
#charaNav > ul li a img {
	position: absolute;
	top: 5px; left: 5px;
	vertical-align: bottom;
}
#charaNav01 {
	background-image: url(../img/chara/chara_side_bg01.png);
}
#charaNav01:before {
	background-image: url(../img/chara/chara_side_bg01_top.png);
}
#charaNav02 {
	background-image: url(../img/chara/chara_side_bg02.png);
}
#charaNav02:before {
	background-image: url(../img/chara/chara_side_bg02_top.png);
}
#charaNav03 {
	background-image: url(../img/chara/chara_side_bg03.png);
}
#charaNav03:before {
	background-image: url(../img/chara/chara_side_bg03_top.png);
}

/* 音声プレイヤー
----------------------------------*/
.sectAudioPlayer {
	/*clear: both;*/
	float: left;
	margin-top: 35px;
	margin-left: 35px;
	padding-left: 30px;
	position: relative;
}
.sectAudioPlayer h3 {
	position: absolute;
	top: -39px;
	left: -5px;
}
.sectAudioPlayer dt {
	margin-bottom: .25em;
	font-weight: bold;
	color: #000;
}
.sectAudioPlayer dt:after { content: ':'; }
.sectAudioPlayer dd {
	width: 280px;
}
div.skin_wcw {
	width: 100%;
	background-color: #000;
	-webkit-box-shadow: 0 0 4px 0 rgba(0,0,0,.4);
	-moz-box-shadow: 0 0 4px 0 rgba(0,0,0,.4);
	box-shadow: 0 0 4px 0 rgba(0,0,0,.4);
	border: none;
	position: relative;
}
div.skin_wcw div.jp-type-single div.jp-interface {
	position: relative;
	height: 40px;
	background-color: #000;
}
div.skin_wcw ul.jp-controls {
	width: 96%;
	padding: 0 2%;
	position: relative;
}
div.skin_wcw ul.jp-controls li {
	display: block;
	height: 40px;
	float: left;
}
div.skin_wcw ul.jp-controls li a {
	display: block;
	text-indent: -9999px;
	background: url(../img/chara/wcw_player.png) no-repeat 0 0;
	outline: none;
}
div.skin_wcw ul.jp-controls li a.jp-play,
div.skin_wcw ul.jp-controls li a.jp-pause,
div.skin_wcw ul.jp-controls li a.jp-stop,
div.skin_wcw ul.jp-controls li a.jp-mute,
div.skin_wcw ul.jp-controls li a.jp-unmute,
div.skin_wcw ul.jp-controls li a.jp-volume-max {
	width: 20px;
	height: 20px;
}
div.skin_wcw ul.jp-controls li a.jp-play,
div.skin_wcw ul.jp-controls li a.jp-pause,
div.skin_wcw ul.jp-controls li a.jp-stop {
	margin: 10px 5px 0;
}
div.skin_wcw ul.jp-controls li a.jp-play:hover { background-position: 0 -20px; }
div.skin_wcw ul.jp-controls li a.jp-pause { background-position: -20px 0; }
div.skin_wcw ul.jp-controls li a.jp-pause:hover { background-position: -20px -20px; }
div.skin_wcw ul.jp-controls li a.jp-stop { background-position: -40px 0; }
div.skin_wcw ul.jp-controls li a.jp-stop:hover { background-position: -40px -20px; }
div.skin_wcw ul.jp-controls li a.jp-mute,
div.skin_wcw ul.jp-controls li a.jp-unmute {
	position: absolute;
	top: 10px;
	right: 53px;
}
div.skin_wcw ul.jp-controls li a.jp-mute {background-position: -60px 0;}
div.skin_wcw ul.jp-controls li a.jp-mute:hover {background-position: -60px -20px;}
div.skin_wcw ul.jp-controls li a.jp-unmute {background-position: -80px 0;}
div.skin_wcw ul.jp-controls li a.jp-unmute:hover {background-position: -80px -20px;}
div.skin_wcw ul.jp-controls li a.jp-volume-max {}

div.skin_wcw div.jp-type-single div.jp-progress {
	position: absolute;
	width: 120px;
	height: 10px;
	left: 75px;
	top: 15px;
	background: #f9f9f9;
}
div.jp-seek-bar {
	width: 0px;
	height: 100%;
	cursor: pointer;
}
div.skin_wcw div.jp-play-bar,
div.skin_wcw div.jp-volume-bar-value {
	background: #fe0066;
	height: 100%;
}
div.skin_wcw div.jp-volume-bar {
	cursor: pointer;
	position: absolute;
	top: 17px;
	right: 8px;
	background: #f9f9f9;
	overflow: hidden;
	width: 40px;
	height: 5px;
}
div.skin_wcw div.jp-playlist{
	padding:0.5em;
}
div.skin_wcw div.jp-playlist li{
	padding:0.5em 1em;
	border-bottom:1px solid #000;
	background: #3e3e3e;
	font-size:0.8em;
}
div.skin_wcw div.jp-playlist li a{
	color:#fff;
	display:block;
	padding-left:20px;
	height:15px;
	background: url(../img/chara/chara_arrow.png) no-repeat;
}
div.skin_wcw div.jp-playlist a:hover {
	color:#fe0066;
}
div.skin_wcw div.jp-playlist a.jp-playlist-current {
	color:#fe0066;
}
div.skin_wcw div.jp-time-holder {
	position: absolute;
	top: 0; left: 0;
	width: 100%;
}
div.skin_wcw div.jp-time-holder div.jp-current-time,
div.skin_wcw div.jp-time-holder div.jp-duration {
	position: absolute;
	color: #ddd;
	font-size: 70%;
	font-style: italic;
}
div.skin_wcw div.jp-time-holder div.jp-current-time {
	top: 12px;
	left: -15px;
}
div.skin_wcw div.jp-time-holder div.jp-duration {
	top: 12px;
	right: -15px;
}



/* -------------------------------------------------------------------
 * 	ムービー MOVIE
 * 	------------------------------------------------------------------- */

#pageMovie{}

#hMovie {
	width: 289px;
	background: url(../img/movie/h_movie.png) no-repeat 50% 0;
}
.sectPV > section {
	margin-bottom: 40px;
}
.sectPV > section > h2 {
	margin-bottom: .5em;
	padding: 0 20px .5em;
	background: url(../img/common/subsect_bdr_h.png) no-repeat 50% bottom;
	font-size: 160%;
	font-weight: bold;
	color: #000;
	text-shadow: 1px 1px 0 #fff;
}

.sectPV .moviePlayer {
	width: 350px;
	float: left;
	margin-left: 20px;
	margin-right: 30px;
	background-color: #000;
	-webkit-box-shadow: 0 0 5px 0 rgba(0,0,0,.5);
	-moz-box-shadow: 0 0 5px 0 rgba(0,0,0,.5);
	box-shadow: 0 0 5px 0 rgba(0,0,0,.5);
}
.sectPV .pvDesc {
	float: left;
	width: 38%;
}
.sectPV .pvDesc p {
	line-height: 1.6em;
	/*text-shadow: 0 0 4px rgba(0,0,0,.25);*/
}



/* -------------------------------------------------------------------
 * 	商品情報 PRODUCT
 * 	------------------------------------------------------------------- */
#pageProduct{}

#hProduct {
	width: 339px;
	background: url(../img/product/h_product.png) no-repeat 50% 0;
}

/* コミック・CD
----------------------------------*/
.sectProductUnit {
	padding-bottom: 30px;
	margin-bottom: 30px;
	border-bottom: 1px dotted #555;
}
.sectProductUnit .figgroup {
	float: left;
	padding-top: 15px;
	margin-right: 20px;
}
.sectProductUnit .figgroup figure {
	float: none;
	margin-bottom: 30px;
	margin-right: 0;
}
.sectProductUnit figure {
	float: left;
	padding-top: 15px;
	margin-right: 20px;
	text-align: center;
}
.goodsPage .sectProductUnit figure {
	float: none;
	text-align: center;
}
.comicPage .sectProductUnit figure {
	width: 160px;
	height: 145px;
	background: url(../img/product/comic_bg.png) no-repeat 0 0;
}
.comicPage .sectProductUnit figure img {
  width: 100px;
  height: auto;
}
.cdPage .sectProductUnit > figure {
	width: 200px;
	height: 185px;
	background: url(../img/product/cd_bg.png) no-repeat 0 0;
}
.bdPage .sectProductUnit > figure {
	width: 227px;
	height: 278px;
	background: url(../img/product/bd_bg.png) no-repeat 0 0;
}
.comicPage .sectProductUnit figure figcaption {
	padding: .75em 0;
	font-size: 90%;
}

.sectProductUnit figure img {
	vertical-align: bottom;
	-webkit-box-shadow: 0 0 4px 0 rgba(0,0,0,.5);
	-moz-box-shadow: 0 0 4px 0 rgba(0,0,0,.5);
	box-shadow: 0 0 4px 0 rgba(0,0,0,.5);
}
.bdPage > .sectProductUnit figure img {
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}
.comicPage .sectProductUnit .prodDtl {
	float: left;
	width:480px;
}
.cdPage .sectProductUnit .prodDtl {
	float: left;
	width:440px;
}
.bdPage .sectProductUnit .prodDtl{
	float: left;
	width:415px;
}

.sectProductUnit .prodDtl h1 {
	margin-bottom: .5em;
	text-shadow: 1px 1px 0 #fff;
	font-size: 140%;
	font-weight: bold;
	color: #000;
}
.sectProductUnit .prodDtl h1 span {
	font-size:70%;
	display:block;
	padding-bottom:0.2em;
}
.sectProductUnit .prodDtl .presale,
.sectProductUnit .prodDtl .onsale {
	margin-bottom: .5em;
	font-weight: bold;
	text-shadow: 1px 1px 0 #fff;
}
.sectProductUnit .prodDtl .onsale { color: #e33; }
.sectProductUnit .prodDtl .presale {color: #333;}


.sectProductUnit .prodDtl dl{
	background:#fff;
	border:1px solid #a9a9a9;
	margin:20px 0 10px;
	padding:0.5em;
}
.sectProductUnit .prodDtl dt{
	font-weight:bold;
	font-size: 90%;
	margin-bottom:10px;
}

.sectProductUnit a{
	color:#0068b7;
	text-decoration:underline;
}

.cdPage .sectProductUnit article{
	clear:both;
	border: 1px solid #a9a9a9;
	overflow:hidden;
	padding:15px 15px 10px 15px;
}
.cdPage .sectProductUnit article figure{
	padding:0 0 5px 0;
	margin-right:15px;
}
.cdPage .sectProductUnit article h1{
	font-weight:bold;
	margin:10px 0;
}
.cdPage .sectProductUnit article p{
	line-height:1.2em;
}



/* コミック */
.comicSpl {
	margin-bottom: 1em;
	font-size: 90%;
}
.comicSpl li {
	line-height: 1.6em;
	margin-bottom:0.8em;
}
.comicSpl li figure{
	float:none;
	text-align: left;
	margin-bottom:10px;
}
.comicSpl li figure img{
	border:1px solid #a9a9a9;
}

.comicGallery {

}
.comicGallery li {
	width: 135px;
	height: 76px;
	float: left;
	margin: 0 10px 10px 0;
	background-color: #ddd;
	border: 1px solid #fff;
}

/* Blu-ray */
.subsubmenu{
	overflow:hidden;
}
.subsubmenu li{
	float:left;
}
.subsubmenu li a,
.bbtn a{
	display:block;
	border:1px solid #000;
	color:#fff;
	padding:0.5em;
	margin:0.5em;
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 10px;   /* Firefox用 */
    border-radius: 10px;        /* CSS3草案 */

background: #333;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.100, #333), color-stop(0.00, #666));
background: -webkit-linear-gradient(top, #666 0%, #333 100%);
background: -moz-linear-gradient(top, #666 0%, #333 100%);
background: -o-linear-gradient(top, #666 0%, #333 100%);
background: -ms-linear-gradient(top, #666 0%, #333 100%);
background: linear-gradient(to bottom, #666 0%, #333 100%);
-pie-background: linear-gradient(#666 0%, #333 100%);


	behavior: url(/js/PIE.htc);
	position: relative;

}
.bbtn a{
	text-decoration:none;
	text-align:center;
}

.tachiyomi li.none{
	display:none;
}
#fancybox-right{
	margin-right:30px;
}


/* -------------------------------------------------------------------
 * 	スペシャル SPECIAL
 * 	------------------------------------------------------------------- */
#pageSpecial {}

h1#hSpecial {
	width: 316px;
	background: url(../img/special/h_special.png) no-repeat 50% 0;
}


/* 共通
----------------------------------*/
.sectEvent > section > h2,
.sectTopic > section > h2,
.sectStory > section > h2{
	margin-bottom: .5em;
	background: url(../img/common/subsect_bdr_h.png) no-repeat 50% bottom;
	font-weight: bold;
	color: #000;
	text-shadow: 1px 1px 0 #fff;
}
.sectTopic > section > h2,
.sectStory > section > h2{
	padding: 0 20px .5em;
	font-size: 160%;
}
.sectEvent > section > h2{
	padding: 0 20px .8em;
	font-size: 130%;
}

.sectEvent > section > .eventInner,
.sectTopic > section > .topicInner,
.sectStory > section > .storyInner{
	padding: 0 20px;
}
.red{
	color:#c9291c;
	font-weight:bold;
	line-height:1.2em;
}
.topicInner{
	margin-bottom:20px;
}
/* イベント EVENT
----------------------------------*/
.lead{
	line-height:1.2em;
}

.sectEvent > section {
	margin-bottom: 40px;
}

.sectEvent > section > .eventInner {
	padding: 0 20px;
}
.sectEvent > section .eventDesc {
	width: 80%;
	margin-bottom: 1em;
	background-color: #fff;
	border-top: 1px solid #aaa;
	border-bottom: 1px solid #aaa;
	line-height:1.3em;
}
.sectEvent > section .eventDesc th,
.sectEvent > section .eventDesc td {
	border-bottom: 1px dotted #ccc;
}
.sectEvent > section .eventDesc tr:last-child th,
.sectEvent > section .eventDesc tr:last-child td {
	border-bottom: none;
}
.sectEvent > section .eventDesc th {
	width: 20%;
	padding: .2em .45em;
	text-align: right;
	font-weight: bold;
}
.sectEvent > section .eventDesc th.t02 {
	width: 30%;

}
.sectEvent > section .eventDesc th:after {
	content: ' : ';
}
.sectEvent > section .eventDesc td {
	padding: .2em .45em;
}
.sectEvent > section p {
	margin-bottom: 1em;
}
.sectEvent > section strong {
	font-weight: bold;
}
.sectEvent > section .spl {
	font-size: 85%;
	color: #888;
}
.sectEvent > section .spl li {
	line-height: 140%;
}
.sectEvent > section .spl li:before {
	content: '※ ';
}
.sectEvent a{
	color:#0068b7;
	text-decoration:underline;
}
.sectEvent a:hover{
	color:#ea68a2;
}

.eventInner dl{
	width: 80%;
	border:1px solid #CCC;
	padding:0.8em 0.8em 0.3em 0.8em;
	background:#fff;
	line-height:1.4em;
}
.eventInner dl.box02{
	background:#fee0d6;
	border:1px solid #feae93;
}
.eventInner dt{
	font-weight:bold;
	margin-bottom:0.2em;
}
.eventInner dd{
	margin-bottom:0.5em;
}

/* トピック
----------------------------------*/
/* 水薙竜コメント */
.mizunagi_comment p {
	float: left;
	width: 345px;
	margin-bottom: 1em;
}
.mizunagi_comment p.name {
	clear: both;
	float: none;
	text-align: right;
}
.twittericon{
		margin:10px;
			overflow:hidden;
}
.twittericon li{
		float:left;
		margin:5px;
}
.twittericon li img{
		width:100px;
}



/* -------------------------------------------------------------------
 * 	リンク LINK
 * 	------------------------------------------------------------------- */

#pageLink {}

h1#hLink {
	width: 252px;
	background: url(../img/link/h_link.png) no-repeat 50% 0;
}

#linkList {
	width: 800px;
	margin: 0 auto;
}
#linkList li {
	float: left;
	width: 50%;
	height: 120px;
}
#linkList li a {
	display: block;
}
#linkList li a:hover {
	color: #555;
}

#linkList dt {
	margin-bottom: .5em;
	font-weight: bold;
	font-size: 110%;
}
#linkList dt:before {
	content: '';
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 10px;
	text-indent: -9999px;
	vertical-align: middle;
	background: url(../img/common/blt_fire01.png) no-repeat 50% 50%;

}
#linkList dd {
	padding-left: 30px;
}
#linkList dd img.bn {
	display: block;
	vertical-align: bottom;
	margin-bottom: 5px;
	-webkit-box-shadow: 0 0 4px 0 rgba(0,0,0,.3);
	-moz-box-shadow: 0 0 4px 0 rgba(0,0,0,.3);
	box-shadow: 0 0 4px 0 rgba(0,0,0,.3);
}
#linkList dd span.outer {
	display: block;
	font-family: 'Marcellus', serif;
	font-size: 90%;
}

/* -------------------------------------------------------------------
 * 	ON AIR
 * 	------------------------------------------------------------------- */
h1#hOnair {
	width: 289px;
	background: url(../img/onair/h_onair.png) no-repeat 50% 0;
}
.onairDesc{
	color:#000;
	font-size:1.2em;
	margin-left:40px;
	line-height:1.5em;
}
.onairDesc th{
	width:30%;
	text-align:left;
}
.onairDesc th,
.onairDesc td{
	padding-bottom:0.5em;
}
.onair ul{
	color:#000;
	font-size:1.2em;
	line-height:1.5em;
	margin-left:40px;
}
.onair li{
	margin-bottom:0.5em;
}
.onair a{
	color:#0066FF;
}

.onair #haishin li{
	margin-bottom:1.5em;
}

.onair p{
	margin-left:40px;
	margin-bottom:1.5em;
}

.onair h3{
	color:#000;
	font-size:1.2em;
	line-height:1.5em;
	margin-left:40px;
}

.onair table{
	margin-bottom:1.5em;
}



/* -------------------------------------------------------------------
 * 	World
 * 	------------------------------------------------------------------- */
h1#hWorld {
	width: 294px;
	background: url(../img/world/h_world.png) no-repeat 50% 0;
}

/* -------------------------------------------------------------------
 * 	goods
 * 	------------------------------------------------------------------- */
.sectGoods figure{
	margin-bottom:10px;
}