@charset "utf-8";

/* ………………………………………………………………………………………… */
/* てがろぐ -Fumy Otegaru Memo Logger- 標準スタイルシート for Ver 3.8.0  */
/* ………………………………………………………………………………………… */
/* ※装飾面のカスタマイズ方法については、配布サイト内にある「カスタマイズ方法」ページ https://www.nishishi.com/cgi/tegalog/custom/ の『装飾のカスタマイズ方法』区画にある解説や記述例もご参照下さい。 */

/* Table of Contents：
   -------------------
	■全体共通装飾
		▼リンクの装飾
		▼URLが書かれた場合の装飾
		▼水平線の装飾
		▼汎用装飾(てがろぐ専用記法で書かれた場合のみ)：文字
		▼自由装飾用の装飾の例
		▼汎用装飾(てがろぐ専用記法で書かれた場合のみ)：画像
		▼埋め込み画像
		▼埋め込み動画
		▼埋め込みTweet
		▼検索語のハイライト		new!

	■ページ最上部(ヘッダ)領域
		▼タイトル区画
		▼管理・投稿ボタン区画

	■入力フォームの表示領域
		▼本文入力欄
		▼投稿コントロール部分(ボタンや字数カウンタなど)
		▼投稿ボタン
		▼文字装飾ボタン群
		▼カテゴリ選択チェックボックス群

	■段組構成（画面の幅が800px以上ある広い場合限定）
		▼大外枠の装飾
		▼メイン段の装飾
		▼サブ段の装飾

	■メイン(ログ掲載)領域
		▼表示対象の限定時などの「限定条件」表示行
		▼日付境界バー

	■付箋ボックス(一発言)ごとの表示 
		▼付箋TOP 
		▼付箋の背景色：カテゴリ別に配色を指定したい場合
		▼ユーザアイコン表示 
	■一発言だけが表示される際に追加表示されるユーティリティリンク群の装飾

	■鍵付き(パスワード保護)投稿に表示される鍵入力フォームの装飾		new!
		▼鍵違いエラーの表示
		▼入力フォーム枠
			▼入力欄前のガイド文
			▼鍵入力欄
			▼送信ボタン

	■一発言だけが表示される際に追加表示されるユーティリティリンク群の装飾

	■ページナビゲーション領域
		▼ページ前後移動リンク群ボックス全体
		▼ページ番号リンク群ボックス全体
		▼限定解除リンク(＝HOMEに戻るリンク)

	■サブ領域
		▼サブ領域の見出し(DASHBOARD)部分
		▼検索窓区画
		▼カレンダー区画
		▼日付一覧リスト・日付検索区画
			▼日付リンクリスト区画
			▼日付プルダウンメニュー区画
		▼ハッシュタグリスト区画
		▼カテゴリツリー区画
			▼カテゴリツリー内の各要素（アイコン・カテゴリ名・該当件数・概要等）
		▼新着投稿リスト区画
		▼カレンダー区画
		▼フリースペース区画

	■ページ最下部(フッタ)領域
	
	■メディアクエリ（レスポンシブデザイン）
		▼iPad miniなどの小型タブレット用
		▼iPhoneなどスマートフォン用

*/


