@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Roboto:500,700');
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 100;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 200;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 300;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 400;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Bold");
	font-weight: bold;
}
@font-face {
	font-family: 'Noto Serif Japanese';
	font-style: normal;
	src: url('../fonts/NotoSerifJP-Light.woff') format('woff');
	font-display: swap;
}
.sf {
	font-family: YuMincho, 'Yu Mincho', 'Noto Serif Japanese', serif;
	font-weight: 400;
}
::selection {
	background: #000;
	color: #fff;
}
::-moz-selection {
 background: #000;
 color:#fff;
}
/* ▼色設定 */
#chronicle dd:after,
#trailerList dd:after,
#seriesList dd:after,
#staffCast dd:after,
#rightMenu li a.colorTV:before,
.tv1 #characterDiagram:after,
.tv2 #characterDiagram:after,
.mv1 #characterDiagram:after,
.rcTV,
.bcTV dt,
.tv1 .characterNav li a:before,
.tv2 .characterNav li a:before,
.mv1 .characterNav li a:before,
.tv1 .characterNav li a:after,
.tv2 .characterNav li a:after,
.mv1 .characterNav li a:after { background-color: #15B0C2 !important; }
#chronicle dd.ss1:after,
#trailerList dd.ss1:after,
#seriesList dd.ss1:after,
#staffCast dd.ss1:after,
#rightMenu li a.colorS1:before,
.ss1 #characterDiagram:after,
.rcS1,
.bcS1 dt,
.ss1 .characterNav li a:before,
.ss1 .characterNav li a:after { background-color: #278938 !important; }
#trailerList dd.ss2:after,
#seriesList dd.ss2:after,
#chronicle dd.ss2:after,
#staffCast dd.ss2:after,
#rightMenu li a.colorS2:before,
.ss2 #characterDiagram:after,
.rcS2,
.bcS2 dt,
.ss2 .characterNav li a:before,
.ss2 .characterNav li a:after { background-color: #DE671F !important; }
#tralilerList dd.ss3:after,
#chronicle dd.ss3:after,
#staffCast dd.ss3:after,
#rightMenu li a.colorS3:before,
.ss3 #characterDiagram:after,
.rcS3,
.bcS3 dt,
.ss3 .characterNav li a:before,
.ss3 .characterNav li a:after { background-color: #F62BA9 !important; }
.bcTV { border-color: #15B0C2 !important; }
.bcS1 { background-color: #278938 !important; }
.bcS2 { background-color: #DE671F !important; }
.bcS3 { background-color: #F62BA9 !important; }
/* ▲色設定 */

body {
	font-family: "Roboto", "Yu Gothic", YuGothic, sans-serif;
	font-weight: 500;
	font-size: 14px;
	color: #fff;
	background-color: #000;
	height: 100%;
}
a { color: #FFF; }
a:hover { text-decoration: none; }
#subWrap {
	min-width: 1200px;
	min-height: 100%;
	overflow-x: hidden;
}
#subWrap header,
#subWrap article,
#subWrap nav,
#subWrap footer {
	opacity: 0;
	pointer-events: none;
}
nav {
	width: 200px;
	box-sizing: border-box;
	position: fixed;
	height: 100%;
	min-height: 620px;
	border-right: #232323 1px solid;
}
nav:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 30px;
	height: 2px;
	background-color: #000;
}
nav h1 {
	color: #FFF;
	position: absolute;
	left: 0px;
	top: 60px;
	font-size: 12px;
	line-height: 22px;
}
nav h1 a {
	display: block;
	transition: all 0.5s ease;
	color: #000;
	text-decoration: none;
}
nav h1 a:hover { opacity: 0.7; }
nav h1 span {
	height: 24px;
	display: block;
	width: 200px;
	background: url(../images/navlogo.png) no-repeat center center / 79%;
	text-indent:-9878px;
}
nav h1:before {
	content: 'Navigation';
	position: absolute;
	top: -4px;
	left: 208px;
	height: 16px;
	width: 66px;
	font-size: 10px;
	background-color: #000;
	transform-origin: left top;
	transform: rotate(90deg);
	line-height: 16px;
	color: #FFF;
	text-align: center;
	letter-spacing: 0.1em;
}
nav h1:after{
    content: '';
    position: absolute;
    right: 0;
    top: -60px;
    height: 20px;
    width: 1px;
    background-color: #FFF;
}
#navList {
	position: absolute;
	width: 200px;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	margin-top:-30px;
}
#navList li {
	padding-top: 5px;
	padding-bottom: 5px;
}
#navList li:last-child { margin-bottom: 0; }
#navList li a {
	text-decoration: none;
	position: relative;
	font-size: 12px;
	letter-spacing: 0.1em;
	text-indent: 0.03;
	text-align: center;
	display: block;
	position: relative;
	line-height: 20px;
}
#navList li a.soon {
	pointer-events: none;
	opacity: 0.4;
}
#navList li a:before {
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	height: 1px;
	width: 0px;
	background-color: #FFF;
	transition: all 0.3s ease;
	transform: translateY(-50%);
}
#navList li a:after {
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	height: 0px;
	width: 1px;
	background-color: #FFF;
	transition: all 0.3s ease;
	transition-delay: 0.3s;
	transform: translateY(-50%);
}
#navList li a:hover:before,
#navList li a.active:before {
	left: 0;
	width: 100%;
}
#navList li a:hover:after,
#navList li a.active:after {
	/*top: 0;*/
	height: 100%;
}
#navList li a span {
	background: #000;
	text-align: center;
	display: inline-block;
	padding-right: 9px;
	padding-left: 9px;
	position: relative;
	z-index: 50;
}
#navList li a span i {
	font-size: 10px;
	font-style: normal;
}
#navShare {
	width: 200px;
	position: absolute;
	left: 0px;
	bottom: 0px;
	padding-top: 12px;
}
#navShare:before {
	content: 'Share';
	position: absolute;
	top: -4px;
	left: 208px;
	height: 16px;
	width: 38px;
	font-size: 10px;
	background-color: #000;
	transform-origin: left top;
	transform: rotate(90deg);
	line-height: 16px;
	color: #FFF;
	text-align: center;
	letter-spacing: 0.1em;
}
#navShare:after {
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	height: 20px;
	width: 1px;
	background-color: #FFF;
}
#navShare ul {
	display: table;
	margin-right: auto;
	margin-left: auto;
	padding-bottom: 22px;
}
#navShare li {
	display: table-cell;
	height: 30px;
	width: 30px;
	padding-right: 6px;
	padding-left: 6px;
}
#navShare ul li a {
	display: block;
	height: 30px;
	text-align: center;
	box-sizing: border-box;
	line-height: 32px;
	text-align: center;
	position: relative;
	font-size: 20px;
}
#navShare ul li a span {
	height: 30px;
	display: block;
	position: relative;
}
#navShare ul li a:before {
	content: '';
	position: absolute;
	width: 1px;
	height: 0px;
	left: 0;
	bottom: 0;
	transition: all .2s ease;
	background-color: #FFF;
}
#navShare ul li a:after {
	content: '';
	position: absolute;
	width: 0px;
	height: 1px;
	left: 0;
	top: 0;
	transition: all .2s ease;
	background-color: #FFF;
}
#navShare ul li a span:before {
	content: '';
	position: absolute;
	width: 1px;
	height: 0px;
	right: 0;
	top: 0;
	transition: all .2s ease;
	background-color: #FFF;
}
#navShare ul li a span:after {
	content: '';
	position: absolute;
	width: 0px;
	height: 1px;
	right: 0;
	bottom: 0;
	transition: all .2s ease;
	background-color: #FFF;
}
#navShare ul li a:hover:before { height: 100%; }
#navShare ul li a:hover:after { width: 100%; }
#navShare ul li a:hover span:before { height: 100%; }
#navShare ul li a:hover span:after { width: 100%; }
#officialTwi a {
	height: 30px;
	padding-left: 40px;
	display: block;
	position: relative;
	text-decoration: none;
	line-height: 30px;
	font-size: 10px;
	letter-spacing: 0.06em;
	transition: all 0.5s ease;
}
#officialTwi a:hover { opacity: 0.6; }
#officialTwi a span {
	background: #FFF;
	display: block;
	width: 30px;
	height: 30px;
	position: absolute;
	left: 0px;
	top: 0px;
	line-height: 32px;
	color: #000;
	text-align: center;
	font-size: 18px;
}
#subCont {
	margin-left: 200px;
	position: relative;
	min-height: 100%;
	min-width: 1080px;
}
#subCont #grayBg {
	content: '';
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	background-color: #202020;
	z-index: -4;
	width: 0;
	transition: all 0.5s cubic-bezier(0.07, 0.68, 0.25, 1);
}
#subCont #bgT1 {
	content: '';
	position: absolute;
	left: calc(26% + 90px);
	top: 30px;
	z-index: -3;
	width: 181px;
	height: 177px;
	background-image: url(../images/topics_h2bg.svg);
	background-repeat: no-repeat;
	transition-delay: .5s;
	transition: all 0.5s ease;
	opacity: 0;
}
.goods #subCont #bgT1,
.bddvd #subCont #bgT1 { left: calc(26% + 30px); }
#subCont #bgT2 {
	content: '';
	position: absolute;
	right: 30px;
	top: 140px;
	z-index: -3;
	width: 334px;
	height: 79px;
	background-image: url(../images/header_bgt2.svg);
	background-repeat: no-repeat;
	transition-delay: .5s;
	transition: all 0.5s ease;
	opacity: 0;
}
#subCont #bgMK {
	content: '';
	position: fixed;
	right: 0px;
	bottom: -50px;
	z-index: -2;
	width: 487px;
	height: 508px;
	background-image: url(../images/footer_bgmk.svg);
	background-repeat: no-repeat;
	transition-delay: .5s;
	transition: all 0.5s ease;
	opacity: 0;
}
#subCont #grayBg.in { width: 74%; }
#subCont #grayBg:before {
	content: '';
	position: absolute;
	left: 60px;
	top: 0;
	bottom: 0;
	width: 1px;
	background-color: #434343;
	transition: all 0.5s ease;
	transition-delay: 0.5s;
	opacity: 0;
}
#subCont.diagram #grayBg:before { display: none; }
.goods #subCont #grayBg:before,
.bddvd #subCont #grayBg:before { display: none; }
#subCont #grayBg:after {
	content: '';
	position: absolute;
	right: 123px;
	top: 0;
	bottom: 0;
	width: 1px;
	background-color: #434343;
	transition: all 0.5s ease;
	transition-delay: 0.5s;
	opacity: 0;
}
#subCont #grayBg.in:before,
#subCont #grayBg.in:after,
#subCont #bgT1.in,
#subCont #bgT2.in,
#subCont #bgMK.in {
	opacity: 1;
	transition-delay: .5s;
}
#subCont header {
	height: 235px;
	position: relative;
	padding-left: 60px;
}
#subCont header:before {
	content: '';
	position: absolute;
	left: calc(26% + 60px);
	top: 0;
	height: 20px;
	width: 1px;
	background-color: #FFF;
}
#subCont header:after {
	content: '';
	position: absolute;
	right: 123px;
	top: 0;
	height: 20px;
	width: 1px;
	background-color: #FFF;
}
#subCont header h2 {
	font-size: 30px;
	line-height: 80px;
	letter-spacing: 1.3em;
	position: absolute;
	height: 80px;
	top: 95px;
	left: 60px;
}
#subCont header h2.halfspace {
	/*letter-spacing: 0.65em;*/
	letter-spacing: -0.1px;
}
#subCont header h2:before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 60px;
	height: 2px;
	background-color: #FFF;
}
#pageTitle {
	position: absolute;
	top: 122px;
	right: 123px;
	font-size: 20px;
	text-align: right;
}
#pageTitle span {
	display: inline-block;
	height: 22px;
	padding-right: 10px;
	color: #000;
	letter-spacing: 0.13em;
	text-indent: 0.13em;
	padding-left: 10px;
	background: #FFF;
	margin-bottom: 11px;
	line-height: 22px;
}
#pageTitle span strong { font-size: 18px; }
#subCont article { }
#articleHead {
	height: 12px;
	margin-bottom: 34px;
}
#articleHeadLeft {
	width: 26%;
	float: left;
	position: relative;
	height: 12px;
}
#articleHeadLeft span {
	font-size: 10px;
	line-height: 12px;
	text-align: center;
	height: 12px;
	width: 56px;
	background: #FFF;
	display: block;
	color: #000;
	letter-spacing: 0.1em;
	text-indent: 0.1em;
	margin-left: 40px;
	position: absolute;
	top: 0;
}
#articleHeadLeft span:first-of-type { right: 166px; }
#articleHeadLeft span:last-of-type { right: 60px; }
#articleHeadRight {
	width: 74%;
	float: left;
	position: relative;
	box-sizing: border-box;
	padding-left: 60px;
	height: 12px;
}
#articleHeadRight span {
	font-size: 10px;
	line-height: 12px;
	text-align: center;
	height: 12px;
	width: 56px;
	background: #FFF;
	display: block;
	color: #000;
	letter-spacing: 0.1em;
	text-indent: 0.1em;
	margin-left: 0px;
}
#chronicle { position: relative; }
#chronicle:before {
	content: '';
	position: absolute;
	left: 0;
	bottom: -1px;
	right: 123px;
	background-color: #434343;
	height: 1px;
}
#chronicle dt {
	float: left;
	height: 20px;
	width: 26%;
	position: relative;
	clear: both;
	z-index: 5;
}
#chronicle dt .y {
	font-size: 12px;
	line-height: 20px;
	background: #000;
	text-align: center;
	height: 20px;
	width: 56px;
	display: block;
	position: absolute;
	right: 166px;
	top: -10px;
}
#chronicle dt .m {
	font-size: 12px;
	line-height: 20px;
	background: #000;
	text-align: center;
	height: 20px;
	width: 56px;
	display: block;
	position: absolute;
	right: 60px;
	top: -10px;
}
#chronicle dd {
	box-sizing: border-box;
	padding-left: calc(26% + 60px);
	position: relative;
	z-index: 1;
}
#chronicle dd:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	right: 123px;
	height: 1px;
	background-color: #434343;
	z-index: 1;
}
#chronicle dd:after {
	content: '';
	position: absolute;
	right: 123px;
	top: 0;
	bottom: 0;
	width: 1px;
	background-color: #15B0C2;
}
#chronicle dd.ss1:after { background-color: #278938; }
#chronicle dd.ss2:after { background-color: #DE671F; }
#chronicle dd.ss3:after { background-color: #F62BA9; }
#chronicle dd:last-of-type .moreWrap { padding-bottom: 0; }
#chronicle dd .chronicleText {
	font-size: 14px;
	line-height: 36px;
	transform: translateY(-9px);
	position: relative;
	z-index: 5;
	padding-right: 183px;
	padding-bottom: 15px;
}
.moreWrap {
	padding-top: 20px;
	padding-bottom: 60px;
	padding-right: 183px;
}
.chronicleMore { height: 20px; }
.chronicleMore a {
	position: relative;
	display: block;
	height: 20px;
	color: #FFF;
	text-decoration: none;
	border: 1px solid #FFF;
	text-align: center;
	line-height: 20px;
	font-size: 12px;
	box-sizing: border-box;
	letter-spacing: 0.075em;
	text-indent: 0.075em;
	transition: all 0.3s ease;
	transition-delay: .15s;
}
.chronicleMore a:before {
	content: '';
	position: absolute;
	right: 0;
	top: 0;
	height: 18px;
	background-color: #FFF;
	width: 0;
	transition: all 0.3s ease;
}
.chronicleMore a.hover {
	color: #000;
	transition-delay: .15s;
}
.chronicleMore a.hover:before {
	width: 100%;
	transition-delay: 0s;
}
.chronicleMore a span {
	position: relative;
	z-index: 10;
}
.chronicleText a {
	text-decoration: none;
	display: block;
}
.moreCont {
	position: relative;
	padding-top: 20px;
	display: none;
}
.moreCont:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 20px;
	height: 1px;
	background-color: #FFF;
}
.moreCont h3 {
	font-size: 18px;
	line-height: 30px;
	padding-bottom: 32px;
	letter-spacing: 0.075em;
}
.moreClose {
	height: 40px;
	width: 40px;
	position: absolute;
	top: 0px;
	right: 0px;
}
.moreClose a {
	height: 40px;
	display: block;
	position: relative;
	background-color: #FFF;
	transition: all 0.3s ease;
}
.moreClose a:hover { opacity: 0.6; }
.moreClose a:before,
.moreClose a:after {
	content: '';
	position: absolute;
	width: 16px;
	height: 2px;
	left: 50%;
	top: 50%;
	margin-left: -8px;
	margin-top: -1px;
	background-color: #000;
}
.moreClose a:before { transform: rotate(45deg); }
.moreClose a:after { transform: rotate(-45deg); }
.moreText {
	line-height: 36px;
	padding-bottom: 20px;
	padding-right: 40px;
}
.moreImage { padding-bottom: 20px; }
.moreImage img {
	display: block;
	float: left;
}
.moreStaff { padding-bottom: 45px; }
.moreStaff li {
	font-size: 12px;
	line-height: 26px;
}
#subWrap footer {
	margin-right: 123px;
	height: 490px;
	border-right: 1px solid #434343;
	position: relative;
}
#subWrap footer:before {
	content: '';
	position: absolute;
	left: 0;
	top: 10px;
	right: 0;
	height: 1px;
	background-color: #434343;
}
#footerMark {
	height: 55px;
	width: 50px;
	position: absolute;
	top: 272px;
	left: 60px;
	text-indent: -9875px;
	background-image: url(../images/footer_icon.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
}
#footerLast {
	height: 125px;
	position: absolute;
	left: 0px;
	right: 0px;
	bottom: 0px;
}
#footerLast:before {
	content: '';
	position: absolute;
	left: 0;
	right: 120px;
	top: -1px;
	height: 1px;
	background-color: #434343;
}
#footerNotice {
	font-size: 10px;
	line-height: 18px;
	text-align: right;
	height: 18px;
	padding-top: 55px;
	font-weight: 600;
}
#copyright {
	font-size: 10px;
	line-height: 18px;
	text-align: right;
	height: 18px;
	font-weight: 600;
}
#pagetop {
	height: 60px;
	width: 120px;
	position: absolute;
	top: -30px;
	right: 0px;
}
#pagetop:before {
	content: '';
	position: absolute;
	top: 29px;
	left: 0;
	width: 20px;
	height: 1px;
	background-color: #FFF;
}
#pagetop:after {
	content: '';
	position: absolute;
	top: 29px;
	right: 0;
	width: 20px;
	height: 1px;
	background-color: #FFF;
}
#pagetop a {
	position: relative;
	z-index: 2;
	display: block;
	height: 60px;
	text-decoration: none;
}
#pagetop a:before,
#pagetop a:after {
	content: '';
	position: absolute;
	left: 50%;
	margin-left: -4px;
	width: 8px;
	height: 8px;
	border-left: 1px solid #FFF;
	border-top: 1px solid #FFF;
	transform: rotate(45deg);
	box-sizing: border-box;
	transition: all 0.3s ease;
}
#pagetop a:before { top: 0px; }
#pagetop a:after { top: 6px; }
#pagetop a:hover:before { top: -4px; }
#pagetop a:hover:after { top: 2px; }
#pagetop a span {
	line-height: 20px;
	text-align: center;
	display: block;
	height: 20px;
	width: 80px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -40px;
	margin-top: -10px;
	font-size: 12px;
	letter-spacing: .1em;
	text-indent: .1em;
}
#rightMenu {
	position: absolute;
	width: 119px;
	right: 4px;
	top: 46px;
	z-index: 5000;
}
#rightMenu li {
	height: 20px;
	margin-bottom: 50px;
}
#rightMenu li a {
	text-decoration: none;
	height: 20px;
	text-align: center;
	display: block;
	font-size: 12px;
	line-height: 20px;
	position: relative;
	transition: all 0.3s ease;
}
#rightMenu li a:hover,
#rightMenu li a.active { color: #000; }
#rightMenu li a:before {
	content: '';
	position: absolute;
	z-index: -1;
	right: 0;
	top: 0;
	height: 20px;
	width: 0;
	background-color: #FFF;
	transition: all 0.3s ease;
}
#rightMenu li a:hover:before,
#rightMenu li a.active:before { width: 100%; }
#rightBg {
	background: #FFF;
	position: fixed;
	width: 4px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	transition: all 0.2s ease;
}
#characterOnce {
	min-height: 620px;
	min-width: 1280px;
	overflow: hidden;
	position: absolute;
	height: 100%;
	width: 100%;
}
#characterOnce section:before {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: 50%;
	margin-top: -310px;
	height: 620px;
	background-color: #202020;
	z-index: 10;
}
#characterOnce section:after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 11;
	background: url(../images/character_pattern.png) center center;
}
#characterOnce section {
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 1500;
	display: none;
	transition: transform 0.5s ease;
	transition-delay: 0s;
}
#characterOnce section h1 {
	font-size: 140px;
	color: #202020;
	text-align: center;
	position: absolute;
	left: 50%;
	top: -60px;
	line-height: 160px;
	letter-spacing: 0.05em;
	text-indent: 0.05em;
	height: 160px;
	width: 200%;
	margin-left: -100%;
	z-index: 9;
}
.tsno {
	font-size: 15px;
	font-style: italic;
	color: #FFF;
	background: #000;
	text-align: center;
	height: 26px;
	width: 170px;
	z-index: 501;
	line-height: 26px;
	letter-spacing: 0.075em;
	text-indent: 0.075em;
	position: absolute;
	left: 0px;
	top: 0px;
}
#characterOnceTitle {
	position: fixed;
	z-index: 5000;
	right: 30px;
	bottom: 30px;
	text-align: right;
}
#characterOnceTitle span {
	background: #15B0C2;
	display: inline-block;
	margin-top: 11px;
	height: 22px;
	font-size: 20px;
	line-height: 22px;
	color: #000;
	letter-spacing: 0.08em;
	padding-right: 9px;
	padding-left: 9px;
	font-weight: 500;
}
#characterOnceTitle span strong { font-size: 18px; }
.characterOnceCont {
	height: 620px;
	width: 1200px;
	margin-top: -310px;
	margin-left: -600px;
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 5001;
}
.characterOnceCont:before {
	content: '';
	position: absolute;
	left: -20px;
	top: -20px;
	width: 32px;
	height: 932px;
	background-image: url(../images/character_dot_l.png);
	z-index: 3;
}
.characterOnceCont:after {
	content: '';
	position: absolute;
	right: 0px;
	top: -12px;
	width: 412px;
	height: 12px;
	background-image: url(../images/character_dot_r.png);
	z-index: 3;
}
.characterSpec {
	background-image: url(../images/character_speccard.png), url(../images/character_speccardbg.png);
	background-position: center center, 540px 30px;
	background-repeat: no-repeat;
	height: 520px;
	width: 740px;
	position: absolute;
	top: 50px;
	right: 80px;
}
.characterPhoto {
	height: 240px;
	width: 200px;
	position: absolute;
	left: 50px;
	top: 50px;
}
.characterSpecRight {
	width: 400px;
	position: absolute;
	top: 50px;
	right: 50px;
}
.characterID {
	font-size: 12px;
	line-height: 12px;
	height: 12px;
	padding-bottom: 10px;
	border-bottom: 2px solid #FFF;
	letter-spacing: 0.035em;
}
.characterSpecRight h3 {
	font-size: 53px;
	line-height: 60px;
	letter-spacing: 0.1em;
	padding-top: 25px;
	padding-bottom: 15px;
}
.characterBen {
	height: 20px;
	margin-bottom: 4px;
}
.characterBen span {
	background: #FFF;
	display: inline-block;
	height: 20px;
	padding-right: 10px;
	padding-left: 10px;
	color: #000;
	font-size: 12px;
	line-height: 12px;
	letter-spacing: 0.075em;
	text-indent: 0.075em;
	line-height: 20px;
}
.characterVoice {
	line-height: 68px;
	height: 68px;
	padding-bottom: 4px;
	font-size: 18px;
	font-weight: 600;
}
.characterText {
	font-size: 14px;
	line-height: 30px;
	padding: 24px 0px;
	position: relative;
}
.characterText:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 30px;
	height: 2px;
	background-color: #FFF;
}
.characterText:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 30px;
	height: 2px;
	background-color: #FFF;
}
.characterImage {
	position: absolute;
	top: -10px;
	right: 845px;
	z-index: 4;
}
#tv204 .characterImage { transform: translateX(100px); }
.characterBottomName {
	font-size: 140px;
	line-height: 160px;
	color: #000;
	height: 160px;
	width: 200%;
	margin-left: -100%;
	position: absolute;
	left: 50%;
	bottom: -32px;
	letter-spacing: 0.05em;
	text-indent: 0.05em;
	text-align: center;
}
.characterNav {
	pointer-events: none;
	left: 0;
	top: 50%;
	right: 0;
	height: 620px;
	position: absolute;
	z-index: 5500;
	margin-top: -310px;
}
.characterNav li {
	height: 620px;
	width: 100px;
	position: absolute;
	top: 0;
	pointer-events: auto;
}
.characterNav li:first-child { left: 0px; }
.characterNav li:last-child { right: 0px; }
.characterNav li a {
	display: block;
	height: 620px;
	position: relative;
	text-decoration: none;
}
.characterNav li a span {
	transform-origin: center center;
	position: absolute;
	top: 50%;
	height: 24px;
	display: inline-block;
	color: #FFF;
	white-space: nowrap;
	font-size: 20px;
	width: 620px;
	margin-top: -12px;
	text-align: center;
	letter-spacing: 0.04em;
	text-indent: 0.04em;
}
.characterNav li:first-child a span {
	margin-left: -315px;
	left: 12px;
	transform: rotate(90deg);
}
.characterNav li:last-child a span {
	margin-right: -315px;
	right: 12px;
	transform: rotate(-90deg);
}
.characterNav li a:before {
	content: '';
	width: 14px;
	position: absolute;
	height: 620px;
	top: 0;
}
.characterNav li:first-child a:before { left: 0; }
.characterNav li:last-child a:before { right: 0; }
.characterNav li a:after {
	content: '';
	width: 67px;
	position: absolute;
	height: 141px;
	top: 50%;
	margin-top: -70px;
}
.characterNav li:first-child a:after {
	left: 30px;
	background: transparent url(../images/character_left_arrow.png) !important;
	transition: all 0.3s ease;
}
.characterNav li:last-child a:after {
	right: 30px;
	background: transparent url(../images/character_right_arrow.png) !important;
	transition: all 0.3s ease;
}
.characterNav li:first-child a:hover:after { left: 22px; }
.characterNav li:last-child a:hover:after { right: 22px; }
.prevOut {
	transform: scale(0.7) translate3d(500px, 100px, 0);
	transition: transform 0.5s ease;
	z-index: 499;
}
.nextOut {
	transform: scale(1.4) translate3d(-500px, -100px, 0);
	transition: transform 0.5s ease;
	z-index: 501;
}
.prevOut .characterNav,
.nextOut .characterNav,
.prevIn .characterNav,
.nextIn .characterNav { display: none; }
@keyframes previn { 0% {
 transform:scale(1.4) translate3d(-500px, -100px, 0);
}
 100% {
 transform:scale(1) translate3d(0, 0, 0);
}
}
@keyframes nextin { 0% {
 transform:scale(0.7) translate3d(500px, 100px, 0);
}
 100% {
 transform:scale(1) translate3d(0, 0, 0);
}
}
.prevIn {
	animation: previn 0.5s ease forwards;
	z-index: 500;
}
.nextIn {
	animation: nextin 0.5s ease forwards;
	z-index: 500;
}
#newsList { position: relative; }
#newsList:before {
	content: '';
	position: absolute;
	left: 0;
	bottom: -1px;
	right: 123px;
	background-color: #434343;
	height: 1px;
}
#newsList dt {
	float: left;
	height: 20px;
	width: 26%;
	position: relative;
	clear: both;
	z-index: 5;
}
#newsList dt .y {
	font-size: 12px;
	line-height: 20px;
	background: #000;
	text-align: center;
	height: 20px;
	width: 56px;
	display: block;
	position: absolute;
	right: 166px;
	top: -10px;
}
#newsList dt .m {
	font-size: 12px;
	line-height: 20px;
	background: #000;
	text-align: center;
	height: 20px;
	width: 56px;
	display: block;
	position: absolute;
	right: 60px;
	top: -10px;
}
#newsList dd {
	box-sizing: border-box;
	padding-left: calc(26% + 60px);
	position: relative;
	z-index: 1;
	padding-bottom: 100px;
}
#newsList dd.newsOnceDD { padding-bottom: 0px; }
#newsList dd:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	right: 123px;
	height: 1px;
	background-color: #434343;
	z-index: 1;
}
#newsList dd:after {
	content: '';
	position: absolute;
	right: 123px;
	top: 0;
	bottom: 0;
	width: 1px;
	background-color: #FFF;
}
#newsList dd .newsText {
	font-size: 16px;
	line-height: 30px;
	transform: translateY(-5px);
	position: relative;
	z-index: 5;
	padding-right: 183px;
	padding-bottom: 20px;
}
.newsCategory { height: 20px; }
.newsCategory span {
	font-size: 12px;
	line-height: 20px;
	color: #000;
	background: #FFF;
	text-align: center;
	height: 20px;
	width: 80px;
	display: block;
	float: left;
	margin-right: 10px;
	letter-spacing: 0.075em;
}
#newsOnceCont {
	margin-top: 10px;
	background: url(../images/news_dot.png) no-repeat left top;
	padding-top: 40px;
	margin-right: 183px;
}
.newsOnceDtitle {
	height: 12px;
	margin-bottom: 17px;
}
.newsOnceDtitle span {
	font-size: 10px;
	line-height: 12px;
	color: #000;
	background: #FFF;
	text-align: center;
	display: block;
	height: 12px;
	width: 56px;
	letter-spacing: 0.1em;
	text-indent: 0.1em;
}
#newsOnceText p {
	line-height: 36px;
	padding-bottom: 30px;
}
#newsOnceText img {
	max-width: 100%;
	height: auto;
}
#newsOnceText p a {
	text-decoration: underline;
	transition: all 0.3s ease;
}
#newsOnceText p a:hover { opacity: 0.7; }
#newsOnceText { padding-bottom: 110px; }
#newsOnceText .goods h3 {
	font-weight: bold;
	margin-top: 80px;
	margin-bottom: 20px;
	padding-left: 10px;
	border-left: #000 2px solid;
}
#newsOnceText .goods ul {
	max-width: 100%;
	line-height: 40px;
}
#newsOnceText .goods li:nth-child(odd) {
	float: left;
	width: 100px;
}
#newsOnceText .goods li:nth-child(even) {
	float: left;
	width: calc(100% - 160px);
	padding-left: 30px;
	border-left: 1px solid #000;
}
#backtolist {
	height: 90px;
	width: 150px;
}
#backtolist a {
	background: #FFF;
	height: 90px;
	display: block;
	line-height: 28px;
	padding-top: 62px;
	padding-left: 10px;
	box-sizing: border-box;
	color: #000;
	text-decoration: none;
	font-size: 12px;
	letter-spacing: .075em;
	overflow: hidden;
	position: relative;
}
#backtolist a:before {
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	width: 50px;
	height: 59px;
	background-image: url(../images/backtolist_arrow.png);
	transition: all 0.5s ease;
}
#backtolist a:hover:before { transform: translate3d(-10px, 0, 0); }
#trailerList {
	position: relative;
	padding-top: 46px;
}
#trailerList:before {
	content: '';
	position: absolute;
	left: 0;
	bottom: -1px;
	right: 123px;
	background-color: #434343;
	height: 1px;
}
#trailerList dt {
	float: left;
	height: 20px;
	width: 26%;
	position: relative;
	clear: both;
	z-index: 5;
}
#trailerList dt .t {
	font-size: 12px;
	line-height: 20px;
	background: #000;
	text-align: center;
	height: 20px;
	display: block;
	position: absolute;
	right: 60px;
	top: -10px;
	padding-right: 10px;
	padding-left: 10px;
}
#trailerList dd {
	box-sizing: border-box;
	padding-left: calc(26% + 60px);
	position: relative;
	z-index: 1;
	padding-bottom: 100px;
}
#trailerList dd:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	right: 123px;
	height: 1px;
	background-color: #434343;
	z-index: 1;
}
#trailerList dd:after {
	content: '';
	position: absolute;
	right: 123px;
	top: 0;
	bottom: 0;
	width: 1px;
	background-color: #000;
}
#trailerList dd .yt {
	margin-right: 183px;
	max-width: 800px;
}
#trailerList dd .yt p {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}
#trailerList dd .yt p iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}
#staffCast {
	position: relative;
	padding-top: 46px;
}
#staffCast:before {
	content: '';
	position: absolute;
	left: 0;
	bottom: -1px;
	right: 123px;
	background-color: #434343;
	height: 1px;
}
#staffCast > dl > dt {
	float: left;
	height: 20px;
	width: 26%;
	position: relative;
	clear: both;
	z-index: 5;
}
#staffCast > dl > dt .t {
	font-size: 12px;
	line-height: 20px;
	background: #000;
	text-align: center;
	height: 20px;
	display: block;
	position: absolute;
	right: 60px;
	top: -10px;
	padding-right: 10px;
	padding-left: 10px;
	letter-spacing: 0.072em;
	text-indent: 0.072em;
}
#staffCast > dl > dd {
	box-sizing: border-box;
	padding-left: calc(26% + 60px);
	position: relative;
	z-index: 1;
	padding-bottom: 100px;
}
#staffCast > dl > dd:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	right: 123px;
	height: 1px;
	background-color: #434343;
	z-index: 1;
}
#staffCast > dl > dd:after {
	content: '';
	position: absolute;
	right: 123px;
	top: 0;
	bottom: 0;
	width: 1px;
	background-color: #000;
}
#staffCast dd ul { margin-right: 183px; }
#staffCast dd li { width: 100%; }
#staffCast dd li dl { transform: translateY(-2px); }
#staffCast dd li dt {
	color: #15B0C2;
	height: 35px;
	letter-spacing: 0.1em;
	line-height: 30px;
	display: inline-block;
	vertical-align: top;
	padding-right: 10px;
}
#staffCast dd li dd {
	font-size: 18px;
	line-height: 26px;
	font-weight: 600;
	letter-spacing: 0.1em;
	white-space: nowrap;
	display: inline-block;
	padding-bottom: 50px;
}
#staffCast dd li dd span {
	font-size: 12px;
	letter-spacing: 0em;
}
#characterDiagram {
	padding-top: 46px;
	padding-right: calc(123px + 2.34375%);
	padding-left: 2.34375%;
	position: relative;
	padding-bottom: 110px;
}
#characterDiagram:before {
	content: '';
	position: absolute;
	top: 46px;
	bottom: 0;
	left: 0;
	right: 123px;
	pointer-events: none;
	border-top: 1px solid #434343;
	border-bottom: 1px solid #434343;
}
#characterDiagram:after {
	content: '';
	position: absolute;
	top: 46px;
	bottom: 0;
	right: 123px;
	width: 1px;
	background-color: #434343;
}
#diagramBox {
	max-width: 1080px;
	margin: 0 auto;
	padding-top: 80px;
	position: relative;
}
#diagramBox h3 {
	line-height: 40px;
	background: #717171;
	height: 40px;
	width: 420px;
	letter-spacing: 1.5em;
	text-align: center;
	text-indent: 1.5em;
	margin: 0px auto 30px;
	border: 1px solid #FFF;
	font-size: 18px;
	font-weight: bold;
	color: #FFF;
}
#boss {
	height: 150px;
	width: 100px;
	position: relative;
	margin: 0px auto 60px;
}
#boss:after {
	content: '';
	position: absolute;
	top: 150px;
	left: 50%;
	height: 30px;
	width: 1px;
	background-color: #FFF;
}
.diaGroup {
	max-width: 210px;
	margin: 0 auto;
}
.diaGroup dt {
	line-height: 22px;
	color: #000;
	background: #FFF;
	height: 20px;
	text-align: center;
	margin-bottom: 10px;
	font-weight: bold;
}
.diaGroup dd,
.diaSingle { box-sizing: border-box; }
.diaPicture {
	display: block;
	height: 82px;
	background-color: #FFF;
	width: 98px;
	margin-right: auto;
	margin-left: auto;
}
.diaGroup dd a,
.diaSingle a {
	display: block;
	height: 120px;
	padding-top: 1px;
	position: relative;
	box-sizing: border-box;
	text-decoration: none;
	background: #2A2A2A;
	transition: all 0.5s ease;
}
.diaGroup dd a:hover,
.diaSingle a:hover {
	background-color: #000;
	transition-delay: 0.2s;
}
.diaGroup dd a:hover .diaName,
.diaSingle a:hover .diaName {
	color: #FFF;
	transition-delay: 0.2s;
}
.diaGroup dd a:not(.ds):before,
.diaSingle a:not(.ds):before {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 4px;
	height: 4px;
	box-sizing: border-box;
	border-left: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
}
.diaGroup dd a:not(.ds):after,
.diaSingle a:not(.ds):after {
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	width: 4px;
	height: 4px;
	box-sizing: border-box;
	border-right: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	transition: all 0.3s ease;
}
.diaGroup dd a:not(.ds) .diaPicture:before,
.diaSingle a:not(.ds) .diaPicture:before {
	content: '';
	position: absolute;
	top: 0px;
	left: 0px;
	width: 4px;
	height: 4px;
	box-sizing: border-box;
	border-top: 1px solid #FFF;
	border-left: 1px solid #FFF;
	transition: all 0.3s ease;
}
.diaGroup dd a:not(.ds) .diaPicture:after,
.diaSingle a:not(.ds) .diaPicture:after {
	content: '';
	position: absolute;
	top: 0px;
	right: 0px;
	width: 4px;
	height: 4px;
	box-sizing: border-box;
	border-top: 1px solid #FFF;
	border-right: 1px solid #FFF;
}
.diaGroup dd a:not(.ds):hover:after,
.diaSingle a:not(.ds):hover:after,
.diaGroup dd a:not(.ds):hover .diaPicture:before,
.diaSingle a:not(.ds):hover .diaPicture:before {
	width: 100%;
	height: 100%;
}
.ds { pointer-events: none; }
.diaName {
	line-height: 38px;
	letter-spacing: 0.075em;
	text-align: center;
	text-indent: 0.075em;
	display: block;
	height: 36px;
	transition: all 0.5s ease;
}
#diagramBox h4.section {
	padding-left: calc((25% - 210px) / 2);
	margin-bottom: 30px;
	width: 75%;
	padding-right: calc((25% - 210px) / 2);
	letter-spacing: 1.5em;
	box-sizing: border-box;
	position: relative;
}
#diagramBox h4.section span {
	text-align: center;
	text-indent: 1.5em;
	position: relative;
	border: 1px solid #FFF;
	font-size: 18px;
	font-weight: bold;
	color: #FFF;
	position: relative;
	z-index: 5;
	box-sizing: border-box;
	display: block;
	line-height: 40px;
	background: #717171;
	height: 40px;
}
#diagramBox h4.section:before {
	z-index: 1;
	content: '';
	position: absolute;
	left: calc((100% - 630px) / 6 + 25px);
	top: -31px;
	height: 100px;
 width:calc(100% / 3 * 2);
	border-top: 1px solid #FFF;
	border-left: 1px solid #FFF;
}
.subsectionbns:before {
	z-index: 1;
	content: '';
	position: absolute;
	right: 50%;
	top: -101px;
	height: 101px;
	width: 300%;
	border-top: 1px solid #FFF;
	border-right: 1px solid #FFF;
}
.subsectionbns { position: relative; }
.subsection {
	float: left;
	width: 25%;
	position: relative;
}
.subsectionline {
	width: 75%;
	position: relative;
	min-height: 80px;
}
.subsection h5 {
	line-height: 20px;
	background: #717171;
	text-align: center;
	margin: 0px auto 20px;
	height: 20px;
	width: 210px;
	border: 1px solid #FFF;
	color: #FFF;
	letter-spacing: 0.075em;
	text-indent: 0.075em;
	box-sizing: border-box;
}
.subsectionline h5 {
	position: absolute;
	display: block;
	vertical-align: bottom;
	left: calc((100% - 630px) / 6);
	bottom: 0px;
	top: 0;
	line-height: normal;
	background: #717171;
	text-align: center;
	width: 50px;
	height: auto;
	border: 1px solid #FFF;
	color: #FFF;
	letter-spacing: 0.075em;
	text-indent: 0.075em;
}
.subsectionline h5 span {
	display: block;
	position: absolute;
	left: 50%;
	top: 50%;
	width: 100%;
	transform: translate(-50%, -50%);
}
.subsectionline h5:before {
	content: '';
	position: absolute;
	left: 50%;
	top: -22px;
	height: 22px;
	width: 1px;
	background-color: #FFF;
}
.subsectionline .diaGroup {
 width:calc(100% - ((100% - 630px) / 3 + 60px));
	margin-left: calc((100% - 630px) / 6 + 60px);
	max-width: inherit;
	float: left;
}
.diaGroup ul { padding-bottom: 10px; }
.dialist {
	width: 100px;
	margin-right: 10px;
	margin-bottom: 10px;
	float: left;
}
.subsectionbns .dialist:nth-child(even) { margin-right: 0; }
#diaout {
	height: 120px;
	width: 100px;
	position: absolute;
	top: 150px;
	left: calc((25% - 210px) / 2);
}
#diaout:after {
	content: '';
	position: absolute;
	right: -15px;
	bottom: -15px;
	width: 80px;
	height: 80px;
	border-bottom: 1px solid #FFF;
	border-right: 1px solid #FFF;
	pointer-events:none;
}
#characterModal {
	position: fixed;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	z-index: 12000;
	background: #FFF;
	overflow: auto;
	display: none;
}
#characterModal iframe {
	vertical-align: bottom;
	display: block;
	height: 100%;
	width: 100%;
	min-height: 620px;
	min-width: 1280px;
	border: none;
}
.modalClose {
	height: 100px;
	width: 100px;
	position: absolute;
	top: 0px;
	right: 0px;
}
.modalClose a {
	background: #000;
	display: block;
	height: 100px;
	position: relative;
	transition: all 0.5s ease;
}
.modalClose a:hover { background-color: #666; }
.modalClose a:before,
.modalClose a:after {
	content: '';
	width: 26px;
	height: 4px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -13px;
	margin-top: -2px;
	background-color: #FFF;
}
.modalClose a:before { transform: rotate(45deg); }
.modalClose a:after { transform: rotate(-45deg); }
#topWrap {
	min-width: 1276px;
	min-height: 100%;
	padding-right: 4px;
	position: relative;
}
#topWrap:before {
	content: '';
	position: absolute;
	width: 4px;
	top: 0;
	bottom: 0;
	right: 0;
	background-color: #000;
}
#topMain {
	margin-left: 200px;
	position: relative;
	height: 100%;
	min-height: 620px;
}
/*#topMain:before {
	content: '';
	position: absolute;
	left: 60px;
	bottom: 0;
	height: 60px;
	background-color: #202020;
	right: 50%;
}*/
#topLeft {
	position: absolute;
	left: 0px;
	top: 0px;
	right: 50%;
	bottom: 0px;
}
#topLeft h1 {
    width: 72%;
    max-width: 750px;
    position: absolute;
    left: 60px;
    top: 60px;
}
#topLeft h1 li {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transform: scale(1.2);
    z-index: 50;
    transition: none;
    width: 100%;
    height: 100%;
}
#topLeft h1 li.active {
	opacity: 1;
	transform: scale(1);
	z-index: 49;
	transition: all 0.3s ease;
}
#startDate {
	height: 71px;
	width: 326px;
	margin-left: -163px;
	position: absolute;
	left: 50%;
	top: 25%;
	margin-top: -10%;
}
#topRight {
	position: absolute;
	left: 50%;
	top: 0px;
	right: 0px;
	bottom: 0px;
	background: #000;
}
#visual {
	position: absolute;
	left: 0px;
	top: 60px;
	right: 0px;
	bottom: 60px;
	z-index: 4500;
}
#topRightHd,
#topRightBt {
	font-size: 10px;
	line-height: 60px;
	color: #FFF;
	letter-spacing: 0.1em;
	text-indent: 0.1em;
	position: absolute;
	height: 60px;
	left: 0px;
	right: 0px;
	text-align: center;
}
#topRightHd:before,
#topRightBt:before {
	content: '';
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 30px;
	height: 2px;
	background-color: #FFF;
	margin-left: -15px;
}
#topRightHd {
	top: 0;
	transform: rotate(180deg);
}
#topRightBt { bottom: 0px; }
#topRightBt li{
    display: none;
}
#topRightBt li.active{
    display: block;
}
#visual ul {
	height: 100%;
	position: relative;
	z-index: 30;
}
#visual li {
	height: 100%;
	width: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	z-index: 2;
}
#visual li a{
	display: block;
	width: 100%;
	height: 100%;
}
#visual:before {
	background: #000;
	position: absolute;
	left: 60px;
	top: 0px;
	right: 60px;
	bottom: 0px;
	content: '';
	z-index: 1;
}
#vis1 { background: url(../images/vs_tv1st.jpg); }
#vis2 { background: url(../images/vs_tv1st_new.jpg); }
#vis3 { background: url(../images/vs_tv2nd.jpg); }
#vis4 { background: url(../images/vs_movie.jpg); }
#vis5 { background: url(../images/vs_ss.jpg); }
#vis6 { background: url(../images/vs_3rd.jpg); }
#vis7 { background: url(../images/vs_3rd_fi.jpg); }
#vis8 { background: url(../images/vs_providence.jpg); }
.vis {
	max-height: 100%;
	max-width: 100%;
}
.topMovie {
	background: #000;
	padding: 8px;
	height: 120px;
	width: 120px;
	position: absolute;
	z-index: 8000;
	left: 0px;
	bottom: 0px;
	box-sizing: border-box;
}
.topMovie a {
	display:none;
	border: 1px solid #3A3A3A;
	height: 102px;
	background: url(../images/btn_movieplay.png) no-repeat center center;
	transition: all 0.3s ease;
}
.topMovie a.active {
	display:block;
}
.topMovie a:hover { background-color: #3a3a3a; }
#visNav {
	position: absolute;
	left: 60px;
	bottom: 60px;
    width: calc(100% - 60px);
}
#visNav li{
    width: 100%;
    height: 40px;
    line-height: 40px;
}
#visNav li a{
    display:block;
    width: 100%;
    height: 100%;
    color: #fff;
    text-decoration: none;
    font-size: 11px;
    letter-spacing: 0.08em;
    position: relative;
    transition: all .3s ease;
}
#visNav li a:before{
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    background: #232323;
    bottom: 0;
    left: 0;
}
#visNav li a:after{
    content: "";
    position: absolute;
    width: 6px;
    height: 1px;
    background: #fff;
    bottom: 0;
    left: 0;
    transition: all .3s ease;
}
#visNav li a:hover,
#visNav li a.active{
    color: #15B0C2;
}
#visNav li a:hover:after,
#visNav li a.active:after{
    width: 100%;
}
/*#visNav {
	position: absolute;
	height: 80px;
	left: 60px;
	bottom: 60px;
}
#visNav li {
	float: left;
	height: 80px;
	width: 80px;
	margin-right: 3px;
}
#visNav li a {
	display: block;
	height: 80px;
	position: relative;
	text-decoration: none;
}
#visNav li a:hover span,
#visNav li a.active span { color: #000; }
#visNav li a:before {
	content: '';
	position: absolute;
	height: 2px;
	left: 0;
	bottom: 0;
	right: 0;
	background-color: #fff;
	transition: all 0.3s ease;
}
#visNav li a:hover:before,
#visNav li a.active:before { height: 100%; }
#visNav li a span {
	font-size: 12px;
	line-height: 33px;
	color: #fff;
	position: absolute;
	height: 33px;
	left: 7px;
	right: 0px;
	bottom: 0px;
	display: block;
	letter-spacing: 0.08em;
	transition: all 0.3s ease;
}
#visNav li a span strong {
	font-size: 26px;
	font-weight: 500;
}*/
#liner {
	background: #15B0C2;
	position: absolute;
	width: 4px;
	top: 0px;
	right: -4px;
	bottom: 0px;
	transition: all 0.3s ease;
}
#topics {
	background: #202020;
	margin-left: 260px;
	padding-top: 210px;
	position: relative;
	overflow: hidden;
	margin-bottom: 130px;
}
#topics h2 {
	font-size: 40px;
	letter-spacing: 1.3em;
	position: absolute;
	top: 180px;
	right: calc(50% + 150px - 1.3em);
	height: 90px;
	line-height: 90px;
}
#topics h2 span {
	position: relative;
	z-index: 5;
}
#topics h2:before {
	position: absolute;
	content: '';
	right: 1.3em;
	bottom: 0;
	width: 60px;
	height: 2px;
	background-color: #000;
}
#topics h2:after {
	content: '';
	position: absolute;
	left: 0;
	top: 30px;
	width: 181px;
	height: 177px;
	background-image: url(../images/topics_h2bg.svg);
	background-repeat: no-repeat;
	z-index: 3;
}
#topics ul {
	width: calc(50% + 60px);
	margin-left: auto;
}
#topics ul li {
	background: #FFF;
	height: 120px;
	margin-bottom: 30px;
}
#topics ul li:last-child { margin-bottom: 0; }
#topics li a {
	display: block;
	height: 120px;
	position: relative;
	text-decoration: none;
}
#topics li a:before {
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	width: 63px;
	height: 74px;
	background: url(../images/topics_arrow.png) no-repeat center center;
	transition: all 0.3s ease;
}
#topics li a:hover:before { right: -5px; }
.topicsCat {
	font-size: 12px;
	line-height: 20px;
	color: #FFF;
	background: #000;
	text-align: center;
	height: 20px;
	width: 80px;
	margin-top: -10px;
	position: absolute;
	left: -40px;
	top: 50%;
	letter-spacing: 0.075em;
	text-indent: 0.075em;
}
.topicsDate {
	font-size: 12px;
	line-height: 20px;
	color: #000;
	letter-spacing: 0.072em;
	position: absolute;
	height: 20px;
	width: 120px;
	left: 60px;
	top: -10px;
	font-weight: bold;
}
.topicsTitle {
	font-size: 16px;
	line-height: 36px;
	position: absolute;
	left: 60px;
	top: 50%;
	right: 60px;
	display: block;
	transform: translateY(-50%);
}
#topWrap footer {
	margin-left: 200px;
	height: 125px;
	position: relative;
}
#topWrap footer #footerLast { padding-right: 60px; }
#footerBnr {
	position: absolute;
	height: 40px;
	left: 60px;
	top: 50px;
	display: table;
}
#footerBnr li {
	display: table-cell;
	padding-right: 12px;
}
#scroll {
	position: absolute;
	bottom: 120px;
	left: calc(50% - 60px);
	font-size: 12px;
	font-weight: 500;
	transform-origin: left top;
	transform: rotate(90deg);
	z-index: 6000;
}
#scroll span {
	width: 60px;
	height: 2px;
	display: inline-block;
	position: absolute;
	background: #000;
	bottom: 6px;
	right: -70px;
}
@keyframes scrolldown { 0% {
width: 0px;
left: 0;
}
 50% {
width: 80px;
left: 80px;
}
 100% {
width: 0px;
left: 80px;
}
}
#scroll span:after {
	content: "";
	position: absolute;
	width: 60px;
	height: 2px;
	background: #202020;
	-webkit-animation: scrolldown 1.7s ease-in-out infinite;
	-moz-animation: scrolldown 1.7s ease-in-out infinite;
	-ms-animation: scrolldown 1.7s ease-in-out infinite;
	animation: scrolldown 1.7s ease-in-out infinite;
}
#topLoading {
	background: #000;
	position: fixed;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	z-index: 20000;
}
#ytModal {
	background: #666;
	position: fixed;
	z-index: 22000;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	display: none;
}
#ytModal iframe {
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	border: none;
	display: block;
}
#ytModal .modalClose {
	position: fixed;
	right: 0;
	top: 0;
	width: 100px;
	height: 100px;
	background-color: rgba(0,0,0,0.8);
	z-index: 100;
}
.modalClose a {
	display: block;
	height: 100px;
	position: relative;
}
.modalClose a:before,
.modalClose a:after {
	content: '';
	position: absolute;
	width: 32px;
	height: 4px;
	background-color: #FFF;
	left: 50%;
	top: 50%;
	margin-left: -16px;
	margin-top: -2px;
}
.modalClose a:before { transform: rotate(-45deg); }
.modalClose a:after { transform: rotate(45deg); }
#twicon {
	width: auto;
	margin: 0;
	padding: 0;
}
#twicon li {
	width: 100px;
	float: left;
	margin: 0 5px 0 0;
	padding: 0;
	height: 130px;
	line-height: 20px;
	font-size: 12px;
	text-align: center;
}
.fl {
	float: left;
	margin-right: 30px;
	margin-bottom: 15px;
}
.fr {
	float: right;
	margin-left: 30px;
	margin-bottom: 15px;
}
.cc {
	display: block;
	margin: 0 auto 25px;
}
.goods header:before,
.bddvd header:before { display: none; }
#goodsBox {
	max-width: 1000px;
	margin: 0 auto;
	padding-top: 80px;
	position: relative;
	padding-right: 27px;
	padding-left: 27px;
}
#goods {
	padding-top: 46px;
	position: relative;
	padding-bottom: 110px;
	padding-right: 123px;
}
#goods:before {
	content: '';
	position: absolute;
	top: 46px;
	bottom: 0;
	left: 0;
	right: 123px;
	pointer-events: none;
	border-top: 1px solid #434343;
	border-bottom: 1px solid #434343;
}
#goodsBox ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
	-ms-flex-line-pack: start;
	align-content: flex-start;
}
#goodsBox ul li {
	width: calc(100% / 3);
	margin-bottom: 40px;
}
.goodsListOnce {
	width: 260px;
	margin-right: auto;
	margin-left: auto;
	position: relative;
	padding-bottom: 46px;
	height: 100%;
	box-sizing: border-box;
}
.goodsListOnce a {
	text-decoration: none;
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 500;
}
.goodsThumb {
	width: 260px;
	box-sizing: border-box;
	border: 1px solid #434343;
	display: block;
	position: relative;
}
.goodsThumb:before {
	content: 'DETAIL';
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	line-height: 260px;
	text-align: center;
	color: #FFF;
	font-size: 14px;
	background-color: rgba(0,0,0,.7);
	opacity: 0;
	transition: all 0.5s ease;
}
.goodsThumb:after {
	content: '';
	position: absolute;
	left: 5px;
	right: 5px;
	bottom: 5px;
	top: 5px;
	box-sizing: border-box;
	border: 1px solid #FFF;
	opacity: 0;
	transition: all 0.5s ease;
}
.ov .goodsThumb:before,
.ov .goodsThumb:after { opacity: 1; }
.goodsThumb img {
	width: 258px;
	height: auto;
}
.goodsName {
	font-size: 14px;
	line-height: 18px;
	padding-top: 18px;
	display: block;
	font-weight: bold;
}
.goodsPrice {
	font-size: 12px;
	line-height: 46px;
	position: absolute;
	height: 46px;
	left: 0px;
	bottom: 0px;
	white-space: nowrap;
	font-weight: bold;
	display: block;
}
.goodsPrice:after {
	content: '';
	position: absolute;
	left: calc(100% + 10px);
	right: calc(-260px + 100%);
	top: 50%;
	margin-top: -1px;
	height: 2px;
	background-color: #FFF;
}
#goodsOnceHead { margin-bottom: 40px; }
#goodsOnceHead h3 {
	font-size: 16px;
	line-height: 28px;
	font-weight: bold;
	letter-spacing: 0.1em;
	margin-bottom: 10px;
}
#goodsOnceHead #cat {
	font-size: 12px;
	line-height: 20px;
	color: #000;
	height: 20px;
	padding-right: 19px;
	padding-left: 19px;
	display: inline-block;
	background-color: #fff;
	letter-spacing: 0.075em;
	text-indent: 0.075em;
}
#goodsMainImage {
	background: #FFF;
	border: 1px solid #434343;
	margin-bottom: 12px;
	text-align: center;
}
#goodsImages { }
#goodsImages img {
	max-width: 100%;
	height: auto;
}
#goodsOnceBox {
	max-width: 838px;
	margin: 0 auto;
	padding-top: 80px;
	position: relative;
	padding-right: 60px;
	padding-left: 60px;
}
#goodsImages li {
	float: left;
	height: 94px;
	width: 94px;
	margin-right: 12px;
	margin-bottom: 12px;
}
#goodsImages li:nth-child(8n) { margin-right: 0; }
#goodsImages li a {
	display: block;
	height: 94px;
	width: 94px;
	background: #FFF;
	border: 1px solid #434343;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	position: relative;
}
#goodsImages li a:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0,0,0,.7);
	opacity: 0;
	transition: all 0.5s ease;
}
#goodsImages li a:hover:before { opacity: 0.3; }
#goodsImages li a.active:before { opacity: 1; }
#goodsTexts { padding: 35px 0px 50px; }
#goodsTexts h4 {
	font-size: 14px;
	line-height: 32px;
	font-weight: bold;
}
#goodsTexts p {
	font-size: 14px;
	line-height: 32px;
	margin-bottom: 28px;
}
#bddvd {
	padding-top: 46px;
	position: relative;
	padding-bottom: 110px;
	padding-right: 123px;
}
#bddvd:before {
	content: '';
	position: absolute;
	top: 46px;
	bottom: 0;
	left: 0;
	right: 123px;
	pointer-events: none;
	border-top: 1px solid #434343;
	border-bottom: 1px solid #434343;
}
#bddvdNav {
	display: table;
	margin: -20px auto 120px;
}
#bddvdNav li {
	height: 40px;
	width: 180px;
	display: table-cell;
	padding-right: 10px;
	padding-left: 10px;
	position: relative;
}
#bddvdNav li:before {
	content: '';
	position: absolute;
	right: 10px;
	top: 0;
	width: 4px;
	height: 4px;
	box-sizing: border-box;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	z-index: 55;
}
#bddvdNav li:after {
	content: '';
	position: absolute;
	left: 10px;
	bottom: 0;
	width: 4px;
	height: 4px;
	box-sizing: border-box;
	border-left: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
}
#bddvdNav li a {
	text-decoration: none;
	height: 40px;
	border: 1px solid #232323;
	display: block;
	line-height: 42px;
	text-align: center;
	background-color: #000;
	position: relative;
	font-weight: bold;
}
#bddvdNav li a:before {
	content: '';
	position: absolute;
	left: -1px;
	top: -1px;
	width: 4px;
	height: 4px;
	box-sizing: border-box;
	border-left: 1px solid #FFF;
	border-top: 1px solid #FFF;
	transition: all 0.3s ease;
}
#bddvdNav li a:after {
	content: '';
	position: absolute;
	right: -1px;
	bottom: -1px;
	width: 4px;
	height: 4px;
	box-sizing: border-box;
	border-right: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	transition: all 0.3s ease;
}
#bddvdNav li a span {
	letter-spacing: 0.075em;
	text-indent: 0.075em;
	position: relative;
	z-index: 50;
}
#bddvdNav li a:hover:before,
#bddvdNav li a:hover:after {
	width: 100%;
	height: 100%;
}
#bddvdNav li a.active {
	border-color: #FFF;
	background-color: #FFF;
	color: #000;
}
#bddvdBox {
	max-width: 1000px;
	margin: 0 auto;
	padding-top: 80px;
	position: relative;
	padding-right: 27px;
	padding-left: 27px;
}
#bddvdBox ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
	-ms-flex-line-pack: start;
	align-content: flex-start;
}
#bddvdBox ul li {
	width: calc(100% / 3);
	margin-bottom: 40px;
}
.bddvdListOnce {
	width: 260px;
	margin-right: auto;
	margin-left: auto;
	position: relative;
	padding-bottom: 62px;
	height: 100%;
	box-sizing: border-box;
}
.bddvdListOnce a {
	text-decoration: none;
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 500;
}
.bddvdThumb {
	width: 260px;
	box-sizing: border-box;
	border: 1px solid #434343;
	display: block;
	position: relative;
}
.bddvdThumb:before {
	content: 'DETAIL';
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	line-height: 363px;
	text-align: center;
	color: #FFF;
	font-size: 14px;
	background-color: rgba(0,0,0,.7);
	opacity: 0;
	transition: all 0.5s ease;
}
.bddvdThumb:after {
	content: '';
	position: absolute;
	left: 5px;
	right: 5px;
	bottom: 5px;
	top: 5px;
	box-sizing: border-box;
	border: 1px solid #FFF;
	opacity: 0;
	transition: all 0.5s ease;
}
.ov .bddvdThumb:before,
.ov .bddvdThumb:after { opacity: 1; }
.bddvdThumb img {
	width: 258px;
	height: auto;
}
.bddvdName {
	font-size: 12px;
	line-height: 18px;
	position: absolute;
	min-height: 28px;
	left: 0px;
	bottom: 20px;
	white-space: nowrap;
	font-weight: bold;
	display: block;
	padding-top:3px;
	padding-bottom:3px;
}
.bddvdName:after {
	content: '';
	position: absolute;
	left: calc(100% + 10px);
	right: calc(-260px + 100%);
	bottom: 20px;
	height: 2px;
	background-color: #FFF;
}
.bddvdRelease {
	color: #000;
	text-align: center;
	height: 20px;
	font-size: 12px;
	line-height: 20px;
	position: absolute;
	left: 0px;
	right: 0px;
	bottom: 0px;
}
#bddvdOnceBox {
	width: 836px;
	margin-right: auto;
	margin-left: auto;
	margin-top: -60px;
}
#releaseDate {
	font-size: 12px;
	line-height: 20px;
	color: #000;
	text-align: center;
	height: 20px;
	width: 200px;
	margin: 0px auto 60px;
	letter-spacing: 0.075em;
	text-indent: 0.075em;
}
#specLeft {
	float: left;
	width: 390px;
}
.captions {
	padding-bottom: 42px;
	position: relative;
}
.captions span {
	height: 42px;
	position: absolute;
	left: 0px;
	bottom: 0px;
	display: inline-block;
	font-size: 12px;
	line-height: 42px;
	font-weight: 600;
	letter-spacing: 0.075em;
}
.jacket span:after {
	content: '';
	position: absolute;
	left: calc(100% + 10px);
	right: calc(-390px + 100%);
	top: 50%;
	margin-top: -1px;
	height: 2px;
	background-color: #FFF;
}
#specRight {
	float: right;
	width: 406px;
}
#specRight h3 {
	height: 20px;
	width: 100px;
	font-size: 12px;
	font-weight: bold;
	color: #000;
	text-align: center;
	line-height: 20px;
	margin-bottom: 20px;
}
#specRight dl { margin-bottom: 32px; }
#specRight dt {
	display: inline-block;
	min-width: 70px;
	letter-spacing: 0.1em;
	line-height: 32px;
	font-weight: bold;
}
#specRight dd {
	line-height: 32px;
	display: inline-block;
	font-family: "Yu Gothic", YuGothic, sans-serif;
	min-width: 330px;
	letter-spacing: 0.1em;
}
#specRight p {
	line-height: 32px;
	margin-bottom: 32px;
	font-family: "Yu Gothic", YuGothic, sans-serif;
	letter-spacing: 0.1em;
}
.devView { margin-bottom: 70px; }
.devView p {
	background: #FFF;
	border: 1px solid #D5D5D5;
	text-align: center;
}
#specMain { padding-bottom: 50px; }
.devView span:after {
	content: '';
	position: absolute;
	left: calc(100% + 10px);
	right: calc(-836px + 100%);
	top: 50%;
	margin-top: -1px;
	height: 2px;
	background-color: #FFF;
}
.devView p iframe { vertical-align: bottom; }
.specTables {
	border-width: 1px;
	border-style: solid;
	margin-bottom: 40px;
}
.specTables dt {
	line-height: 50px;
	color: #FFF;
	height: 50px;
	text-align: center;
	letter-spacing: 0.2em;
	text-indent: 0.2em;
	font-weight: bold;
}
.specTables dd {
	padding: 50px;
	background-color: rgba(0,0,0,.7);
}
.specTables dd p {
	letter-spacing: 0.1em;
	line-height: 32px;
}
#bddvdBox2 {
	width: 864px;
	margin: 0 auto;
	padding-top: 80px;
	position: relative;
}
#bddvdBox2 ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
	-ms-flex-line-pack: start;
	align-content: flex-start;
}
#bddvdBox2 ul li {
	width: calc(100% / 3);
	margin-bottom: 40px;
}
#storeTitle {
	font-size: 18px;
	line-height: 24px;
	font-weight: bold;
	letter-spacing: 0.2em;
	text-align: center;
	text-indent: 0.2em;
	height: 24px;
	margin-bottom: 80px;
	position: relative;
}
#storeTitle.llTV:after {
	content: '';
	position: absolute;
	width: 30px;
	height: 2px;
	background-color: #15B0C2;
	margin-left: -15px;
	top: 40px;
	left: 50%;
}
#storeList li {
	float: left;
	height: 20px;
	width: 200px;
	margin-right: 12px;
	position: relative;
	margin-bottom: 12px;
}
#storeList li:before {
	content: '';
	position: absolute;
	right: 0;
	top: 0;
	width: 4px;
	height: 4px;
	box-sizing: border-box;
	border-top: solid 1px #FFF;
	border-right: solid 1px #FFF;
	z-index: 15;
}
#storeList li:after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 4px;
	height: 4px;
	box-sizing: border-box;
	border-bottom: solid 1px #FFF;
	border-left: solid 1px #FFF;
}
#storeList li:nth-child(4n) { margin-right: 0; }
#storeList li a {
	display: block;
	height: 20px;
	position: relative;
	font-size: 12px;
	line-height: 20px;
	letter-spacing: 0.025em;
	text-indent: 0.025em;
	text-align: center;
	border: 1px solid #232323;
	box-sizing: border-box;
	text-decoration: none;
	background-color: #000;
	font-weight: bold;
}
#storeList li a:before {
	content: '';
	position: absolute;
	left: -1px;
	top: -1px;
	width: 4px;
	height: 4px;
	box-sizing: border-box;
	border-top: solid 1px #FFF;
	border-left: solid 1px #FFF;
	transition: all 0.3s ease;
}
#storeList li a:after {
	content: '';
	position: absolute;
	right: -1px;
	bottom: -1px;
	width: 4px;
	height: 4px;
	box-sizing: border-box;
	border-bottom: solid 1px #FFF;
	border-right: solid 1px #FFF;
	transition: all 0.3s ease;
}
#storeList li a:hover:before,
#storeList li a:hover:after {
	width: 100%;
	height: 100%;
}
.stores { padding-top: 50px; }
.stores h4 a {
	height: 22px;
	font-size: 14px;
	line-height: 24px;
	color: #FFF;
	display: block;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	position: relative;
}
.stores h4 a:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	background-color: #000;
	width: 0;
	transition: all 0.3s ease;
}
.stores h4 a:hover:before { width: 100%; }
.stores h4 span {
	position: relative;
	z-index: 10;
}
.stores h4 span img {
	vertical-align: text-top;
	display: inline-block;
	margin-left: 5px;
}
.storesin {
	padding-top: 30px;
	padding-bottom: 30px;
	position: relative;
}
.storesin:after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 30px;
	height: 2px;
	background-color: #000;
}
.storesin:last-of-type:after { display: none; }
.storesin h5 {
	font-size: 16px;
	line-height: 35px;
	font-weight: bold;
}
.storesin h6 {
	font-size: 14px;
	line-height: 32px;
	font-weight: bold;
	padding-bottom: 20px;
}
.storesin p {
	line-height: 32px;
	padding-bottom: 32px;
}
.caution { font-size: 12px; }
#seriesList {
	position: relative;
	padding-top: 46px;
}
#seriesList:before {
	content: '';
	position: absolute;
	left: 0;
	bottom: -1px;
	right: 123px;
	background-color: #434343;
	height: 1px;
}
#seriesList dt {
	float: left;
	height: 20px;
	width: 26%;
	position: relative;
	clear: both;
	z-index: 5;
}
#seriesList dt .t {
	font-size: 12px;
	line-height: 20px;
	background: #FFF;
	text-align: center;
	height: 20px;
	display: block;
	position: absolute;
	right: 60px;
	top: -10px;
	padding-right: 10px;
	padding-left: 10px;
}
#seriesList dd {
	box-sizing: border-box;
	padding-left: calc(26% + 60px);
	position: relative;
	z-index: 1;
	padding-bottom: 100px;
}
#seriesList dd:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	right: 123px;
	height: 1px;
	background-color: #434343;
	z-index: 1;
}
#seriesList dd:after {
	content: '';
	position: absolute;
	right: 123px;
	top: 0;
	bottom: 0;
	width: 1px;
	background-color: #000;
}
#seriesList dd .yt {
	margin-right: 183px;
	max-width: 800px;
}
#seriesList dd .yt p {
	position: relative;
	width: 100%;
}
#seriesList td {
	padding-bottom: 15px;
}
#seriesList .gr {
	color: #278938;
}
.topMovie a span {
	font-size: 12px;
	color: #FFF;
	text-align: center;
	top: 100px;
	letter-spacing: 0.2em;
	display: block;
	text-indent: 0.2em;
	padding-top: 70px;
	text-decoration: none;
}
#theaterLink {
	height: 40px;
	width: 190px;
	margin-left: -95px;
	margin-top:90px;
	position: absolute;
	left: 50%;
	top: 50%;
}
#theaterLink a {
	display: block;
	position: relative;
	background: #000; }
