@charset "UTF-8";
/* ------------------------------------------------------------------------- */
/*
 *  snowflake-liquid.css
 *
 *  Copyright (c) 2011, clown. All rights reserved.
 *
 *  Redistribution and use in source and binary forms, with or without
 *  modification, are permitted provided that the following conditions
 *  are met:
 *
 *    - Redistributions of source code must retain the above copyright
 *      notice, this list of conditions and the following disclaimer.
 *    - Redistributions in binary form must reproduce the above copyright
 *      notice, this list of conditions and the following disclaimer in the
 *      documentation and/or other materials provided with the distribution.
 *    - No names of its contributors may be used to endorse or promote
 *      products derived from this software without specific prior written
 *      permission.
 *
 *  THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
 *  "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
 *  LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
 *  A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
 *  OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
 *  SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED
 *  TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
 *  PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF
 *  LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
 *  NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
 *  SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 */
/* ------------------------------------------------------------------------- */

/* ------------------------------------------------------------------------- */
/*
 *  横幅の定義
 *
 *  .contents-buffer は，リキッドスタイルを実現するためのクラス．
 *  この CSS では，右側に 310px 固定幅のサイドバーを設けるリキッドスタイル
 *  となっている．
 */
/* ------------------------------------------------------------------------- */
body {
    width                   : 100%;
    margin                  : 0;
    padding                 : 0;
    border                  : 0;
}

.container {
    width                   : 97%;
    overflow                : hidden;
}

.contents-buffer {
    width                   : 100%;
    float                   : left;
    margin-right            : -310px;
    padding                 : 0;
    border                  : 0;
}

.contents {
    margin                  : 1em;
    margin-right            : 330px;
    padding                 : 0;
    border                  : 0;
    position                : relative;
    overflow                : hidden;
}

.sidebar {
    width                   : 310px;
    float                   : right;
    display                 : inline;
    margin                  : 1em 0;
    padding                 : 0;
    border                  : 0;
    position                : relative;
    overflow                : hidden;
}

.sidebar .component {
    width                   : 300px;
}

/* ------------------------------------------------------------------------- */
/*
 *  フォントの定義
 */
/* ------------------------------------------------------------------------- */
body, table, input, textarea, address, iframe {
    font-family             : 'Times', 'Times New Roman', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    font-size               : 14px;
    line-height             : 1.4;
    color                   : #222222;
}

/* ------------------------------------------------------------------------- */
/*
 *  クラス未指定時の一般的なタグのスタイル
 */
/* ------------------------------------------------------------------------- */
body {
    background              : #d1d0cb url('../images/background.gif') repeat;
}

a {
    color                   : #0020a0;
    text-decoration         : none;
}

a:hover {
    color                   : #ef810f;
    text-decoration         : underline;
}

img {
    margin                  : 0;
    padding                 : 0;
    border                  : 0;
    -ms-interpolation-mode  : bicubic;
}

hr {
    margin                  : auto;
    width                   : 98%;
    height                  : 1px;
    border-width            : 1px 0 0 0;
    border-style            : solid;
    border-color            : #dcdcdc;
}

address {
    font-style              : normal;
}

dt {
    font-weight             : bold;
}

dd {
    margin                  : 0;
    margin-bottom           : 0.5em;
    padding                 : 0;
}

table {
    width                   : 97%;
    background-color        : #ffffff;
    margin                  : 0 auto;
    margin-bottom           : 1em;
    padding                 : 0;
    border                  : solid 1px #e3e3e3;
    border-collapse         : collapse;
    border-spacing          : 0;
}

table th {
    margin                  : 0;
    padding                 : 5px;
    border                  : solid #e3e3e3;
    border-width            : 0 0 1px 1px;
    background-color        : #f5f5f5;
    font-weight             : bold;
    text-align              : center;
}

table td {
    margin                  : 0;
    padding                 : 4px;
    border                  : solid #e3e3e3;
    border-width            : 0 0 1px 1px;
}

