@charset "EUC-JP";

/* ----------------------------------------
 作成日:2015.03.01
 テンプレート名: beige-type1
 by lefty_haru (http://hidarikikiryu.jugem.jp)
---------------------------------------- */

/* ←ここから
読み終わりましたらこの部分は邪魔ですので削除してください。
文字、色、サイズなど改変はご自由におやりください。再配布は禁止です。
色・サイズなど変更しての再配布も禁止です。
JQuery、Java script、CSS 3は一部しか判りませんので質問いただいてもお答えしかねます。
特に難しい記述をしておりませんから、改変箇所は検索されれば回答は見つかると思います。
デフォルト状態（初期状態）の不具合がありましたらご連絡いただけますと対処いたします。
改変後の不具合のサポートはしませんのでご容赦ください。

facebookなどの各アイコンはフリー素材を加工したものと自分で製作したものがありますので当該テンプレート以外でお使いいただくのは禁止です。

通常のモニターでは厳密なキャリブレーションは無理ですが、
正しく色合いが映るように最低限のキャリブレーションはおやりになったほうが良いと思います。
キャリブレーションはモニター側とパソコン側両方行えます。
詳しくお知りになりたいのでしたら「パソコン　モニター　キャリブレーション」で検索すればヒットします。

パソコンはwindows7ならデスクトップ画面で右クリック。
グラフィックプロパティをクリックすれば調整パネルが出ます。
調整の方法は検索してください。

当方がモニターをキャリブレーションするのに使っているサイトです。
2つのサイトで両方正しく見えるようにモニター側を調整しています。

http://urawazapclife.blog119.fc2.com/blog-entry-351.html
http://www.takoland.com/entrance/monitor_setting.htm

Mac os X v10.8（Mountain Lion）以降および、Windows7（更新プログラム適用）以降の
OSに最適化してますので、それ以前のOSでのご利用は正しく表示されません。
透過や影はCSS3に対応していないIE10以前のブラウザでは表現されません（IE11では確認済み）。
Fire Fox、Google Chrome、Operaをお使いの方は最新のバージョンにしてください。
要所に変更時の注意点を記載してありますのでお読みください。

エントリー内最大画像横幅は628pxまで。

右サイドバーのフリースペースの編集は必ずリストタグを使ってください。
リストタグを使わないとスペースが均一に表示されません。
<ul>
<li></li>
<li></li>
</ul>
ここまで→ */

/* 初期化 ---------- */

body,h1,h2,h3,h4,p,div,img,ul,ol,li,dl,dd,dt,q,blockquote,table,th,td,form,input {
 margin: 0; padding: 0;
 }


/*
コンテンツ・背景をベージュから淡いクリームにする場合は、bodyのbackgroundを #f2f1e7 に変更。
#f2f1e7に替えた時は、レイアウトのfooterのbackgroundも #d8d5c5 に変更してください。
*/
body {
font-size: 16px; color: #333; font-style: normal; font-weight: normal; letter-spacing: normal;
font-family: "Arial","Lucida Grande","segoe UI",Verdana,"游ゴシック体","游ゴシック",YuGothic,"Yu Gothic","ヒラギノ角ゴ proN w3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif;
line-height: 100%;
background: #f2f1ec;
text-align: center;
}

h1, h2, h3 { 
font-weight: normal;
 }

img {
 border: 0;
 }

ul, ol {
list-style-type: none;
}



/* ----------------リンク */

/* 個別リンク以外全て */
a	{ 
color: #444; text-decoration: none;
 }
a:hover	{ 
color: #be2e2c; text-decoration: underline;
 }

/* h1 ブログタイトル */
#site_title a { 
color: #555;text-decoration: none;
 }
#site_title a:hover {
color: #be2e2c;text-decoration: none;
 }

/* カレンダー */
.calendar a { 
color:#be2e2c; text-decoration:none;
 }
.calendar a:hover { 
color:#be2e2c; text-decoration:underline;
 }

/* 記事内リンク */
.entry_body a { 
color: #be2e2c; text-decoration: none;
 }
.entry_body a:hover { 
color: #be2e2c; text-decoration: underline;
 }

