@charset "utf-8";
/* opacity
-------------------------------------------------------------------------------*/
/* flex display
-------------------------------------------------------------------------------*/
/* a button
-------------------------------------------------------------------------------*/
/* hover
-------------------------------------------------------------------------------*/
/* a current
-------------------------------------------------------------------------------*/
/* setPosCenter
-------------------------------------------------------------------------------*/
/* clearfix
-------------------------------------------------------------------------------*/
/* easing
-------------------------------------------------------------------------------*/
/* content
-----------------------------------------------------------------------------*/
.main-character { height: 600px; }
.main-character .content-inner { z-index: 20; top: 0; margin-top: 0; }
.main-character .content-inner .character-name-area { position: absolute; *text-align: center; width: 300px; }
.main-character .content-inner .character-name-area .character-name { text-align: center; }
.main-character .content-inner .character-name-area .character-name.anim { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=" 0 ")"; filter: alpha(opacity=0); zoom: 1; }
.main-character .content-inner .character-name-area .character-voice { text-align: center; margin: 8px auto; vertical-align: middle; position: relative; }
.main-character .content-inner .character-name-area .character-voice.anim { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=" 0 ")"; filter: alpha(opacity=0); zoom: 1; }
.main-character .content-inner .character-name-area .character-voice .over { cursor: pointer; position: absolute; top: -8px; left: 0; right: 0; display: none; }
.main-character .content-inner .character-name-area .character-voice .over.anim { display: block; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=" 0 ")"; filter: alpha(opacity=0); zoom: 1; }
.main-character .content-inner .character-name-area .character-voice .over.show { display: block; }
.main-character .content-inner .character-name-area .character-voice .off { cursor: pointer; }
.main-character .content-inner .character-name-area .character-voice .off.hide { display: none; }
.main-character .content-inner .character-name-area .character-voice .no-audio { display: none; }
.main-character .content-inner .character-name-area .character-voice .no-audio.show { display: block; }
.main-character .content-inner .character-name-area .character-line { margin-bottom: 15px; text-align: center; }
.main-character .content-inner .character-name-area .character-line.anim { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=" 0 ")"; filter: alpha(opacity=0); zoom: 1; }
.main-character .content-inner .character-name-area .character-texts { height: 470px; margin-right: 2px; text-align: center; }
.main-character .content-inner .character-name-area .character-texts .character-texts-anim { zoom: 1; }
.main-character .content-inner .character-name-area .character-texts .character-texts-anim:before, .main-character .content-inner .character-name-area .character-texts .character-texts-anim:after { display: block; height: 0; visibility: hidden; content: "\0020"; }
.main-character .content-inner .character-name-area .character-texts .character-texts-anim:after { clear: both; }
.main-character .content-inner .character-name-area .character-texts .character-texts-anim.anim { height: 0%; overflow: hidden; }
.main-character .content-inner .character-name-area .character-texts .character-texts-anim p { display: inline-block; vertical-align: top; overflow: hidden; width: 32px; }
.main-character .content-inner .character-name-area .character-texts .character-texts-anim p:first-child { margin-right: 0; }
.main-character .content-inner .character-name-area .character-texts .character-texts-anim p.anim img { margin-left: -10px; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=" 0 ")"; filter: alpha(opacity=0); zoom: 1; }
.main-character .content-inner .character-button-wide { width: 35px; height: 105px; position: absolute; }
.main-character .content-inner .character-button-wide a:hover { background-position: 0 100%; }
.main-character .content-inner .character-button-wide.anim { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=" 0 ")"; filter: alpha(opacity=0); zoom: 1; }
.main-character .content-inner .character-button-wide a { width: 100%; height: 100%; background: url("../../../assets/images/character_detail/button-info.png") no-repeat; display: block; }
.main-character .video, .main-character .video-mask, .main-character .video-filter, .main-character .requid-image { width: 760px; height: 428px; position: absolute; top: 50%; left: 50%; }
.main-character .requid-image { min-width: 760px; margin: 0; top: 0; left: 0; }
.main-character .video-mask { z-index: 5; }
.main-character .video-mask img { width: 100%; height: 100%; }
.main-character.left .content-inner .character-name-area { top: 50px; right: 30px; }
.main-character.left .content-inner .character-button-wide { top: 450px; left: 50px; }
.main-character.left .video, .main-character.left .video-mask, .main-character.left .video-filter { margin: -194px 0 0 -440px; }
.main-character.right .content-inner .character-name-area { top: 50px; left: 30px; }
.main-character.right .content-inner .character-button-wide { top: 450px; right: 50px; }
.main-character.right .video, .main-character.right .video-mask, .main-character.right .video-filter { margin: -194px 0 0 -330px; }
.main-character#yuri .content-inner .character-name-area { width: 340px; }
.main-character#miku .character-name-area { left: 80px; width: 340px; }
.main-character#miku .visual { width: 722px; height: 428px; position: absolute; top: 50%; left: 50%; margin: -230px 0 0 -250px; overflow: hidden; }
.main-character#miku .new-icon { position: absolute; top: 21px; right: 60px; }
.main-character#siragiku .new-icon { position: absolute; top: 0px; right: 80px; }
.main-character#siragiku .video, .main-character#siragiku .video-mask, .main-character#siragiku .video-filter { margin-top: -244px; }
.main-character.last-area { height: 700px; }
.main-character.last-area .content-inner { height: 700px; }

/* colorbox
-----------------------------------------------------------------------------*/
#colorbox-close { width: 27px; height: 79px; background: url(../../../assets/images/character_detail/cbox-button-close.png) no-repeat 0 0; bottom: 27px; left: 22px; position: absolute; cursor: pointer; }

#cbox-content { text-align: center; }