/* ------------------------------------------------------------------------- */
/*
 *  汎用的なクラスのスタイル
 */
/* ------------------------------------------------------------------------- */
.attention {
    color                   : #a00000;
}

/* ------------------------------------------------------------------------- */
/*
 *  .header
 */
/* ------------------------------------------------------------------------- */
.header {
    background              : #2b2b27 url('../images/background-bar.gif') repeat;
    color                   : #ffffff;
    width                   : 100%;
    clear                   : both;
    margin                  : 0;
    padding                 : 0.2em 0;
    border                  : 0;
    position                : relative;
    overflow                : hidden;
    border-bottom           : solid 1px #2b2b27;
}

.header a {
    color                   : #ffffff;
    text-decoration         : none;
}

.header a:hover {
    color                   : #ef810f;
    text-decoration         : underline;
}

.header-title {
    margin                  : 0 0 5px 1.5%;
    padding                 : 0;
    font-size               : 36px;
}

.header-title img.logo {
    margin                  : 0 10px 0 0;
    vertical-align          : middle;
}

/* ------------------------------------------------------------------------- */
/*
 *  .footer
 */
/* ------------------------------------------------------------------------- */
.footer {
    background              : #2b2b27 url('../images/background-bar.gif') repeat;
    color                   : #ffffff;
    clear                   : both;
    padding                 : 0;
    border                  : 0;
    position                : relative;
    overflow                : hidden;
    text-align              : center;
    border-top              : solid 1px #2b2b27;
    border-bottom           : solid 1px #2b2b27;
    font-size               : small;
}

.footer address {
    color                   : #ffffff;
    display                 : inline;
    padding                 : 0.5em 0;
}

.footer a {
    color                   : #ffffff;
}

.footer a:hover {
    color                   : #ef810f;
    text-decoration         : underline;
}

/* ------------------------------------------------------------------------- */
/*
 *  .container
 */
/* ------------------------------------------------------------------------- */
.container {
    background              : #ffffff;
    margin                  : 2em auto;
    padding                 : 0;
    border                  : solid 1px #2b2b27;
    border-radius           : 3px;
}

/* ------------------------------------------------------------------------- */
/*
 *  .contents
 */
/* ------------------------------------------------------------------------- */
.contents {
}

.contents-summary {
    font-weight             : bold;
    margin                  : 0 1em;
}

/* ------------------------------------------------------------------------- */
/*
 *  .article
 */
/* ------------------------------------------------------------------------- */
.article-category {
    background              : #d1d0cb url('../images/background.gif') repeat;
    margin                  : 0 0 1em 0;
    padding-left            : 1em;
    border                  : solid 1px #c1c0bb;
    border-radius           : 3px;
    font-size               : large;
}

.article-category a {
    color                   : #222222;
    text-decoration         : none;
}

.article-category a:hover {
    color                   : #ef810f;
    text-decoration         : underline;
}

.article {
    margin                  : 1em;
    padding-bottom          : 1em;
    border-bottom           : solid 1px #dcdcdc;
}

.article-title {
    margin                  : 0;
    font-size               : medium;
    font-weight             : normal;
    line-height             : 1.2;
}

.article-summary {
    margin                  : 0.5em 0;
    font-size               : small;
    max-width               : 60em;
    overflow                : hidden;
}

.article-image {
    float                   : left;
    margin-right            : 0.5em;
    border                  : solid 1px #dcdcdc;
    max-width               : 200px;
    max-height              : 150px;
}

.article-loading {
    margin                  : 1em;
}

.article-navigator {
    margin                  : 0 1em;
}

.article-navigator a.box {
    background              : #2b2b27 url('../images/background-bar.gif') repeat;
    color                   : #ffffff;
    font-weight             : bold;
    line-height             : 2.0;
    white-space             : nowrap;
    padding                 : 0.2em 0.7em;
    border                  : solid 1px #2b2b27;
    border-radius           : 3px;
}

