@charset "UTF-8";
/*////////////////////////////////////////////////////////////
mansion100% - theme.css for "theme" category.

Copyright (C) NEXT Co,. Ltd. All right reserved.
------------------------------------------------------------

    0. Import External CSS
    1. Header
        1-1. Writer Profile
        1-2. Theme Archive
    2. Content Header
        2-1. Page Title
        2-2. Utility
    3. Content Body
        3-1. Common
        3-2. Content Block Layout
        3-3. Sub box
    4. Trackback
    5. Top Page
        5-1. Topics
        5-2. Theme TOC Flash
        5-3. Popular Ranking
    6. Theme Archive Page

////////////////////////////////////////////////////////////*/

/* ------------------------------------------------------------
    0. Import External CSS
   ------------------------------------------------------------ */
@import "common.css";

/* ------------------------------------------------------------
    1. Header
   ------------------------------------------------------------ */
p#btnThemeRss01 {
    position: absolute;
	top: 15px;
	right: 0;
}

div#themeHeader {
    margin-bottom: 10px;
}

div#themeHeader div#blockThemeIntro {
    float: left;
    width: 686px;
    padding-bottom: 10px;
    background: #f8f6e9 url(/theme/images/box_theme_intro_01_btm.gif) no-repeat left bottom;
}

div#blockThemeIntro p.themeTitle {
    margin-bottom: 10px;
    padding: 10px 11px 0;
    background: #f8f6e9 url(/theme/images/box_theme_intro_01_top.gif) no-repeat left top;
}

div#blockThemeIntro p.themeCategory {
    float: left;
    padding-left: 10px;
}

div#blockThemeIntro p.themeSummary {
    margin: 0 20px 40px 105px;
}

/*  1-1. Writer Profile
   ------------------------------------------------- */
div#blockThemeIntro div.writerProfile {
    position: relative;
    width: 676px;
    margin-left: 10px;
    padding-bottom: 10px;
    background: url(/theme/images/box_writer_profile_01_btm.gif) no-repeat left bottom;
}

div#blockThemeIntro div.writerProfile p {
    position: absolute;
    top: 10px;
    left: 70px;
    width: 98px;
}

div#blockThemeIntro div.writerProfile dl {
    width: 676px;
    padding-top: 10px;
    background: url(/theme/images/box_writer_profile_01_top.gif) no-repeat left top;
}

div#blockThemeIntro div.writerProfile dl dt {
    float: left;
    width: 190px;
    margin: 25px 20px 0 0;
    padding-left: 70px;
    font-weight: bold;
}

div#blockThemeIntro div.writerProfile dl dd {
    float: left;
    width: 370px;
    font-size: 77%;
}

div#blockThemeIntro div.writerProfile dl dd.image {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 45px;
    margin: 0;
    padding: 0;
    background: none;
}

/*  1-2. Theme Archive
   ------------------------------------------------- */
div#blockThemeArchive {
    float: right;
    width: 279px;
    padding-bottom: 20px;
    background: url(/theme/images/box_theme_archive_01_btm.gif) no-repeat left bottom;
}

div#blockThemeArchive h2 {}

div#blockThemeArchive dl {
    margin: 0 20px;
}

div#blockThemeArchive dl dt {
    font-size: 77%;
    color: #666666;
}

div#blockThemeArchive dl dd {
    margin-bottom: 10px;
}

div#blockThemeArchive p.moreLink {
    margin-right: 20px;
    padding-top: 10px;
}

/* ------------------------------------------------------------
    2. Content Header
   ------------------------------------------------------------ */

/*  2-1. Page Title
   ------------------------------------------------- */
div#themeContent h1 {
    width: 980px;
    margin-bottom: 20px;
    padding-bottom: 11px;
    background: url(/theme/images/box_theme_ttl_01_btm.gif) no-repeat left bottom;
    font-size: 123.1%;
    font-weight: bold;
    line-height: 1.3;
}

div#themeContent h1 span {
    display: block;
    padding: 15px 50px 5px;
    background: url(/theme/images/box_theme_ttl_01_top.gif) no-repeat left top;
}

/*  2-2. Utility
   ------------------------------------------------- */
