/* <system section="theme" selected="6435922169449318492"> */
@charset "UTF-8";@import url(https://fonts.googleapis.com/css?family=Titillium+Web);html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font:inherit;font-size:100%;vertical-align:baseline}html{line-height:1}ol,ul{list-style:none}table{border-collapse:collapse;border-spacing:0}caption,th,td{text-align:left;font-weight:normal;vertical-align:middle}q,blockquote{quotes:none}q:before,q:after,blockquote:before,blockquote:after{content:"";content:none}a img{border:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary{display:block}#container{width:960px;margin-top:1.3em;margin:1.3em auto 0}#container-inner{display:block;width:100%}a{color:#695d53;text-decoration:none}a:hover{color:#42aac7}h1{font-size:34px;padding:.3em 0}h2{font-size:28px;padding:.3em 0}h3{font-size:24px;padding:.3em 0}h4{font-size:21px;padding:.3em 0}h5{font-size:18px;padding:.3em 0}h6{font-size:15px;padding:.3em 0}p{margin-bottom:1em}ul,ol{margin-left:2em;padding:.3em 0}ul li,ol li{padding:.3em 0}ul{list-style:disc}ol{list-style:decimal}dl{border-left:2px solid #42aac7;padding:.5em}dd{margin:0 0 1.5em 1em}blockquote{background-color:#f9f9f9;-webkit-border-radius:5px 5px;-moz-border-radius:5px / 5px;border-radius:5px / 5px;padding:.5em;border:1px solid #d9d9d9}blockquote:before{content:"〃";font-weight:bold;font-size:2em;color:#42aac7;display:block}blockquote:after{content:"〃";font-weight:bold;font-size:2em;display:block;color:#42aac7;text-align:right}blockquote cite a{color:#42aac7}blockquote cite a:hover{color:#75c1d6}table{background-color:#f9f9f9;border:1px solid #d9d9d9}th,td{padding:.3em;border:1px solid #d9d9d9}pre{background-color:#f9f9f9;border:2px solid #75c1d6;-webkit-border-radius:5px 5px;-moz-border-radius:5px / 5px;border-radius:5px / 5px;padding:.5em;white-space:pre;word-wrap:normal;overflow:hidden}pre:hover{overflow:auto}body{line-height:1.5;font-size:14px;background:url("http://img.f.hatena.ne.jp/images/fotolife/t/totora0155/20130223/20130223002552.png");color:#695d53;font-family:Verdana,Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif}#blog-title{display:block;width:100%;border-bottom:1px solid #ccc;position:relative}#blog-title-inner{margin-left:1em}#title{font-size:3em;padding:.3em 0;font-family:"Titillium Web",sans-serif}#title a{border-bottom:2px dashed #695d53}#blog-description{text-indent:1em;font-size:15px}.header-image-enable #blog-title #title a,.header-image-enable #blog-title #blog-description{color:inherit;text-shadow:0;padding:0;position:relative;top:26%}.header-image-enable #blog-title #title a{border:0}.header-image-enable #blog-title #title,.header-image-enable #blog-title #blog-description{padding:0;position:relative;top:26%}#content{display:block;width:100%;*zoom:1;padding-top:3em;line-height:1.7;background:url("http://img.f.hatena.ne.jp/images/fotolife/t/totora0155/20130222/20130222233630.png")}#content:before,#content:after{content:"";display:table}#content:after{clear:both}#wrapper{display:inline;float:left;width:66.42857%;margin-left:1.42857%;margin-right:3.57143%}.hentry:not(:last-child){margin-bottom:3em}.hentry .entry-title{display:inline;float:left;width:96.15385%;margin-left:3.84615%;font-size:2em;color:#42aac7;text-align:left;letter-spacing:.2em;padding:0;line-height:1.7}.entry-inner:first-child{padding-bottom:1em}.entry-inner:not(:first-child){padding:1em 0}.date{color:#42aac7;text-align:left;border-bottom:1px dotted #9a9a9a;height:1.5em;padding-left:1.3em;margin-bottom:1.5em;padding-bottom:.1em}.date span{color:#42aac7;text-shadow:0 1px 1px #b2b2b2;letter-spacing:.2em}.date .date-year{font-size:.8em}.date .date-month{font-size:1.2em}div.categories{position:absolute}div.categories a{padding-left:1em;border-left:1px solid #d1d1d1;background-color:#fbfbfb;padding:.1em .5em;-webkit-border-radius:2px 2px;-moz-border-radius:2px / 2px;border-radius:2px / 2px;border:1px solid lightgrey;color:#bebebe;position:relative;bottom:3.1em;right:-10em}div.categories a:hover{color:#42aac7}div.categories a:not(:first-child){margin-left:.5em}.entry-content{display:inline;float:left;width:96.15385%;margin-left:3.84615%;line-height:1.7;margin-top:1.7em}[id^="entry-"] .entry-inner h1{font-size:34px}img.hatena-fotolife,img.magnifiable{max-width:100%;margin:0 auto 1em;width:auto;display:block;-webkit-border-radius:3px 3px;-moz-border-radius:3px / 3px;border-radius:3px / 3px;padding:.35em;background:url("http://img.f.hatena.ne.jp/images/fotolife/t/totora0155/20130222/20130222233630.png");border:1px solid #ddd;-webkit-transition:all,0,ease-in-out,0.5s;-moz-transition:all,0,ease-in-out,0.5s;-o-transition:all,0,ease-in-out,0.5s;transition:all,0,ease-in-out,0.5s}img.hatena-image-left,img.hatena-image-right{max-width:31%;display:inline}a img.hatena-image-left{float:left;margin:0 1em 0 0}a img.hatena-image-right{float:right;margin:0 0 0 1em}.keyword{border-bottom:1px dashed #d9d9d9}.hatena-asin-detail{border:1px solid #ddd;padding:.5em;background-color:#f9f9f9;-webkit-border-radius:5px 5px;-moz-border-radius:5px / 5px;border-radius:5px / 5px;*zoom:1}.hatena-asin-detail:before,.hatena-asin-detail:after{content:"";display:table}.hatena-asin-detail:after{clear:both}.hatena-asin-detail ul{list-style:none;margin:0;padding:0;line-height:1}.hatena-asin-detail [target="_blank"]{color:#42aac7}.hatena-asin-detail [target="_blank"]:hover{color:#95cfdf}.hatena-asin-detail>a{display:inline;float:left;width:38.46154%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin:.3em;text-align:center;border-right:1px solid #c3c3c3}.hatena-asin-detail-info{display:inline;float:left;width:60%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.entry-content .hatena-asin-detail .hatena-asin-detail-image{float:none;margin:0;max-width:100%;width:auto}.entry-header-menu{position:absolute;height:0}.entry-header-menu a{position:relative;bottom:3em;left:42.5em;color:#a09287}.entry-header-menu a:hover{color:#695d53}.entry-header-menu a:before{content:"≫";font-size:.8em;color:#a09287;letter-spacing:.2em}.entry-footer{display:block;clear:both;padding:1.5em 0;margin-left:4.7619%;font-size:13px}.entry-footer-section{text-align:right;float:right}.hatena-star-container{width:25em;float:left;margin-bottom:1em}.star-navigation-tooltip{position:relative;bottom:2.4em}.google_afc_blocklink,#google_afc_user,.customized-footer{clear:both}.comment-box{border-top:1px solid #b6b6b6}.comment{list-style:none;margin:0}.comment li{border-bottom:1px solid #b6b6b6;padding:.5em 1em;line-height:1.2}.comment-user-id{margin-left:.5em}.comment-content{margin-left:1em}.leave-comment-title{display:inline;float:left;width:38.46154%;margin-left:30.76923%;margin-right:30.76923%;padding:.3em;text-align:center;border:1px solid #b6b6b6}.pager,.permalink.pager{position:relative;margin:0 1em 1em;height:2em}.pager-next,.pager-prev{padding:0 .5em;border:1px solid #b6b6b6}.pager-prev{position:absolute;right:0}#box2{display:inline;float:left;width:27.14286%;margin-right:1.42857%;position:relative;bottom:1.3em}.hatena-module{border-bottom:1px solid #d9d9d9;margin-bottom:.8em;padding:.8em}.hatena-module-title{font-size:1.3em;padding:.3em 0}.hatena-module-body{padding-left:.8em}.profile-icon{padding:.3em;background-color:#fafafa;border:1px solid #75c1d6;-webkit-border-radius:3px 3px;-moz-border-radius:3px / 3px;border-radius:3px / 3px;float:left;margin:0 10px 10px 0}.id{margin-left:1em;position:relative;top:0 bottom:2.3em}.profile-description{clear:both}.search-form input[type="text"]{outline:0;-webkit-border-radius:3px 3px;-moz-border-radius:3px / 3px;border-radius:3px / 3px;border:1px solid #d5d5d5;text-indent:.5em;height:1.3em;line-height:1.3;background-color:#fbfbfb}.search-form input[type="text"]:focus{border:1px solid #42aac7}.search-form input[type="submit"]{border:0;background-color:transparent;border-left:1px solid #d5d5d5;background-color:#f9f9f9;cursor:pointer}#footer{width:960px;text-align:center;padding-top:1em;margin:0 auto}.breadcrumb{padding:1em;background:url("http://img.f.hatena.ne.jp/images/fotolife/t/totora0155/20130222/20130222233630.png")}span[itemprop="child"]{color:#42aac7}.page-about dl{border:0}.page-about dt{font-size:1.17em;line-height:2}.page-archive h1{font-size:1.2em}.page-archive ul{margin-left:.3em;list-style:none}.page-archive .autopagerize_page_element li{border-left:2px solid #42aac7}.page-archive .categories{display:block;width:100%;display:block}.page-archive .entry-title{font-size:1.1em}.page-archive .categories,.page-archive .entry-title{margin-left:1em}
/* </system> */

/* <system section="background" selected="e9f4f1"> */
body{background:#e9f4f1;}
/* </system> */

/* タイトルと説明文を並べて表示 */
#blog-title-inner { display: table-cell !important; white-space: nowrap !important; }
#title, #blog-description { display: inline-block !important; }

/* 前半（タイトル）のサイズ */
#title {font-size: 38px !important;}

/* 後半（説明文）のサイズ */
#blog-description {font-size: 24px !important;}

/* 記事のタイトル（「ブログ始めました」など）のサイズ調整 */
.entry-title {
    font-size: 20px !important; /* 今より一回り小さく、読みやすいサイズに */
    font-weight: bold;
    margin-bottom: 20px !important;
}

/* プロフィールのぼやけた画像を隠して、綺麗な画像に差し替える */
.hatena-module-profile .profile-icon {
    box-sizing: border-box;
    padding-left: 120px; /* 画像の横幅と同じにする */
    width: 120px !important;
    height: 120px !important;
    background: url("https://cdn-ak.f.st-hatena.com/images/fotolife/n/notenote-life/20260211/20260211100311.jpg") no-repeat center / cover;
    overflow: hidden;
}

/* SNSボタンのレイアウトを強制的に正常化する */
.social-buttons {
    display: block !important;    /* 一旦ブロック形式に戻す */
    text-align: center !important; /* 中の要素を中央に寄せる */
    margin: 40px 0 !important;    /* 上下にしっかり余白を作る */
    width: 100% !important;       /* 横幅をいっぱいまで広げて重なりを防ぐ */
    clear: both !important;       /* 前後の要素からの干渉を断ち切る */
}

/* ボタン一つ一つを横に並べる */
.social-buttons > div, 
.social-buttons > span,
.social-buttons-item {
    display: inline-block !important; /* 横に並べる */
    vertical-align: middle !important;
    margin: 0 8px 10px 8px !important; /* ボタン同士の隙間 */
}

/* ユーザー名（notenote-life）との重なりを防止 */
.entry-footer {
    margin-top: 30px !important;
    clear: both !important;
}

/* 記事内の太字を強制的に太く見せる */
.entry-content b, .entry-content strong {
    font-weight: 700 !important; /* 数字が大きいほど太くなります */
}

/* 1. 表をスマホで横スクロールさせる（不要な広がりを防止） */
.entry-content table {
    display: table; /* blockから、本来のtableの性質に戻す */
    width: auto;    /* 必要以上に横に広がらないようにする */
    border-collapse: collapse; /* 枠線をスッキリさせる */
}

/* 2. 偶数行に薄いグレーを敷く（ゼブラストライプ） */
.entry-content tr:nth-child(even) {
    background: #f2f2f2;
}

/* 3. 表にマウスを乗せた行の色を変える（PC読者への優しさ） */
.entry-content tr:hover {
    background: #e1efff;
}

/* 目次全体の枠の設定 */
.table-of-contents {
    display: inline-block; /* 中身の長さに合わせて横幅を縮める */
    min-width: 250px;      /* 最低限の横幅（小さくなりすぎ防止） */
    max-width: 90%;       /* スマホ等で突き抜けないよう最大幅を指定 */
    padding: 5px 15px 5px 15px; /* 右側と左側の余白を調整 */
    margin: 10px 0;
    border: 1px solid #ccc;
    background-color: #f9f9f9;
    border-radius: 5px;
    font-size: 0.8em; /* 【追加】全体の文字サイズを少し小さく(90%)する */
    list-style-type: none; /* 「・」を消す */
}

/* 「目次」という文字の設定 */
.table-of-contents::before {
    content: "目次";
    font-weight: bold;
    display: block;
    margin-top: 3px;    /* ← 枠の上端と「目次」の間の距離を調整（追加） */
    margin-bottom: 3px; /* ← 「目次」とリストの間の距離を 10px から 3px に減らす */
    border-bottom: 1px solid #eee; /* 【追加】うっすら線を引くと見やすくなります */
}

/* 目次内のリスト全体の余白調整 */
.table-of-contents ul,
.table-of-contents ol {
    margin-left: 1.2em; /* 左側の余白を確保して、文字が枠に刺さるのを防ぐ */
    padding-left: 0;
    list-style-type: none; /* リストの「・」を完全に消す */
}

/* 目次の各項目の設定 */
.table-of-contents li {
    margin: 0;
    padding: 2px 0;
    line-height: 1.4;
    /* text-indent（左への突き出し）を削除して、文字の位置を正常化 */
}

/* 第2階層（h5など）の文字をさらに小さく、左の余白も調整 */
.table-of-contents li li {
    font-size: 0.85em; /* 【追加】子項目をさらに一回り小さくする */
    padding: 1px 0;    /* 【追加】子項目の行間をさらに詰める */
    list-style-type: none; /* 「・」を消す */
    margin-left: 1.2em; /* 子項目をさらに右にずらして階層をわかりやすくする */
}

/* 目次の文字色を青にする */
.table-of-contents li a {
    color: #0066cc; /* 落ち着いた青 */
    text-decoration: none; /* リンクとわかりやすく下線を引く（不要なら none に） */
}

.table-of-contents li a:hover {
    text-decoration: underline; /* マウスを乗せた時だけ下線を出す */
}

/* 本文全体の文字を濃く・読みやすくする */
.entry-content {
    color: #555;          /* 文字の色を真っ黒に近い少し濃いグレーに */
    font-size: 16px;      /* 文字サイズを1段階アップ（標準は16px程度） */
}

/* リンク（青文字）も少し濃くする */
.entry-content a {
    color: #0044cc;
}

/* サイドバーの文字も調整（任意） */
.hatena-module {
    color: #666;
    font-size: 15px;
}

/* 記事本文内のリスト（箇条書き）の行間を詰める */
.entry-content ul li, 
.entry-content ol li {
    margin: 0;           /* 外側の余白をゼロにする */
    padding: 2px 0;      /* 上下に少しだけ隙間を作る（お好みで0にしてもOK） */
    line-height: 1.6;    /* 行自体の高さを設定（1.4〜1.6くらいが読みやすいです） */