﻿﻿﻿/* ………………………………………………………………………………………………………………… */
/* てがろぐ -Fumy Otegaru Memo Logger- ツイッターっぽい感じのスタイルシート for Ver 1.3.0 */
/* ………………………………………………………………………………………………………………… */
/* Table of Contents：
   -------------------
	■全体共通装飾
	■ページ最上部(ヘッダ)領域
	■入力フォームの表示領域
	■段組構成（画面の幅が800px以上ある広い場合限定）
	■メイン(ログ掲載)領域
	■投稿ボックス(一発言)ごとの表示
	■一発言だけが表示される際に追加表示されるユーティリティリンク群の装飾
	■ページナビゲーション領域
	■サブ領域
		（フリースペース区画、検索窓区画、ハッシュタグリスト区画、日付別リスト区画、汎用ボックスなど）
	■ページ最下部(フッタ)領域
*/


/* ============== */
/* ■全体共通装飾 */
/* ============== */
.wrap {  overflow: hidden;} /* 右側の余白消し */

@media screen and (max-width : 480px){
	html,
	body {
		overflow-x: hidden;
		overflow-y: scroll;
		-webkit-overflow-scrolling: touch;
	}
}

body {
	font-family: "メイリオ",Meiryo,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic","游ゴシック","YuGothic",sans-serif;
	margin: 0;
	padding: 0;
	background-color: #da6;
        box-sizing : border-box;
}

	/* -------------- */
	/* ▼リンクの装飾 */
	/* -------------- */
	a {
		color: #333;
		text-decoration: none;
	}
	a:hover {
		background:#65bdba;
                border-radius:3px;
	}

	.url {
		display:inline-block;
		word-break:break-all;	/* 自動リンクのはみ出しを防ぐ */
	}

	/* ---------------------------------------------- */
	/* ▼汎用装飾(てがろぐ専用記法で書かれた場合のみ) */
	/* ---------------------------------------------- */
	/* D:削除(Delete) */
	.decorationD {
		font-style: strike;
		color: #888;
		text-decoration-color: darkblue;	/* 線の色 */
	}
	/* E:強調(Emphasis) */
	.decorationE {
		font-style: normal;
		font-weight: bold;
		color: #05c;
	}
	/* Q:引用(Quote) */
	.decorationQ {
		border-left: 5px double skyblue;
		margin: 1em 0.3em 1em 1em;
		padding: 0.75em 0.5em;
		background-color: #f8f8ff;
		font-size: 0.95em;
	}
	/* S:小文字(Small) */
	.decorationS {
		font-size: 0.8em;
	}
	/* T:極小文字(Tiny) */
	.decorationT {
		font-size: 0.6em;
	}
	/* U:下線(Underline) */
	.decorationU {
		text-decoration-line: underline;	/* 線位置 */
		text-decoration-style: double;		/* 線種類 */
		text-decoration-color: skyblue;		/* 線配色 */
	}

	/* -------------- */
	/* ▼埋め込み画像 */
	/* -------------- */
	/* ▽画像ボックス(FIGオプション指定時) */
	.embeddedpictbox {
		margin: 0;					/* 外側の余白を消す */
		padding: 0;					/* 内側の余白を消す */
		display: inline-table;		/* 横方向に並べる */
		border-collapse: collapse;	/* displayをinline-tableにする場合に必要 */
		border: 1px solid #e0eee0;	/* 枠線 */
		vertical-align: top;		/* 行内では上に寄せる */
	}
		/* キャプション */
		.embeddedpictbox figcaption {
			display: table-caption;		/* キャプションが画像幅から外に出ないようにする */
			caption-side: bottom;		/* キャプションの位置(上にしたければtop) */
			font-size: 0.8em;			/* 文字サイズ */
			text-align: center;			/* センタリング */
			background-color: #e0eee0;	/* 背景色 */
		}

		/* 画像ボックスに含まれる画像 */
		.embeddedpictbox img {
			vertical-align: middle;
		}

	/* ▽画像リンク */
	.imagelink {
		display: inline-block;
		line-height: 1;				/* 表示形態によっては画像の下に余計な空白が出るのを防ぐ対策 */
		vertical-align: inherit;	/* 同上 */
	}

	/* ▽画像そのもの */
	.embeddedimage {
		max-width: 100%;	/* 横方向にはみ出ないようにする */
		max-height: 240px;	/* 大きくなりすぎないようにする */
		width: auto;	/* 画像サイズを固定したい場合はここに具体的なpx値を指定するのがお勧め */
		height: auto;	/* 高さを固定したい場合を除いて、ここは auto のままにするのがお勧め */
	}

	/* ▽フラグ付き画像 (※設定や採用記法によって出力パターンが複数あるため、あらゆるパターンに対応させるべく同じスタイルを2重に指定しています。) */
	figure.nsfw {
		overflow: hidden;	/* ぼかし領域がfigureのボックスからはみ出ないようにする */
	}
	.imagelink.nsfw {
		overflow: hidden;	/* ぼかし領域がfigureのボックスからはみ出ないようにする */
	}
	img.nsfw {
		filter: blur(9px);	/* ぼかす */
	}

        /* -------------- */
	/* ▼埋め込み動画 */
	/* -------------- */
	@media all and (max-width: 600px) {
		.embeddedmovie {
			display: inline-block;
			max-width: 100%;	/* はみ出ないようにする */
			width: auto;
			height: auto;
		}
	}

	/* --------------- */
	/* ▼埋め込みTweet */	/* これはツイートが埋め込まれる処理「前」用の装飾です。実際に埋め込まれるツイートはTwitter側のiframeで装飾されますので、てがろぐ側では指定できません。 */
	/* --------------- */
	blockquote.twitter-tweet {
		background-color: #f8f8f8;
		border: 1px dashed #ddd;
		border-radius: 9px;
		margin: 0.3em 0;
		padding: 1em;
		font-size: 0.95em;
		color: #999;
		text-shadow: 1px 1px 1px #fff;
	}

           /* ▼埋め込みツイートの横幅を強制的に制限 */
                div.twitter-tweet { max-width: 350px !important; }

	/* -------------------- */
	/* ▼検索語のハイライト */
	/* -------------------- */
	.searchword {
		font-weight: bold;
		background: linear-gradient(transparent 60%, #8df 60%);
	}


/* ========================== */
/* ■ページ最上部(ヘッダ)領域 */
/* ========================== */
header {
	display: table;
	background : #1b1b1b;
        width : 100%;
        margin-top: -30px;
        padding : 1em 0.4em 0.4em;
	
}

	/* -------------- */
	/* ▼タイトル区画 */
	/* -------------- */
	.headtitle {
		display: table-cell;
		margin: 0;
		line-height: 1;
	}


        .headtitle a {
		color: #fff;
		text-decoration: none;
	}
	.headtitle a:hover {
                color: #333;
		background : #65bdba;
                border-radius:3px;
}

		/* ▽先頭アイコン */
		.headicon {
			
			vertical-align: middle;
		}

		/* ▽タイトル */
		h1#jump {
			color: #d82;
                        margin: 0.2em;
                        font-size : 16px;
        
		}

		/* ▽サブタイトル */
		.subtitle {
			display: inline-block;
		}

		/* ▽タイトル直下の文章 */
		.headguide {
			margin: 0.2em;
                        font-size: 12px; 
                        color : #a9a9a9;                        
		}

	/* ---------------------- */
	/* ▼管理・投稿ボタン区画 */
	/* ---------------------- */
	.headcontrol {
		display: table-cell;
		text-align: right;
		vertical-align: middle;
		padding: 0 5px;
	}
	.control-links {
		margin: 0;
	}

	/* ▼管理・投稿用リンクボタン */
	.headcontrol a {
		display: inline-block;
		text-align: center;
		border-radius: 2em;
		padding: 0.5em 1em;
		margin-bottom: 1px;
		background-color: #65bdba;
		color: white;
		text-decoration: none;
		white-space: nowrap;
	}
	/* ▼管理・投稿用リンクボタンにマウスが載った際 */
	.headcontrol a:hover {
		text-decoration: underline;
		background-color: #65bdba;
		color: white;
                font-weight: bold;
	}

	/* ▼投稿・管理ボタン区画（画面の横幅が800px以上の場合） */
	@media all and (min-width: 800px) {
		.headcontrol {
			white-space: nowrap;	/* ヘッダ領域のボタン部分を横並びに強制する */
		}
	}


