@charset "utf-8";

/**---------------------------
debug
*/
#todo,
.todo2
{
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    opacity:.9;
    display: none;
}
.todo2
{
    position: relative;
}
#todo h3
{
    background-color: red;
}
.todo2 h3
{
    background-color: red;
    color:#000;
}
#todo h3 a,
.todo2 h3 a
{
    display: block;
}
#todo ol,
.todo2 ol
{
    width: 100%;
    background-color: pink;
    color:#000;
    position: absolute;
/*     display: none; */
    text-indent: 1em;
    list-style-position: inside;
}

.yet:before
{
    content:"【未】";
    background: yellow;
    color: #000;
}
.done:before
{
    content:"【未】";
    background: yellow;
    color: #000;
}
.who:before
{
    content:"【誰か頼む!!!】";
    background: yellow;
    color: #000;
}

*{ margin: 0; padding: 0; border: 0; text-decoration: none; }
html,body
{
    width: 100%;
/*     height: 100%; */
/*     background-color: #162645; */
}

.module
{
    color: #111;
/*     background-color: #FFF; */
    position: relative;
    margin: 8px;
    padding: 10px;
}

body
{
    width: 100%;
    color: #FFF;
    font-size: 11px;
    font-height: 24px;
    letter-spacing: .1em;
    font-family: "FOT-TsukuMin Pro",'Kozuka Mincho Pro', 'Kozuka Mincho Std', '小塚明朝 Pro R', '小塚明朝 Std R', 'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'ヒラギノ明朝 Pro W3','ＭＳ Ｐ明朝','MS PMincho', 'Times', 'Times New Roman', serif;
    
}

#wrapper
{
    width: 1080px;
    position: relative;
    margin: 0 auto;
}

.section
{
    position: relative;
    overflow: hidden; /* float解除 */
}


/**---------------------------
BASE
*/
#header
{
/*     background-color:pink; */
}
#content
{
/*     background-color:lightgreen; */
}
#footer
{
/*     background-color:gold; */
    clear: both;
    padding-top: 20px;
}





body
{
    background: transparent url(/jp/static/images/2010/bg/bg.png) repeat left top;
    position: relative;
}
#wrapper
{
    overflow: hidden;
    position: relative;
}

/**====================================
HEADER
*/
#logo
{
    width: 530px;
    height: 154px;
    overflow: hidden;
    float: left;
}
#headerNav
{
    position: absolute;
    top :0;
    right: 0;
    width: 580px;
    height: 40px;
    overflow: hidden;
/*     background-color: blue; */
}
#headerBanner
{
}
#headerBanner li
{
}

#headerBanner .banner.scape
{
    position:absolute;
    right:360px;
    top:60px;
}
#headerBanner .banner.support 
{
    position:absolute;
    right:180px;
    top:40px;
}
#headerBanner .banner.rakuten 
{
    position:absolute;
    right:35px;
    top:75px;
}


#headerNav ul{
	float: right;
	}
#headerNav li, #headerNav a {
	font-size:8px;
	float: left;
	color: #000;
	padding:0 2px;
	}
#headerNav li{
	list-style: none;
	}
/**====================================
CONTENT
*/

#flickr
{
    width: 500px;
    height: 350px;
    float: left;
    padding-top:200px;
    margin-top:-60px;
}

#flickr h2
{
    margin-top:-140px; 
    margin-left: -15px;
}
#info
{
    margin-left: 540px;
}
    #info .banners
    {
        position: relative;
/*         overflow: hidden; */
        margin-right: 10px;
        width: 250px;
        float: left;
        padding-bottom:150px;
    }
    #info .banner 
    {
    }
    #info .banner.events 
    {
        margin-left:90px;
        margin-top:60px;
    }
    #info .banner.download 
    {
        margin-top:80px;
    }
    #info .banner.ustream 
    {
        width: 340px;
        height: 269px;
        position: absolute;
        top: 180px;
        right: -260px;
    }


