/*
　　　　 基本カラー: beige
　 基本リンクカラー: darkslateblue
 基本 a:hoverカラー: palevioletred
基本 li:hoverカラー: #feffe9
*/

* { margin: 0; padding: 0; }
html { font-family: 'ヒラギノ丸ゴ Pro W4', 'メイリオ', Arial, Verdana, Osaka, MS P Gothic, sans-serif !important;}

/*---- [ 基 本レイアウト] ----*/
body { border: 0; width: 100%; color: #555; font-size: 90%; background-color: snow;}
#page { width: 100%; margin: auto; text-align:left;}
#header { height: 50px; background: beige; border-bottom: solid 1px #aaa;}
#body { padding: 10px; margin-top: 50px; }
#main-container { float:left; width: 100%; /* must */}
#main { margin-right: 420px;}
#sub { float: left; margin-left: -410px; width: 200px; padding-right: 10px;}
#extra { float: left; width: 200px; margin-left: -200px;}
#footer { clear: both; border-top: 1px solid #aaa; background-color: beige; text-align: center;}
#footer p { padding: 10px;}

/*---- [汎用タグ] ----*/
a { color: darkslateblue; text-decoration: none;}
a:hover { color: palevioletred; text-decoration: underline;}
img { border: none;}
ins { text-decoration: none;}
strong { color: #876769; }

/*---- [ヘッダータイトル] ----*/
#header h1 { text-align: right; padding-right: 50px; }

/*------------------[ 汎用クラス ]--------------------------*/
.hidden, a.jump { display: none !important; }
p.jump { padding-right: 1em; text-align: right !important; font-size: 9px !important;}
img.smiley{ width: 16px; height: 16px; vertical-align: middle; cursor:pointer; margin:0 3px 0 0;}
img.home-icon { width: 12px; height: 12px; vertical-align: middle; }
.center, .alert { width: 99%; text-align: center; margin: 30px auto;}
.alert { color: palevioletred; }
.new-entry { width: 17px; height: 12px;}
hr.clear { clear: both; padding-bottom: 1px;  margin-bottom: -1px; width: 100%;  height: 1px;  border: none; visibility: hidden; }
.separator { clear: both; }
.micro-banner { width: 80px; height: 15px; }
img.smiley{ width: 16px; height: 16px; vertical-align: middle; cursor: pointer; margin: 0 3px 0 0;}
img.home-icon { width: 12px; height: 12px; vertical-align: middle; }
img.extlink-icon { width: 12px; height: 12px; vertical-align: top; padding-left: 2px;}
#PageTop {
 position: fixed; bottom: -4px; right: 20px; display: block; font-size: 9px; padding: 2px 3px 4px 3px;
 border: solid 1px #766f8b; border-bottom-width: 0; background: #feffe9; z-index: 1000;
 -moz-border-radius: 4px; -webkit-border-radius: 4px;
}
.attached {clear: both; margin-top: 2em; }
.attached-icon { vertical-align: middle; padding-left: 2px;}
.stars img { width: 16px; height: 16px;}
.draft { border: dashed 1pt palevioletred; height: 100%;} /*--[ ドラフト投稿表示 ]--*/
.draft-before { content: "未公開の記事です";  color: palevioletred;  font-size: 11px;  padding: .3em 1em;}
.google-it { font: 600 13px 'Times New Roman',serif; color: #2020ff; cursor: pointer;}
.techrat-entry {
  padding-left: 20px; font-size: Arial;  clear: both;
  background: url(Images/techrat-entry.png) no-repeat 0 1px; margin-top: 2em;
}
.expand-icon {             /* サイドボックス展開用ボタン */
  display: block; width: 13px; height: 13px; font-size: 1px; margin: 3px 7px 0 0; background: url(Images/toggle.png) 0px 0px no-repeat; 
  float: right; cursor: pointer; z-index: 1000;
}

/*------------------------[ リンクバー用 ]-------------*/
#linkbar {position: absolute; top: 50px; left: 0; padding-left: 6px; z-index: 1; overflow: hidden; font-size: 80%; width: 85%; line-height: 1.6;}
#linkbar ul {padding-left: 0.5em; float: left; width: 100%;}
#linkbar ul li { float: left; list-style: none; margin-left: 6px; background: beige; border: solid 1px #aaa; border-top-width: 0;
 /*-moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px;
 -webkit-border-bottom-right-radius: 3px; -webkit-border-bottom-left-radius: 3px;*/
}
#linkbar ul li:hover { background-color: #feffe9;}
#linkbar ul li a {padding: 3px 6px; font-weight: bold; color: #668;}
#linkbar ul a:hover { text-decoration: none; color: navy;}
#linkbar li img { vertical-align: bottom; }

/* --------------------[ ページナビのスタイル ]----------------------*/
.nav { margin: 20px auto 40px auto; text-align: center;}
.nav p { margin-top: 1em;}
 /* Pagination */
div.weblog-pageNav { padding: 3px; margin: 15px 3px; text-align:center; font-family: Georgia, 'メイリオ', Arial, Verdana, Osaka, MS P Gothic, sans-serif;}
div.weblog-pageNav a { padding: 2px 3px; margin: 2px; border: 1px solid #dedede; border-color: #fff #dedede #dedede #fff; color: #000099;}
div.weblog-pageNav a:hover{ border: 1px solid #000099; color: #000;}
div.weblog-pageNav a:active { border: 1px solid #000099; color: #f00;}
div.weblog-pageNav span.current { padding: 2px 3px; margin: 2px; border: 1px solid #475b7d; font-weight: bold; background-color: #475b7d; color: #fff;}

/* --------------------[ 記事ボックススタイル ]----------------------*/
.article { margin: 30px auto 30px auto; padding: 0; font: 95% 'メイリオ'; color: #333; position: relative; clear: both;}
.article .article-title { position: absolute; left: 95px; top: 10px; text-align: left; z-index: 4; font: 600 16px 'メイリオ', Arial;}
.article .meta {  position: absolute; top: 0px; left: 1px; width: 78px; z-index: 10; border: solid 1px #888; font-size: 10px; text-align: center; background: beige; border-right-width: 0;
 /*-moz-border-radius-bottomleft: 6px; -moz-border-radius-topleft: 6px;
 -webkit-border-bottom-left-radius: 5px; -webkit-border-top-left-radius: 5px;*/
}
.article .meta .article-date { color: darkslateblue; text-align: center; font: 500 11px Arial, sans-serif;}
.article .meta .article-date em { font: 800 22px Tahoma; text-decoration: none; display: block;}
.article .meta .category, .article .meta .reaction { margin-top: 5px; margin-bottom: 5px;}
.article .meta .posted { font: 500 12px 'メイリオ', Arial; color: #777;}
.article .meta .icon * { vertical-align: bottom;}
.article-content { position: relative; clear: both; z-index: 2; padding: 60px 1em 1em 1em; margin-left: 80px; background-color: #fff; border: solid 1px #aaa; line-height: 1.7; }
.article-content p { margin: .8em 0; }
.article-content ol, .article-content ul { margin: 2em 2em 2em 4em; font-size: 94%; color: #284444; }
.article-content li { margin-bottom: 5px;  }
.article-content h3, .article-content h4 { text-align: center; margin: 1em auto; }
.article .reactions ul { position: relative; right: 8px; top: -1px; list-style: none; }
.article .reactions ul li { float: right; margin-right: 5px; background: beige; border: solid 1px #aaa; padding: 1px 6px; font-size: 93%;
 /*-moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px;
 -webkit-border-bottom-right-radius: 3px; -webkit-border-bottom-left-radius: 3px;*/
}
.article .reactions ul li a { color: #555;}
.article .reactions ul li a:hover { text-decoration: none; color: navy;}
.article .reactions ul li:hover { background: #feffe9; }
.article div.media-part { margin: auto; text-align: center; width: 177px; border: solid 1px #ddd;}
/*.article-content:after { content: ""; display: block; clear: both; }*/
.shown-alone { overflow: auto; } /* 単独記事表示モード時に付加 */
*:first-child+html .article-content {  height: 1%; } /* IE7 only */

/*--[ 「続」ボタン使用時の続きを読む ]--*/
.article div.readmore-div {  margin: 1em;}
.article span.readmore { cursor: pointer; color: navy; padding-left: 1em;}

/*--[ 記事内ページリンク用スタイル ]--*/
.article-pageNav { clear: both; font-size: 90%;  text-align: center; width: auto; height: 32px; margin: 2em auto;}
.article-pageNav span { background: url(Images/page-cell.png) repeat-x 0 0; border: solid 1px #696ea4; height: 18px; display: inline-block; padding: 2px 3px; font: 600 13px Verdana, Trebuchet MS, Arial;}
.article-pageNav span.page-stat { width: 60px; background: navy url(Images/page-stat.png) repeat-x 0 0; color: #fff;}
.article-pageNav a { text-decoration: none; border-bottom: none; }
.article-pageNav span.page-cur { color: #aaa; border-left-width: 0; }
.article-pageNav span.page-cell { color: navy; border-left-width: 0; }
.article-pageNav span.page-cell a { border-bottom: none; }
.article-pageNav span.page-next { color: navy; border-left-width: 0;}
.article-pageNav span.page-next a { border-bottom: none; }
.article .article-icon { width: 16px; height: 11px; }
.article-bottom { padding: 5px 0 0 85px;}
.tags-entry { padding-left: 25px; font: 500 12px/17px arial, 'メイリオ', sans-serif; color: #777; background: url(Images/techrat-entry.png) no-repeat 0 0px; margin-top: 1em;}
/*--[ ヘッドライン用 続きを読む ]--*/
.article-content .headline-readmore { margin: 1em; font-size: 90%; }

/*------------------[ Ajaxボタン ]--------------------------*/
.cute-button { width: 130px; float: right; margin: 1em auto 1em 0; padding-right: 4px; text-align: right;}
.cute-reply { margin: 1em auto 4em 4em; }
.cute-button button { background: beige; cursor: pointer; border: solid 1px #aaa; font: 500 13px Trebuchet MS, 'ヒラギノ丸ゴ Pro W4', 'メイリオ', Arial, sans-serif; padding: 0 2px 2px 2px; overflow: visible; width: auto; height: 24px; color: #555; display: block;
 /*-moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px;
 -webkit-border-bottom-right-radius: 3px; -webkit-border-bottom-left-radius: 3px;*/
}
.cute-button button:hover { background-color: #feffe9;}
.cute-button button[disabled] { color: #aaa;}

/*---[ 引用フォーマット ]---*/
dl.quote { width: 86%; background: #fffafa; border: solid 1px #aaa; margin: 2em auto; padding: 0;}
dl.quote dt{ padding: 5px 0 0px 10px;}
dl.quote dt cite { font-weight: 600; color: #556b2f; }
blockquote { font: 103%/1.7 "メイリオ", "Trebuchet MS", sans-serif; color: #484a47; margin: 0px auto; padding : 15px 15px 15px 48px; background: url(Images/quote.png) -5px -5px no-repeat;}
blockquote p { padding: 0; margin: 0 !important; }
dl.quote dt.cite { text-align: right; padding-right: 1em; font-size: 90%; }
dl.quote dt.cite * { padding-right: 1em;}

/*---[ 整形タグ ]---*/
pre { width: 86%; margin: 1.5em auto; overflow: auto; border-left: 4px solid #eeeaea; background: snow; padding: 1em; font: 500 14px/1.2 courier new,Verdana, monospace;}
pre strong { color: crimson; }
/*---------[ サイドバー ]---------*/
h3.sidebar-cap { padding-top: 3px; text-align: center; font-size: 100%; background: beige; margin: 20px 0 0 60px; border: solid 1px #aaa; border-bottom-width: 0;
 /*-moz-border-radius-topright: 4px; -moz-border-radius-topleft: 4px;
 -webkit-border-top-right-radius: 3px; -webkit-border-top-left-radius: 3px;*/
}
.sidebar-body { border: solid 1px #aaa; border-top: none;}
.sidebar-body li a:hover { text-decoration: none; color: navy;}
.sidebar-body li:hover { background: #feffe9; }
#pages li, #comments li, #recently li, #trackbacks li, #categories li, #archives li, #others li { list-style: none; }
#pages, #comments, #recently, #trackbacks, #categories, #archives, #others { margin: 15px 0 15px 0; }
#pages ul, #others ul { text-align: center; }

/* --- [ サイドバー: ページ ] --- */
ul.sidebar-pages li { line-height: 2; border-top: solid 1px #ccd; }

/* --- [ サイドバー: コメント ] --- */
ul.sidebar-comments li { border-top: solid 1px #ccd; line-height: 1.6;  padding-left: 10px;}
ul.sidebar-comments ul li.nest1 { border-top: dotted 1px #ccd; margin-left: 30px;}
ul.sidebar-comments ul li.nest2 { border-top: dotted 1px #ccd; margin-left: 50px;}
ul.sidebar-comments ul li.show-all-comments a { color: navy; padding-bottom: 5px; font-size: x-small;}
ul.sidebar-comments ul li.show-all-comments a:before { content: " ↓ ";}

/* --- [ サイドバー: エントリー ] --- */
ul.sidebar-recently li { font-size: 87%; border-top: solid 1px #ccd; line-height: 2.2; padding : 0 5px 0 10px;}

/* --- [ サイドバー: カテゴリー ] --- */
ul.sidebar-categories * a { font-size: 90%;}
ul.sidebar-categories li.main-category { border-top: solid 1px #ccd; line-height: 2; padding : 0 0 0 10px;}
ul.sidebar-categories li.sub-category { border-top: dotted 1px #ccd; padding : 0 0 2px 35px;}
ul.sidebar-categories span { /* 記事数がゼロのとき */ font-size: 90%; color: #aaa;}

/* --- [ サイドバー: トラックバック ] --- */
ul.sidebar-trackbacks li { border-top: solid 1px #ccd; line-height: 1.8; padding-left: 10px;}
ul.sidebar-trackbacks li ul li { border-top: dotted 1px #ccd; line-height: 1.6; margin-left: 25px;}
ul.sidebar-trackbacks li.no-ping, ul.sidebar-tags li.no-tag { color: #bbb; padding-left: 20px;}

/* --- [ サイドバー: タグ ] --- */
ul.sidebar-tags { border-top: solid 1px #aaa; }
ul.sidebar-tags li {  display: inline; padding: 5px;}
ul.sidebar-tags .tags-end { text-align: right; font-size: 12px; display: block; padding-right: 1em;}

/* --- [ サイドバー: アーカイブ ] --- */
ul.sidebar-archives li { border-top: solid 1px #ccd; padding-right: 2.5em; text-align: right; line-height: 1.6;}

/* --- [ サイドバー: その他 ] --- */
ul.sidebar-others { border-top: solid 1px #aaa;  padding: 4px 0;}
ul.sidebar-others li { padding-top: 3px; }

/* ------------------------[ コメント表示用 ]--------------------*/
.comments-div, .trackbacks-div { font-size: 97%; width: 80%; margin: 0 auto; padding-left: 80px;}
.comments-div .comments-header, .trackbacks-header { padding: 2em; text-align: center; font-size: 105%; color: navy;}
.comments-div a { text-decoration: underline;}
.comments-div .comment-entry p{ color: #555; text-align: left;}
.comments-div a.No{ font: 800 150% georgia, arial, sans-serif; text-decoration: none; padding-right: 10px;}
.comments-div a.No:before { content: "#"; }
.comments-div .comment-entry {  margin:0 auto auto 2em;}
.comments-div .non-disclosure {  border: 1px dotted #aaa;}
.comments-div .non-disclosure:before {  content: "[非公開]"; font-size: 80%; color: palevioletred;}
.comments-div .comment-index { padding-bottom: 0.5em; }
.comments-div .comment-index-owner { margin: -1em auto 0.5em -1em;}
.comments-div .comment-entry-owner { padding-left: 6em;}
.comments-div .comment-body{ margin: 0.5em 0 0 1em;  padding: 0 6em 0 1em; line-height: 1.5;}
.comment-quote { color: #7e7a94; border-left: 2px #ddd solid; padding: 10px;}
.comment-cntrl { padding-left: 0.5em;}
.comment-cntrl img { vertical-align: middle;}
hr.comment-separator { border-width: 0; visibility: hidden; margin: 1em 0 0.5em 4em;}
.comment-closed { margin: 2em; padding: 3px 0 0 280px; height: 2em; font-size: 90%; color: #777; background: url(Images/closed.png) no-repeat 250px top;}
.comment-nondisclosure {  padding-left: 1.3em; margin-top: .5em;}

/* ------------------------[ コメントフォーム用 ]---------------------*/
.comment-form { clear: both; padding: 1em 2em 1em 60px; width: 90%; margin: auto;}
.comment-form input, #c_color { font-family: Trebuchet MS, Arial, Meiryo, sans-serif; vertical-align: middle; line-height: 1.0;}
.comment-form .time-now, form.comment-form img { vertical-align: middle; }
.comment-intro, .trackback-alert { margin: 1em; padding: 0 0.5em; color: #4c4c5c; border-left: solid 6px beige; font-size: 87%;}
.comment-intro input.txt { width: 310px; }
.comment-inputarea { border-left: solid 6px beige; margin: 1em 0 1em 1em; padding-left: 0.5em;}
.comment-inputarea p { margin: 5px 0;}
.comment-form .info { font-size: 80%; color: #777; padding: 5px 2em 5px 22px; background: url(Images/owner-comment.png) no-repeat left 3px;}
.comment-textarea { width: 98%; border: solid 1px #aaa; background: #f7f7f7;}
.comment-preview-div { padding-left: 1em; border-left: solid 4px #696997;}
#comment-previewarea { margin: 2em 0 0 0; width: auto;}
#comment-previewarea .comment-confirm { background: url(Images/arrow.png) 3.5em 4px no-repeat; margin: 1em; padding-left: 4em; color: #564240;}
.comment-form .comment-submit { width: 100%; margin: 1em auto; text-align: center;}
#Hiraptcha { color: rgb(160, 160, 160); }
#Hiraptcha + img { border: solid 1px #aaa;}

/* ------------------------[ トラックバック導入 ]---------------------*/
form.trackback-preface { text-align: center; width: 70%; margin: auto; padding: .5em;}
form.trackback-preface legend { color: #ac1822; font-size: 90%; margin-left: 1.5em; padding: 0 5px;}
form.trackback-preface p.trackback-alert { padding: 0.3em 0 .5em 2em;}
form.trackback-preface p { margin: .7em auto; padding: .5em; font-size: 90%; color: #666; text-align: left; width: 80%;}
form.trackback-preface p input.txt { width: 90%;}

/*----------------------------[ トラックバック表示 ]-------------*/
dl.trackback{ text-align: left; width: 75%; margin: auto; padding-left: 1em; border-bottom: dotted 2px #ddd;}
dl.trackback dt { font: 500 15px georgia; color: #2A3164; padding-left: .5em;}
dl.trackback dd { margin-top: .5em;}
dl.trackback dd:first-letter { font-size: 16px; color: palevioletred;}
dd.trackback-footer{ font-size: 11px; color: #00004d; text-align: right;}

/*------------------------[ 記事のリスト表示 ]-------------*/
div.show-list { width: 100%; margin: 2em auto 5em auto;}
div.show-list ul {  width: 73%; margin: auto; list-style: url(Images/arrow.png) square; padding-left: 3em;}
div.show-list ul li { padding-bottom: .5em; }

/*---------------------[ 詳細検索用 ]-------------*/
.search-form {  background-color: #fafcfb;  border: 1px solid #aaa;  width: 450px;  margin: 1em auto auto auto;  padding: 1em;}
.search-intro  { margin: 3em auto 2em; font-size: 15px; letter-spacing: 2px; text-align: center; font-size: 150%;}
.search-alert { margin: 3em auto 2em; font-size: 15px; }
.search-alert { color: palevioletred;}
.search-form ul { list-style: square; margin-left:30px;}
dl.search-results {  width: 70%;  margin: 1em auto; padding: 1em;}
dl.search-result dd {  text-decoration: none;  color: #555;  padding: 0.25em 0 0 2.5em;}
.search-result dt {  margin-top: 0.7em;}
dt.search-result-hit {  background: none;  margin-top: 1.5em;}
dt.search-result-hit span.cat{  font-weight: 500;  padding-left: 2em;}
.search-result-index {  font: 700 16px Georgia, arial, sans-serif; color: #555;}
.search-result-comment{  border-left: solid 2pt #ddd;  margin-left: 2em; padding-left:0.5em;}
.search-result-comment dt { padding-left: 0.3em;  font: 600 14px MS P Gothic, sans-serif;  background: none;  color: #111;}

/*---------------------------[ カテゴリー一覧表示用 ]----------------------*/
.category-list {  width: 350px; margin: 60px auto 30px auto;}
.category-list ul { list-style: none; margin-left: 6em; padding-left: 15px;}
.category-list ul li.main-category { background: url(Images/arrow.png) 0px 4px no-repeat; padding : 0px 0px 5px 10px;}
.category-list ul li.main-category span,
.category-list ul li.sub-category span { color:#aaa; font-size: 90%;}
.category-list ul li.sub-category { background: url(Images/arrow.png) 45px 4px no-repeat; padding : 0px 0px 2px 55px;}
.category-nav, .tags-nav { margin-top: 1.5em;}

/*---------------------------[ アーカイブ / タグ 一覧表示用 ]----------------------*/
div.tags-list { width: 200px; margin: 60px auto 30px auto;}
div.archives-list { width: 250px; margin: 60px auto 30px auto;}
div.archives-list ul { list-style: none;  padding-left: 20px;}
div.archives-list ul li ul, div.tags-list ul { list-style: none;}
div.archives-list ul li ul li,
div.tags-list ul li{ line-height: 1.6; padding-left: 45px; background: url(Images/folder.png) no-repeat 15px 0;}
div.archives-list h3, div.tags-list h3 { margin: 2em auto; color: navy; text-align: center;}
div.archives-list ul h4 { margin: 10px auto 5px 0px; text-align: left; color: #2d3073; font: 800 14pt Georgia;}

/*--------------[ 外部動画 ]-------------*/
.video-link { width: 425px; margin: 2em auto; z-index: 1;}

/*--------------[ 作成ページボックス ]-------------*/
.page-box { border: solid 1px #aaa; margin: 1em 2em; padding: 2em;}

/*---------[ カレンダー ]---------*/
#calendar { position: absolute; top: 3px; left: 15px; width: 95%;}
#calendar div.calendar-body ol { list-style: none; }
#calendar ol.wheader, #calendar ol.weekday li.blank { display: none;}
#calendar div.calendar-top { float: left; margin-top: 3px; }
#calendar div.calendar-top * { display: inline; }
#calendar div.calendar-top div.prev-month,
#calendar div.calendar-top div.next-month { width: 20px; }
#calendar div.calendar-cap { font: 800 16px Georgia; color: #8B859F;}
#calendar div.calendar-body ol.wheader li,
#calendar div.calendar-body ol.weekday li { float: left; width: 18px; height: 18px; padding: 1px !important; text-align: center;
 border: solid 1px beige; line-height: 18px; margin-left: 1px !important; font: 14px Georgia;
}
#calendar li.Sun { color: red;}
#calendar li.Sat { color : blue;}
#calendar li.Holiday { color : darkred;}
#calendar li.daySubmit { border-color: #777 !important;}
#calendar li.Today { color: rgb(5,170,50); text-decoration: underline; cursor: help;}

/*------------------------[ 写真・ドロップシャドウ設定 ]-----------------*/
.resized { cursor: pointer; cursor: url(Images/zoomin.cur), pointer; *cursor: url(theme/basic/Images/zoomin.cur);}
div.photo { padding: 15px; margin: 15px;}
div.photo div.shadow { background: url(Images/shadow.gif); float: left;}
div.photo div.shadow img, div.photo div.noshadow img { display: block; padding: 8px; margin: 0; border: 1px solid #ccc; border-color: #ddd #ccc #bbb #ccc; background-color: #fff; position: relative; left: -6px; top: -6px; overflow: hidden;}
html>body div.photo div.shadow { background: transparent url(Images/shadow.png) no-repeat right bottom; margin: 0;}
div.photo div.shadow:before { content: " "; background: transparent url(Images/shadow.png) no-repeat right top; display: block; width: 6px; height: 6px; margin: -6px 0 0 auto;}
div.photo div.shadow:after { content: " "; background: url(Images/shadow.png) no-repeat left bottom; display: block; margin: -6px 0 0 -6px; width: 6px; height: 6px;}
div.photo-caption { font-size: 13px; color: navy;}
div.photo div.photo-caption { padding: 0 2px 0 5px;}
*:first-child+html div.photo div.shadow { margin-bottom: -12px; } /* just for IE7 */
div.photo div.shadow img.borderless, div.photo div.noshadow img.borderless { padding: 0; }

/* ポラロイド風バージョン: Polaroid-style */
div.polaroid { background: url(Images/shadow-frame.png) no-repeat 0 0; padding: 15px 0 0 15px; margin: 30px;}
div.polaroid:after { content: ""; display: block; clear: both; }
div.polaroid div.shadow { background: url(Images/shadow-frame.png) no-repeat 100% 100%; margin: -9px -6px -4px -9px; padding: 9px 0 0 9px; overflow: hidden; /* just for IE */}
div.polaroid:before, div.polaroid div.shadow:before { content: ""; background: #fff url(Images/shadow-frame.png) no-repeat right top; display: block; width: 15px; height: 15px; margin: -15px -6px 0 auto;}
div.polaroid div.shadow:before { margin-right: 0; }
div.polaroid div.shadow:after, div.polaroid:after { content: ""; background: #fff url(Images/shadow-frame.png) left bottom; display: block; width: 15px;  height: 15px; margin: -15px 0 0 -15px;}
div.polaroid div.photo-caption { margin-bottom: 20px;}

.al-left { float: left; display: inline; }
.al-right { float: right;}
.al-center { margin-left: auto !important; margin-right: auto !important;}
.photo-canvas div.photo-caption { margin: -10px 5px 30px 5px; }

/* ---------------------[ 画像ギャラリー表示設定 ]---------------------*/
.gallery { margin: 30px auto; position: relative; z-index: 1; width: 300px; /* (1*2+64+4*2)*4 = 296 <-- minimal width   */}
.gallery ul { position: absolute; top: 0; left: 0; list-style: none;}
.gallery ul li { display: inline; float: left; padding: 4px;}
.gallery ul li span{ display: none; }
.gallery ul li a img { width: 64px; height: 64px; padding: 0; border: 0; background: #000;}
.gallery ul li a { float: left; display: block; width: 64px; height: 64px; /* Image's width */ border: 1px solid #333; /* 画像の枠幅 */}
.gallery ul li a:hover { position: relative;}
.gallery ul li a:hover img { position: absolute; left: -20px; top: -10px; width: 100px; border: 1px solid #aaa; padding: 5px; background: #fff; display: block;}
.gallery ul li a:hover span { /* ToolTip */
 position: absolute; left: -20px; top: -30px; /* top is img's top + height */
 width: 100px; height: 20px; font: 700 14px Trebuchet MS, Tahoma, Verdana; padding: 5px; text-align: center; background: #fff;
 border: solid 1px #aaa; border-bottom-width: 0; text-decoration: none; display: block;
}

table.page-nav-main,
table.page-nav-sub { border-collapse: collapse; letter-spacing: 1px; font:600 13px/21px arial; width: auto; height: 21px; margin: 40px auto 20px auto; color: navy; border-top: 1px solid navy; border-bottom: 1px solid navy;}
table.page-nav-sub { margin: 1em auto 2em auto; }
table.page-nav-main a{ text-decoration: none; }
table.page-nav-main tr td { padding: 0; }
table.page-nav-main td.link { width: 20px; text-align:center;}
table.page-nav-main td.current { width: 20px; text-align:center; background: #669; font-weight: 800; color: #fff;}
table.page-nav-main td.avant { width: 0;}
table.page-nav-main td.apres { width: 0;}
table.page-nav-main td.centre { line-height: 20px; height: 20px;}
.cooliris-link { text-align: center; }

/*------------------------[ テーマ切り替えセレクター用 ]-------------*/
#theme-selector {
  position: absolute; top: 50px; right: 50px; width: 100px; color: navy; cursor: crosshair; border: solid 1px #aaa; border-top-width: 0;
  text-align: center; font: 500 13px/20px Century Gothic, Arial, sans-serif; z-index: 1000; background: beige;
}
#theme-selector ul {  display: none; background: #fff;  border-top: 1px solid #ccc; list-style: none;}
#theme-selector ul li { margin-left: 0; }
#theme-selector ul li.current { border-top: 1px solid #ccc; background: beige; }
#theme-selector ul li a { display: block; color: navy; background: #fff; text-align: center; text-decoration: none; border-top: 1px solid #ccc; width: auto; height: 20px;}
#theme-selector:hover ul, #theme-selector.over ul { display: block; }
#theme-selector ul li a:hover{ background: #feffe9;}

/*------------------------[ ペイン切り替え ]-------------*/
#toggle { position: absolute; top: 50px; right: 160px; width: 60px; text-align: center;  font: 500 13px/20px Century Gothic, Arial, sans-serif; z-index: 1000; background: beige; color: navy; cursor: pointer; border: solid 1px #aaa; border-top-width: 0;}

/*------------------------[ ページ生成時間 ]-------------*/
#rendering-time { text-align: center; font: 12px Georgia;}

/* ---------------------[ アマゾンアソシエイト表示設定 ]---------------------*/
.amazon-box { border: dotted 1px #aaa; margin: 2em 3em; width: auto; max-width: 540px;}
.amazon-box p.entry { margin: 10px; float: left;}
.amazon-box p.entry img { margin: 10px;}
.amazon-box p.title a, .amazon-box p.entry a, .amazon-box ul.amazon-info li a { border-width: 0;}
.amazon-box p.title { margin: 20px 0 -20px 0; font-weight: 600;}
.amazon-box ul.amazon-info { list-style: none; border: none;}
.amazon-box ul.amazon-info li { font-size: 80%; padding-left: 10px; background: none; line-height: 1.2;}
.amazon-box ul.amazon-info li span { color: #002233; font-weight: 600; }
.amazon-box ul.amazon-info li.review dl { border: solid 2px #ddd; width: 230px; background: ivory; position: relative; left: 30px; top: 3px; padding: 1em;}
.amazon-box li.review dl dd{ padding-left: 1em;}

/* ---------------------[ ソーシャルブックマーク設定 ]---------------------*/
.social-bookmark { min-width: 100px; position: absolute; top: 10px; right: 10px;}
.social-bookmark img { vertical-align: middle;}
div.sbm-pop { padding: 2px; font-size: 12px; width: 220px; background: ivory; border: solid 3px #cdd; z-index: 1000;}
div.sbm-pop ul { list-style: none; margin: 1em 0 1em 3em;}
div.sbm-pop .sbm-close { text-align: right;}
div.sbm-pop .sbm-intro, div.sbm-pop .sbm-info { padding: .5em 1em;}
.social-bookmark img.sbm-entry { cursor: pointer; width: 100px; height: 16px;}
.social-bookmark span.sbm-count { position: absolute; left: 81px; top: 4px; font: 600 12px Arial; color: #f4008a;}
.social-bookmark .sbm-hatena { color:red; background:pink; font: 600 8pt Arial; text-decoration: underline;}
.social-bookmark .sbm-hatena:after, .social-bookmark .sbm-livedoor:after, .social-bookmark .sbm-twitter:after,
.social-bookmark .sbm-buzzurl:after { content: " users";}
.social-bookmark .sbm-twitter, .social-bookmark .sbm-facebook { color: navy; background: #eefcfc; font: 800 8pt Trebuchet MS, Arial; }
.social-bookmark .sbm-delicious { color:#fff; background: blue; font: 800 8pt Trebuchet MS, Arial; }
.social-bookmark .sbm-yahoo { font-weight: 800; color: palevioletred;}
.social-bookmark .sbm-livedoor { color:#cc00ff; background:#eeddff; font: 500 8pt Arial; }
.social-bookmark .sbm-buzzurl { color:navy; background:#ffeeff; font: 500 8pt Arial; }