div#themeContent ul.utility {
    margin-bottom: 20px;
    text-align: right;
}

div#themeContent ul.utility li {
    display: inline;
    text-align: right;
}

div#themeContent ul.utility li.trackback {
    margin-right: 5px;
}

/* --- SBM Icons --- */
div#themeContent ul.utility li ul {
    display: inline;
}

div#themeContent ul.utility li ul li {
    margin-right: 5px;
	color: #4e7a00;
}

div#themeContent ul.utility li ul li img {
    margin-right: 5px;
    vertical-align: middle;
}

/* ------------------------------------------------------------
    3. Content Body
   ------------------------------------------------------------ */
div#themeTextBody {}

/*  3-1. Common
   ------------------------------------------------- */
div#themeTextBody h2 {
    width: 980px;
    margin-bottom: 15px;
    padding: 3px 5px;
    border-left: 10px solid #6d480b;
    font-size: 108%;
}

div#themeTextBody div.main li {
    margin-left: 2em;
}

div#themeTextBody div.main ul li {
    list-style: disc;
}

div#themeTextBody div.main ol li {
    list-style: decimal;
}

div#themeTextBody div.main em {
    font-weight: bold;
}

div#themeTextBody div.main strong {
    font-size: 116%;
}

/*  3-2. Content Block Layout
   ------------------------------------------------- */
div#themeTextBody div.block01,
div#themeTextBody div.block02,
div#themeTextBody div.block03,
div#themeTextBody div.block04 {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 4px solid #eeeeee;
}

div#themeTextBody div.lastChild {
    border-bottom: none;
}

/* --- Main & Sub Box --- */
div#themeTextBody div.main {
    width: 660px;
    font-size: 108%;
}

div#themeTextBody div.sub {
    width: 280px;
}

/* Case: 2 Photos */
div#themeTextBody div.block03 div.main,
div#themeTextBody div.block04 div.main {
    width: 380px;
}

div#themeTextBody div.block03 div.sub,
div#themeTextBody div.block04 div.sub {
    width: 560px;
}

/* Case: Main Left, Sub Right */
div#themeTextBody div.block01 div.main,
div#themeTextBody div.block03 div.main {
    float: left;
}

div#themeTextBody div.block01 div.sub,
div#themeTextBody div.block03 div.sub {
    float: right;
}

/* Case: Main Right, Sub Left */
div#themeTextBody div.block02 div.main,
div#themeTextBody div.block04 div.main {
    float: right;
}

div#themeTextBody div.block02 div.sub,
div#themeTextBody div.block04 div.sub {
    float: left;
}

/*  3-3. Sub box
   ------------------------------------------------- */
div#themeTextBody div.sub ul li.item {
    float: left;
    width: 280px;
    margin-bottom: 20px;
}

/* Caption */
div#themeTextBody p.caption {
    margin-top: 5px;
    font-size: 77%;
    line-height: 1.3;
}

/* Property Unit */
div#themeTextBody div.sub ul li.unit {
    width: 235px;
    padding: 0 20px;
}

div#themeTextBody div.block02 div.sub ul li.unit {
    margin-left: 0;
    margin-right: 22px;
}

div#themeTextBody div.sub div.blockAssetBuzz {
    padding: 0;
}

div#themeTextBody div.sub div.unitBuzz01 {
    margin-right: 0;
    margin-bottom: 0;
}

/* ------------------------------------------------------------
    4. Trackback
   ------------------------------------------------------------ */
div.blockTrackback {
    margin-bottom: 40px;
}

div.blockTrackback dl dt {
    margin-bottom: 10px;
    font-weight: bold;
}

div.blockTrackback dl.trackback {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 4px solid #eeeeee;
}

div.blockTrackback dl.trackback dd input {
    width: 50%;
    padding: 5px;
    border: 1px solid #cccccc;
}

div.blockTrackback dl.trackbackList {
    width: 980px;
}

div.blockTrackback dl.trackbackList a:link,
div.blockTrackback dl.trackbackList a:visited {
    text-decoration: none;
}

div.blockTrackback dl.trackbackList a:hover,
div.blockTrackback dl.trackbackList a:active {
    text-decoration: underline;
}