/* ============== */
/* ■全体共通装飾 */
/* ============== */
html {
	width: 100%;	/* 横幅 */
	height: 100%;	/* 高さ */
	margin: 0;	/* 外側の余白量 */
	padding: 0;	/* 内側の余白量 */
}
body {
	width: 100%;
	min-height: 100vh;	/* htmlの高さ100％に対するbodyの最小高 */
	margin: 0;		/* 外側の余白量 */
	padding: 0;		/* 内側の余白量 */
	background-color: #e6e6e6;	/* 背景色 */
	background-image: radial-gradient(#fff 17%, transparent 19%),
										radial-gradient(#fff 17%, transparent 19%);	/* ドット柄背景画像を表示するための2つの円形グラデーション指定 */
	background-size: 12px 12px;	/* 1つの円形グラデーションのサイズ */
	background-position: 0 0, 6px 6px;	/* 2つの円形グラデーションをずらして配置する */
	color: #14171a;			/* 文字色 */
	font: normal 16px/25px Verdana,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','メイリオ','Meiryo',sans-serif;	/* フォントスタイル */
	-webkit-text-size-adjust: 100%;	/* スマートフォンを横向きにした時にフォントを拡大させない指定 */
}

	/* -------------- */
	/* ▼リンクの装飾 */
	/* -------------- */
	a {
		color: #008ba3;	/* 文字色 */
		text-decoration: none;	/* 下線を消す */
	}
	a:hover {
		color: #72d5e5;	/* 文字色 */
		text-decoration: underline;	/* 下線を引く */
	}

	/* ------------------------- */
	/* ▼URLが書かれた場合の装飾 */
	/* ------------------------- */
	.url {
		display:inline-block;	/* インラインブロック化 */
		word-break:break-all;	/* 自動リンクのはみ出しを防ぐ */
	}

	/* -------------- */
	/* ▼水平線の装飾 */
	/* -------------- */
	hr {
		border: 0;
		border-color: #e6ecf0;
		background-color: transparent;
		width: 100%;	/* 横幅 */
		height: 1px;	/* 高さ */
	}

	/* ---------------------------------------------------- */
	/* ▼汎用装飾(てがろぐ専用記法で書かれた場合のみ)：文字 */
	/* ---------------------------------------------------- */
	/* B:太字(Bold) */
	.decorationB {
		font-weight: bold;		/* 太字 */
	}
	/* D:削除(Delete) */
	.decorationD {
		color: #aaa;	/* 文字色 */
		text-decoration-line: line-through;	/* 取り消し線 */
		text-decoration-color: #4f7d86;			/* 線の色 */
	}
	/* E:強調(Emphasis) */
	.decorationE {
		color: #4f7d86;	/* 文字色 */
		font-style: normal;
		font-weight: bold;
	}
	/* I:斜体(Italic) */
	.decorationI {
		font-style: italic;		/* 斜体 */
	}
	/* Q:引用(Quote) */
	.decorationQ {
		margin: 1em;		/* 外側の余白(上→右→下→左) */
		padding: 1em;			/* 内側の余白(上下→左右) */
		border-left: 5px double rgb(79 125 134 / 0.5);	/* 左端の枠線 */
		background-color: #f1f6f7;			/* 背景色 */
		color: #666;			/* 文字色 */
		font-size: 0.9em;				/* 文字サイズ */
		line-height: 1.6;				/* 行の高さ */
		display: block;					/* ※Ver 2.2.0以降必須の記述 */
	}
	.decorationQ::before,
	.decorationQ::after {
		content: '';			/* 標準で付加されてしまう引用符を無効にする */
	}
	.decorationQ + br {
		display: none;	/* 引用直後の改行を無効化する */
	}
	/* 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: #4f7d86;		/* 線配色 */
	}


	/* ---------------------- */
	/* ▼自由装飾用の装飾の例 */	/* 自由装飾は [F:myclass:対象文字] の記法で <span class="deco-myclass">対象文字</span> のようにマークアップされる機能です。あらかじめclassを用意しておくことで自由な装飾を個数制限なく使い分けられます。 */
	/* ---------------------- */	/* 投稿者の自由な記述によって意図せずページが崩れてしまうのを防ぐために、適用されるclass名の先頭には必ず deco- が付加されます。 */
	.deco-scream {
		font-size: 1.67em;	/* 文字サイズ(1.67倍) */
	}
	.deco-code {
		display: inline-block;	/* インラインブロック化 */
		font-family: "Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace;	/* 等幅フォント */
		background-color: snow;	/* 背景色 */
		color: black;			/* 文字色 */
		border: 1px solid #eee;	/* 枠線 */
		border-radius: 3px;		/* 角丸 */
		padding: 0px 3px;		/* 内側の余白量 */
	}
	.deco-separator {
		display: block;					/* ブロック化 */
		border-bottom: 1px dotted gray;	/* 下線 */
	}

	/* ---------------------------------------------------- */
	/* ▼汎用装飾(てがろぐ専用記法で書かれた場合のみ)：画像 */	/* この部分は、文字装飾領域内に含まれた画像を装飾するための記述です。 */
	/* ---------------------------------------------------- */
	/* E:強調(Emphasis)に含まれる画像に対する装飾 */
	.decorationE img {
		margin: 5px 5px;
		max-height: 35px;				/* 高さを最大35pxに抑える */
		width: auto;					/* 横幅は縦横比を維持する */
		outline: 4px ridge rgb(50 236 70 / 8);		/* 浮き上がる淡緑色の枠線を付加 */
		vertical-align: bottom;			/* 行の上下方向で下に寄せる */
	}
	/* B:太字(Bold)に含まれる画像に対する装飾 */
	.decorationB img {
		margin: 5px 5px;
		max-height: 35px;				/* 高さを最大35pxに抑える */
		width: auto;					/* 横幅は縦横比を維持する */
		box-shadow: 3px 3px 3px yellowgreen;		/* 右下に黄緑色の影を付ける */
		vertical-align: bottom;			/* 行の上下方向で下に寄せる */
	}
	/* I:斜体(Italic)に含まれる画像に対する装飾 */
	.decorationI img {
		margin: 5px 5px;
		max-height: 35px;				/* 高さを最大35pxに抑える */
		width: auto;					/* 横幅は縦横比を維持する */
		box-shadow: -3px 3px 3px pink;	/* 左下にピンク色の影を付ける */
		vertical-align: bottom;			/* 行の上下方向で下に寄せる */
	}
	/* U:下線(Underline)に含まれる画像に対する装飾 */
	.decorationU img {
		margin: 5px 5px;
		max-height: 35px;				/* 高さを最大35pxに抑える */
		width: auto;					/* 横幅は縦横比を維持する */
		box-shadow: 3px 3px 3px skyblue;	/* 右下に空色の影を付ける */
		vertical-align: bottom;			/* 行の上下方向で下に寄せる */
	}
	/* Q:引用(Quote)に含まれる画像に対する装飾 */
	.decorationQ img {
		margin: 5px 5px;
		max-height: 35px;				/* 高さを最大35pxに抑える */
		width: auto;					/* 横幅は縦横比を維持する */
		vertical-align: middle;			/* 行の上下方向で真ん中に寄せる */
		border: 1px solid #c6c6c6
	}
	/* D:削除(Delete)に含まれる画像に対する装飾 */
	.decorationD img {
		margin: 5px 5px;
		max-height: 35px;				/* 高さを最大35pxに抑える */
		width: auto;					/* 横幅は縦横比を維持する */
		opacity: 0.4;	/* 半透明にする */
		vertical-align: bottom;			/* 行の上下方向で下に寄せる */
	}
	/* S:小文字(Small)に含まれる画像に対する装飾 */
	.decorationS img {
		margin: 10px 5px 0;
		max-height: 30px;				/* 高さを最大50pxに抑える */
		width: auto;					/* 横幅は縦横比を維持する */
		vertical-align: bottom;			/* 行の上下方向で下に寄せる */
	}
	/* T:極小文字(Tiny)に含まれる画像に対する装飾 */
	.decorationT img {
		margin: 10px 5px 0;
		max-height: 30px;				/* 高さを最大30pxに抑える */
		width: auto;					/* 横幅は縦横比を維持する */
		vertical-align: bottom;			/* 行の上下方向で下に寄せる */
	}

	/* -------------- */
	/* ▼埋め込み画像 */
	/* -------------- */
	.embeddedimage {
		max-width: 100%;	/* 横方向にはみ出ないようにする */
		max-height: 240px;	/* 大きくなりすぎないようにする */
		width: auto;	/* 画像サイズを固定したい場合はここに具体的なpx値を指定するのがお勧め */
		height: auto;	/* 高さを固定したい場合を除いて、ここは auto のままにするのがお勧め */
		border-radius: 7px;	/* 角丸 */
		margin-top: 0.5em;	/* 画像上の余白量 */
		object-fit: cover;	/* 画像ブロックからはみ出た画像を、縦横比を維持したままトリミングして中央配置 */
	}
	/* ▼特定カテゴリ（caution）の画像にクッション画像を挟む指定 */
	.caution .embeddedimage { display: none; }
	.caution .imagelink {
		display: inline-block;
		width: 320px;
		height: 240px;
		background-image: url("https://izbox.flop.jp/homepage/img/caution_vga.png");	/* リンクをブロック化して背景画像を表示する */
		background-size: cover;
		background-repeat: no-repeat;
		border-radius: 7px;
		margin-top: 0.5em;
	}

	/* -------------- */
	/* ▼埋め込み動画 */
	/* -------------- */
		.embeddedmovie {
			max-width: 95%;	/* はみ出ないようにする */
			max-height: 95%;
			border-radius: 14px;
			margin-top: 0.5em;
		}

	/* -------------- */
	/* ▼埋め込み音楽 */
	/* -------------- */
		.embeddedmusic {
			display: block;
			max-width: 100%;	/* はみ出ないようにする */
			margin-top: 0.5em;
		}

	/* --------------- */
	/* ▼埋め込み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;
	}
	/* ------------- */
	/* ▼鍵付き画像BOX */
	/* ------------- */
	.onelogbox.logstatus-lock .imagebox {
		display: block;
		width: 240px;
		height: 238px;
		border: 1px dotted #ccc;
		border-radius: 7px;
		margin: 0 0 8px 0;
	}


	/* -------------------- */
	/* ▼検索語のハイライト */
	/* -------------------- */
	.searchword {
		background-color: rgb(132 180 255 / 6);
		padding: 0 0.15em;
	}


/* ========================== */
/* ■ページ最上部(ヘッダ)領域 */
/* ========================== */
header {
    display: block;
    position: fixed;
    margin: 0;
    width: 100%;
    background-color: rgb(255 255 255 / 9);
    z-index: 100;
	}
	/* -------------- */
	/* ▼タイトル区画 */
	/* -------------- */
	.headarea {
		display: flex;
		align-items: baseline;
		width: 800px;
		height: 80px;
		margin: 0 auto;
	}
	.headtitle {
		width: 100%;
		text-align: center;
	}
		/* ▽メインタイトル */
		.maintitle {
			margin: 0;			/* 外側の余白量 */
			padding: 0;
		}
		.maintitle h1 {
			font: bold 32px/1.7 Verdana,sans-serif;		
			line-height: 0;
		}
		/* ▽メインタイトルのリンク */
		.maintitle a {
			text-decoration: none;	/* 下線を消す */
			line-height: initial;
		}
		/* ▽メインタイトルのリンクにマウスが載ったとき */
		.maintitle a:hover {
			text-decoration: none;	/* 下線を消す */
		}

		/* ▽サブタイトル */
		.subtitle {
			font-size: 0.45em;		/* 文字サイズ */
			line-height: 0;
		}

		/* ▽タイトル下部の概要文 */
		.mainguide {
			margin: 0;
			line-height: inherit;
		}
	/* ---------------------- */
	/* ▼管理・投稿ボタン区画 */
	/* ---------------------- */
	.headcontrol {
		width: 105px;		/* 横幅 */
		font-size: 20px;		/* 文字サイズ */
		position: fixed;
		top: 8px;
		right: 24px;
		z-index: 3000;
	}

	/* ▼ボタンの包含ボックス */
	.control-links {
		display: flex;		/* 段組み準備 */
		flex-wrap: wrap;
		margin: 0;
	}
	.control-links a {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 35px;
		height: 30px;
		text-decoration: none;
	}


/* ======================== */
/* ■入力フォームの表示領域 */		/* ※これはQUICKPOST用です。新規投稿専用画面や編集画面ではCGI内蔵のCSSが使われるため、ここの記述は適用されません。 */
/* ======================== */
.postarea { padding-bottom: 1em;}		/* 内側下の余白量 */

.postform {
	margin-bottom: 1em;			/* 外側下の余白量 */
	padding: 0;
}
.postform p {
	margin: 0.5em 0;			/* 外側の余白量 */
}

	/* ------------ */
	/* ▼本文入力欄 */
	/* ------------ */
	textarea.tegalogpost {
		box-sizing: border-box;		/* 内側の余白量と枠線を横幅・高さに含む */
		border: 1px solid #e6ecf0;			/* 枠線 */
		border-radius: 5px;			/* 枠の角丸 */
		width: 100%;				/* 横幅 */
		height: 4.3em;				/* 高さ */
		overflow-wrap: break-word;	/* 折り返し方法 */
		overflow: auto;				/* はみ出した場合の処理 */
		font-family: inherit;			/* フォント指定継承 */
		font-size: 16px;			/* 文字サイズ */
		line-height: 1.2;			/* 行の高さ */
	}
		/* ▽プレースホルダ(※入力文字数がゼロの際にだけ見える薄文字)の装飾 */
		textarea.tegalogpost:placeholder-shown { color: #657786; padding-left: 0.4em; }			/* 通常時 */
		textarea.tegalogpost:focus:placeholder-shown { color: #bbb; }	/* カーソルが入ったとき */
		textarea.tegalogpost:-ms-input-placeholder { color: #657786; }		/* for IE */

	/* ------------------------------------------------ */
	/* ▼投稿コントロール部分(ボタンや字数カウンタなど) */
	/* ------------------------------------------------ */
	.line-control {
		margin: 0.25em 0;	/* 外側の余白量 */
	}
	/* ID変更リンク */
	.changelink {
		display: flex;		/* 段組準備 */
		float: right;
		margin: 0.2em 0.5em;
	}

	/* ------------ */
	/* ▼投稿ボタン */
	/* ------------ */
	.postbutton {
		display: inline-block;		/* インラインブロック化 */
		background-color: #00afcc;			/* 背景色 */
		color: white;				/* 文字色 */
		font-size: 1em;			/* 文字サイズ */
		font-weight: bold;			/* 太字 */
		text-decoration: none;		/* 下線を消す */
		margin: -5px 0 10px 0;		/* 外側の余白量 */
		padding: 0.3em 1em;		/* 内側の余白量 */
		line-height: 1.75;			/* 行の高さ */
		border: none;	/* 枠線なし */
		border-radius: 2em;			/* 枠の角丸 */
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;			/* ブラウザデフォルトの装飾をオフ */
		position: initial;
	}
	/* ▼投稿ボタンにマウスが載ったとき */
	.postbutton:hover {
		background-color: #72d5e5;	/* 背景色 */
	}

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

	@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[type="checkbox"] { background-color: #fff; cursor: pointer; box-sizing: border-box; margin: 2px 3px 3px 4px; padding: initial; min-width: 14px; min-height: 14px; border: 1px solid #606984;; appearance: none; -webkit-appearance: none; -moz-appearance: none;}
	.catChecks input[type="checkbox"]:checked {
		background: #2e80ff; /* チェック時の背景色 */
		border-color: #2e80ff; /* チェック時の文字色 */
	}

	/* 鍵付き投稿フォーム */
	.passkeyinput {
		width: 10em;
		height: 22px;
		padding-left: 5px;
		border: 1px solid #ccc;
		border-radius: 3px;
		background-color: #fff;
		color: #191b22;
		font-size: 16px;
		vertical-align: middle;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
	}
	.passkeysubmit {
		padding: 0.25em 0.5em;
		line-height: 1;
		height: 1.63rem;
		border: 1px solid #ccc;
		border-radius: 3px;
		background-color: #f0f0f0;
		color: #14171a;
		vertical-align: middle;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
	}
	
	.passkeysubmit:hover {
		border: 1px solid #999;
		background-color: #999;
		color: #fff;
	}

/* ================================================= */
/* ■段組構成（画面の幅が800px以上ある広い場合限定） */
/* ※段組(2カラム構成)にしたくない場合は、この区画を全削除して下さい。 */
/* ================================================= */
@media all and (min-width: 800px) {
	/* -------------- */
	/* ▼大外枠の装飾 */
	/* -------------- */
	.contents {
		display: flex;				/* 段組準備 */
		flex-direction: column;		/* サイドバー(サブ側)を右側にしたい場合はこの値を「row」に、左側にしたい場合は「row-reverse」にして下さい。 */
		margin: 0 auto 1em;					/* 外側の余白量 */
		padding: 0;					/* 内側の余白量 */
		width: 800px;				/* 横幅 */
	}
	/* ---------------- */
	/* ▼メイン段の装飾 */
	/* ---------------- */
	.contents .mainarea {
		width: 70%;				/* 横幅 */
		vertical-align: top;	/* 上に寄せる */
		margin: 6em auto 0;	/* 外側の余白量 */
		padding: 0 1em;		/* 内側の余白量 */
	}
	/* -------------- */
	/* ▼サブ段の装飾 */
	/* -------------- */
	.contents .subarea {
		width: 70%;				/* 横幅 */
		vertical-align: top;	/* 上に寄せる */
		margin: 0 auto;	/* 外側の余白量 */
		padding: 0;		/* 内側の余白量 */
	}
}


/* ====================== */
/* ■メイン(ログ掲載)領域 */
/* ====================== */
.mainarea {
	background-color: transparent;	/* 背景色 */
}

	/* ------------------------------------------ */
	/* ▼表示対象の限定時などの「限定条件」表示行 */
	/* ------------------------------------------ */
	.situation {
		margin: 0;	/* 外側の余白量 */
		font-weight: bold;	/* 太字 */
		color: #444b5d;		/* 文字色 */
		line-height: initial;
	}
	.situation:empty { display: none; }	/* 限定表示がない場合は存在自体を消す */

	/* ------------------ */
	/* ▼日付セパレータ行 */
	/* ------------------ */
	.dateseparator {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 0.5em;
		background-color: #606060;
		color: #eee;
		border: 1px solid #eee;
		border-radius: 7px;
		font-size: 0.8em;
	}

	/* ▼日付境界バーの表示文字列の先頭に付加する記号 */
	.dateseparator::before {
		font-family: "FontAwesome";
		content: '\f017';
		font-weight: 400;
	}

	/* ▼日付境界バー内のリンク(ボタン) */
	.dateseparator a {
		height: 14px;
		padding: 0 3.5em;		/* 内側の余白量 */
		background-color: transparent;
		color: #fff;			/* 文字色 */
		line-height: initial; /* 行の高さ */
		font-size: 10px;		/* 文字サイズ */
		font-weight: normal;	/* 太字を解除 */
		border: 1px solid #fff;	/* 枠線 */
		border-radius: 8px;		/* 枠の角丸 */
		text-decoration: none;	/* 下線を消す */
	}

	/* ▼日付境界バー内のリンク(ボタン)にマウスが載ったとき */
	.dateseparator a:hover {
		background-color: #00afcc;	/* 背景色 */
		color: #fff;			/* 文字色 */
		border-color: #eee;		/* 枠線の色 */
	}

/* ============== */
/* ■付箋ボックス(一発言)ごとの表示  */	/* ※この領域は、内側スキンで生成しているHTMLに対する装飾です。 */
/* ============== */
	/* --------- */
	/* ▼付箋TOP */
	/* --------- */
	.fusentop {
		margin: 0;
		padding: 0 1em;
		border-bottom: 1px dashed #e6ecf0;
		border-radius: 10px 10px 0 0;
		background-color: rgb(255 255 255 / 5);
		min-height: 2em;
	}

	.fusentop small {
		display: inline-block;
		font-size: 0.67em;
	}

		/* --------- */
		/* ▼投稿No. */
		/* --------- */
		.postnum {
			font-size: 0.9em;		/* 文字サイズ */
			color: #555;		/* 文字色 */
		}

		/* ---------- */
		/* ▼投稿日時 */
		/* ---------- */
		.postdate {
			font-size: 0.85em;		/* 文字サイズ */
		}

			/* ‥‥‥‥‥‥‥‥‥ */
			/* ▼投稿日時のリンク */
			/* ‥‥‥‥‥‥‥‥‥ */
			.postdate a {
				display: inline-block;		/* インラインブロック化 */
				vertical-align: middle;		/* 中央へ寄せる */
				font-weight: bold;		/* 太字 */
				color: #666;		/* 文字色 */
			}
			/* ▽投稿日時リンクにマウスが載ったとき */
			.postdate a:hover {
				text-decoration: underline;	/* 下線を引く */
				color: #888;		/* 文字色 */
			}

			/* ‥‥‥‥‥‥‥ */
			/* ▼メモ番号部分 */
			/* ‥‥‥‥‥‥‥ */
			.memonum {
				font-size: 0.8em;	/* 文字サイズ */
			}

			/* ▽メモ番号のリンク */
			.memonum a {
				text-decoration: none;	/* 下線を消す */
			}

			/* ▽メモ番号のリンクにマウスが載ったとき */
			.memonum a:hover {
			text-decoration: underline;	/* 下線を表示する */
			}

			/* ‥‥‥‥‥‥‥‥ */
			/* ▼New!サイン部分 */
			/* ‥‥‥‥‥‥‥‥ */
			/* 新着 */
			.newsign {
				display: inline-block;	/* インラインブロック化 */
				margin: 0.5em 0 0.25em 0;		/* 外側の余白量 */
				color: #f55;		/* 文字色 */
				font-size: 12px;	/* 文字サイズ */
			}
			/* 新着要素が無いとき非表示 */
			.newsign:empty { display: none;}
			/* 先頭固定 */
			.fixed {
				color: #5b7083;
			}
			.fixed::before {
				font-family: fontawesome;
				content: "\f08d";
				padding-right: 2px;
			}			
			.pin {
				font-size: 1em;
			}

	/* ------------------------------------------------ */
	/* ▼付箋の背景色：カテゴリ別に配色を指定したい場合 */
	/* ※下記の「info」・「memo」・「diary」・「monologue」などは、実際に設定してあるカテゴリID名に書き換えて下さい。 */
	/* ------------------------------------------------ */
	.fusen,
	.fuseninquiry,
	.fusenanser,
	.fusencaution,
	.fusentest { background-color: #fff; border: 0px; margin-bottom: 1.25em; border-radius: 10px; } /* カテゴリ色無し */

	.fuseninfo { background-color: #f0ffff; margin-bottom: 1.25em; border-radius: 10px; } /* お知らせ */

	.fusenmemo { background-color: #fffff0; border: 0px; margin-bottom: 1.25em; border-radius: 10px; } /* メモ */

	.fusendiary { background-color: #fff8fa; border: 0px; margin-bottom: 1.25em; border-radius: 10px; } /* 日記 */

	.fusenmonologue { background-color: #f8f8f8; border: 0px; margin-bottom: 1.25em; border-radius: 10px; } /* ひとりごと */

	/* ---------- */
	/* ▼投稿本文 */
	/* ---------- */
	.fusencontent {
		margin: 1em 0;		/* 外側の余白量 */
	}
	.fusenbody {
		height: auto;
		padding: 0 2em;
	}
	.newsign + .fusencontent { margin-top: 0;}
	.newsign:empty + .fusencontent { margin-top: 1em;}

		/* ‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥ */
		/* ▼本文内に含まれるハッシュタグリンク */
		/* ‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥ */
		.comment .taglink {
			text-decoration: none;	/* 下線を消す */
			word-break:break-all;	/* 自動リンクのはみ出しを防ぐ */
		}
		/* ▼ハッシュタグリンクにマウスが載ったとき */
		.comment .taglink:hover {
			text-decoration: underline;		/* 下線を引く */
		}

		/* ‥‥‥‥‥‥‥‥‥‥‥‥‥‥ */
		/* ▼続きを読むリンク（ボタン） */		/* ※注：「続きを読む」機能は、JavaScriptが無効な閲覧環境では機能せず、その場合はボタンも表示されません。 */
		/* ‥‥‥‥‥‥‥‥‥‥‥‥‥‥ */
		/* ▽ボタン枠の装飾(共通) */
		.readmorebutton {
			margin-top: 0.3em;				/* 外側の余白量 */
			padding: 0.2rem 0.7em;		/* 内側の余白量 */
			border: 1px solid #00afcc;	/* 枠線の装飾 */
			border-radius: 10px;	/* 枠線の角丸 */
			font-size: 0.9em;		/* 文字サイズ */
		}
		/* ▽ボタン表面の装飾(共通) */
		.readmorebutton:link,
		.readmorebutton:visited {
			background-color: transparent;	/* 背景色(グラデーション非対応の環境のみ) */
			color: #00afcc;		/* 文字色 */
			text-decoration: none;	/* リンク装飾を消す */
		}
		/* ▽ボタンにマウスが載った際の装飾(共通) */
		.readmorebutton:hover {
			background-color: #00afcc;	/* 背景色 */
			color: white;				/* 文字色 */
			text-decoration: none;	/* 下線を加える */
		}

		/* ▽開く（続きを読む）ボタン専用の装飾 */
		.readmorebutton.readmoreopen {
			display: flex;		/* 段組準備 */
			justify-content: center;
			align-items: center;
		}

		/* ▽閉じる（畳む）ボタン専用の装飾 */
		.readmorebutton.readmoreclose {
			display: flex;		/* 段組準備 */
			justify-content: center;
			align-items: center;
			width: 2em;
			content: "\A";
			white-space: pre;
		}

	/* ------------ */
	/* ▼付箋フッタ */
	/* ------------ */
	/* ---------- */
	/* ▼付箋署名 */
	/* ---------- */
	.fusendate {
		margin: 0.75em 0 0 0;
		padding: 0.25em 1em;	/* 内側の余白量 */
		border-top: 1px dashed #e6ecf0;	/* 枠線 */
		border-radius: 0 0 10px 10px;	/* 枠線の角丸 */
		background-color: rgb(255 255 255 / 3);	/* 背景色 */
		font-size: 0.8em;		/* 文字サイズ */
		text-align: right;	/* 右に寄せる */
/* 		display: block;
		position: relative;
		left: -1rem;
		width: 102.4%;
    z-index: 10;		重なりを上にする */
	}
	/* ▽付箋署名のリンク */
	.fusendate a {
		display: inline-block;	/* インラインブロック化 */
    vertical-align: middle;	/* 中央に寄せる */
    font-weight: bold;	/* 太字 */
    color: #666;	/* 文字色 */
	}
	/* ▽マウスが載ったとき */
	.fusendate a:hover {
    color: #888;
  }

	/* ------------ */
	/* ▼カテゴリ名 */
	/* ------------ */
	.categories {
		display: inline-block;
	}
		/* ▽カテゴリリンク1つ */
		.categorylink {
			color: #00afcc !important;
			font-weight: normal !important;
			text-decoration: none;		/* リンクの下線を消す */
		}
		/* ▽カテゴリリンクにマウスが載ったとき */
		.categorylink:hover {
			color: #72d5e5 !important;
			text-decoration: underline;	/* 下線を表示 */
		}
		/* ▽カテゴリ間のセパレータ */
		.catseparator {
			display: inline-block;
			margin: 0 1px;			/* 左右に1pxの余白 */
			color: #00afcc;			/* 文字色 */
		}

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

		/* ‥‥‥‥‥‥‥ */
		/* ▼投稿ユーザID */
		/* ‥‥‥‥‥‥‥ */
		.postuserid {
		margin-left: 0.25em;		/* 外側左の余白量 */
		font-weight: normal;		/* 通常 */
		font-size: 0.8em;		/* 文字サイズ */
		color: #606984;		/* 文字色 */
		}

		/* ▽ユーザIDのリンク */
		.postuserid a {
			text-decoration: none;		/* 下線を消す */
			color: inherit;				/* 文字色(継承) */
		}
		/* ▽ユーザIDのリンクにマウスが載ったとき */
		.postuserid a:hover {
			text-decoration: none ;		/* 下線を消す */
			color: inherit;				/* 文字色(継承) */
		}
		/* ▽ユーザIDのリンクの前につける装飾（Re:>>No.1の様に表示する） */
		.postidlink::before {
			content: "Re:";
		}

		/* ‥‥‥‥‥‥ */
		/* ▼編集リンク */
		/* ‥‥‥‥‥‥ */
		.editlink {
			display: inline-block;	/* インラインブロック化 */
		}


/* ====================================================================== */
/* ■一発言だけが表示される際に追加表示されるユーティリティリンク群の装飾 */
/* 各投稿の個別ページでのみ表示される囲みナビ用の装飾です。               */
/* ====================================================================== */
.utilitylinks {
	margin: 2em 1em 1em 1em;	/* 外側の余白量 */
	padding: 0.5em;				/* 内側の余白量 */
	font-size: 0.9em;			/* 文字サイズ */
}


/* ========================== */
/* ■ページナビゲーション領域 */
/* ========================== */
.pagenavi {
	margin: 1.5em 0;			/* 外側の余白量 */
	padding: 0;			/* 内側の余白量 */
	text-align: center;			/* 中央寄せ */
}

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

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

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

	/* ▼ページ番号リンクの数字 */
	.pagenums a.pagenumlink {
		margin: 0px 2px 0px 2px;	/* 外側の余白量 */
		padding: 3.2px 8px;		/* 内側の余白量 */
		background-color: #fff;
		font-size: 1em;				/* 文字サイズ */
		font-weight: bold;			/* 太字 */
		border: 1px solid #00afcc;
		border-radius: 10px;
	}
	/* ▽ページ番号リンクにマウスが載った際の装飾 */
	a.pagenumlink:hover {
		background-color: #72d5e5;
		color: #fff;
		text-decoration: none;
	}

	/* ▽現在のページ番号の装飾 */
	a.pagenumhere {
		text-decoration: none;		/* リンク装飾を消す */
					/* 角丸 */
		background-color: #fff;
		color: #f2a405;
		border: 1px solid #f2a405 !important;
		border-radius: 10px;
	}
	a.pagenumhere:hover {
		border-color: #00afcc !important;
	}
	/* ------------------------------------ */
	/* ▼限定解除リンク(＝HOMEに戻るリンク) */
	/* ------------------------------------ */
	.pagehome {
		margin: 0.15em;		/* 外側の余白量 */
		font-weight: bold;	/* 太字 */
	}


/* ========== */
/* ■サブ領域 */
/* ========== */
.subarea {
	background-color: #fff;		/* 背景色 */
	color: #657786;		/* 文字色 */
	border-radius: 1em;		/* 角丸 */
}
	/* --------------------------------- */
	/* ▼サブ領域の見出し(DASHBOARD)部分 */
	/* --------------------------------- */
	.subhead {
		line-height: 1;						/* 行の高さ */
		text-align: center;					/* センタリング */
		font-weight: bold;					/* 太字 */
	}

	/* ------------ */
	/* ▼検索窓区画 */
	/* ------------ */
	.searcharea {
	margin: 0;				/* 外側の余白量 */
	padding: 1em;			/* 内側の余白量 */
	border-bottom: 1px solid #e6ecf0;	/* 下線 */
	}
	/* ▼見出し */
	.searcharea .cornertitle {
		margin: 0 0 0.5em 0;	/* 外側の余白量 */
		font-weight: bold;		/* 太字 */
	}

		/* ▽検索フォーム */
		.searchbox,
		.searchinputs {
		margin: 0;			/* 外側の余白量 */
		display: flex;		/* 段組準備 */
		flex-wrap: wrap;
		max-width: 25em;	/* 最大横幅 */
		}
			/* 検索語(テキスト)入力欄 */
			.queryinput {
			font-size: 16px;
			width: 9em;
	    border: 1px solid #ccc;			/* 枠線 */
	    border-radius: 2px;		/* 角丸 */
			}
			/* 検索(送信)ボタン */
			.searchbox .submitbutton {
			margin-left: 2px;				/* 外側の余白量 */
			padding: 0.25em 0.5em;	/* 内側の余白量 */
			line-height: 1.25;			/* 行の高さ */
			border: 1px solid #ccc;		/* 枠線 */
			background-color: #f0f0f0;		/* 背景色 */
	    color: #14171a;	/* 文字色 */
			vertical-align: top;		/* 上に揃える */
			-webkit-appearance: none;		/* ブラウザ初期装飾の無効化 */
			-moz-appearance: none;		/* ブラウザ初期装飾の無効化 */
			appearance: none;		/* ブラウザデ初期装飾の無効化 */
			}
			/* ▽検索(送信)ボタンにマウスが載った際の装飾 */
			.searchbox .submitbutton:hover {
			background-color: #999;		/* 背景色 */
			color: white;							/* 文字色 */
			}

		/* ▽検索対象を限定するチェックボックス */
		.searchtarget {
		margin: 0.5em 0 0 0;
		}

		/* ▽検索フォーム形式の切り替えリンク */
		.siwtchsearchbox {
			font-size: 0.9em;
			margin: 0.5em 0 1em 0;
		}

		/* ▽複合検索フォーム */
		#complexsearch {
			display: none;	/* 複合検索窓は、最初は非表示にしておく */
		}

			/* 検索オプションリスト */
			.searchoptions {
				font-size: 0.9em;					/* 文字サイズ */
				margin: 0.75em 0 0 1em;	/* 外側の余白量 */
				padding: 0 0 0 0.5em;			/* 内側の余白量 */
			}
			label.searchoption {
				font-size: 0.9em;
			}

			/* 項目名 */
			.solabel {
				display: inline-block;	/* インラインブロック化 */
				min-width: 5em;			/* 最小幅 */
			}

			/* セレクトボックス */
			.searchoptions select {
				max-width: 175px;		/* 最大幅 */
			}

	/* ---------------- */
	/* ▼カレンダー区画 */
	/* ---------------- */
	.calendararea {
	margin: 0 0 1em 0;	/* 外側の余白量 */
	padding: 1em;				/* 内側の余白量 */
	border-bottom: 1px solid whitesmoke;	/* 下線 */
	}
	/* ▼見出し */
	.calendararea .cornertitle {
		margin: 0 0 0.5em 0;	/* 外側の余白量 */
		font-weight: bold;		/* 太字 */
	}

		/* ▽カレンダーカバー */
		.calendarplace {
			display: flex;		/* 段組準備 */
			justify-content: center;
			margin: 0.5em 0;	/* 外側の余白量 */
			padding: 0;				/* 内側の余白量 */
			background-color: #fff;	/* 背景色 */
			line-height: 1.5;	/* 行の高さ */
			overflow: auto;		/* はみ出る場合の処理 */
		}

		/* ▽カレンダーテーブル */
		.calendar {
			border-collapse: collapse;		/* 枠を結合 */
			border: 1px solid whitesmoke;	/* テーブル外側の枠線 */
		}

		.calendar th,
		.calendar td {
			border: 1px solid #fefefe;	/* テーブル内側の枠線 */
			padding: 2px;					/* セル内側の余白 */
			text-align: center;		/* 中央寄せ */
			font-size: 0.9em;			/* 文字サイズ */
			line-height: 1.1;			/* 行の高さ */
		}

			/* 年月キャプション */
			.calendar caption {
				color: #736d71;		/* 文字色 */
			}

			/* 曜日行 */
			.daysofweek th {
				background-color: #efefef;	/* 背景色 */
				font-weight: normal;		/* 通常 */
				padding: 6px 0;		/* 内側の余白量 */
				font-size: 0.8em;	/* 文字サイズ */
				line-height: 1;		/* 行の高さ */
			}

			/* 日付数値の装飾（リンクになる場合も、ならない場合も共通） */
			.calendar a,
			.calendar .nolink {
				display: inline-block;	/* インラインブロック化 */
				border-radius: 50%;	/* 角丸 */
				padding: 0.4em;			/* 内側の余白量 */
				width: 1.4em;				/* 横幅 */
				height: 1.4em;			/* 高さ */
				background-color: transparent;	/* 背景色 */
				line-height: 1.4;		/* 行の高さ */
			}

			/* 日付数値のリンク（※リンクになる場合だけの装飾） */
			.calendar td a {
				text-decoration: none;		/* 下線を消す */
				background-color: transparent;	/* 背景色 */
				font-weight: bold;		/* 太字 */
			}
			/* 日付数値のリンクにマウスが載った際 */
			.calendar td a:hover {
				background-color: #4dc9dd;	/* 背景色 */
				color: white;					/* 文字色 */
				font-weight: bold;		/* 太字 */
			}

			/* 今日の枠（カレンダー内での「今日」のセルだけの装飾） */
			.today {
				background-color: #e5f7fa;	/* 背景色 */
			}
			.calendarlinks {
			padding: 0;			/* 内側の余白量 */
			text-align: center;		/* 中央揃え */
			}

	/* ------------------------------ */
	/* ▼日付一覧リスト・日付検索区画 */
	/* ------------------------------ */
	.datelistarea {
	padding: 1em;			/* 内側の余白量 */
	border-bottom: 1px solid #e6ecf0;	/* 下線 */
	}
	/* ▼見出し */
	.datelistarea .cornertitle {
		margin: 0 0 0.5em 0;	/* 外側の余白量 */
		font-weight: bold;		/* 太字 */
	}

		/* …………………………… */
		/* ▼日付リンクリスト区画 */
		/* …………………………… */
		/* ▽日付リスト(年単位) */
		/* ▽日付リスト(月単位) */
		.datelimitsublist {
			list-style-type: none;	/* リストの先頭記号(なし) */
		}
			/* ――――――――――――――――――――――――― */
			/* ▽年表記が単独で存在する場合に、月表示を横に並べる */	/* 縦に並べたい場合は、この区画を削除して下さい。 */
			/* ――――――――――――――――――――――――― */
			.datelimitlist .datelimitsublist .datelimit-month {
				display: inline-block;	/* インラインブロック化 */
				margin-right: 0.9em;		/* 外側右の余白 */
			}
			/* ―――――――――――――――――――――――――――――――――――― */
			/* ▽年表記が単独で存在する場合に、月リンク内に含まれる年表記を非表示にする */	/* 年表記も表示したい場合は、この区画を削除して下さい。 */
			/* ―――――――――――――――――――――――――――――――――――― */
			.datelimitlist .datelimitsublist .year {
				display: none;			/* 非表示 */
			}

		/* ▽日付リスト内の該当件数 */
		.datelimitlist .num {
			margin-left: 0.4em;			/* 外側左の余白 */
			color: #aaa;			/* 文字色 */
		}

		/* …………………………………… */
		/* ▼日付プルダウンメニュー区画 */
		/* …………………………………… */
		.datelimitbox {
		margin: 0;			/* 外側の余白量 */
		display: flex;		/* 段組準備 */
		flex-wrap: wrap;
		width: 17em;		/* 横幅 */
		}

		.datelimitbox .submitbutton {
    margin-left: 2px;				/* 外側左の余白 */
    padding: 0.25em 0.5em;	/* 内側の余白量 */
    line-height: 1;			/* 行の高さ */
    height: 1.7rem;				/* 高さ */
    border: 1px solid #ccc;			/* 枠線 */
    background-color: #f0f0f0;	/* 背景色 */
    color: #14171a;	/* 文字色 */
    vertical-align: top;				/* 上揃え */
    -webkit-appearance: none;		/* ブラウザ初期装飾の無効化 */
    -moz-appearance: none;			/* ブラウザ初期装飾の無効化 */
    appearance: none;						/* ブラウザ初期装飾の無効化 */
    }
		.datelimitbox .submitbutton:hover {
    background-color: #999;	/* 背景色 */
    color: #fff;						/* 文字色 */
    }
		.datelimitbox select {
    width: 9em;				/* 横幅 */
    height: 1.7rem;		/* 高さ */
    padding: 0.2em;			/* 内側の余白量 */
    background-color: #fff;	/* 背景色 */
    border: 1px solid #ccc;			/* 枠線 */
    border-radius: 2px;		/* 角丸 */
		}
		.datelimitboxoptions {
		font-size: 0.9em;
		margin: 0.5em 0 1em 0;
		}
		span.datelimitboxoptions > label {
		margin-right: 0.5em;;
		}
			input[type="radio"] {
			display: inline-block;
			width: 1em;
			height: 1em;
			border: 1px solid #ccc;
			border-radius: 50%;
			vertical-align: text-top;
			appearance: none;
			-webkit-appearance: none;
			}
			input[type="radio"]:checked {
			border: 3px solid #0099ff;
			}

	/* ------------------------ */
	/* ▼ハッシュタグリスト区画 */
	/* ------------------------ */
	.hashtaglistarea {
	margin: 0;			/* 外側の余白量 */
	padding: 1em;		/* 内側の余白量 */
	border-bottom: 1px solid #e6ecf0;	/* 下線 */
	}
	/* ▼見出し */
	.hashtaglistarea .cornertitle {
		margin: 0 0 0.5em 0;		/* 外側の余白量 */
		font-weight: bold;			/* 太字 */
	}
		/* ▽ハッシュタグリスト */
		.hashtaglist {
			line-height: 1.5;		/* 行の高さ */
		}

		/* ▽ハッシュタグリストの1項目 */
		.hashtaglist li {
			display: inline-block;	/* インラインブロック化(横に並べる) */		/* ※ハッシュタグ一覧を横に並べたくない場合は、この行を削除して下さい。 */
		}

		/* ▽ハッシュタグリスト内の該当件数 */
		.hashtaglist .num {
			margin-left: 0.4em;	/* 外側左の余白量 */
			color: #aaa;		/* 文字色 */
		}

	/* -------------------- */
	/* ▼カテゴリツリー区画 */
	/* -------------------- */
	.categoryarea {
	margin: 0;			/* 外側の余白量 */
	padding: 1em;		/* 内側の余白量 */
	border-bottom: 1px solid #e6ecf0;	/* 下線 */
	}
	/* ▼見出し */
	.categoryarea .cornertitle {
		margin: 0 0 0.5em 0;		/* 外側の余白量 */
		font-weight: bold;			/* 太字 */
	}
		/* ▽カテゴリツリー */
		.categoryTree ul {
			list-style-type: disc;
		}
		/* ▽カテゴリツリー内の該当件数 */
		.categoryTree .num {
			display: inline-block;	/* インラインブロック化 */
			margin-left: 0.4em;			/* 外側左の余白量 */
			color: #aaa;						/* 文字色 */
		}
		.cattree.depth2 {
			list-style-type: circle;
		}

	/* -------------------- */
	/* ▼画像一覧リスト区画 */
	/* -------------------- */
	.imagelistarea {
		margin: 0;			/* 外側の余白量 */
		padding: 1em;		/* 内側の余白量 */
		border-bottom: 1px solid #e6ecf0;	/* 下線 */
	}
	/* ▼見出し */
	.imagelistarea .cornertitle {
		margin: 0 0 0.5em 0;		/* 外側の余白量 */
		font-weight: bold;			/* 太字 */
	}

	.imagelistitem {
		margin: 0.75%;
	}
		/* ………………… */
		/* ▼各画像の装飾 */	/* ここで画像の縦横サイズを制限しておかないと、原寸で表示されてしまいますので注意して下さい！ */
		/* ………………… */
		.imagelistbox {
			margin: 0 auto;				/* 外側の余白量 */
			display: flex;
			flex-wrap: wrap;
		}
		.imagelistbox .oneimage {
			width: 80px;				/* 画像を横方向に少なくとも3つは並べたい(※後のmax-widthの影響で4つ以上並ぶこともある) */
			height: auto;			/* 画像の高さは自動調整 */
			max-width: 100px;		/* 画像の横幅最大値 */
			max-height: 100px;		/* 画像の高さ最大値 */
			aspect-ratio: 1/1;		/* 画像を正方形にする */
			object-fit: cover;		/* 縦横比が合わなければトリミング */
			margin: 1%;				/* 画像周囲の余白量 */
			vertical-align: middle;	/* 画像下部に余計な空白ができるのを防ぐ */
		}

		/* ▼総数・総サイズの情報 */
		.imagesinfo {
			margin: 0.25em 0;		/* 外側の余白量(上下→左右) */
			text-align: right;		/* 右寄せ */
		}
			.totalimgfiles {
				font-size: 0.9em;		/* 文字サイズ */
			}
			.totalimgsizes {
				font-size: 0.8em;		/* 文字サイズ */
			}



	/* -------------------- */
	/* ▼フリースペース区画 */
	/* -------------------- */
	.freespacearea {
	margin: 0;			/* 外側の余白量 */
	padding: 1em;		/* 内側の余白量 */
	border-bottom: 1px solid #e6ecf0;	/* 下線 */
	}
	/* ▼見出し */
	.freespacearea .cornertitle {
		margin: 0 0 0.5em 0.25em;		/* 外側の余白量 */
		font-weight: bold;					/* 太字 */
		color: #657786;							/* 文字色 */
	}

		/* ▽フリースペースの本文 */
		.freespacebody {
		min-height: 4em;		/* 最小高 */
		}

		/* ▽フリースペース・プロフィール設定 */
		.profilebox {
		display: flex;	/* 段組準備 */
		margin: 0;			/* 外側の余白量 */
		padding: 0;			/* 内側の余白量 */
		width: 100%;		/* 横幅 */
		}

		/* プロフィールアイコン */
		.profileicon img {
		display: block;		/* ブロック化 */
		width: 4em;				/* 横幅 */
		height: 4em;			/* 高さ */
		margin-top: 0.2em;	/* 外側の余白量 */
		border: #e6ecf0 solid 1px;	/* 枠線 */
		border-radius: 50%;	/* 角丸：50%で円 */
		}

		/* プロフィール本文 */
		.profilebody {
		display: block;		/* ブロック化 */
		width: 26em;			/* 横幅 */
		padding-left: 0.5em;	/* 内側左の余白量 */
		color: #657786;				/* 文字色 */
		}

		/* プロフィール本文内・定義リスト */
		.profilebody dl dd {
			display: list-item;
			list-style-position: inside;
			list-style-image: url(images/cross.gif);
			margin-bottom: 0.5em;
			text-align: right;
		}

		/* ▽フリースペースの編集リンク */
		.freespaceedit {
			margin: 0;					/* 外側の余白量 */
			text-align: right;	/* 右寄せ */
			font-size: 0.75em;	/* 文字サイズ */
		}
		.freespaceedit a {
			color: #606984;			/* 文字色 */
			}

			/* ▽編集リンクにマウスが載ったとき */
			.freespaceedit a:hover {
				color: #72d5e5;		/* 文字色 */
		}

	/* ▼その他の情報表示 */
	.infotitle {
		font-size: 0.95em;	/* 文字サイズ */
		margin-left: 1.25em;
	}


/* ========================== */
/* ■ページ最下部(フッタ)領域 */
/* ========================== */
footer {
	width: 100%;				/* 横幅 */
	color: #93959a;			/* 文字色 */
}

	/* ▼管理操作リンク群 */
	footer .control-links {
		text-align: center;		/* 中央寄せ */
	}

	/* ▼戻るリンク */
	.backlink {
		text-align: center;		/* 中央寄せ */
		margin: 0;
		padding: 1em;
	}

	/* 著作権表示(Poweredby)のデザイン */
	.poweredby { margin: 0 1em; font-size: 11px; }


/* ======================================== */
/* ■メディアクエリ（レスポンシブデザイン） */
/* ======================================== */
	/* --------------------------------- */
	/* ▼iPad miniなどの小型タブレット用 */
	/* --------------------------------- */
	@media all and (min-width: 481px) and (max-width: 799px){
		/* タイトルとボタンの段組は解消 */
		header {display: flex;}
		.headtitle { display: block; }
		.headcontrol {
			display: block;
			margin-top: 6px;
		}
		.subarea  {
			margin: 0 auto;
		}
	}

	/* ---------------------------- */
	/* ▼iPhoneなどスマートフォン用 */
	/* ---------------------------- */
	@media all and (max-width: 480px) {
		body {
			min-height: 100dvh;		/* Safari向け */
			font-size: 14px;
			line-height: 1.5;
		}
		/* L:リスト(List) */
		.fusenbody > ul {
			list-style: none;
		}
		.fusenbody > ul.decorationL {
			list-style: disc inside;
		}

		/* ▼埋め込み画像 */
		.embeddedimage {
			margin: 0 auto;	/* 画像上下の余白量 */
		}
		/* ▼特定カテゴリ（caution）の画像にワンクッションを挟む指定 */
		.caution .embeddedimage { display: none; }
		.caution .imagelink {
			display: inline-block;
			left: 0;
			width: 240px;
			height: 144px;
			background-size: 240px 144px;
			background-image: url("https://izbox.flop.jp/homepage/img/caution_hwxga.png");	/* リンクをブロック化して背景画像を表示する */
		}
		/* ▼鍵付き画像BOX */
		.onelogbox.logstatus-lock .imagebox {
			width: 265px;
		}
	
		iframe {
			width: 250px !important;	/* 埋め込みフレームサイズ固定 */
			height: auto;
			margin-top: 0.5em;
		}

		.headarea {
		display: flex;
		align-items: center;
		width: 95%;
		}
		.headtitle {
		width: 100%;
		line-height: initial;
		}
		.subtitle {
		display: flex;
		justify-content: center;
		line-height: inherit;
		}
		.mainguide {
		font-size: 12px;
		line-height: 1.5;
		}
		.headcontrol {
			font-size: 15px;		/* 文字サイズ */
			width: 55px;
			top: auto;
			right: 4px;
		}
		.control-links {
			display: flex;		/* 段組み準備 */
			width: 55px;
		}
		.control-links a {
			width: 27px;
			height: 25px;
		}
		.contents,
		.onelogbox,
		.footer
		 {
			width: 95%;
			margin: 0 auto 1em;
		}
		.mainarea  {
			margin: 0 auto;
			padding: 6.75em 0.5em 0;
		}
		.subarea  {
			margin: 0 0.5em;
			padding: 0;
		}
		.infobody {	
			display: flex;
			justify-content: flex-end;
		}
		.fusentop {
			min-height: 1.8em;
		}
		.fusencontent {
			margin: auto;		/* 外側の余白量 */
			width: auto;	/* 横幅 */
			text-align: justify;	/* 均等割り付け */
			hanging-punctuation: allow-end last;	/* 句読点の行末ぶら下げ */
		}
		.dateseparator {
			display: flex;
			height: 56px;
			flex-wrap: wrap;
			align-content: center;
			justify-content: center;
		}
		.dateseparator a {
			display: inline-block;
			margin-left: 2px;
			margin-bottom: 2px;
			padding: 0 0.5em;
			width: 32em;
			font-size: 10px;
			line-height: 1.4;
			text-align: center;
			white-space: nowrap;
		}
		.imagelistbox  {
			width: 97%;
		}
		.imagelistitem {
			margin: 2%;
		}
		.imagelistbox .oneimage {
			width: 74px;
			height: auto;
		}
		.profilebox {
		display: flex;	/* 段組準備 */
		flex-direction: column;
		align-items: center;
		}
		.profilebody h3 {
		margin: 0;		/* 外側の余白 */
		}
		.profileicon img {
		width: 4em;				/* 横幅 */
		height: 4em;			/* 高さ */
		margin: 0;
		}
		.profilebody {
		width: 18em;			/* 横幅 */
		}
		.poweredby { text-align: center; }


	}


/* End of file */