#theaterLink a:before {
	content:'';
	position:absolute;
	left:0;
	top:0;
	bottom:0;
	width:0;
	transition:all 0.3s ease;
	background-color:#444;
}
#theaterLink a:after {
	content:'';
	position:absolute;
	right:0;
	top:0;
	bottom:0;
	width:0;
	transition:all 0.3s ease;
	background-color:#FFF;
	opacity:0.1
}
#theaterLink a:hover:before,
#theaterLink a:hover:after {
	width:100%;
}
#theaterLink a img {
	position:relative;
	z-index:5;
}


#trailerLink {
	height: 40px;
	width: 190px;
	margin-left: -95px;
	margin-top:135px;
	position: absolute;
	left: 50%;
	top: 50%;
}
#trailerLink a {
	display: block;
	position: relative;
	background: #000; }
#trailerLink a:before {
	content:'';
	position:absolute;
	left:0;
	top:0;
	bottom:0;
	width:0;
	transition:all 0.3s ease;
	background-color:#444;
}
#trailerLink a:after {
	content:'';
	position:absolute;
	right:0;
	top:0;
	bottom:0;
	width:0;
	transition:all 0.3s ease;
	background-color:#FFF;
	opacity:0.1
}
#trailerLink a:hover:before,
#trailerLink a:hover:after {
	width:100%;
}
#trailerLink a img {
	position:relative;
	z-index:5;
}
#toSS {
	position:absolute;
	width:170px;
	height:50px;
	top:50%;
	left:50%;
	margin-top:150px;
	margin-left:-85px;
}
#toSS a {
	position:relative;
	height:50px;
	border:#666 1px solid;
	display:block;
	background-image:url(../images/to_ss.png);
	box-sizing: border-box;
}
#toSS a:before {
	content:'';
	position: absolute;
	left:-1px;
	top:-1px;
	width:0;
	height:0;
	border-top:1px solid #666;
	border-left:1px solid #666;
	box-sizing: border-box;
	transition:all .3s ease;
}
#toSS a:after {
	content:'';
	position: absolute;
	right:-1px;
	bottom:-1px;
	width:0;
	height:0;
	border-bottom:1px solid #666;
	border-right:1px solid #666;
	transition:all .3s ease;
}
#toSS a:hover:before,
#toSS a:hover:after {
	width:calc(100% + 1px);
	height:calc(100% + 1px);
	border-color:#FFF;
}

#navList li.seriesLinks.top {
	padding-top: 25px;
	padding-bottom: 5px;
	position: relative;
}
.seriesLinks.top:before {
	content: "";
	position: absolute;
	top: 10px;
	left: 10px;
	right: 10px;
	height: 1px;
	background: #fff;
}



.visualLinkWrap {
	position: relative;
	transition: opacity .4s ease;
}
.visualLinkWrap:hover {
	opacity: .8;
}
.visualLink {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

/* POLICY */
.policy {
	display: block;
	font-size: 10px;
	text-align: right;
	font-weight: 600;
}