/* ------------------------------------------------------------
    5. Top Page
   ------------------------------------------------------------ */
   
/*  5-1. Topics
   ------------------------------------------------- */
div#blockThemeTopics {
    margin-bottom: 20px;
}

div#blockPopularTheme,
div#blockThemeComment {
    width: 483px;
    float: left;
}

div#blockPopularTheme {
    margin-right: 14px;
}

div#blockPopularTheme table.tblRanking01 {
    width: 100%;
}

div#blockThemeComment {}

div#blockThemeComment ol {
    width: 483px;
    margin-top: 5px;
}

div#blockThemeComment ol li {
    width: 443px;
    padding: 5px 0 5px 40px;
    border-top: 2px solid #eeeeee;
}

div#blockThemeComment ol li.firstChild {
    border-top: none;
}

div#blockThemeComment ol li ul li {
    padding: 0;
    background: none;
    border-top: none;
}

div#blockThemeComment ol li ul li.themeName {
    width: 320px;
}

div#blockThemeComment ol li ul li.date {
    margin: -1.5em 0 0 0;
    font-size: 77%;
    color: #666666;
    text-align: right;
}

/* --- Face Icon --- */
div#blockThemeComment ol li.face01 { background: url(/shared/images/ico_face_a_01.gif) no-repeat 5px 5px; }
div#blockThemeComment ol li.face02 { background: url(/shared/images/ico_face_a_02.gif) no-repeat 5px 5px; }
div#blockThemeComment ol li.face03 { background: url(/shared/images/ico_face_a_03.gif) no-repeat 5px 5px; }
div#blockThemeComment ol li.face04 { background: url(/shared/images/ico_face_a_04.gif) no-repeat 5px 5px; }
div#blockThemeComment ol li.face05 { background: url(/shared/images/ico_face_a_05.gif) no-repeat 5px 5px; }
div#blockThemeComment ol li.face06 { background: url(/shared/images/ico_face_a_06.gif) no-repeat 5px 5px; }
div#blockThemeComment ol li.face07 { background: url(/shared/images/ico_face_a_07.gif) no-repeat 5px 5px; }
div#blockThemeComment ol li.face08 { background: url(/shared/images/ico_face_a_08.gif) no-repeat 5px 5px; }
div#blockThemeComment ol li.face09 { background: url(/shared/images/ico_face_a_09.gif) no-repeat 5px 5px; }
div#blockThemeComment ol li.face10 { background: url(/shared/images/ico_face_a_10.gif) no-repeat 5px 5px; }

/*  5-2. Theme TOC Flash
   ------------------------------------------------- */
div.swfThemeToc {
    width: 980px;
    height: 876px;
    margin-bottom: 30px;
}

/*  5-3. Popular Ranking
   ------------------------------------------------- */
div.blockPopularRanking {
    margin-bottom: 15px;
    background: url(/theme/images/box_theme_ranking_01_btm.gif) no-repeat left bottom;
}

div.itemRanking {
    float: left;
    width: 190px;
    margin-right: 7px;
    padding: 15px 0 20px;
    background: url(/theme/images/box_theme_ranking_01_top.gif) no-repeat left top;
}

div.blockPopularRanking div.firstChild {
    margin-right: 9px;
}

div.blockPopularRanking div.lastChild {
    margin-right: 0;
}

div.itemRanking h3 {
    min-height: 3.5em;
    padding-left: 35px;
    padding-right: 15px;
    background: url(/shared/images/ico_crown_01.gif) no-repeat 10px 0;
    font-weight: bold;
    line-height: 1.3;
}

* html div.itemRanking h3 { /* For IE6 */
    height: 3.5em;
}

div.itemRanking table.tblRanking01 {
    width: 188px;
    margin-left: 1px;
}

div.itemRanking table.tblRanking01 th.rank {
    padding-left: 5px;
}

div.itemRanking table.tblRanking01 td.itemName {
    font-weight: bold;
}

div.itemRanking p.moreLink {
    margin-top: 15px;
    margin-right: 10px;
}

/* ------------------------------------------------------------
    6. Theme Archive Page
   ------------------------------------------------------------ */
p.navThemeTop {
    margin: 0 0 30px 0;
}