/* ======================== */
/* ■入力フォームの表示領域 */
/* ======================== */
.postform {
	background-color: #fdfdfd;	/* 背景色 */
	margin: 1em 0;				/* 外側の余白量 */
	padding: 1em 1em 0.5em;			/* 内側の余白量 */
        border-radius : 10px;
        border:1px #333 solid;
}
.postform p {
	margin: 0;
}
	/* ------------ */
	/* ▼本文入力欄 */
	/* ------------ */
	textarea.tegalogpost {
		border: 2px #44b7a6 solid;	/* 枠線 */
		border-radius: 0.67em;		/* 枠の角丸 */
		background-color: fdfdfd;	/* 背景色 */
		font-size: 0.9rem;			/* 文字サイズ */
		padding: 0.5em;				/* 内側の余白量 *
		box-sizing: border-box;		/* サイズ解釈方法 */
		width: 95%;				/* 横幅 */
		height: 4.3em;				/* 高さ */
		overflow-wrap: break-word;	/* 折り返し方法 */
		overflow: auto;				/* はみ出した場合の処理 */
                margin-bottom: 0.5em;
	}
		/* ▽プレースホルダ(※入力文字数ゼロの際だけ見える薄文字)の装飾 */
		textarea.tegalogpost:placeholder-shown { color: #777; }			/* 通常時 */
		textarea.tegalogpost:focus:placeholder-shown { color: #bbb; }	/* カーソルが入ったとき */
		textarea.tegalogpost:-ms-input-placeholder { color: #aaa; }		/* for IE */

	/* ▼投稿コントロール部分(ボタンや字数カウンタなど) */
	.line-control {
		margin: 0.25em 0;
	}

/* ▼投稿コントロール部分(ボタンや字数カウンタなど) */
	/* ------------------------------------------------ */
	.line-control {
		margin: 0.25em 0;	/* 外側の余白量 */
	}

	/* ------------ */
	/* ▼投稿ボタン */
	/* ------------ */
	.postbutton {
		display: inline-block;		/* インラインブロック化 */
		background: #44b7a6;/*#35abf2;*/
		color: #fff;		/* 文字色 */
		font-size: 1rem;			/* 文字サイズ */
		font-weight: bold;			/* 太字 */
		text-decoration: none;		/* 下線を消す */
		padding: 0.25em 0.75em;		/* 内側の余白量 */
		border: 2px solid #44b7a6;	/* 枠線 */
		border-radius: 2em;			/* 枠の角丸 */
	}
	/* ▼投稿ボタンにマウスが載ったとき */
	.postbutton:hover {
		background-color: #d82;
                border: 2px solid #d82;
                text-decoration: underline;
                color: #fff;
	}

	/* ------------------ */
	/* ▼文字装飾ボタン群 */
	/* ------------------ */
	/* 掲載領域全体 */ .decoBtns { display: inline-block; margin-top: 0.5em; }
	/* 全ボタン装飾 */ .decoBtns input { min-width: 32px; min-height: 28px; margin:1px; background-color:#eee; border: 1px solid #aaa; cursor: pointer; border-radius: 3px; font-size: 14px; vertical-align: middle; }
	/* マウス載る際 */ .decoBtns input:hover { background-color:#e5f1fb; border-color: #0078d7; }
	/* 太字  :B */ .decoBtnB { font-weight: bold; }
	/* 取消線:D */ .decoBtnD { text-decoration: line-through; text-decoration-color: red; text-decoration-style: double; }
	/* 強調  :E */ .decoBtnE { font-weight: bold; color: blue; }
	/* 斜体  :I */ .decoBtnI { font-style: italic; }
	/* 引用  :Q */ .decoBtnQ {  }
	/* 小さめ:S */ .decoBtnS {  }
	/* 極小  :T */ .decoBtnT { font-size: 11px !important; }
	/* 下線  :U */ .decoBtnU { text-decoration: underline; text-decoration-color: red; }
	/* 文字色:C */ .decoBtnC { color: red; }
	/* 背景色:M */ .decoBtnM { color: blue; }

	@media all and (min-width: 800px) {
		/* ▼文字装飾ボタン群 */
		.decoBtns { margin-top: 0; }
	}

        /* -------------------------------- */
	/* ▼カテゴリ選択チェックボックス群 */	/* ★Ver 3.0.0以降で使用 */
	/* -------------------------------- */
	.catChecks { font-size:0.9em; padding-top: 0.5em; }
	.catChecks label { display:inline-block; cursor:pointer; margin:0 0.75em 0 0; }
	.catChecks label:hover { text-decoration:underline; }
	.catChecks input { min-width:0; min-height:0; margin-right:0.2em; }


/* ================================================= */
/* ■段組構成（画面の幅が800px以上ある広い場合限定） */		/* ※2カラム構成にしたくない場合は、この区画を全削除して下さい。 */
/* ================================================= */
@media all and (min-width: 800px) {

	/* -------------- */
	/* ▼大外枠の装飾 */
	/* -------------- */
	.contents {
		display: flex;
		flex-direction: row-reverse;		/* サイドバー(サブ側)を右側にしたい場合はこの値を「row」に、左側にしたい場合は「row-reverse」にして下さい。 */
		border-collapse: separate;
		border-spacing: 1em 0;
		margin: 0;
		padding: 0;
		width: 100%;
	}
	/* ---------------- */
	/* ▼メイン段の装飾 */
	/* ---------------- */
	.contents .mainarea {
                width: 75%;				/* メイン側の横幅 */
	 vartical-align: top;
		margin: 0 1em 0 0;	/* サイドバー(サブ側)を右側に変更した場合は、この値を「1em 0 0 1em」などに変更する方がバランスが良くなります。たぶん。 */
	}
	/* -------------- */
	/* ▼サブ段の装飾 */
	/* -------------- */
	.contents .subarea {
		width: 25%;				/* サブ側の横幅 */
		vartical-align: top;
                
	}
}




/* ====================== */
/* ■メイン(ログ掲載)領域 */
/* ====================== */
.mainarea {
	padding: 0;

 }

	/* ------------------------------------------ */
	/* ▼表示対象の限定時などの「限定条件」表示行 */
	/* ------------------------------------------ */
	.situation {
		margin: 1em;
                width: -moz-fit-content;
	        width: fit-content;
		font-weight: bold;
		color: #333;
                background: linear-gradient(transparent 85%, #fff 85%);
	}

        .situation:before {
		        font-family: "Font Awesome 5 Free";
                        content: "\f138";/*アイコン種類*/
                        color: #333;
                        font-weight: 900;
                        padding-right : 5px;/*文字との隙間*/
	}

	.situation:empty { display: none; }	/* 限定表示がない場合はボックス自体を非表示にする。 */

	/* ------------------ */
	/* ▼日付セパレータ行 */
	/* ------------------ */
	.dateseparator {
		color: #333;
		font-weight: bold;
		padding: 5px 1em;
                border-radius : 7px;
                background: #fdfdfd;
                margin: 0;
	}

       .dateseparator:before {
                font-family: "Font Awesome 5 Free";
                content: '\f14a';
                font-weight: 400;
                padding-right : 3px;/*文字との隙間*/
        }

	/* ▼日付セパレータ行内のリンク */
	.dateseparator a {
		background-color: #fd3;
		font-size: 80%;
		font-weight: normal;
		display: inline-block;
		border-radius: 1em;
		margin: 0px 0.25em;
		padding: 0px 0.5em;
	}



      .dateseparator a:hover {
                background-color : #44b7a6;
                color:#fff;
        }


/* ================================ */
/* ■投稿ボックス(一発言)ごとの表示 */	/* ※この領域は、内側スキンで生成しているHTMLに対する装飾です。 */
/* ================================ */
.onelogbox {
        margin: 0 0 2em;
	padding: 1em 0.5em 1em 0 ;
        background : #fdfdfd;
	display: table;
	width: 100%;
        border-radius: 240px 15px 100px 15px / 15px 200px 15px 185px;
	box-sizing: border-box;
        border: 5px solid #444;
}

.situation + .onelogbox {
	/* 限定条件表示行の直下に表示される場合 */
	
}

	/* -------------------- */
	/* ▼ユーザアイコン表示 */
	/* -------------------- */
	.iconarea {
		display: table-cell;
		vertical-align: top;
		padding-top: 5px;
                
	}
	.usericon {
		vertical-align: middle;
                border-radius: 3px;
	}

	/* ------------ */
	/* ▼投稿内容側 */
	/* ------------ */
	.onelogbody {
		display: table-cell;
		vertical-align: top;
		width: 100%;
                background : #fdfdfd;
	}

		/* -------------- */
		/* ▼投稿情報表示 */
		/* -------------- */
		.oneloginfo {
			margin: 0 0 0.3em 0;
			font-size: 0.9em;
		}

			.onelogctrl {
				margin: 0;
				float: right;
			}

		/* ▼ユーザ名領域 */
		.username {
			display: inline-block;
			margin: 0 0.5em 0 0;
			font-weight: bold;
		}

		/* ▼ユーザ名のリンク */
		.username a {
			color: black;
		}
		/* ▼ユーザ名のリンクにマウスが載ったとき */
		.username a:hover {
			color: #333;
		}

		/* ▼投稿日時領域 */
		.postdate {
			font-size: 0.85em;
		}

		/* ▼投稿日時のリンク */
		.postdate a {
			display: inline-block;
			color: #555;
			background-color: ffe;
			border-radius: 0.5em;
			padding: 0 0.5em;
		}
		/* ▼投稿日時リンクにマウスが載ったとき */
		.postdate a:hover {
			color: #333;
		}

		/* --------- */
		/* ▼投稿No. */
		/* --------- */
		.postnum {
			font-size: 0.75em;
			color: #555;
		}

		/* -------- */
		/* ▼文字数 */
		/* -------- */
		.length {
			font-size: 0.8em;
			color: #555;
		}

		/* ------------ */
		/* ▼編集ボタン */
		/* ------------ */
		.editlink {
			font-size: 0.67em;
		}
		.editlink a {
			text-decoration: none;
			display: inline-block;
			color: #08f;
			background-color: #eef;
			border: 1px solid #ccf;
			border-radius: 5px;
			padding: 0 3px;
		}
		.editlink a:hover {
			background-color: blue;
			color: white;
			border-color: blue;
		}

                /* ----------- */
		/* ▼新着投稿(NEW!) */
                /* ---------- */
                .new {
                      color: #d82;
                      margin-left: 1em;
                      border-top: solid 1px #d82;
                      border-bottom: solid 1px #d82;
                }


                /* ---------- */
		/* ▼投稿本文 */
		/* ---------- */
		.onelogcontent {
			margin: 0;
                        font-size : 14px;
		}
                .clap { margin-top : 10px;
                }
		.comment {
			line-height: 1.3;
		}

		/* ▽投稿本文に含まれるURLリンク */
		.comment .url {
			color: #e48822
			text-decoration: none;
		}
		.comment .url:hover {
			text-decoration: underline;
		}

		/* ▽投稿本文に含まれるハッシュタグリンク */
		.comment .taglink {
			display: inline-block;	/* インラインブロック化 */
			margin: 1em 3px 0 0;			/* 外側の余白量 */
			padding: 0 0.5em;		/* 内側の余白量 */
			text-decoration: none;	/* 下線を消す */
			word-break:break-all;	/* 自動リンクのはみ出しを防ぐ */
			border: 1px solid #666;	/* 枠線 */
			background-color: #fdfdfd;	/* 背景色 */
			color: #333;		/* 文字色 */
			border-radius: 5px;		/* 角丸 */
		}
		/* ▽投稿本文に含まれるハッシュタグリンクにマウスが載ったとき */
		.comment .taglink:hover {
			border-color: #666;
			background-color: #65bdba;
			color: white;
                        font-weight: bold;
		}

             /* ========================== */
             /* ■スクロールボタン */
             /* ========================== */

   /* ▼配置 */
   .scrollBtns {
      position: fixed; /* ボタンを画面内の指定位置に固定表示する */
      bottom: 1.5em;     /* 画面の下端から1文字分の距離 */
      right: 1em;      /* 画面の右端から1文字分の距離 */
      max-width: 3em;  /* 最大幅：3文字分 */
   }
   /* ▼ボタンの装飾 */
   .scrollBtns a {
      display: block;         /* ブロック化(全体をクリック可能にするため) */
      margin: 0.5em 0 0;
      width: 2.8em; 
      height: 2.8em;
      color: #333;           /* 文字色：白色 */
      background-color: #fdfdfd; /* 背景色：青色 */
      border: 2px solid #333;
      border-radius: 50%;    /* 角を丸くする */
      opacity: 0.7;          /* 半透明にする(＝不透明度60％／つまり背後が40％透けて見える) */
      line-height: 3em;         /* 行の高さを詰める */
      text-decoration: none;  /* リンクの下線を付けない */
      text-align: center;     /* 文字をセンタリングする */     
   }

   /* ▼マウスが載ったときの装飾変更 */
   .scrollBtns a:hover {
      background-color: #65bdba;  /* 背景色 */
      color: #fff; 
   }

   /* ▼矢印記号 */
   .arrow  { display:block; font-size:1.5em; padding:0.5em 0;}  /* 1.5文字分の大きさ */


/* ============================================================ */
/* ■鍵付き(パスワード保護)投稿に表示される鍵入力フォームの装飾 */
/* ============================================================ */
.passkeyform {
	display: inline-block;
	margin: 0;
	padding: 0.6em;
	background-color: #efe;
	border: 1px solid #cec;
	border-radius: 0.25em;
}

	/* ▼鍵違いエラーの表示 */
	.passkeyerror {
		display: block;
		color: white;
		background-color: crimson;
		font-weight: bold;
		line-height: 1;
		margin: 0 0 0.5em 0;
		padding: 0.33em 0.25em;
	}

	/* ▼入力フォーム枠 */
	.passkeybox {
		display: block;
	}

		/* ▼入力欄前のガイド文 */
		.passkeyguide {
			margin-right: 0.1em;
		}
		/* ▼鍵入力欄 */
		.passkeyinput {
			width: 10em;
			margin: 0 0.25em 3px 0;
		}
		/* ▼送信ボタン */
		.passkeysubmit {
		}


/* ====================================================================== */
/* ■一発言だけが表示される際に追加表示されるユーティリティリンク群の装飾 */
/* ====================================================================== */
.utilitylinks {
	margin: 2em 1em 1em 1em;
	padding: 0.5em;
	border: 1px solid #b2defc;
	border-radius: 1em;
	background-color: #eff8fe;
	font-size: 0.9em;
}
.utilitylinks ul {
	color: darkblue;
}


/* ========================== */
/* ■ページナビゲーション領域 */
/* ========================== */
.pagenavi {
	margin: 2em 0px;			/* 外側の余白 */
	padding: 0.8em 0px 0.5em;			/* 内側の余白 */
	text-align: center;			/* 中央寄せ */
	border-width: 1px;		/* 枠線の太さ */
	border-style: solid;		/* 枠線の種類 */
	border-color: #333;		/* 枠線の配色 */
	background-color: #fdfdfd;	/* 背景色 */
        border-radius : 7px;
}
.pagenavi p {
	margin: 0;
	text-align: center;
}

	/* ------------------------------------ */
	/* ▼ページ前後移動リンク群ボックス全体 */
	/* ------------------------------------ */
	.pagelinks {
		margin: 0.75em;		/* 外側の余白 */
	}

	/* ▼ページ移動リンクの文字 */
	.pagelinks a {
		font-weight: bold;
	}

	/* -------------------------------- */
	/* ▼ページ番号リンク群ボックス全体 */
	/* -------------------------------- */
	p.pagenums {
		margin: 0.5em;		/* 外側の余白 */
	}

	/* ▼ページ番号リンクの数字 */
	.pagenums a.pagenumlink {
		margin: 0px 2px 0px 2px;	/* 外側の余白 */
		padding: 0.2em 0.5em;		/* 内側の余白 */
		font-size: 1em;				/* 文字サイズ */
		font-weight: bold;			/* 太字 */
	}
	/* ▽現在のページ番号の装飾 */
	a.pagenumhere {
		text-decoration: none;		/* リンク装飾を消す */
		background-color: #d82;		/* 背景色 */
		color: white;				/* 文字色 */
		border-radius: 1em;			/* 角丸 */
	}
	/* ▽ページ番号リンクにマウスが載った際の装飾 */
	a.pagenumlink:hover {
		text-decoration: none;		/* リンク装飾を消す */
		background-color: #44b7a6;		/* 背景色 */
		color: white;				/* 文字色 */
		border-radius: 0.3em;		/* 角丸 */
	}

	/* ------------------------------------ */
	/* ▼限定解除リンク(＝HOMEに戻るリンク) */
	/* ------------------------------------ */
	.pagehome {
		font-weight: bold;
	}


/* ========== */
/* ■サブ領域 */
/* ========== */
.subarea {
	margin: 1em 1em 0 1em;
	padding: 0;
}

	/* -------------------- */
	/* ▼フリースペース区画 */
	/* -------------------- */
	.freespacearea {
		margin: 0 0 1em 0;			/* 外側の余白量 */
		padding: 0.5em;				/* 内側の余白量 */
		background-color: #fdfdfd;	/* 背景色 */
                border-radius : 8px;
	}
	/* ▼見出し */
	.freespacearea .cornertitle {
		font-weight: bold;
                color: #d82;
		margin: 0 0 0.5em 0;
		border-bottom : 1px dashed #333;
                text-indent : 0.2em;
	}

       .freespacearea .cornertitle:before {
                font-family: "Font Awesome 5 Free";
                content: '\f152';
                font-weight: 900;
                padding-right : 5px;/*文字との隙間*/
                color: #1b1b1b; /*アイコン色*/
        }

	/* ▼フリースペースの中身 */
	.freecontents {
		font-size: 0.9em;
		line-height: 1.4;
	}
        .freecontents ul { list-style-type: none; text-indent:1.5em; margin: 0; padding: 0;}
        .freecontents ul li { }
        .freecontents li:before {
                font-family: "Font Awesome 5 Free";
                content: "\f138";/*アイコン種類*/
                position: absolute;
                left : 0.5em; /*左端からのアイコンまで*/
                color: #65bdba; /*アイコン色*/
                font-weight: 900;
        }

/* ▼フリースペース文字装飾 */
       .small {margin: 0 0 0.5em 0; font-size:80%; font-weight:normal; color:#333;}


/* ▼フリースペース編集用リンク */
	.freespaceedit {
		font-size: 0.7em;
		text-align: right;
		border-top: 1px dotted #ccc;
		margin: 0.5em 0 0 0;
	} 

	
	/* ------------------------ */
	/* ▼ハッシュタグリスト区画 */
	/* ------------------------ */
	.hashtaglistarea {
		margin: 0 0 1em 0;			/* 外側の余白量 */
		padding: 0.5em;				/* 内側の余白量 */
		background-color: #fdfdfd;	/* 背景色 */
                border-radius : 8px;
	}
	/* ▼見出し */
	.hashtaglistarea .cornertitle {
		font-weight: bold;
                color: #d82;
		margin: 0 0 0.5em 0;
		border-bottom : 1px dashed #333;
                text-indent : 0.2em;
	}

 .hashtaglistarea .cornertitle:before {
                font-family: "Font Awesome 5 Free";
                content: '\f152';
                font-weight: 900;
                padding-right : 5px;/*文字との隙間*/
                color: #1b1b1b; /*アイコン色*/
        }

		/* ▽ハッシュタグリスト */
		.hashtaglist {
			margin: 0.5em;
			padding: 0;
			list-style-type: none;
                        font-size: 0.9em;
		}
		.hashtaglist li {
			display: inline-block;
		}
		/* ▽ハッシュタグリスト内の該当件数 */
		.hashtaglist .num {
			font-size: 0.9em;
			color: gray;
			margin-left: 0.25em;
		}

	

	/* -------------- */
	/* ▼汎用ボックス */
	/* -------------- */
	.subbox {
		margin: 0 0 1em 0;
		padding: 0.5em;
		font-size: 0.8em;
                text-align: center;
		background-color: #fdfdfd;
                border-radius : 8px;
	}

.powered_back {background-color: #da6;} 
.marker { background: linear-gradient(transparent 65%, #65bdba 65%); }

        /* -------------------- */
	/* ▼カテゴリツリー区画 */
	/* -------------------- */
	.categoryarea {
		margin: 0 0 1em 0;			/* 外側の余白量 */
		padding: 0.5em;				/* 内側の余白量 */
                background-color: #fdfdfd;	/* 背景色 */
                border-radius : 8px;
	}

	/* ▼見出し */
	.categoryarea .cornertitle {
		font-weight: bold;
                color: #d82;
		margin: 0 0 0.5em 0;
		border-bottom : 1px dashed #333;
                text-indent : 0.2em;
               
	}

	 .categoryarea .cornertitle:before {
                font-family: "Font Awesome 5 Free";
                content: '\f152';
                font-weight: 900;
                padding-right : 5px;/*文字との隙間*/
                color: #1b1b1b; /*アイコン色*/
        }


         .categoryTree { margin: 0;padding: 0;	}

	/* ▽カテゴリツリー */
		.categoryTree ul {list-style-type : none; text-indent :0.3em; margin : 0; padding : 0; 
                                 font-size: 0.9em; line-height: 1.4;  color:#333; 
		}

                .categoryTree ul li {
                        position: relative;
                        padding: 0 0 0 1em;
                }


                .categoryTree ul li:before {
                        font-family: "Font Awesome 5 Free";
                        content: "\f138";/*アイコン種類*/
                        position: absolute;
                        left: -0.2em;
                        color: #65bdba; /*アイコン色*/
                        font-weight: 900;
                        padding-right : 2px;/*文字との隙間*/

                }

        /* ▼内側記事のカテゴリリンク */
                 .categorylink { font-weight: bold;
                        display: inline-block;
			color: #e48822;
			text-decoration: none;
			word-break:break-all;	/* 自動リンクのはみ出しを防ぐ */
		}
		/* ▽投稿本文に含まれるハッシュタグリンクにマウスが載ったとき */
		.categorylink:hover {
			text-decoration: underline;
                        color : #333;
		}

/* ………………………………………………………………………………………… */
/* ▼カテゴリツリー内の各要素（アイコン・カテゴリ名・該当件数・概要等） */
/* ………………………………………………………………………………………… */
/* ▽カテゴリアイコン */
.categoryTree .caticon img {
   height: 1.2em;         /* アイコンの高さを1.2文字分に制限する */
   width: auto;         /* アイコンの横幅は自動調整する */
   vertical-align: text-top;   /* アイコンの上端位置をテキストの上端に合わせる */
}

/* 間隔調整：カテゴリアイコンとカテゴリ名が並ぶ際には間隔を空ける */
.categoryTree .caticon + .cattext,
.categoryTree .cattext + .caticon {
   margin-left: 3px;
}

/* ▽該当件数 */
.categoryTree .num {
   display: inline-block;
   margin-left: 0;
   font-size: 0.9em;
   color: #aaa;
}

/* ▽カテゴリ概要文 */
.categoryTree .catdescription {
   font-size: smaller;
   color: #555;
}

/* ▽カテゴリアイコン */
.categoryicon img {
   height: 1.2em;
   width: auto;
   vertical-align: text-top;
   margin: 0 1px;
}

/* ========================== */
/* ■ページ最下部(フッタ)領域 */
/* ========================== */
footer {
	margin: 0 -1em 0px 0px;		/* 外側の余白 */
	padding: 20px 0;		/* 内側の余白 */
	background : #1b1b1b;
	color: #fff;			/* 文字色 */
}
footer p {
	margin: 0;
	padding: 0;
}


	/* ▼戻るリンク */
	.backlink {
		text-align: center;			/* 中央寄せ */
		padding: 10px 0 5px;
                font-size : 0.9em;
	}

.backlink a {
		color: #fff;
		text-decoration: none;
	}
	.backlink a:hover {
                color: #333;
		background : #65bdba;
                border-radius:3px;
}

	/* 著作権表示のデザイン */
	.poweredby { margin: 0; font-size: 0.9em; }

        .poweredby a {
		color: #333;
		text-decoration: none;
                font-weight: bold;
	}
	.poweredby a:hover {
                color: #333;
		background : #65bdba;
                border-radius:3px;
                font-weight: bold;
}

.marker { background: linear-gradient(transparent 65%, #65bdba 65%); }
.right { text-align : right; }

/* ========================== */
/* ■アイコンフォント */
/* ========================== */

.arrows:before {
  font-family: "Font Awesome 5 Free";
  content: '\f152';
  font-weight: 900;
  padding-right : 5px;/*文字との隙間*/
  color: #1b1b1b; /*アイコン色*/
}

.check-square:before {
  font-family: "Font Awesome 5 Free";
  content: '\f14a';
  font-weight: 400;
  padding-right : 3px;/*文字との隙間*/
}

/* End of file */