/* 記事タイトル */
.entry h2 a { 
color: #585858; text-decoration: none;
 }
.entry h2 a:hover { 
color: #be2e2c; text-decoration: none;
 }

/* nav コメント・トラックバック */
.red a { 
color:#be2e2c; text-decoration: none;
 }
.red a:hover { 
color:#be2e2c; text-decoration: underline;
 }

/* ----------------- クリアー */

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

.clearfix {
 display: inline-block;
 }

/* IE7 */
*+html .clearfix {
 min-height: 1%;
 }

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */



/* ---------- レイアウト指定 ------------------------ */

/* -------------------- 2カラムレイアウト */

#wrapper { 
width: 100%;
min-width: 1040px;
margin: 0px auto;
 }


#header { 
width: 100%;
background: #fdfdfd;
 }

/*
右ナビとメインの間のborderは#mainと#navの長さがそろわなくてもfooterまで伸びるように
画像で表示してます。両サイドのborderの色を変更する場合は、変更色で巾：1px・高さ：10pxの
border画像を作ってアップロードしbackgroundのurlを書き換えてください。
*/
#contents {
width: 1040px;
margin: 0 auto;
background: url(http://img-cdn.jg.jugem.jp/d12/543560/20150212_1322527.png) 720px top repeat-y;
border-left: 1px solid #ccc; border-right: 1px solid #ccc;
 }

#main {
float: left;
width: 720px;
text-align: left;
padding: 20px 0px 0px;
}

#nav {
float: right;
width: 320px;
text-align: left;
padding: 30px 0px 0px;
}

#footer { 
width: 100%;
padding: 200px 0px 20px;
border-top: 1px solid #ccc;
background: #dedcd0;
}



/* -------------------- ヘッダー部 --------------- */

/* ログイン */
ul.management {
width: 1010px;
text-align: right;
margin: 0px auto;
padding: 5px 30px 0px 0px;
list-style: none;
 }

ul.management li{
float: right;
text-align: right;
font-size: 13px;
padding: 0px 0px 0px 10px;
}

ul.management li a {
 display: block;
 }
ul.management li a:hover {
 opacity: 0.8;
 }


/* ブログタイトル */
/* 
説明位置を真ん中にするには、text-align:center;にしてpaddingの一番右を0pxにしてwidthを1040pxに変更。
右にずらす場合は、paddingの4番目の数値：10pxを変更。
加算した数字分width: 1030pxから引いてください。
h1の高さ調節はpaddingの1番目の数値：60pxを変えて下さい。
 */
h1#site_title {
width: 1030px;
text-align: left;
font-size: 28px;
text-shadow:1px 1px 1px #ccc;
margin: 0px auto;
padding: 60px 0px 10px 10px;
}

/* ブログ説明 */
/* 
説明位置を真ん中にするには、text-align:center;にしてpaddingの一番右を0pxにしてwidthを1040pxに変更。
右にずらす場合は、paddingの4番目の数値：10pxを変更。
加算した数字分width: 1030pxから引いてください。
 */
.description {
width: 1030px;
text-align: left;
font-size: 12px;
text-shadow:1px 1px 1px #cdcdcd;
margin: 0px auto;
padding: 0px 0px 30px 10px;
}

/* header　カレンダー */

.calendar {
text-align: center;
font-size: 14px; letter-spacing: 0.1em;
padding: 14px 0px;
border-top: 1px solid #ccc; border-bottom: 1px solid #ccc;
}

/* カレンダーを見出しと同じ左詰めで表示する場合はこちらを使ってください。 */
/* ====================←使うときはこれを削除
.calendar {
width: 1000px;
text-align:left;
font-size: 14px; letter-spacing: 0.1em;
margin: 0px auto;
padding: 14px 0px 14px 40px;
border-top: 1px solid #ccc; border-bottom: 1px solid #ccc;
}
使うときはこれを削除→ ===================== */



/* ------------------------------ #main　エントリー --------------- */

/* エントリー単体表示時上部プレビューネクストリンク */

.entry_navi {
text-align: center;
font-size: 13px;
margin: 10px 0px;
}


/* エントリー本体 */
.entry {
width: 720px;
margin: 10px 0px 40px;
}