.article-navigator a.selected-item {
    background              : #2b2b27 url('../images/background-bar.gif') repeat;
    color                   : #ef810f;
    font-weight             : bold;
    line-height             : 2.0;
    white-space             : nowrap;
    padding                 : 0.2em 0.7em;
    border                  : solid 1px #2b2b27;
    border-radius           : 3px;
}

.article-navigator a.box:hover {
    color                   : #ef810f;
    text-decoration         : underline;
}

.article-filter { display : none; } /* deprecated */
.article-display {
    text-align              : right;
    font-weight             : bold;
    margin                  : 5px 1em;
    padding-bottom          : 3px;
    border-bottom           : solid 1px #dcdcdc;
    line-height             : 1.75;
}

.article-display-element {
    padding                 : 0 0.5em;
    background-color        : #f0f0f0;
    border                  : solid 1px #f0f0f0;
    border-radius           : 3px;
}

.article-display-element a {
    color                   : #222222;
    white-space             : nowrap;
}

.article-display-element a:hover {
    color                   : #ef810f;
    text-decoration         : underline;
}

.article-display-selected {
    padding                 : 0 0.5em;
    background-color        : #4e4d46;
    border                  : solid 1px #4e4d46;
    border-radius           : 2px;
    color                   : #ffffff;
}

.article-display-selected a {
    color : #ffffff;
}

.article-display-selected a:hover {
    color                   : #ef810f;
    text-decoration         : underline;
}

/* .article 内の細かなスタイル */
.domain, .date {
    margin-right            : 0.5em;
    font-size               : small;
    color                   : #7f7f7f;
}

.domain a, .date a {
    color                   : #7f7f7f;
}

.domain a:hover, .date a:hover {
    color                   : #ef810f;
    text-decoration         : underline;
}

.rss {
    background              : url('../images/rss.png') no-repeat;
    padding-left            : 20px;
}

.rating {
    background              : url('../images/rating.png') no-repeat;
    color                   : #c00000;
    margin-right            : 0.5em;
    padding-left            : 20px;
    font-size               : small;
    font-weight             : bold;
}

.hatena-count {
    background              : url('../images/hatena.png') no-repeat;
    color                   : #7f7f7f;
    margin-right            : 0.5em;
    padding-left            : 20px;
    font-size               : small;
}

.twitter-count {
    background              : url('../images/twitter.png') no-repeat;
    color                   : #7f7f7f;
    margin-right            : 0.5em;
    padding-left            : 20px;
    font-size               : small;
}

.facebook-count {
    background              : url('../images/facebook.png') no-repeat;
    color                   : #7f7f7f;
    margin-right            : 0.5em;
    padding-left            : 20px;
    font-size               : small;
}

/* ------------------------------------------------------------------------- */
/*
 *  .contents-navigator
 */
/* ------------------------------------------------------------------------- */
.contents-navigator {
    background              : #2b2b27 url('../images/background-bar.gif') repeat;
    color                   : #ffffff;
    clear                   : both;
    margin                  : 0;
    padding                 : 0;
    border                  : 0;
    position                : relative;
    overflow                : hidden;
    color                   : #ffffff;
    font-size               : 16px;
}

.contents-navigator a {
    color                   : #ffffff;
    text-decoration         : none;
}

.contents-navigator a:hover {
    color                   : #ef810f;
    text-decoration         : underline;
}

.contents-navigator ul {
    width                   : 100%;
    clear                   : both;
    margin                  : auto 0;
    padding                 : 0 0 0 1em;
    border                  : 0;
    position                : relative;
    list-style-type         : none;
    zoom                    : 1; /* IE6 Hack */
}

.contents-navigator ul li {
    vertical-align          : top;
    display                 : inline-block;
    margin                  : auto 0;
    padding                 : 0.1em 2em;
    border                  : 0;
    position                : relative;
    font-weight             : bold;
    /display                : inline; /* IE7対策 */
    /zoom                   : 1; /* IE7対策 */
}

#contents-navigator-top ul li.selected-item {
    background              : #ffffff;
    border                  : 0;
    border-radius           : 3px 3px 0 0;
}