#tweetWall
{
    position:relative;
    width:1050px;
    height:645px;
}
    #tweetWall .cards
    {
        list-style:none;
    }
    #tweetWall .card
    {
        position:absolute;
        width:348px;
    }
    #tweetWall #card00,
    #tweetWall #card10,
    #tweetWall #card20
    {
        left:0;
    }
    #tweetWall #card01,
    #tweetWall #card11,
    #tweetWall #card21
    {
        left:350px;
    }
    #tweetWall #card02,
    #tweetWall #card12,
    #tweetWall #card22
    {
        left:700px;
    }
    #tweetWall #card00,
    #tweetWall #card01,
    #tweetWall #card02
    {
        top:0;
    }
    #tweetWall #card10,
    #tweetWall #card11,
    #tweetWall #card12
    {
        top:215px;
    }
    #tweetWall #card20,
    #tweetWall #card21,
    #tweetWall #card22
    {
        top:430px;
    }
    #tweetWall .tweet
    {
        height:160px;
        position: relative;
        padding: 30px 26px 26px;
        background: transparent url(/jp/static/images/2010/bg/bubble00.png) no-repeat left top;
    }
    #card00 .tweet { background: transparent url(/jp/static/images/2010/bg/bubble00.png) no-repeat left top; }
    #card01 .tweet { background: transparent url(/jp/static/images/2010/bg/bubble01.png) no-repeat left top; }
    #card02 .tweet { background: transparent url(/jp/static/images/2010/bg/bubble02.png) no-repeat left top; }
    #card10 .tweet { background: transparent url(/jp/static/images/2010/bg/bubble10.png) no-repeat left top; }
    #card11 .tweet { background: transparent url(/jp/static/images/2010/bg/bubble11.png) no-repeat left top; }
    #card12 .tweet { background: transparent url(/jp/static/images/2010/bg/bubble12.png) no-repeat left top; }
    #card20 .tweet { background: transparent url(/jp/static/images/2010/bg/bubble20.png) no-repeat left top; }
    #card21 .tweet { background: transparent url(/jp/static/images/2010/bg/bubble21.png) no-repeat left top; }
    #card22 .tweet { background: transparent url(/jp/static/images/2010/bg/bubble22.png) no-repeat left top; }
    
    #tweetWall .tweet dt
    {
        display: none;
    }
    #tweetWall .tweet .icon
    {
        position: absolute;
        bottom: 0;
        right: 8px;
    }
    #tweetWall .tweet .user
    {
        position: absolute;
        bottom: 46px;
        right: 38px;
        background: none !important;
    }
    #tweetWall .tweet .user a
    {
        color: #222;
    }
    #tweetWall .tweet .text
    {
        font-size:13px;
        line-height:23px;
        padding-top: 10px;
        margin: 5px;
        background-image: url(/jp/static/images/2010/bg/openquote.png);
        background-position: top left;
        background-repeat: no-repeat;
        text-indent: 65px;
    }
    #tweetWall .tweet .text span
    {
        display: block;
        /*background: url(/jp/static/images/2010/bg/closequote.png) no-repeat right bottom;*/
    }
    #tweetWall .tweet .date
    {
        position: absolute;
        bottom: 13px;
        right:30px;
        font-size:9px;
    }

#ustream
{
    clear: both;
}
    #liveShow
    {
        clear: both;
        float: left;
        width: 600px;
    }
    
    /**IE7*/
    *:first-child+html #liveShow 
    { 
        margin-top: -100px;
    }
    *:first-child+html #socialStream 
    { 
        margin-top: -100px;
    }
    #liveShow object
    {
        position: absolute;
        z-index: 3;
    }
    #socialStream
    {
        position: relative;
        left: 670px;
    }
    #ustream h2
    {
        float: left;
        width: 100%;
        padding: 0 10px;
        height: 160px;
        margin-left: -15px;
        overflow: hidden;
    }
    #ustream .bodycopy
    {
        margin-left: 430px;
        min-height: 160px;
        position: relative;
        top :-50px;
    }
    #ustream .banner
    {
        display:block;
        position: absolute;
        top: 195px;
        left:10px;
        z-index: 9;
/*
        background-color: blue;
        opacity:.3;
*/
    }

/**====================================
FOOTER
*/
#news
{
    width: 400px;
    height: 550px;
    overflow: hidden;
    overflow-y: scroll;
    float: left;
    background-color: #FFF;
    font-size: 11px;
    line-height: 17px;
}
    #news h2
    {
        margin-bottom: .5em;
    }
    #news .tweets
    {
        position: relative;
        list-style: none;
    }
    #news .tweets .tweet
    {
        position: relative;
        border-top: dotted 1px #999;
        padding: .6em 1em;
    }
    #news .tweets .tweet dt
    {
        display: none;
    }
    #news .tweets .tweet .text
    {
        margin-top: 1.5em;
    }
    #news .tweets .tweet .date
    {
        position: absolute;
        top: .5em;
        text-decoration: underline;
        padding: 0 .5em;
        line-height: 2em;
    }
    #news .tweets .tweet .user
    {
        display: none;
    }

#footerNav
{
    width: 480px;
    overflow: hidden;
    float: left;
    margin-left: 10px;
    margin-right: -10px;
}
#footerNav li
{
    width: 200px;
    float: left;
/*     background-color: pink; */
    margin-right: 30px;
	list-style: none;
	font-size: 12px;
}

#footerBanner
{
    overflow: hidden;
    margin-left: 10px;
    margin-right: -10px;
    position:absolute;
    top:0;
    right:0;
}

#credit
{
/*     width: 480px; */
    overflow: hidden;
    float: left;
    margin-left: 10px;
    margin-right: -10px;
}
#credit ul
{
    overflow: hidden;
    float: left;
    margin-left: 10px;
    margin-right: -10px;
}
#websiteCredit
{
    float: left;
    margin-right: 80px;
    margin-bottom: 1.5em;
    width: 140px;
}
#mainVisualCredit
{
    float: right;
    width: 370px;
}

#weare
{
    text-align: center;
    margin-top: -20px;
    margin-bottom: 20px;
}
/**---------------------------
.btn
*/

a
{
    color: #00195b;
    background-color: #fbd452;
}
a:hover
{
    background-color: #fcd657;
}
.banners
{
    list-style: none;
}
.banner a, #logo a
{
    background: none;
}
.tweet a
{
    color: #fbd452;
    background-color: transparent;
}
.tweet .date a
{
    color: #00195b;
}

.btn {
	position: relative;
	z-index: 3;
}

.btn a {
	display: block;
	font-weight: bold;
	letter-spacing: 1px;
	position: relative;
	text-align: center;
	text-decoration: none;
	text-indent: -9898px;
}

.btn a span {
	position: relative;
	z-index: -1;
}

.border00
{
    background: transparent url(/jp/static/images/2010/bg/border00.png) repeat-x left 50%;
    display:block;
    height:30px;
}
.border
{
    clear: both;
    margin: 20px 0;
    display: block;
}
.border hr
{
    display: none;
}