/* line-heightはエントリータイトルが2行になった際、文字が重ならないギリで設定してます */
h2 {
font-size: 27px; line-height: 110%;
text-shadow:1px 1px 1px #d2d2d2;
margin: 0px 40px 0px 0px;
padding: 20px 0px 5px 40px;
}

.entry_date {
color: #be2e2c; font-size: 13px;
padding: 0px 0px 10px 40px;
}


/* エントリー本文 */
.entry_body {
font-size: 14px; line-height: 170%; letter-spacing: 0.1em;
padding: 15px 40px 0px;
}

/* エントリー続き */
.entry_more {
font-size: 14px; line-height: 170%; letter-spacing: 0.1em;
padding: 15px 40px 0px;
}

/* 続きを読む */
.entry_sequel_link {
text-align: right;
text-shadow:1px 1px 1px #cfcfcf;
padding: 0px 5px 0px 0px;
}

.entry_sequel_link a { 
color:#444;
text-decoration:none;
}
.entry_sequel_link a:hover {
color:#be2e2c;
text-decoration:underline;
}

/* エントリー本文・続き内最大画像横幅は628pxまで */
.entry_body img, .entry_more img {
padding: 5px;
background: #fefefe;
border: 1px solid #aaa;
 }

/*
引用：1行未満短文はq、複数行はblockquote使用
記事の投稿リッチエディターでの引用（”のアイコンボタン）を使うとblokquoteのみになります。
qを使う場合は、HTMLモードに切り替え<q></q>タグを使ってください。
<q>タグを打ち込むと自動生成で<q></q>が作られるので、<q>ここに</q>引用短文を入れてください。
アップロード表示では自動で引用の「」が生成されます。
*/
q {
font-size: 14px; line-height: 170%;
background: #fff;
}

blockquote {
font-size: 14px; line-height: 170%;
margin: 10px 0px;
padding: 9px;
border: 1px solid #aaa;
background: #fff;
}

/* ソーシャルボタン */
.social-wrap {
margin: 30px 0px 0px;
padding: 10px 0px;
background: #ece9d8;
border-top: 1px solid #ccc; border-bottom: 1px solid #ccc;
}

.social-wrap ul {
padding: 0px 0px 0px 10px;
list-style: none;
}
.social-wrap li {
display: inline;
}

.entry_state {
font-size: 13px;
text-align: right;
padding: 10px 10px;
border-bottom: 1px solid #ccc;
}


/* 単体エントリー表示時　コメント部 */

.comment-send {
font-size: 14px; line-height: 170%;
padding: 15px 40px 0px;
}

.comment {
margin: 20px 0px 30px;
padding: 10px 0px;	
}

.comment_title {
font-size: 20px;
margin: 20px 0px 0px;
padding: 0px 0px 0px 40px;
}

.comment_author {
font-size: 13px;
text-align: right;
margin: 10px 0px 25px;
padding: 2px 10px 0px 0px;
border-top: 1px dashed #999;
}

	
.comment-send .fill-in { 
width: 250px;
padding: 2px 0px;
 }
.comment-send textarea { 
width: 500px;
 }

.transmit {
letter-spacing: 0.1em;
padding: 2px 4px;
 }

/* 単体エントリー表示時　トラックバック部 */

.trackback {
margin: 20px 0px 30px;
padding: 10px 0px;	
}

.trackback_title {
font-size: 20px;
margin: 20px 0px 0px;
padding: 0px 0px 0px 40px;
}

.trackback_url {
font-size: 14px;
padding: 10px 0px 0px 40px;
}

.trackback_author {
font-size: 13px;
text-align: right;
margin: 10px 0px 25px;
padding: 2px 0px 0px;
border-top: 1px dashed #999;
}

/* #main下部プレビューネクストナビ */
.prenext-navi {
text-align: center;
font-size: 14px; color: #be2e2c;
margin: 0px 0px 30px;
}

.prenext-navi span { 
margin: 0px 2px;
padding: 0px 5px;
border: 1px solid #ccc;
background: #fdfdfd;
 }

.prenext-navi span.pager_next, .prenext-navi span.pager_prev { 
margin: 0px;
padding: 0px;
border: none;
background: none;
 }