.contents-navigator ul li.selected-item a {
    color                   : #222222;
    text-decoration         : none;
}

.contents-navigator ul li.selected-item a:hover {
    color                   : #ef810f;
    text-decoration         : underline;
}

#contents-navigator-top {
    padding                 : 0.25em 0 0 0;
}

#contents-navigator-bottom {
    padding                 : 0.25em 0;
    font-size               : 14px;
}

#contents-navigator-bottom ul {
    padding                 : 0;
}

#contents-navigator-bottom ul li {
    float                   : right;
}

/* ------------------------------------------------------------------------- */
/*
 *  .sidebar
 */
/* ------------------------------------------------------------------------- */
.component {
    background              : #ffffff;
    margin                  : 0.5em 0;
    padding                 : 0;
    border                  : solid 1px #2b2b27;
    border-radius           : 3px;
    overflow                : hidden;
}

.component-title {
    background              : #2b2b27 url('../images/background-bar.gif') repeat;
    color                   : #ffffff;
    margin                  : 0;
    padding                 : 0.25em 0.5em;
    font-size               : small;
}

.component-title a {
    color                   : #ffffff;
    text-decoration         : none;
}

.component-title a:hover {
    color                   : #ef810f;
    text-decoration         : underline;
}

.component-body {
    margin                  : 1em 10px;
    padding                 : 0;
    border                  : 0;
    font-size               : small;
}

.component-navigator {
    margin-top              : 0.5em;
    text-align              : right;
}

/* ------------------------------------------------------------------------- */
/*
 *  .amazlist
 */
/* ------------------------------------------------------------------------- */
.amazlist {
    width                   : 280px;
    margin                  : 0.5em 0;
    padding                 : 0;
}

.amazlist-image {
    display                 : inline-block;
    float                   : left;
    width                   : 140px;
    max-height              : 200px;
    overflow                : hidden;
    border                  : solid 1px #dcdcdc;
}

.amazlist-summary {
    display                 : inline-block;
    float                   : right;
    width                   : 130px;
    margin                  : 0;
    padding                 : 0;
    border                  : 0;
}

.amazlist-title {
    font-size               : small;
    line-height             : 1.2;
}

.amazlist-author {
    font-size               : x-small;
    color                   : #7f7f7f;
    margin                  : 0.25em 0;
}

.amazlist-count {
    display                 : inline-block;
    float                   : left;
    font-weight             : bold;
    background              : url('../images/rating.png') no-repeat;
    color                   : #c00000;
    margin-left             : 2px;
    padding-left            : 18px;
}

.amazlist-date {
    display                 : inline-block;
    float                   : left;
    font-weight             : bold;
}

.amazlist-price {
    display                 : inline-block;
    float                   : right;
    font-weight             : bold;
    color                   : #c00000;
}

/* ------------------------------------------------------------------------- */
/*
 *  .clearfix
 */
/* ------------------------------------------------------------------------- */
.clearfix {
    display                 : inline-block;
}

.clearfix:after {
    content                 : ".";
    display                 : block;
    height                  : 0;
    clear                   : both;
    visibility              : hidden;
}

/* ------------------------------------------------------------------------- */
/*
 *  .smb (Social Media Buttons)
 */
/* ------------------------------------------------------------------------- */
.smb-horizontal {
    height                  : 25px;
}

.smb-horizontal div {
    margin-right            : 0.5em;
    margin-top              : 4px;
    float                   : left;
}

.smb-vertical {
    margin-left             : 10px;
    margin-bottom           : 7px;
    width                   : 280px;
    height                  : 70px;
}

.smb-vertical div.twitter {
    margin-right            : 25px;
    float                   : left;
}

.smb-vertical div.hatena {
    margin-right            : 0;
    float                   : left;
}

/* 最後の項目の右余白は取り除く */
.smb-vertical div.facebook {
    width                   : 70px !important;
    margin-right            : 0;
    float                   : right;
}

