@charset "UTF-8";
/* CSS Document */

#drawer{ background-image: url(../img/expand-bg.gif); position: absolute; width: 100%; overflow: hidden; background-position: center top; }
#drawer.down{ top: 698px; height: 380px;}
#drawer.up{	top: 50px;	height: 1000px;}
#drawer .barbg{ background-image: url('../img/bg_bar.png'); background-position: center top; background-repeat: repeat-x;}
#drawer .bar{ margin: 0px auto;	background-image: url('../img/bar.png'); background-position: center top; background-repeat: no-repeat;	height: 84px; text-align: center; color: white;}
#drawer .bar #direction-up,
#drawer .bar #direction-down{ margin: auto;	width: 100px;}
#drawer .bar #direction-up .left,
#drawer .bar #direction-down .left{	float: left; margin-top: 11px; margin-left: 10px;}
#drawer .bar #direction-up .right,
#drawer .bar #direction-down .right{ float: right; margin-top: 11px; margin-right: 10px;}

#content{ color: #b3b4b7; width: 1000px; margin: 0 auto; font-size: 0.70em;}
#content a{	text-decoration: none;}
#content h4 a{ font-weight: bold;}
#content h4{ margin: 15px auto 0; font-weight: bold; color: #F00;}
#content #news{	float: left; width: 33%;}
#content #twitter{ margin: 0 33%;}
#content #follow{ float: right;	width: 33%;}
#content .clear{ clear: both;}
#content #news > div,
#content #twitter > div,
#content #follow > div{	margin: 0 25px;}
#content #news h3,
#content #twitter h3,
#content #follow h3{ margin: 0 auto; font-size: 2em; color: #C00; font-family: Arial, Helvetica, sans-serif; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #868280;}
#content #follow ul{ list-style:none;}
#content #follow li{ float:left;}
#content #follow li.twitter{ margin-left:10px;}

.post h4{ font-size:12px;}
.post .date{ margin: 0 auto 12px;}
.post .description{	margin: 0 auto 35px; font-size:12px; line-height:130%;}
.post .description a{ color:#fff;}
.post .description a:hover{ color:#f00; text-decoration:underline;}

.tweet{	display: none; padding: 10px 0; min-height: 60px; overflow-x: hidden;}
.tweet .avatar{	float: left; margin: 2px 4px 2px 0px;}
.tweet .avatar img{	height: 48px; width: 48px;}
.tweet .user a{  font-weight: bold;}
.tweet .text{ margin: 0 0 0 50px;}
.tweet .time{ margin: 5px 0 0 50px; font-variant: small-caps;}

#social{ padding: 10px 0;}
#social #avatar{ float: left}
#social .avatar_text{  margin: 0 60px;}
#social .avatar_text span.screen_name{  font-weight: bold;  font-size: 1.5em;}
#social .fb-like{ float: left;  margin: 25px auto;}
#social .tw-like{ margin: 25px auto;}
#social #preorder_promo{  margin: 125px auto 0;}

#main{ height: 635px; margin: 0 auto; text-align: center;}
#mainmovie{ padding-top:35px;}
#select{ margin:0 auto; width:900px; position:relative;}
#select ul{list-style:none; }
#select li.big_logo{ position: absolute; left: 477px; top: 79px;}
#select li.catch{
	position: absolute;
	left: 574px;
	top: 253px;
}
#select li.day{	position: absolute;	left: 245px; top: 372px;}
#select li.tbox{
	position: absolute;
	left: 591px;
	top: 419px;
}
#select li.trial{
	position: absolute;
	left: 684px;
	top: 383px;
}
#select li.platunum{
	position: absolute;
	left: -28px;
	top: 302px;
}
#select li.news1 a{	position: absolute;	left: -32px; top: 460px; display: block; width: 297px; height: 109px; }
#select li.news2 a{ position: absolute;	left: 296px; top: 460px; display: block; width: 297px; height: 109px; }
#select li.news3 a{	position: absolute;	left: 624px; top: 460px; display: block; width: 297px; height: 109px; }
#select li.news1 a:hover{ background-color:#FFF;}
#select li.news2 a:hover{ background-color:#FFF;}
#select li.news3 a:hover{ background-color:#FFF;}
#select li.news1 span{ display: block; width: 74px;	height: 39px; background-image: url(../top/dlc_update.gif);	position: absolute;	top: 460px;	left: -32px; text-indent:-9999px;}
#day{ margin:0 auto; width:262px; padding-top:18px;}
#ad{ margin-top:10px; }