.prenext-navi span.pager_first { 
margin: 0px;
padding: 0px 5px 0px 7px;
border: none;
background: none;
 }

.prenext-navi span.pager_last { 
margin: 0px;
padding: 0px 7px 0px 5px;
border: none;
background: none;
 }

.prenext-navi a { 
color: #444; text-decoration: none;
 }
.prenext-navi a:hover { 
color: #be2e2c; text-decoration: underline;
 }

/* ---------- #main プロフィール詳細ページ用 */

.profile_title {
font-size: 20px;
margin: 0px 0px 20px;
padding: 10px 0px 10px 40px;
border-bottom: 1px solid #ccc;
}

.profile_name {
font-size: 14px;
margin: 0px 0px 20px;
padding: 0px 0px 0px 40px;
}

.entry-bottom { 
text-align: right;
font-size: 14px;
padding: 10px 40px 30px 0px;
border-bottom: 1px solid #ccc;
 }



/* ---------------------------------------- #nav 右サイド -------------------- */

.side-unit {
margin: 0px 30px 30px;
}

/* タイトル下に線を入れる場合は　border-bottom: 1px solid #ccc;　を追加 */
h3 {
font-size: 20px; color: #444;
padding: 20px 0px 14px;
}

.side-contents {
font-size: 12px;
}

.side-contents ul {
list-style: none;
}

.side-contents li {
line-height: 1.3em;
padding: 14px 0px 14px 5px;
border-bottom: 1px solid #ccc;
}

/* 検索・フォーム */
.reference {
position: relative;
margin: 0px 30px 30px;
}

.refer-form {
position: relative;
}

#character-input {
width: 254px; height: 28px;
font-size: 13px; color: #333;
padding: 1px 2px 1px;
background: #fbfaf6;
border: 1px solid #aaa;
}

#magnifier {
position: absolute;
top: 2px;
left: 228px;
}


/* -------------- user */
.profile { 
font-size: 13px;
margin: 20px 30px 30px;
padding: 14px 0px 14px 5px;
border-bottom: 1px solid #ccc;
}

.profile dt { 
line-height: 1.3em;
padding: 5px 0px 5px;
}

.profile dd { 
line-height: 1.3em;
padding: 5px 0px 5px;
}

.profile dd img { 
padding: 3px;
border: 1px solid #aaa;
background: #fff;
 }

/* -------- for mobile QR code */
dl.profile dd.mobile { 
line-height: 1.3em;
padding: 15px 0px 5px;
}

/* スポンサーリンク */
.ad {
margin: 0px 30px;
padding: 0px 0px 30px;
}

.ad-contents {
font-size: 12px;
padding: 10px 0px 0px 5px;
}



/* ---------------------------------------- #footer フッター ---------------- */

/* ジュゲムバナー */
.banner { 
text-align: right;
font-size: 13px;
padding: 0px 80px 3px 0px;
}

/* 著作権 */
.copyright {
text-align: right;
font-size: 13px;
padding: 0px 80px 0px 0px;
}

.copyright a {
text-decoration: none;
}
.copyright a:hover {
text-decoration: underline;
}


/* SNS Icon */

/*
出現位置はbottom:15px;righ:20px;の数値を好みの数値に変更してください。
ワイド画面だと問題ありませんが、従来の4：3画面などだと左右の背景が無くなり、コンテンツ内に
乗っかりますので、乗っかったときでも邪魔にならないよう、なるべく右より、下よりにしてください。
*/

ul#sns-unit {
width: 48px; text-align: center;
position: fixed;
list-style: none;
bottom: 15px;
right: 20px;
 }

ul#sns-unit li {
padding: 0px 0px 5px;
}

ul#sns-unit li a {
 display: block;
 }
ul#sns-unit li a:hover {
 opacity: 0.8;
 }

/* JQUERY　ページトップ */
/* SNS Iconを削除してページトップ単体で使うときはこちらを使って下さい。 */

/* ←使うときはこれを削除
#page-top {
 position: fixed;
 bottom: 30px;
 right: 30px;
 }

#page-top a {
 display: block;
 }
#page-top a:hover {
 opacity: 0.8;
 }
使うときはこれを削除→ */