iframe.twitter-share-button.twitter-count-vertical {
    width                   : 80px!important;
}

/* ------------------------------------------------------------------------- */
/*
 *  .sitemap
 */
/* ------------------------------------------------------------------------- */
.sitemap {
    margin                      : 0.5em 1em;
}

.sitemap-element {
    display                     : inline;
    white-space                 : nowrap;
}

/* ------------------------------------------------------------------------- */
/*
 *  .calendar
 */
/* ------------------------------------------------------------------------- */
table.calendar {
    float                   : left;
    width                   : 300px;
    text-align              : center;
}

table.calendar tbody {
    color                   : #a0a0a0;
}

.sunday {
    color                   : #c00000;
}

.saturday {
    color                   : #0000a0;
}
/* ------------------------------------------------------------------------- */
/*
 *  .ads
 */
/* ------------------------------------------------------------------------- */
.header-ads-mobile, .header-ads-title-mobile {
    display                 : none;
}

.component-ads, .article-ads {
    width                   : 300px;
    height                  : 251px;
    margin                  : 0.5em 0;
    padding                 : 0;
    border                  : 0;
    position                : relative;
    overflow                : hidden;
}

.article-ads {
    margin                  : 1em;
    padding-bottom          : 1em;
    border-bottom           : solid 1px #dcdcdc;
}

ul.categories {
    list-style              : none;
    margin                  : 0;
    padding                 : 0;
    border                  : 0;
    position                : relative;
    overflow                : hidden;
}

ul.categories li {
    float                   : left;
    margin                  : 0 0.5em;
    padding                 : 0;
    white-space             : normal;
}

/* ------------------------------------------------------------------------- */
/*
 *  スマートフォン対応
 */
/* ------------------------------------------------------------------------- */
@media screen and (max-width:780px) {
    body, table, input, textarea, address {
        line-height             : 1.4;
        color                   : #222222;
    }
    
    table {
        width                   : 99%;
    }
    
    table.calendar {
        clear                   : both;
    }
    
    .header {
        margin                  : 0;
        padding                 : 0;
    }
    
    .header-title {
        margin                  : 0 0 5px 0;
    }
    
    .header-title img.logo {
        margin                  : 0 5px 0 0;
    }
    
    .container {
        width                   : 100%;
        margin                  : 1.5em 0 0 0;
        border                  : 0;
        border-radius           : 0;
    }
    
    .contents-buffer {
        display                 : block;
        width                   : 100%;
        margin                  : 0;
        padding                 : 0;
        border                  : 0;
    }
    
    .contents {
        margin                  : 1em 0.5em;
        padding                 : 0;
        border                  : 0;
    }
    
    .sidebar {
        display                 : block;
        width                   : 100%;
        margin                  : 0;
        padding                 : 0;
        border                  : 0;
    }
    
    .sidebar .component {
        width                   : 97%;
        margin                  : 1em auto;
    }
    
    .sidebar .component-ads {
        width                   : 97%;
        margin                  : 1em auto;
        height                  : 250px;
    }
    
    .contents-summary {
        margin                  : 0;
    }
    
    .article {
        margin                  : 1em 0;
    }
    
    .article-category {
        padding-left            : 10px;
    }
    
    .article-display {
        margin                  : 5px 0;
    }
    
    .article-loading {
        margin                  : 1em 0;
    }
    
    .article-navigator {
        margin                  : 0;
    }
    
    .contents-navigator ul {
        padding                 : 0;
    }
    
    .contents-navigator ul li {
        margin                  : 0.5em 0 0 0;
        padding                 : 0.1em 0;
        width                   : 32%;
    }
    
    #contents-navigator-top {
        padding                 : 0;
    }
    
    #contents-navigator-top ul {
        text-align              : center;
    }
    
    #contents-navigator-bottom {
        display                 : none;
    }
    
    .header-title {
        margin-left             : 10px;
    }
    
    .article-display {
        font-size               : 10px;
    }
    
    .article-ads {
        margin                  : 1em 0;
    }
}