@charset "utf-8";

/* CSS Document */



/* wrapper

----------------------------------------------------------------------*/

#main .wrapper {

overflow: hidden;

width: 900px;

background: #000;

}



/* visual

----------------------------------------------------------------------*/

#visual {

position: relative;

margin-bottom: 10px;

width: 900px;

height: 250px;

background: url(../image/top_visual_bg.png) left top no-repeat;

}



#visual .movie {

position: absolute;

left: 10px;

top: 10px;

}



#visual .image {

position: absolute;

right: 10px;

top: 10px;

width: 580px;

height: 230px;

}



#visualContainer {

position: relative;

list-style: none;

width: 580px;

height: 230px;

}



#visualContainerPrev {

position: absolute;

left: 10px;

top: 50%;

margin-top: -60px;

}



#visualContainerNext {

position: absolute;

right: 10px;

top: 50%;

margin-top: -60px;

}



/* twitter

----------------------------------------------------------------------*/

#twitter {

position: relative;

float: left;

margin-right: 10px;

width: 220px;

height: 481px;

/*

background: url(../image/top_twitter_bg.png) left 24px no-repeat;

color: #FFF;

*/

}



#twitter ul {

list-style: none;

margin: 10px auto 15px;

width: 184px;

height: 390px;

}



#twitter li {

overflow: hidden;

margin-bottom: 10px;

padding-bottom: 10px;

width: 160px;

font-size: 11px;

color: #FFF;

border-bottom: 1px solid #333;

}



#twitter li .tweet_avatar {

float: left;

}



#twitter li .tweet_time {

display: block;

margin-left: 50px;

margin-bottom: 3px;

}



#twitter li .tweet_time a {

color: #FF0;

text-decoration: none;

}



#twitter li .tweet_text {

display: block;

margin-left: 50px;

width: 110px;

line-height: 1.4;

}



#twitter li .tweet_text a {

color: #FFF;

}



#twitter .twitterLink {

position: absolute;

bottom: 20px;

left: 20px;

}



/* contents

----------------------------------------------------------------------*/

#contents {

float: left;

margin-right: 10px;

width: 360px;

height: 481px;

background: url(../image/top_contents_bg.png) left 24px no-repeat;

}



#contents #mainContents {

list-style: none;

margin: 0 auto;

padding-top: 15px;

width: 320px;

}



#contents #mainContents li {

overflow: hidden;

width: 320px;

border-bottom: 1px solid #333;

padding-bottom: 17px;

margin-bottom: 18px;

}



#contents #mainContents .left {

float: left;

padding-left: 10px;

width: 140px;

}



#contents #mainContents .right {

float: right;

width: 160px;

}



#contents #mainContents li .left a {

padding-left: 15px;

font-size: 12px;

font-weight: bold;

color: #C00;

background: url(../image/top_contents_bullet.png) left center no-repeat;

}



#contents #mainContents li p {

margin-top: 5px;

font-size: 11px;

color: #FFF;

line-height: 1.4;

}



#contents #subContents {

list-style: none;

margin: 0 auto;

width: 310px;

}



#contents #subContents li {

float: left;

margin-bottom: 10px;

}



#contents #subContents li.odd {

margin-right: 10px;

}



/* information

----------------------------------------------------------------------*/

#information {

float: right;

margin-bottom: 10px;

width: 300px;

height: 154px;

background: url(../image/top_information_bg.png) left 24px no-repeat;

}



#information ul {

list-style: none;

font-size: 11px;

margin: 10px auto;

width: 265px;

height: 105px;

}



#information li {

color: #FFF;

border-bottom: 1px solid #333;

margin-bottom: 10px;

padding-bottom: 10px;

width: 240px;

line-height: 1.4;

}



#information li strong {

float: left;

display: block;

width: 70px;

color: #FF0;

font-weight: bold;

}



#information li span {

display: block;

margin-left: 80px;

}



#information li span a {

color: #FFF;

}



/* software

----------------------------------------------------------------------*/

#software {

float: right;

margin-bottom: 10px;

width: 300px;

height: 142px;

background: url(../image/top_software_bg.png) left 24px no-repeat;

}



#software .box {

padding: 10px 20px;

width: 260px;

}



#software .left {

float: left;

overflow: hidden;

width: 160px;

}



#software .left ul {

list-style: none;

}



#software .left li {

float: left;

color: #FFF;

font-size: 11px;

font-weight: bold;

text-align: center;

width: 77px;

}



#software .left li img {

margin-bottom: 5px;

}



#software .left .kabuto {

margin-right: 6px;

}



#software .right {

float: right;

width: 90px;

}



#software .right strong {

display: block;

margin-bottom: 5px;

color: #FF0;

font-size: 12px;

}



#software .right p {

color: #FFF;

font-size: 11px;

line-height: 1.4;

}