@charset "utf-8";

/* ==========================================================================================
	--COMMON
========================================================================================== */
html {background: #000 url(../image/common/bg.jpg) repeat-x;}
body {font-size: 75%;} /* for ie */
html > body:last-child {font-size: 12px;} /* for other browsers */
body {
	height: 100%;
	background: url(../image/common/bg_wrapper.jpg) no-repeat center top;
	color: #fff;
	font-family: "メイリオ","Meiryo","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック","Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif;
	_font-family: "ＭＳ Ｐゴシック",sans-serif;
	line-height: 1.4;
}

/* text */
p:last-child {margin-bottom: 0 !important;}
strong, em, cite {font-weight: normal; font-style: normal;}
strong {font-weight: bold;}
em {text-decoration: underline;}
small {display: block;}

/* anchor */
a {color: #e3aec0; text-decoration: none;}
a:link {color: #e3aec0;}
a:visited {color: #e3aec0;}
a:hover {color: #ffffff; text-decoration: underline;}
a:active {color: #ffffff;}
a img {border: none; text-decoration: none;}

/* heading */
h1, h2 {font-size: 116%;}
h3, h4, h5, h6 {font-size: 100%;}

/* images */
img {vertical-align: top;}

/* tables */
table {width: 98%; margin: 0 auto 0;}
thead th {padding: 0.5em 0.4em; text-align: left;}
thead td {}
tbody th {padding: 1em 0.3em;}
tbody td {padding: 1em 0.4em;}
tfoot th {}
tfoot td {}

/* clear */
.clear:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.clear {*zoom: 1;}

/* ==========================================================================================
	--LAYOUT
========================================================================================== */
section, article, aside {position: relative;}
#wrapper {position: relative; width: 900px; margin: 0 auto;}

/*	@General class
-------------------------------------------------------------------------------------------*/
.align-left {position: relative; float: left; margin: 0 10px 10px 0;}
.align-right {position: relative; float: right; margin: 0 0 10px 5px;}

/* ==========================================================================================
	--HEADER
========================================================================================== */
#globalheader {position: relative; z-index: 9999; margin-bottom: 12px;}
#globalheader h1 {padding: 24px 0; text-align: center;}

/*	@Global navigation
-------------------------------------------------------------------------------------------*/
#primarynav {position: relative; width: 100%; height: 37px; -moz-box-shadow: 5px 5px 5px #040913; -webkit-box-shadow: 5px 5px 5px #040913; box-shadow: 5px 5px 5px #040913; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;}
#primarynav ul {width: 100%; height: 37px;}
#primarynav ul li {position: relative; float: left; height: 37px; text-indent: -9999px;}
#primarynav ul li#pn_home {width: 95px;}
#primarynav ul li#pn_guideline {width: 109px;}
#primarynav ul li#pn_ticket {width: 80px;}
#primarynav ul li#pn_brand {width: 87px;}
#primarynav ul li#pn_model {width: 90px;}
#primarynav ul li#pn_guest {width: 80px;}
#primarynav ul li#pn_extra {width: 82px;}
#primarynav ul li#pn_audition {width: 102px;}
#primarynav ul li#pn_media {width: 80px;}
#primarynav ul li#pn_blog {width: 95px;}
#primarynav ul li a,
#primarynav ul li span {display: block; width: 100%; height: 37px; background: url(../image/common/header/nav.png) no-repeat;}
#primarynav ul li a {overflow: hidden;}
#primarynav ul li#pn_home a,
#primarynav ul li#pn_home span {background-position: 0 0;}
#primarynav ul li#pn_guideline a,
#primarynav ul li#pn_guideline span {background-position: -95px 0;}
#primarynav ul li#pn_ticket a,
#primarynav ul li#pn_ticket span {background-position: -204px 0;}
#primarynav ul li#pn_brand a,
#primarynav ul li#pn_brand span {background-position: -284px 0;}
#primarynav ul li#pn_model a,
#primarynav ul li#pn_model span {background-position: -371px 0;}
#primarynav ul li#pn_guest a,
#primarynav ul li#pn_guest span {background-position: -461px 0;}
#primarynav ul li#pn_extra a,
#primarynav ul li#pn_extra span {background-position: -541px 0;}
#primarynav ul li#pn_audition a,
#primarynav ul li#pn_audition span {background-position: -623px 0;}
#primarynav ul li#pn_media a,
#primarynav ul li#pn_media span {background-position: -725px 0;}
#primarynav ul li#pn_blog a,
#primarynav ul li#pn_blog span {background-position: -805px 0;}
#primarynav ul li#pn_home a:hover,
#primarynav ul li#pn_home span:hover {background-position: 0 -37px;}
#primarynav ul li#pn_guideline a:hover,
#primarynav ul li#pn_guideline span:hover {background-position: -95px -37px;}
/*
#primarynav ul li#pn_ticket a:hover,
#primarynav ul li#pn_ticket span:hover {background-position: -204px -37px;}
#primarynav ul li#pn_brand a:hover,
#primarynav ul li#pn_brand span:hover {background-position: -284px -37px;}
#primarynav ul li#pn_model a:hover,
#primarynav ul li#pn_model span:hover {background-position: -371px -37px;}
#primarynav ul li#pn_guest a:hover,
#primarynav ul li#pn_guest span:hover {background-position: -461px -37px;}
#primarynav ul li#pn_extra a:hover,
#primarynav ul li#pn_extra span:hover {background-position: -541px -37px;}
*/
#primarynav ul li#pn_audition a:hover,
#primarynav ul li#pn_audition span:hover {background-position: -623px -37px;}
/*
#primarynav ul li#pn_media a:hover,
#primarynav ul li#pn_media span:hover {background-position: -725px -37px;}
*/
#primarynav ul li#pn_blog a:hover,
#primarynav ul li#pn_blog span:hover {background-position: -805px -37px;}

#primarynav ul li ul {position: absolute; left: 0; top: 37px; width: 242px; height: auto; padding: 5px 0; background-color: #000;}
#primarynav ul li ul li {float: none; height: auto; padding: 10px; text-indent: 0;}
#primarynav ul li ul li a {display: inline; height: auto; background: none; color: #fff; font-size: 108%;}
#primarynav ul li ul li a:hover {background-color: #ff0097; text-decoration: none;}

/* ==========================================================================================
	--DOC
========================================================================================== */
#doc {position: relative; width: 100%;}

/*	@Content
-------------------------------------------------------------------------------------------*/
#content {float: left; width: 693px; margin-right: 15px; padding: 30px 0 50px; border: 1px solid #4a5972; background-color: #081327;}
/*#doc .static {width: 674px !important;}*/
#doc .static h1 {position: absolute; top: -10px; left: 19px; height: 152px; background: url(../image/common/content/bg_heading.png) no-repeat left top;}
#doc .static h1 img {padding: 67px 0 0 64px;}
#content .row {position: relative; width: 100%; margin-bottom: 20px; overflow: hidden;}
#content .row section {width: 300px; padding: 15px; border: 1px solid #333;}
#content .row .col-l {float: left;}
#content .row .col-r {float: right;}
#content .row section h1 {border: none;}
#content .row section a {display: block; width: 100%; height: 100%;}
#content .row section a:hover {text-decoration: none;}
#content .row section p {color: #fff;}

#content #sns {width: 100%; overflow: hidden;}
#content #sns ul {float: right; overflow: hidden;}
#content #sns ul li {display: inline; float: left; margin-left: 5px;}
#content #sns ul li .twitter-share-button {width: 60px !important; height: 21px !important;}

/*	@Sidebar
-------------------------------------------------------------------------------------------*/
#sidebar {float: left; width: 190px; overflow: hidden;}
#sidebar section {margin-bottom: 10px;}
#sidebar section h1 {text-align: center; overflow: hidden;}
#sidebar section a:hover {text-decoration: none;}

/* sec_report2011 */
#sidebar #sec_report2011 p {display: none;}

/* sec_facebook */
#sidebar #sec_facebook {width: 174px; padding: 0 8px; background-color: #181817;}
#sidebar #sec_facebook h1 {position: relative; width: 190px; margin: 0 -8px;}
#sidebar #sec_facebook p {padding: 8px 0; color: #849ed4; font-size: 91%; line-height: 1.2;}
#sidebar #sec_facebook .like {padding-left: 30px; border-bottom: 1px dashed #777; background: url(../image/common/sidebar/icon_facebook.png) no-repeat 0 8px; color: #fff; font-size: 109%; line-height: 1.1;}

/* sec_twitter */
#sidebar #sec_twitter #tweets {height: 265px; background-color: #181817; font-size: 83%; overflow: auto;}
#sidebar #sec_twitter #tweets ul {padding: 5px 0;}
#sidebar #sec_twitter #tweets ul li {width: 165px; margin: 0 auto; padding: 5px 0 5px 5px; border-top: 1px dashed #fff; overflow: hidden;}
#sidebar #sec_twitter #tweets ul li:first-child,
#sidebar #sec_twitter #tweets ul li.first-child {border: none;}
#sidebar #sec_twitter #tweets .twtr-icon {float: left; margin: 0 5px 5px 0; background-color: #fff;}

/* sec_mixi */
#sidebar #sec_mixi p {display: none;}

/* grp_etc */
#sidebar #grp_etc ul li {margin-bottom: 10px;}

/* ==========================================================================================
	--FOOTER
========================================================================================== */
#globalfooter {width: 100%; padding-bottom: 20px;}
#globalfooter div {width: 100%;}
#globalfooter h1 {margin-bottom: 10px; padding-bottom: 5px; border-bottom: 1px solid #6e6e6e; line-height: 1.1;}
#globalfooter section {width: 100%;}

/*	@Thanks footer
-------------------------------------------------------------------------------------------*/
#globalfooter #thanksfooter {margin-bottom: 10px;}
#globalfooter #thanksfooter ul {display: table;}
#globalfooter #thanksfooter ul li {display: table-cell; padding: 0 15px 15px 0; vertical-align: middle;}

/*	@Page footer
-------------------------------------------------------------------------------------------*/
#globalfooter #pagefooter {margin-bottom: 10px;}
#globalfooter #pagefooter ul {width: 100%; overflow: hidden;}
#globalfooter #pagefooter ul li {float: left; margin-right: 5px;}

/*	@Copyright
-------------------------------------------------------------------------------------------*/
#globalfooter #copyright {font-size: 83%;}

/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}

/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:url(../image/colorbox/overlay.png) repeat 0 0;}
#colorbox{}
    #cboxTopLeft{width:21px; height:21px; background:url(../image/colorbox/controls.png) no-repeat -101px 0;}
    #cboxTopRight{width:21px; height:21px; background:url(../image/colorbox/controls.png) no-repeat -130px 0;}
    #cboxBottomLeft{width:21px; height:21px; background:url(../image/colorbox/controls.png) no-repeat -101px -29px;}
    #cboxBottomRight{width:21px; height:21px; background:url(../image/colorbox/controls.png) no-repeat -130px -29px;}
    #cboxMiddleLeft{width:21px; background:url(../image/colorbox/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(../image/colorbox/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(../image/colorbox/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(../image/colorbox/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0; background:url(../image/colorbox/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(../image/colorbox/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext:hover{background-position:-50px -25px;}
        #cboxLoadingOverlay{background:url(../image/colorbox/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(../image/colorbox/loading.gif) no-repeat center center;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(../image/colorbox/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose:hover{background-position:-25px -25px;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}

/*
  The following provides PNG transparency support for IE6
  Feel free to remove this and the /ie6/ directory if you have dropped IE6 support.
*/
.cboxIE6 #cboxTopLeft{background:url(../image/colorbox/ie6/borderTopLeft.png);}
.cboxIE6 #cboxTopCenter{background:url(../image/colorbox/ie6/borderTopCenter.png);}
.cboxIE6 #cboxTopRight{background:url(../image/colorbox/ie6/borderTopRight.png);}
.cboxIE6 #cboxBottomLeft{background:url(../image/colorbox/ie6/borderBottomLeft.png);}
.cboxIE6 #cboxBottomCenter{background:url(../image/colorbox/ie6/borderBottomCenter.png);}
.cboxIE6 #cboxBottomRight{background:url(../image/colorbox/ie6/borderBottomRight.png);}
.cboxIE6 #cboxMiddleLeft{background:url(../image/colorbox/ie6/borderMiddleLeft.png);}
.cboxIE6 #cboxMiddleRight{background:url(../image/colorbox/ie6/borderMiddleRight.png);}

.cboxIE6 #cboxTopLeft,
.cboxIE6 #cboxTopCenter,
.cboxIE6 #cboxTopRight,
.cboxIE6 #cboxBottomLeft,
.cboxIE6 #cboxBottomCenter,
.cboxIE6 #cboxBottomRight,
.cboxIE6 #cboxMiddleLeft,
.cboxIE6 #cboxMiddleRight {
    _behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");
}

/*
 * CSS Styles that are needed by jScrollPane for it to operate correctly.
 *
 * Include this stylesheet in your site or copy and paste the styles below into your stylesheet - jScrollPane
 * may not operate correctly without them.
 */

.jspContainer
{
	overflow: hidden;
	position: relative;
}

.jspPane
{
	position: absolute;
}

.jspVerticalBar
{
	position: absolute;
	top: 0;
	right: 0;
	width: 9px;
	height: 100%;
	background: #747474;
}

.jspHorizontalBar
{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 16px;
	background: red;
}

.jspVerticalBar *,
.jspHorizontalBar *
{
	margin: 0;
	padding: 0;
}

.jspCap
{
	display: none;
}

.jspHorizontalBar .jspCap
{
	float: left;
}

.jspTrack
{
	background: #dde;
	position: relative;
}

.jspDrag
{
	background: #000;
	position: relative;
	top: 1px;
	left: 1px;
	width: 7px;
	cursor: pointer;
}

.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag
{
	float: left;
	height: 100%;
}

.jspArrow
{
	background: #50506d;
	text-indent: -20000px;
	display: block;
	cursor: pointer;
}

.jspArrow.jspDisabled
{
	cursor: default;
	background: #80808d;
}

.jspVerticalBar .jspArrow
{
	height: 16px;
}

.jspHorizontalBar .jspArrow
{
	width: 16px;
	float: left;
	height: 100%;
}

.jspVerticalBar .jspArrow:focus
{
	outline: none;
}

.jspCorner
{
	background: #eeeef4;
	float: left;
	height: 100%;
}

/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner
{
	margin: 0 -3px 0 0;
}
