@charset "utf-8";

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

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

	■ページ最上部(ヘッダ)領域
		▼タイトル区画
		▼管理・投稿ボタン区画
		▼ヘッダ領域：画面の横幅が800px以上の場合
		▼ヘッダ領域：画面の横幅が480px以下の場合

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

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

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

	■投稿ボックス(一発言)ごとの表示
		▼投稿情報カラム
			▼ユーザアイコン＆ユーザ名リンク
		▼投稿本文カラム
			▼投稿本文
			▼続きを読むリンク（ボタン）
			▼投稿日時やカテゴリ名などの情報表示
		▼画面幅が狭い場合の上書き装飾

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

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

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

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

	■ページ最下部(フッタ)領域
*/


/* ============== */
/* ■全体共通装飾 */
/* ============== */
body {
	font-family: "メイリオ",Meiryo,"Hiragino Kaku Gothic ProN","Hiragino Sans",sans-serif;
	margin: 0;
	padding: 0;
}

	/* -------------- */
	/* ▼リンクの装飾 */
	/* -------------- */
	a:link { color: blue; }		/* 未訪問リンク */
	a:visited { color: #309; }	/* 既訪問リンク */
	a:hover { color: rgb(39, 151, 185); }	/* マウスが載ったとき */

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

	/* ---------------------------------------------------- */
	/* ▼汎用装飾(てがろぐ専用記法で書かれた場合のみ)：文字 */
	/* ---------------------------------------------------- */
	/* B:太字(Bold) */
	.decorationB {
		font-weight: bold;		/* 太字 */
	}
	/* D:削除(Delete) */
	.decorationD {
		color: #000000;	/* 文字色 */
		text-decoration-line: line-through;	/* 取り消し線 */
		text-decoration-color: rgb(0, 0, 0);			/* 線の色 */
	}
	/* E:強調(Emphasis) */
	.decorationE {
		color: rgb(0, 87, 210);	/* 文字色 */
		font-style: normal;
		font-weight: bold;
	}
	/* I:斜体(Italic) */
	.decorationI {
		font-style: italic;		/* 斜体 */
	}
	/* Q:引用(Quote) */
	.decorationQ {
		margin: 1em 0.3em 1em 1em;		/* 外側の余白(上→右→下→左) */
		padding: 0.75em 0.5em;			/* 内側の余白(上下→左右) */
		border-left: 5px double rgb(85, 148, 204);	/* 左端の枠線 */
		background-color: rgb(238, 255, 254);			/* 背景色 */
		font-size: 0.95em;				/* 文字サイズ */
		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: rgb(0, 255, 204);		/* 線配色 */
	}

	/* ---------------------- */
	/* ▼自由装飾用の装飾の例 */	/* 自由装飾は [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: rgb(250, 252, 255);	/* 背景色 */
		color: black;			/* 文字色 */
		border: 1px solid #eee;	/* 枠線 */
		border-radius: 3px;		/* 角丸 */
		padding: 0px 3px;		/* 内側の余白量 */
	}

	.deco-separator {
		display: block;					/* ブロック化 */
		border-bottom: 1px dotted gray;	/* 下線 */
	}

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

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

		/* 画像ボックスに含まれる画像 */
		.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%, #aaf0de 60%);		/* 文字の下半分くらいにマーカーっぽい線を引く */
	}

/* ========================== */
/* ■ページ最上部(ヘッダ)領域 */
/* ========================== */
header {
	display: table;				/* タイトルとボタンで2段組 */
	background-color: rgb(255, 255, 255);	/* 背景色 */
	width: 100%;				/* 横幅 */
}

	/* -------------- */
	/* ▼タイトル区画 */
	/* -------------- */
header {
	display: table;				/* タイトルとボタンで2段組 */
	background-color: rgb(255, 255, 255);	/* 背景色 */
	width: 100%;				/* 横幅 */
}

	/* -------------- */
	/* ▼タイトル区画 */
	/* -------------- */
	.headtitle {
		display: table-cell;	/* タイトルとボタンで2段組 */
		margin: 0;				/* 外側の余白量 */
		padding: 0.5em;			/* 内側の余白量 */
		color: #000;			/* 文字色 */
		line-height: 1;			/* 行の高さ */
	}

		/* ▽メインタイトル */
		.maintitle {
			margin: 0;			/* 外側の余白量 */
			text-decoration: none;	/* 下線を消す */
			width: 75%;
		}
		/* ▽メインタイトルのリンク */
		.maintitle a {
			color: rgb(27, 19, 178);			/* 文字色 */
			text-decoration: none;	/* 下線を消す */
		}
		/* ▽メインタイトルのリンクにマウスが載ったとき */
		.maintitle a:hover {
			color: rgb(170, 251, 255);				/* 文字色 */
		}

		/* ▽サブタイトル */
		.subtitle {
			display: inline-block;	/* インラインブロック化 */
			font-size: 0.55em;		/* 文字サイズ */
			color: #3b4577;
		}

		/* ▽タイトル下部の概要文 */
		.mainguide {
			margin: 5px 0 0 0;	/* 外側の余白量 */
			line-height: 1.2;	/* 行の高さ */
		}

	.topimg {
		width: 100%;
	}

	.topimg img {
		width: 100%;
	}

	/* ---------------------- */
	/* ▼管理・投稿ボタン区画 */
	/* ---------------------- */
	.headcontrol {
		display: table-cell;	/* タイトルとボタンで2段組 */
		float: right;		/* 右寄せ */
		vertical-align: middle;	/* 上下の中心寄せ */
		padding: 0 3px;			/* 内側の余白量 */
	}

	/* ▼ボタンの包含ボックス */
	.control-links {
		margin: 0;				/* 外側の余白量 */
	}

	/* ▼管理・投稿用リンクボタン */
	.headcontrol a {
		display: inline-block;		/* インラインブロック化 */
		text-align: center;			/* センタリング */
		border: 2px solid white;	/* 枠線 */
		border-radius: 0.5em;		/* 枠の角丸 */
		padding: 0.5em;				/* 内側の余白量 */
		margin-bottom: 1px;			/* 外側下の余白量 */
		background-color: rgb(27, 19, 178);;	/* 背景色 */
		color: white;				/* 文字色 */
		text-decoration: none;		/* 下線を消す */
		white-space: nowrap;		/* 折り返さない */
	}
	/* ▼管理・投稿用リンクボタンにマウスが載った際 */
	.headcontrol a:hover {
		text-decoration: underline;	/* 下線を引く */
		background-color: #ccfffe;	/* 背景色 */
		color: rgb(15, 10, 125);;				/* 文字色 */
	}

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

		/* タイトル区画 */
		.mainguide {
			line-height: 1;			/* 行の高さ */
		}
	}

	/* ----------------------------------------- */
	/* ▼ヘッダ領域：画面の横幅が480px以下の場合 */
	/* ----------------------------------------- */
	@media all and (max-width: 480px) {
		/* タイトル区画 */
		.maintitle {
			position: relative;
			top: 30px;
			width: 170px;
		}
		.subtitle {
			padding-top: 0.5em;
			font-size: 0.35em;		/* 文字サイズ */
			vertical-align: middle;	/* 上下の中心寄せ */
		}
		.mainguide {
			font-size: 0.8em;		/* 文字サイズ */
			line-height: 1.25;		/* 行の高さ */
		}
	}

/*========================*/
/*追従メニュー*/
/*========================*/
nav {
	/* ここから１カラムデザインのメニューバースクロール追従 */
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	background: rgba(255, 255, 255, 0.9);
	z-index: 1000;
	/* ここまで１カラムデザインのメニューバースクロール追従。不要なら削除してください */
}

nav {
	display: -webkit-box;
	display: flex;
	justify-content: space-around;
	padding: 10px;
	margin: 14px auto;
	border-top: 1px solid #9ebefa;
	border-bottom: 1px solid #9ebefa;
}

nav ul {
	display: flex;
	justify-content: space-around;
	padding: 0;
	margin: 0;
	width: 85%;
	list-style: none;
	position: relative;
}

nav ul li {
	position: relative;
	font-size: 14px;
}

nav ul li ul {
	position: absolute;
	top: 100%;
	left: 0;
	display: none;
	background-color: #ffffff;
	padding: 3px;
	border: 1px solid #ddd;
	width: 120px;
}

nav ul li ul .nav-works {
	position: absolute;
	top: 100%;
	left: 0;
	display: none;
	background-color: #ffffff;
	padding: 3px;
	border: 1px solid #ddd;
	width: 120px;
}

nav ul li ul .nav-post {
	position: absolute;
	top: 100%;
	left: 0;
	display: none;
	background-color: #ffffff;
	padding: 3px;
	border: 1px solid #ddd;
	width: 120px;
}

nav ul li ul .nav-shop {
	position: absolute;
	top: 100%;
	left: 0;
	display: none;
	background-color: #ffffff;
	padding: 3px;
	border: 1px solid #ddd;
	width: 100px;
}

nav ul li:hover ul {
	display: block;
}

nav ul li a {
	display: block;
	padding: 5px;
	text-decoration: none;
	color: #333;
}

nav ul li a:hover {
	background-color: #b9c1ff;
}

nav ul li a img {
	max-width: 20%;
}

@media (max-width: 480px) {
	nav ul li a img {
		max-width: 55%;
	}
}


/* ======================== */
/* ■入力フォームの表示領域 */		/* ※これはQUICKPOST用です。新規投稿専用画面や編集画面ではCGI内蔵のCSSが使われるため、ここの記述は適用されません。 */
/* ======================== */
.postform {
	background-color: white;	/* 背景色 */
	margin: 1em;			/* 外側の余白量 */
	padding: 1em;			/* 内側の余白量 */
}
.postform p {
	margin: 0;
}
	/* ------------ */
	/* ▼本文入力欄 */
	/* ------------ */
	textarea.tegalogpost {
		border: 2px rgb(27, 19, 178) solid;	/* 枠線 */
		border-radius: 0.67em;		/* 枠の角丸 */
		background-color: white;	/* 背景色 */
		font-size: 0.9rem;			/* 文字サイズ */
		padding: 0.5em;				/* 内側の余白量 */
		margin-bottom: 0.25em;		/* 外側下の余白量 */
		box-sizing: border-box;		/* サイズ解釈方法 */
		width: 100%;				/* 横幅 */
		height: 4.3em;				/* 高さ */
		overflow-wrap: break-word;	/* 折り返し方法 */
		overflow: auto;				/* はみ出した場合の処理 */
	}
		/* ▽プレースホルダ(※入力文字数がゼロの際にだけ見える薄文字)の装飾 */
		textarea.tegalogpost:placeholder-shown { color: #777; }			/* 通常時 */
		textarea.tegalogpost:focus:placeholder-shown { color: #bbb; }	/* カーソルが入ったとき */
		textarea.tegalogpost:-ms-input-placeholder { color: #aaa; }		/* for IE */

	/* 横幅800px以下の環境の場合 */
	@media all and (max-width: 800px) {
		textarea.tegalogpost {
			font-size: 16px;	/* 文字サイズ */
			padding: 0.4em;		/* 内側の余白量 */
		}
	}

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

	/* ------------ */
	/* ▼投稿ボタン */
	/* ------------ */
	.postbutton {
		display: inline-block;		/* インラインブロック化 */
		background: rgb(27, 19, 178);			/* 背景色 */
		color: white;				/* 文字色 */
		font-size: 1rem;			/* 文字サイズ */
		font-weight: bold;			/* 太字 */
		text-decoration: none;		/* 下線を消す */
		padding: 0.25em 0.75em;		/* 内側の余白量 */
		border: 1px solid #110f5b;	/* 枠線 */
		border-radius: 1em;			/* 枠の角丸 */
	}
	/* ▼投稿ボタンにマウスが載ったとき */
	.postbutton:hover {
		background-color: #4884c9;	/* 背景色 */
	}

	/* ------------------ */
	/* ▼文字装飾ボタン群 */	/* ★Ver 1.4.0以降で使用 */
	/* ------------------ */
	/* 掲載領域全体 */ .decoBtns { display: inline-block; margin-top: 0.5em; }
	/* 全ボタン装飾 */ .decoBtns input { min-width: 32px; min-height: 28px; margin:1px; background-color:#ffffff; border: 1px solid #cbbfff; 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; }

	/* 投稿欄下部：「鍵付き」チェックボックスと「個別鍵」ボタンの間を詰める一時的なスタイル */
	.funcUIs .catChecks { margin:0 0.75em 0 0; }
	.funcUIs .catChecks label { margin: 0; }

/* ================================================= */
/* ■段組構成（画面の幅が800px以上ある広い場合限定） */		/* ※段組(2カラム構成)にしたくない場合は、この区画を全削除して下さい。 */
/* ================================================= */
.prf-img {
	max-width: 100%;
	padding: 10px 15px;
}

@media all and (min-width: 800px) {

	/* -------------- */
	/* ▼大外枠の装飾 */
	/* -------------- */
	.contents {
		display: table;				/* 段組準備 */
		border-collapse: separate;	/* 段の間隔を空ける */
		border-spacing: 1em 0;		/* 段の間隔量 */
		margin: 0;					/* 外側の余白量 */
		padding: 0 15px;					/* 内側の余白量 */
		;
	}
	/* ---------------- */
	/* ▼メイン段の装飾 */
	/* ---------------- */
	.contents .mainarea {
		display: table-cell;	/* 段組 */
		width: 75%;				/* 横幅 */
		vertical-align: top;	/* 上に寄せる */
	}
	/* -------------- */
	/* ▼サブ段の装飾 */
	/* -------------- */
	.contents .subarea {
		display: table-cell;	/* 段組 */
		width: 25%;				/* 横幅 */
		vertical-align: top;	/* 上に寄せる */
	}
}


/* ====================== */
/* ■メイン(ログ掲載)領域 */
/* ====================== */
.mainarea {
	margin: 1em;	/* 外側の余白量 */
	padding: 0;		/* 内側の余白量 */
}

	/* ------------------------------------------ */
	/* ▼表示対象の限定時などの「限定条件」表示行 */
	/* ------------------------------------------ */
	.situation {
		margin: 0 0 1em 0;	/* 外側の余白量 */
		font-weight: bold;	/* 太字 */
		color: rgb(27, 19, 178);		/* 文字色 */
	}
	.situation:empty { display: none; }	/* 限定表示がない場合は存在自体を消す */

	/* -------------- */
	/* ▼日付境界バー */
	/* -------------- */
	.dateseparator {
		background-color: rgb(27, 19, 178);	/* 背景色 */
		color: white;			/* 文字色 */
		padding: 2px 1em;		/* 内側の余白量 */
	}

	/* ▼日付境界バーの表示文字列の先頭に付加する記号 */
	.dateseparator::before {
		content: '▼';			/* 何も付け加えたくない場合はこの1行を消して下さい */
	}

	/* ▼日付境界バー内のリンク(ボタン) */
	.dateseparator a {
		display: inline-block;	/* インラインブロック化 */
		margin-left: 1.5em;		/* 外側左の余白量 */
		color: white;			/* 文字色 */
		font-size: 0.75em;		/* 文字サイズ */
		font-weight: normal;	/* 太字を解除 */
		border: 1px solid rgb(204, 246, 255);	/* 枠線 */
		border-radius: 1em;		/* 枠の角丸 */
		padding: 0px 1em;		/* 内側の余白量 */
		text-decoration: none;	/* 下線を消す */
		vertical-align:middle;	/* 上下の中心寄せ */
	}
	/* ▼日付境界バー内のリンク(ボタン)にマウスが載ったとき */
	.dateseparator a:hover {
		background-color: rgb(204, 232, 238);	/* 背景色 */
		color: rgb(0, 58, 128);			/* 文字色 */
		border-color: rgb(235, 233, 135);		/* 枠線の色 */
	}


/* ================================ */
/* ■投稿ボックス(一発言)ごとの表示 */	/* ※この領域は、内側スキンで生成しているHTMLに対する装飾です。 */
/* ================================ */
.onelogbox {
	display: table;					/* 投稿情報と投稿本文とで2段組 */
	border-collapse: separate;		/* 段の間隔を空ける */
	border-spacing: 0 0.75em;		/* 段の間隔量 */
	border-bottom: 1px #ccc dashed;	/* 下線 */
	width: 100%;					/* 横幅 */
}

	/* ---------------- */
	/* ▼投稿情報カラム */
	/* ---------------- */
	.onelogside {
		display: table-cell;	/* 投稿情報と投稿本文とで2段組 */
		vertical-align: top;	/* 上に寄せる */
		text-align: center;		/* センタリング */
		width: 96px;			/* 横幅 */
		min-width: 64px;		/* 最低横幅 */
	}

		/* ………………………………………… */
		/* ▼ユーザアイコン＆ユーザ名リンク */
		/* ………………………………………… */
		.usericonlink {
			display: block;				/* ブロック化 */
			margin: 0 3px;				/* 外側の余白量 */
			padding: 0.75em 0;			/* 内側の余白量 */
			color: rgb(27, 19, 178);				/* 文字色 */
			background-color: #f5fcff;	/* 背景色 */
			border: 1px solid #9fb1ff;	/* 枠線 */
			border-radius: 1em;			/* 枠の角丸 */
			font-size: 0.67em;			/* 文字サイズ */
			line-height: 1;				/* 行の高さ */
			text-decoration: none;		/* 下線を消す */
		}
		/* ▽マウスが載ったとき */
		.usericonlink:hover {
			border-color: rgb(170, 236, 238);			/* 枠線の色 */
			background-color: #ffc;		/* 背景色 */
		}

			/* ‥‥‥‥‥‥‥ */
			/* ▼アイコン部分 */
			/* ‥‥‥‥‥‥‥ */
			.iconarea {
				display: block;		/* ブロック化 */
			}

			/* ‥‥‥‥‥‥‥ */
			/* ▼ユーザ名部分 */
			/* ‥‥‥‥‥‥‥ */
			.username {
				display: block;		/* ブロック化 */
				padding-top: 4px;	/* 内側上の余白量 */
			}

			/* ‥‥‥‥‥‥‥ */
			/* ▼メモ番号部分 */
			/* ‥‥‥‥‥‥‥ */
			.memonum {
				margin: 0.3em 0;	/* 外側の余白量 */
				font-size: 0.8em;	/* 文字サイズ */
				color: gray;		/* 文字色 */
			}

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

			/* ▽メモ番号のリンクにマウスが載ったとき */
			.memonum a:hover {
				color: red;			/* 文字色 */
			}

			/* ‥‥‥‥‥‥‥‥ */
			/* ▼New!サイン部分 */
			/* ‥‥‥‥‥‥‥‥ */
			.newsign {
				display: inline-block;	/* インラインブロック化 */
				color: #f55;			/* 文字色 */
				font-size: 0.8em;		/* 文字サイズ */
				margin-right: 0.35em;	/* 外側下の余白量 */
			}

	/* ---------------- */
	/* ▼投稿本文カラム */
	/* ---------------- */
	.onelogbody {
		display: table-cell;	/* 投稿情報と投稿本文とで2段組 */
		vertical-align: top;	/* 上に寄せる */
	}

		/* …………… */
		/* ▼投稿本文 */
		/* …………… */
		.comment {
			margin-left: 1em;		/* 外側左の余白量 */
			line-height: 1.55;		/* 行の高さ */
			min-height: 4em;		/* 最低限確保する高さ */
		}

			/* ‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥ */
			/* ▼本文内に含まれるハッシュタグリンク */
			/* ‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥‥ */
			.comment .taglink {
				display: inline-block;	/* インラインブロック化 */
				margin: 0 3px;			/* 外側の余白量 */
				text-decoration: none;	/* 下線を消す */
				word-break:break-all;	/* 自動リンクのはみ出しを防ぐ */
			}
			/* ▼ハッシュタグリンクにマウスが載ったとき */
			.comment .taglink:hover {
				color: #00cccc;					/* 文字色 */
				border-color: white;			/* 枠線の色 */
				text-decoration: underline;		/* 下線を引く */
			}

			/* ‥‥‥‥‥‥‥‥‥‥‥‥‥‥ */
			/* ▼続きを読むリンク（ボタン） */		/* ※注：「続きを読む」機能は、JavaScriptが無効な閲覧環境では機能せず、その場合はボタンも表示されません。 */
			/* ‥‥‥‥‥‥‥‥‥‥‥‥‥‥ */
			/* ▽ボタン枠の装飾(共通) */
			.readmorebutton {
				display: inline-block;	/* インラインブロック化 */
				padding: 1px 0.5em;		/* 内側の余白 */
				margin: 0 1px;			/* 外側の余白 */
				border: 1px solid #bbb;	/* 枠線の装飾 */
				border-radius: 0.5em;	/* 枠線の角丸 */
			}
			/* ▽ボタン表面の装飾(共通) */
			.readmorebutton:link,
			.readmorebutton:visited {
				background-color: rgb(27, 19, 178);	/* 背景色(グラデーション非対応の環境のみ) */
				color: white;		/* 文字色 */
				text-decoration: none;	/* リンク装飾を消す */
			}
			/* ▽ボタンにマウスが載った際の装飾(共通) */
			.readmorebutton:hover {
				background-image: none;		/* グラデーションなし */
				background-color: #00cccc;	/* 背景色 */
				color: white;				/* 文字色 */
				text-decoration: underline;	/* 下線を加える */
			}

			/* ▽開く（続きを読む）ボタン専用の装飾 */
			.readmorebutton.readmoreopen {
				font-size: 0.95em;		/* 文字サイズ */
			}

			/* ▽閉じる（畳む）ボタン専用の装飾 */
			.readmorebutton.readmoreclose {
				font-size: 0.75em;		/* 文字サイズ */
			}

		/* ……………………………………………… */
		/* ▼投稿日時やカテゴリ名などの情報表示 */
		/* ……………………………………………… */
		.oneloginfo {
			margin: 0.75em 0 0 0;	/* 外側の余白量 */
			color: #9fb1ff;			/* 文字色 */
			font-size: 0.8em;		/* 文字サイズ */
			text-align: right;		/* 右寄せ */
		}

			/* ‥‥‥‥‥‥‥ */
			/* ▼投稿ユーザID */
			/* ‥‥‥‥‥‥‥ */
			.postuserid {
				margin: 0 0.3em;	/* 外側の余白量 */
			}

			/* ▽ユーザIDのリンク */
			.postuserid a {
				text-decoration: none;		/* 下線を消す */
				color: inherit;				/* 文字色(継承) */
			}
			/* ▽ユーザIDのリンクにマウスが載ったとき */
			.postuserid a:hover {
				text-decoration: underline;	/* 下線を引く */
			}

			/* ‥‥‥‥‥‥‥‥‥ */
			/* ▼投稿日時のリンク */
			/* ‥‥‥‥‥‥‥‥‥ */
			.postdate a {
				display: inline-block;		/* インラインブロック化 */
				padding: 0 0.25em;			/* 内側の余白量 */
				color: rgb(27, 19, 178);			/* 文字色 */
				text-decoration: none;		/* 下線を消す */
			}

			/* ▽投稿日時リンクにマウスが載ったとき */
			.postdate a:hover {
				text-decoration: underline;	/* 下線を引く */
			}

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

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

			/* ‥‥‥‥‥‥ */
			/* ▼編集リンク */
			/* ‥‥‥‥‥‥ */
			.editlink a {
				display: inline-block;	/* インラインブロック化 */
				font-size: 0.82em;		/* 文字サイズ */
				color: black;			/* 文字色 */
				text-decoration: none;	/* 下線を消す */
				background-color: #ffffff;	/* 背景色 */
				border: 1px solid #ccc;	/* 枠線 */
				border-radius: 0.5em;	/* 枠の角丸 */
				padding: 0 0.5em;		/* 内側の余白量 */
			}

			/* ▽編集リンクにマウスが載ったとき */
			.editlink a:hover {
				color: white;			/* 文字色 */
				background-color: rgb(255, 238, 0);	/* 背景色 */
				border-color: rgb(255, 153, 0);		/* 枠線の色 */
			}

	/* ------------------------------ */
	/* ▼画面幅が狭い場合の上書き装飾 */
	/* ------------------------------ */
	@media all and (max-width: 480px) {
		/* ▼投稿情報カラム */
		.onelogside {
			width: 64px;		/* 横幅 */
		}
		/* ▼投稿本文 */
		.comment {
			margin-left: 0.3em;	/* 外側左の余白量 */
			line-height: 1.45;	/* 行の高さ */
		}
	}


/* ============================================================ */
/* ■鍵付き(パスワード保護)投稿に表示される鍵入力フォームの装飾 */
/* ============================================================ */
.passkeyform {
	display: inline-block;
	margin: 0;
	padding: 0.6em;
	background-color: #fff;
	border: 1px solid rgb(21, 11, 162);
	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 {
		}


/* ====================================================================== */
/* ■一発言だけが表示される際に追加表示されるユーティリティリンク群の装飾 */	/* 各投稿の個別ページでのみ表示される囲みナビ用の装飾です。表示項目の取捨選択や詳細な装飾方法は https://www.nishishi.com/cgi/tegalog/custom/#customizecss-utilitylinkbox をご覧下さい。 */
/* ====================================================================== */
.utilitylinks {
	margin: 2em 1em 1em 1em;	/* 外側の余白量 */
	padding: 0.5em;				/* 内側の余白量 */
	border: 1px solid rgb(119, 151, 170);		/* 枠線 */
	border-radius: 1em;			/* 枠の角丸 */
	background-color: rgb(221, 230, 255);		/* 背景色 */
	font-size: 0.9em;			/* 文字サイズ */
}
/* ▼ナビのリンクリスト */
.utilitylinks ul {
	color: #110f5b;			/* 文字色 */
}


/* ========================== */
/* ■ページナビゲーション領域 */
/* ========================== */
.pagenavi {
	margin: 2.5em 0px;			/* 外側の余白 */
	padding: 0.5em 0px;			/* 内側の余白 */
	text-align: center;			/* 中央寄せ */
	border-width: 3px 0px;		/* 枠線の太さ */
	border-style: dotted;		/* 枠線の種類 */
	border-color: #fff;		/* 枠線の配色 */
	background-color: white;	/* 背景色 */
	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: 0.2em 0.5em;		/* 内側の余白 */
		font-size: 1em;				/* 文字サイズ */
		font-weight: bold;			/* 太字 */
	}
	/* ▽現在のページ番号の装飾 */
	a.pagenumhere {
		text-decoration: none;		/* リンク装飾を消す */
		background-color: rgb(27, 19, 178);	/* 背景色 */
		color: white;				/* 文字色 */
		border-radius: 1em;			/* 角丸 */
	}
	/* ▽ページ番号リンクにマウスが載った際の装飾 */
	a.pagenumlink:hover {
		text-decoration: none;		/* リンク装飾を消す */
		background-color: #00cccc;	/* 背景色 */
		color: white;				/* 文字色 */
		border-radius: 0.3em;		/* 角丸 */
	}

	/* ------------------------------------ */
	/* ▼限定解除リンク(＝HOMEに戻るリンク) */
	/* ------------------------------------ */
	.pagehome {
		margin: 0.15em;		/* 外側の余白 */
		font-weight: bold;	/* 太字 */
	}


/* ========== */
/* ■サブ領域 */
/* ========== */
.subarea {
	margin: 1em 0 0 0;				/* 外側の余白量 */
	padding: 0 1em;					/* 内側の余白量 */
	background-color: rgb(255, 255, 255);			/* 背景色 */
	border-left: 1px solid rgb(27, 19, 178);	/* 枠線(左側) */
}

	/* --------------------------------- */
	/* ▼サブ領域の見出し(DASHBOARD)部分 */
	/* --------------------------------- */
	.subhead {
		border-bottom: 3px double rgb(27, 19, 178);	/* 下線 */
		line-height: 1;						/* 行の高さ */
		text-align: center;					/* センタリング */
		font-weight: bold;					/* 太字 */
		color: rgb(27, 19, 178);						/* 文字色 */
	}

	/* ------------ */
	/* ▼検索窓区画 */
	/* ------------ */
	.searcharea {
		margin: 0 0 1em 0;					/* 外側の余白量 */
		padding: 0 0 1em 0;					/* 内側の余白量 */
		border-bottom: 1px dashed rgb(27, 19, 178);	/* 下線 */
	}
	/* ▼見出し */
	.searcharea .cornertitle {
		font-weight: bold;
		margin: 0;
		color: rgb(27, 19, 178);
		text-shadow: 1px 1px 1px rgb(27, 19, 178);
	}

		/* ▽検索フォーム */
		.searchbox {
			margin: 0;		/* 外側の余白量 */
		}
			/* 検索語(テキスト)入力欄 */
			.queryinput {
				border: 2px solid rgb(27, 19, 178);
				border-radius: 0.5em;
				font-size: 1em;
				padding: 0.25em 0.5em;
				max-width: calc( 25vw - 9em);	/* 横幅最大値 */
				min-width: 150px;				/* 横幅最小値 */
			}
			/* 検索(送信)ボタン */
			.searchbox .submitbutton {
				background-color: rgb(27, 19, 178);
				border: 1px solid #00cccc;
				font-size: 1em;
				padding: 0.25em 0.67em;
				border-radius: 1em;
				font-weight: bold;
				color: white;
				display: inline-block;
				margin: 0 0 0 3px;
			}
			.searchbox .submitbutton:hover {
				background-color: #9fb1ff;
				color: rgb(27, 19, 178);
			}

		/* ▽検索対象を限定するチェックボックス */
		.searchtarget {
			margin: 0;
			font-size: 0.9em;
			line-height: 1.3;
		}

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

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

			/* 検索オプションリスト */
			.searchoptions {
				font-size: 0.9em;
				margin: 0.75em 0 1em 1em;
				padding: 0 0 0 0.5em;
			}

			/* 項目名 */
			.solabel {
				display: inline-block;
				min-width: 5em;
			}

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

	/* ------------------------ */
	/* ▼新着画像一覧リスト区画 */
	/* ------------------------ */
	.imagelistarea {
		background-color: #d1fff4;
		margin: 0 0 1em 0;					/* 外側の余白量 */
		padding: 0 0 1em 0;					/* 内側の余白量 */
		border-bottom: 1px dashed rgb(27, 19, 178);	/* 下線 */
	}
	/* ▼見出し */
	.imagelistarea .cornertitle {
		margin: 0;							/* 外側の余白量 */
		font-weight: bold;					/* 太字 */
		color: rgb(193, 182, 68);						/* 文字色 */
		text-shadow: 1px 1px 1px white;		/* 文字の影 */
	}

		/* ………………………………………… */
		/* ▼新着画像リスト内の各画像の装飾 */	/* ここで画像の縦横サイズを制限しておかないと、原寸で表示されてしまいますので注意して下さい！ */
		/* ………………………………………… */
		.imagelistbox {
			margin: 0;				/* 外側の余白量 */
			text-align: center;		/* センタリング */
		}
			/* ▽画像リストの1項目枠 */
			.imagelistitem {
				display: inline-block;
				width: 30%;				/* 横方向に少なくとも3つは並べたい(※後のmax-widthの影響で4つ以上並ぶこともある) */
				max-width: 100px;		/* 横幅最大値 */
				max-height: 100px;		/* 高さ最大値 */
				margin: 1%;				/* 周囲の余白量 */
				vertical-align: middle;	/* 枠の下部に余計な空白ができるのを防ぐ */
				overflow: hidden;		/* 画像がぼかされている場合に、ぼかしが枠からはみ出ないようにする */
				border: #00a solid 2px;
			}

				/* ▽画像リストの1項目内の画像そのもの */
				.imagelistbox .oneimage {
					width: 100%;
					height: auto;			/* 画像の高さは自動調整 */
					aspect-ratio: 1/1;		/* 画像を正方形にする */
					object-fit: cover;		/* 縦横比が合わなければトリミング */
					vertical-align: middle;	/* 画像下部に余計な空白ができるのを防ぐ */
				}

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

	/* ------------------------------ */
	/* ▼アフィリエイト */
	/* ------------------------------ */
	.af-area {
		margin: 0 0 1em 0;					/* 外側の余白量 */
		padding: 0 0 1em 0;					/* 内側の余白量 */
		border-top: 1px dashed rgb(27, 19, 178);
		border-bottom: 1px dashed rgb(27, 19, 178);	/* 下線 */
		background-color: white;
	}
	/* ▼見出し */
	.af-area .cornertitle {
		margin: 0;							/* 外側の余白量 */
		font-weight: bold;					/* 太字 */
		color: rgb(85, 170, 157);						/* 文字色 */
		text-shadow: 1px 1px 1px white; 	/* 文字の影 */
	}


	.recitem a img {
		box-shadow: 5px 5px 5px rgb(138, 138, 138);
	}

	.wrap {
		display: -webkit-box;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		height: 30%;
	}
	
	.wrap .inner {
		-webkit-box-flex: 1;
						flex: 1;
		margin-bottom: 30px;
	}

	.wrap-3col {
		display: -webkit-box;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		padding: 5px 10px;
	}
	
	.wrap-3col .inner {
		-webkit-box-flex: 1;
						flex: 1;
		margin-bottom: 30px;
	}

	@media (max-width: 480px) {
		/* ------------------------------ */
	/* ▼アフィリエイト */
	/* ------------------------------ */
	@media only screen and (min-width: 768px) {
		.wrap {
			-webkit-box-orient: horizontal;
			-webkit-box-direction: normal;
							flex-direction: row;
			-webkit-box-pack: justify;
							justify-content: space-between;
		}
		.wrap .inner {
			width: 46%;
			-webkit-box-flex: 0;
							flex: none;
		}
	}

	.wrap-3col {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
            flex-direction: row;
    -webkit-box-pack: justify;
            justify-content: space-between;
  }
  .wrap-3col .inner {
    width: 31%;
    -webkit-box-flex: 0;
            flex: none;
  }
	}

	/* ------------------------------ */
	/* ▼サンクス */
	/* ------------------------------ */
	.thanks-area {
		margin: 0 0 1em 0;					/* 外側の余白量 */
		padding: 0 0 1em 0;					/* 内側の余白量 */
		border-top: 1px dashed rgb(27, 19, 178)rgb(0, 53, 128);
		border-bottom: 1px dashed rgb(27, 19, 178);	/* 下線 */
		background-color: #e5fffd;
	}
	/* ▼見出し */
	.thanks-area .cornertitle {
		margin: 0;							/* 外側の余白量 */
		font-weight: bold;					/* 太字 */
		color: rgb(85, 170, 157);						/* 文字色 */
		text-shadow: 1px 1px 1px white; 	/* 文字の影 */
	}

	/* ------------------------ */
	/* ▼ハッシュタグリスト区画 */
	/* ------------------------ */
	.hashtaglistarea {
		margin: 0 0 1em 0;					/* 外側の余白量 */
		padding: 0 0 1em 0;					/* 内側の余白量 */
		border-bottom: 1px dashed rgb(27, 19, 178);	/* 下線 */
	}
	/* ▼見出し */
	.hashtaglistarea .cornertitle {
		margin: 0;							/* 外側の余白量 */
		font-weight: bold;					/* 太字 */
		color: rgb(85, 106, 136);						/* 文字色 */
		text-shadow: 1px 1px 1px white;		/* 文字の影 */
	}
		/* ▽ハッシュタグリスト */
		.hashtaglist {
			list-style-type: none;	/* リストの先頭記号(なし) */
			margin: 0.5em 0;		/* 外側の余白量 */
			padding: 0.75em;		/* 内側の余白量 */
			background-color: white;	/* 背景色 */
			border-radius: 0.5em;	/* 角丸 */
			line-height: 1.5;		/* 行の高さ */
		}

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

		/* ▽ハッシュタグリスト内の該当件数 */
		.hashtaglist .num {
			font-size: 0.9em;		/* 文字サイズ */
			color: #00a;			/* 文字色 */
			margin-left: 0.25em;	/* 外側左の余白量 */
		}

	/* プルダウンメニュー版ハッシュタグ一覧の装飾 */
	.hashtagpull {
	    max-width: 200px;
	}

		/* -------------------- */
		/* ▼新着投稿リスト区画 */
		/* -------------------- */
		.latestpostarea {
			margin: 0 0 1em 0;
			/* 外側の余白量 */
			padding: 0 0 1em 0;
			/* 内側の余白量 */
			border-bottom: 1px dashed #1b13b2;
			/* 下線 */
		}
	
		/* ▼見出し */
		.latestpostarea .cornertitle {
			margin: 0;
			/* 外側の余白量 */
			font-weight: bold;
			/* 太字 */
			color: #1b13b2;
			/* 文字色 */
			text-shadow: 1px 1px 1px white;
			/* 文字の影 */
		}
	
		/* ▽新着投稿グリスト */
		.latestpostlist {
			margin: 0.5em 0;
			/* 外側の余白量 */
			padding: 0.6em 0.2em 0.1em 0.5em;
			/* 内側の余白量 */
			background-color: white;
			/* 背景色 */
			border-radius: 0.5em;
			/* 角丸 */
			line-height: 1.25;
			/* 行の高さ */
		}
	
		/* 各項目 */
		.latestpostlist li {
			margin: 0.5em 0;
		}
	
		/* タイトルリンク以外の項目 */
		.latestpostlist span {
			display: inline-block;
			font-size: 0.8em;
		}
				.latestpostlist .postdate { color: gray; }	/* 投稿日付 */
				.latestpostlist .posttime { color: gray; }	/* 投稿時刻 */
				.latestpostlist .username { color: #556588; }	/* 投稿者名 */
				.latestpostlist .userid   { color: #675588; }	/* 投稿者ID */
				.latestpostlist .postid   { color: gray; }		/* 投稿番号 */
				.latestpostlist .length   { color: gray; }	/* 本文文字数 */

	/* -------------------- */
	/* ▼フリースペース区画 */
	/* -------------------- */
	.freespacearea {
		margin: 0 0 1em 0;					/* 外側の余白量 */
		padding: 0 0 1em 0;					/* 内側の余白量 */
		border-bottom: 1px dashed rgb(27, 19, 178);	/* 下線 */
	}
	/* ▼見出し */
	.freespacearea .cornertitle {
		margin: 0;							/* 外側の余白量 */
		font-weight: bold;					/* 太字 */
		color: rgb(85, 170, 157);						/* 文字色 */
		text-shadow: 1px 1px 1px white; 	/* 文字の影 */
	}

		/* ▽フリースペースの本文 */
		.freespacebody {
			margin: 0.5em 0;		/* 外側の余白量 */
			padding: 0.75em;		/* 内側の余白量 */
			background-color: #fdffff;	/* 背景色 */
			border-radius: 0.5em;	/* 角丸 */
			line-height: 1.5;		/* 行の高さ */
		}

		/* ▽フリースペースの編集リンク */
		.freespaceedit {
			margin: 0;
			text-align: right;
			font-size: 0.75em;
		}

	/* ▼その他の情報表示 */
	.infotitle {
		margin: 1em 0 0 0;
		border-bottom: 1px dotted #ccc;
		font-size: 0.95em;
	}
	.infobody {
		margin: 0 0 1em 0;
		padding-top: 0.25em;
		text-align: right;
	}

/* ========================== */
/* ■ページ最下部(フッタ)領域 */
/* ========================== */
footer {
	margin: 1em 0px 0px 0px;	/* 外側の余白 */
	padding: 0.5em 0px;			/* 内側の余白 */
	background-color: rgb(27, 19, 178);	/* 背景色 */
	color: white;				/* 文字色 */
}

	/* ▼管理操作リンク群 */
	footer .control-links {
		text-align: center;		/* 中央寄せ */
		margin: 0.5em;			/* 外側の余白量 */
	}

	/* ▼戻るリンク */
	.backlink {
		text-align: center;		/* 中央寄せ */
		margin: 0.5em;			/* 外側の余白量 */
	}

	/* ▼フッタ内リンクの装飾 */
	footer a:link    { color: white; }  	/* 未訪問 */
	footer a:visited { color: white; }  	/* 訪問済み */
	footer a:hover   { color: yellow; } 	/* マウスが乗ったとき */
	footer a:active  { color: #ccffcc; }	/* アクティブ時 */

	/* Powered-by表記のデザイン */
	.poweredby { margin: 2em 1em 0px 1em; font-size: 0.8em; }

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

	/* -------------- */
	/* ▼大外枠の装飾 */
	/* -------------- */
	.contents {
		display: table;				/* 段組準備 */
		border-collapse: separate;	/* 段の間隔を空ける */
		border-spacing: 1em 0;		/* 段の間隔量 */
		margin: 0;					/* 外側の余白量 */
		padding: 0;					/* 内側の余白量 */
		width: 100%;				/* 横幅 */
	}


/* ====================== */
/* ■メイン(ログ掲載)領域 */
/* ====================== */
.mainarea {
	margin: 1em;	/* 外側の余白量 */
	padding: 0;		/* 内側の余白量 */
}

	/* ------------------------------------------ */
	/* ▼表示対象の限定時などの「限定条件」表示行 */
	/* ------------------------------------------ */
	.situation {
		margin: 0 0 1em 0;	/* 外側の余白量 */
		font-weight: bold;	/* 太字 */
		color: rgb(138, 175, 224);		/* 文字色 */
	}
	.situation:empty { display: none; }	/* 限定表示がない場合は存在自体を消す */

	/* -------------- */
	/* ▼日付境界バー */
	/* -------------- */
	.dateseparator {
		background-color: rgb(187, 187, 252);	/* 背景色 */
		color: white;			/* 文字色 */
		padding: 2px 1em;		/* 内側の余白量 */
	}

	/* ▼日付境界バーの表示文字列の先頭に付加する記号 */
	.dateseparator::before {
		content: '▼';			/* 何も付け加えたくない場合はこの1行を消して下さい */
	}

	/* ▼日付境界バー内のリンク(ボタン) */
	.dateseparator a {
		display: inline-block;	/* インラインブロック化 */
		margin-left: 1.5em;		/* 外側左の余白量 */
		color: rgb(204, 235, 255);			/* 文字色 */
		font-size: 0.75em;		/* 文字サイズ */
		font-weight: normal;	/* 太字を解除 */
		border: 1px solid rgb(255, 253, 204);	/* 枠線 */
		border-radius: 1em;		/* 枠の角丸 */
		padding: 0px 1em;		/* 内側の余白量 */
		text-decoration: none;	/* 下線を消す */
		vertical-align:middle;	/* 上下の中心寄せ */
	}
	/* ▼日付境界バー内のリンク(ボタン)にマウスが載ったとき */
	.dateseparator a:hover {
		background-color: rgb(204, 232, 238);	/* 背景色 */
		color: rgb(0, 58, 128);			/* 文字色 */
		border-color: rgb(235, 233, 135);		/* 枠線の色 */
	}

			/* ‥‥‥‥‥‥‥‥‥ */
			/* ▼投稿日時のリンク */
			/* ‥‥‥‥‥‥‥‥‥ */
			.postdate a {
				display: inline-block;		/* インラインブロック化 */
				padding: 0 0.25em;			/* 内側の余白量 */
				color: rgb(79, 203, 252);			/* 文字色 */
				text-decoration: none;		/* 下線を消す */
			}

/* ============================================================ */
/* ■鍵付き(パスワード保護)投稿に表示される鍵入力フォームの装飾 */
/* ============================================================ */
.passkeyform {
	display: inline-block;
	margin: 0;
	padding: 0.6em;
	background-color: #fff;
	border: 1px solid rgb(21, 11, 162);
	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;
	}


/* ====================================================================== */
/* ■一発言だけが表示される際に追加表示されるユーティリティリンク群の装飾 */	/* 各投稿の個別ページでのみ表示される囲みナビ用の装飾です。表示項目の取捨選択や詳細な装飾方法は https://www.nishishi.com/cgi/tegalog/custom/#customizecss-utilitylinkbox をご覧下さい。 */
/* ====================================================================== */
.utilitylinks {
	margin: 2em 1em 1em 1em;	/* 外側の余白量 */
	background-color: rgb(17, 29, 61);		/* 背景色 */
}
/* ▼ナビのリンクリスト */
.utilitylinks ul {
	color: rgb(91, 211, 255);			/* 文字色 */
}


/* ========================== */
/* ■ページナビゲーション領域 */
/* ========================== */
.pagenavi {
	border-color: #808ea0;		/* 枠線の配色 */
	background-color: #fff;	/* 背景色 */
}

/* ========== */
/* ■サブ領域 */
/* ========== */
.subarea {
	margin: 1em 0 0 0;				/* 外側の余白量 */
	padding: 0 1em;					/* 内側の余白量 */
	background-color: rgb(255, 255, 255);			/* 背景色 */
	border-left: 1px solid rgb(27, 19, 178);	/* 枠線(左側) */
}

	/* --------------------------------- */
	/* ▼サブ領域の見出し(DASHBOARD)部分 */
	/* --------------------------------- */
	.subhead {
		border-bottom: 3px double rgb(27, 19, 178);	/* 下線 */
		line-height: 1;						/* 行の高さ */
		text-align: center;					/* センタリング */
		font-weight: bold;					/* 太字 */
		color: rgb(27, 19, 178);						/* 文字色 */
	}

	/* ------------ */
	/* ▼検索窓区画 */
	/* ------------ */
	.searcharea {
		margin: 0 0 1em 0;					/* 外側の余白量 */
		padding: 0 0 1em 0;					/* 内側の余白量 */
		border-bottom: 1px dashed rgb(238, 243, 255);	/* 下線 */
	}
	/* ▼見出し */
	.searcharea .cornertitle {
		font-weight: bold;
		margin: 0;
		color: rgb(255, 255, 255);
		text-shadow: 1px 1px 1px white;
	}

		/* ▽検索フォーム */
		.searchbox {
			margin: 0;		/* 外側の余白量 */
		}
			/* 検索語(テキスト)入力欄 */
			.queryinput {
				border: 2px solid rgb(136, 143, 170);
				border-radius: 0.5em;
				font-size: 1em;
				padding: 0.25em 0.5em;
				max-width: calc( 25vw - 9em);	/* 横幅最大値 */
				min-width: 150px;				/* 横幅最小値 */
			}
			/* 検索(送信)ボタン */
			.searchbox .submitbutton {
				background-color: rgb(0, 9, 128);
				border: 1px solid rgb(0, 62, 128);
				font-size: 1em;
				padding: 0.25em 0.67em;
				border-radius: 1em;
				font-weight: bold;
				color: white;
				display: inline-block;
				margin: 0 0 0 3px;
			}
			.searchbox .submitbutton:hover {
				background-color: rgb(0, 102, 204);
				color: rgb(47, 36, 131);
			}

		/* ▽検索対象を限定するチェックボックス */
		.searchtarget {
			margin: 0;
			font-size: 0.9em;
			line-height: 1.3;
		}

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

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

			/* 検索オプションリスト */
			.searchoptions {
				font-size: 0.9em;
				margin: 0.75em 0 1em 1em;
				padding: 0 0 0 0.5em;
			}

			/* 項目名 */
			.solabel {
				display: inline-block;
				min-width: 5em;
			}

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

	/* ------------------------ */
	/* ▼新着画像一覧リスト区画 */
	/* ------------------------ */
	.imagelistarea {
		background-color: #cbfffc;
		border-bottom: 1px dashed rgb(34, 204, 213);	/* 下線 */
	}
	/* ▼見出し */
	.imagelistarea .cornertitle {
		color: rgb(223, 204, 81);						/* 文字色 */
		text-shadow: 1px 1px 1px white;		/* 文字の影 */
	}

	/* ------------------------------ */
	/* ▼日付一覧リスト・日付検索区画 */
	/* ------------------------------ */
	.datelistarea {
		margin: 0 0 1em 0;					/* 外側の余白量 */
		padding: 0 0 1em 0;					/* 内側の余白量 */
		border-bottom: 1px dashed rgb(255, 255, 255);	/* 下線 */
	}
	/* ▼見出し */
	.datelistarea .cornertitle {
		margin: 0;							/* 外側の余白量 */
		font-weight: bold;					/* 太字 */
		color: rgb(34, 204, 213);						/* 文字色 */
	}

		/* …………………………… */
		/* ▼日付リンクリスト区画 */
		/* …………………………… */
		/* ▽日付リスト(年単位) */
		.datelimitlist {
			background-color: rgb(192, 208, 255);	/* 背景色 */
		}

		/* ▽日付リスト内の該当件数 */
		.datelimitlist .num {
			color: #66a;			/* 文字色 */
		}

		/* …………………………………… */
		/* ▼日付プルダウンメニュー区画 */
		/* …………………………………… */
		.datelimitbox {
			background-color: rgb(192, 208, 255);	/* 背景色 */
		}

	/* ------------------------ */
	/* ▼ハッシュタグリスト区画 */
	/* ------------------------ */
	.hashtaglistarea {
		border-bottom: 1px dashed rgb(255, 255, 255);	/* 下線 */
	}
	/* ▼見出し */
	.hashtaglistarea .cornertitle {
		color: rgb(255, 255, 255);						/* 文字色 */
		text-shadow: 1px 1px 1px white;		/* 文字の影 */
	}
		/* ▽ハッシュタグリスト */
		.hashtaglist {
			background-color: #fff;	/* 背景色 */
		}

		/* ▽ハッシュタグリスト内の該当件数 */
		.hashtaglist .num {
			color: rgb(34, 204, 213);			/* 文字色 */
		}

	/* -------------------- */
	/* ▼カテゴリツリー区画 */
	/* -------------------- */
	.categoryarea {
		border-bottom: 1px dashed rgb(255, 255, 255);	/* 下線 */
	}
		/* ▽見出し */
		.categoryarea .cornertitle {
			color: rgb(255, 255, 255);						/* 文字色 */
			text-shadow: 1px 1px 1px white;		/* 文字の影 */
		}
		.categoryTree {
			background-color: rgb(192, 208, 255);	/* 背景色 */
			border: 1px solid #eee;	/* 枠線 */
		}

	/* -------------------- */
	/* ▼新着投稿リスト区画 */
	/* -------------------- */
	.latestpostarea {
		border-bottom: 1px dashed rgb(255, 255, 255);	/* 下線 */
	}
	/* ▼見出し */
	.latestpostarea .cornertitle {
		font-weight: bold;					/* 太字 */
		color: rgb(34, 204, 213);						/* 文字色 */
	}
		/* ▽新着投稿グリスト */
		.latestpostlist {
			background-color: #fff;	/* 背景色 */
		}
			/* 各項目 */
			.latestpostlist li {
				margin: 0.75em 0;
			}
			/* タイトルリンク以外の項目 */
			.latestpostlist span {
				display: inline-block;
				font-size: 0.8em;
			}
				.latestpostlist .postdate { color: gray; }	/* 投稿日付 */
				.latestpostlist .posttime { color: gray; }	/* 投稿時刻 */
				.latestpostlist .username { color: #556588; }	/* 投稿者名 */
				.latestpostlist .userid   { color: #675588; }	/* 投稿者ID */
				.latestpostlist .postid   { color: gray; }		/* 投稿番号 */
				.latestpostlist .length   { color: gray; }	/* 本文文字数 */

	/* ---------------- */
	/* ▼カレンダー区画 */
	/* ---------------- */
	.calendararea {
		margin: 0 0 1em 0;					/* 外側の余白量 */
		padding: 0 0 1em 0;					/* 内側の余白量 */
		border-bottom: 1px dashed rgb(255, 255, 255);	/* 下線 */
	}
	/* ▼見出し */
	.calendararea .cornertitle {
		margin: 0;							/* 外側の余白量 */
		font-weight: bold;					/* 太字 */
		color: rgb(0, 0, 0);						/* 文字色 */
		text-shadow: 1px 1px 1px rgb(215, 215, 215);		/* 文字の影 */
	}

		/* ▽カレンダーカバー */
		.calendarplace {
			margin: 0.5em 0;		/* 外側の余白量 */
			padding: 0.75em;		/* 内側の余白量 */
			background-color: #fff;	/* 背景色 */
			border-radius: 0.5em;	/* 角丸 */
			line-height: 1.5;		/* 行の高さ */
			overflow: auto;			/* はみ出る場合の処理 */
		}

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

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

			/* 年月キャプション */
			.calendar caption {
				color: rgb(255, 255, 255);		/* 文字色 */
			}

			/* 曜日行 */
			.daysofweek th {
				background-color: #3f4e90;
				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.2em;			/* 横幅 */
				height: 1.1em;			/* 高さ */
				background-color: transparent;
			}

			/* 日付数値のリンク（※リンクになる場合だけの装飾） */
			.calendar td a {
				background-color: #93dfcc;	/* 背景色 */
				color: #000;				/* 文字色 */
			}
			/* 日付数値のリンクにマウスが載った際 */
			.calendar td a:hover {
				background-color: rgb(126, 204, 211);	/* 背景色 */
				color: #000;				/* 文字色 */
			}

			/* 今日の枠（カレンダー内での「今日」のセルだけの装飾） */
			.today {
				background-color: #ffffcc;	/* 背景色 */
			}

	/* -------------------- */
	/* ▼フリースペース区画 */
	/* -------------------- */
	.freespacearea {

		border-bottom: 1px dashed rgb(255, 255, 255);	/* 下線 */
	}
	/* ▼見出し */
	.freespacearea .cornertitle {
		color: rgb(34, 204, 213);						/* 文字色 */
	}

		/* ▽フリースペースの本文 */
		.freespacebody {
			background-color: #fdffff;	/* 背景色 */
		}

	/* ------------------------------ */
	/* ▼リンク集 */
	/* ------------------------------ */
	ul.link01 {
		display: -webkit-box;
		display: flex;
		flex-wrap: wrap;
		-webkit-box-pack: start;
						justify-content: flex-start;
		margin: 10px 0;
		text-align: center;
		list-style: none;
	}
	
	ul.link01 li {
		margin-right: 8px;
		margin-top: 5px;
		max-width: 100px;
	}

	ul.link01 li a img {
		max-width: 100px;
	}

	.link-area {
		border-top: 1px dashed rgb(0, 53, 128);
		border-bottom: 1px dashed rgb(0, 53, 128);	/* 下線 */
		background-color: #fff;
	}
	/* ▼見出し */
	.link-area .cornertitle {
		color: rgb(85, 170, 157);						/* 文字色 */
		text-shadow: 1px 1px 1px white; 	/* 文字の影 */
	}

	.link-area ul.link02 {
		display: -webkit-box;
		display: flex;
		flex-wrap: wrap;
		list-style: none;
	}
	
	.link-area .link02 li a {
		display: block;
		width: -webkit-fit-content;
		width: -moz-fit-content;
		width: fit-content;
	}
	
	.link-area .link02 li:not(:last-of-type) {
		padding-right: 5px;
		margin-right: 5px;
		border-right: 1px solid #ece8fa;
	} 

	/* ------------------------------ */
	/* ▼サンクス */
	/* ------------------------------ */
	.thanks-area {
		border-top: 1px dashed rgb(0, 53, 128);
		border-bottom: 1px dashed rgb(0, 53, 128);	/* 下線 */
		background-color: #fff;
	}
	/* ▼見出し */
	.thanks .cornertitle {
		color: rgb(85, 170, 157);						/* 文字色 */
		text-shadow: 1px 1px 1px white; 	/* 文字の影 */
	}
	
}

.link-container {
  display: flex;
  flex-wrap: wrap;
  max-width: 100%;
}
  
.icon-link {
  border: 1px solid #ccc; /* 枠のスタイル */
  padding: 10px; /* 内側の余白 */
  margin: 5px;
  width: 100%;
  border-radius: 10px;
}
  
.icon-link a {
  display: flex;
  align-items: flex-start; /* 上に揃える */
  text-decoration: none;
  color: black;
  width: 100%;
}
  
.icon-link .icon {
  width: 30%; /* リンク幅の20% */
  margin-right: 10px;
}
  
.text-container {
  display: flex;
  flex-direction: column;
}
  
.icon-link a:hover {
  text-decoration: underline;
}

/*ボタン*/
a.btn {
  display: inline-block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 10px 30px;
  background: gray;
  color: #ffffff;
  margin: 20px auto;
  -webkit-transition: .2s;
  transition: .2s;
  box-shadow: 0 7px #0A0A2A;
}

a.btn:hover, a.btn:active {
  background: #b3b3b3;
  -webkit-transition: .2s;
  transition: .2s;
  box-shadow: none;
  position: relative;
  top: 7px;
}

a.btn.white {
  background: #ffffff;
  color: #000000;
}

a.btn.white:hover {
  color: #333333;
  -webkit-transition: .2s;
  transition: .2s;
}

a.btn.black {
  background: #000000;
}

a.btn.black:hover {
  background: #262626;
  -webkit-transition: .2s;
  transition: .2s;
}

a.btn.pink {
  background: #fa3c72;
}

a.btn.pink:hover {
  background: #fc87a8;
  -webkit-transition: .2s;
  transition: .2s;
  color: #ffffff;
}

a.btn.red {
  background: #ff0000;
}

a.btn.red:hover {
  background: #fa3c72;
  -webkit-transition: .2s;
  transition: .2s;
  color: #ffffff;
}

a.btn.lpink {
  background: #F6A3D5;
}

a.btn.lpink:hover {
  background: #F6BCD8;
  -webkit-transition: .2s;
  transition: .2s;
  color: #ffffff;
}

a.btn.blue {
  background: #4169e1;
}

a.btn.blue:hover {
  background: #839deb;
  -webkit-transition: .2s;
  transition: .2s;
  color: #ffffff;
}

		/* ---------------------- */
		/* ▼カード型リンクの装飾 */
		/* ---------------------- */
		.cardlink {
			display: inline-block;
			width: 100%;
			max-width: 400px;
			/* 最大幅 (※横幅を制限したくない場合はこれを削除して下さい) */
			padding: 0 0.25em 0.5em 0;
			/* 内側の余白量 */
			font-size: 0.9rem;
			/* 文字サイズ */
			text-decoration: none;
			/* リンク文字の下線を消す */
			vertical-align: middle;
			/* 行内の上下方向では中央配置 */
		}
	
/* ------------------------------------- */
/* リンクカードの装飾(サイズS/L共通部分) */
/* ※後述の「サイズS用の追記」や「サイズL用の追記」と合わせて、1つのカードデザインになります。 */
/* ------------------------------------- */
/* カード外枠 */
.cardlinkbox {
	border: 1px solid #ccc;
	/* 枠線 */
	border-radius: 7px;
	/* 角丸 */
	background-color: white;
	/* 背景色 */
	display: flex;
	/* 内部レイアウトのFlexbox化 */
}

/* (マウスが載ったとき) */
.cardlinkbox:hover {
	background-color: #f5fff5;
	/* 背景色 */
	border-color: #8c8;
	/* 枠線色 */
}

/* ▽リンクカード内の画像枠 (※読み込まれたog:imageは、この枠に《背景画像として》描画されます) */
.cardlinkimage {
	background-image: linear-gradient(-30deg, #8a8, #e0f0e0);
	/* プレースホルダ的な背景グラデーション(※og:imageの画像指定が読み込まれたら、この値は上書きされます) */
	background-size: cover;
	/* 背景画像で枠を埋める */
	background-position: center center;
	/* 背景画像を中央に寄せる */
	background-repeat: no-repeat;
	/* 背景画像を繰り返さない */
}

/* ▽リンクカード内のテキスト枠 */
.cardlinktextbox {
	display: flex;
	/* Flexbox化 */
	flex-direction: column;
	/* 子要素を縦方向に並べる */
	padding: 0.5em 1em;
	/* 内側の余白量 */
}

/* ▽リンクカードのテキスト枠内の3要素共通 */
.cardlinktitle,
.cardlinkdescription,
.cardlinkurl {
	/* ↓表示行数を制限するための準備 (※システム側では文字数は制限せずに「記述されている全文字」をHTMLに出力しますので、表示分量を制限したい場合はCSSで制御する必要があります。) */
	display: -webkit-box;
	/* -webkit-line-clampを使うために必要な記述1 ※A */
	-webkit-box-orient: vertical;
	/* -webkit-line-clampを使うために必要な記述2 ※A */
	overflow: hidden;
	/* 表示量を制限する場合に必須の記述 */
	/* ↓制限の仕様 */
	line-clamp: 1;
	/* 1行だけ見せる (将来的にはこれだけで実現可能かも) */
	-webkit-line-clamp: 1;
	/* 1行だけ見せる (今のブラウザにはこちらが必要で、そのためには上記「※A」も必要) */
	text-overflow: ellipsis;
	/* 省略記号(三点リーダー) */
}

/* リンクタイトル */
.cardlinktitle {
	padding-bottom: 0.25em;
	/* 内側下端の余白量 */
}

/* リンク概要文 */
.cardlinkdescription {
	line-height: 1.3;
	/* 行の高さ */
	color: #555;
	/* 文字色 */
	line-clamp: 2;
	/* (既存指定の上書き) 最大2行まで見せる */
	-webkit-line-clamp: 2;
	/* (既存指定の上書き) 最大2行まで見せる */
}

/* リンクドメイン */
.cardlinkurl {
	color: #999;
	/* 文字色 */
}

/* ----------------------------------- */
/* リンクカードの装飾(サイズS用の追記) */
/* 前述の「サイズS/L共通部分」と合わせて、1つのカードデザインになります。 */
/* ----------------------------------- */
.cardsize-S {
	flex-direction: row;
	/* 画像とテキストは横に並べる(Flexbox) */
}

/* ▽リンクカード内の画像枠 */
.cardsize-S .cardlinkimage {
	min-width: 100px;
	/* 最小の横幅 */
	min-height: 100px;
	/* 最小の高さ */
	border-radius: 6px 0 0 6px;
	/* 左側だけ角丸 */
	flex-shrink: 0;
	/* 枠サイズを自動縮小させない */
}

/* ▽リンクカード内のテキスト枠 */
.cardsize-S .cardlinktextbox {
	border-left: 1px solid #ccc;
	/* 左側の枠線 */
	justify-content: center;
	/* Flexboxの上下方向での中央寄せ */
}

/* ▽リンクカードのテキスト枠内の3要素 */
.cardsize-S .cardlinktitle {
	order: 2;
}

/* タイトルは、2番目に表示 */
.cardsize-S .cardlinkdescription {
	order: 3;
}

/* 概要文　は、3番目に表示 */
.cardsize-S .cardlinkurl {
	order: 1;
}

/* ドメインは、1番上に表示 */

/* ----------------------------------- */
/* リンクカードの装飾(サイズL用の追記) */
/* 前述の「サイズS/L共通部分」と合わせて、1つのカードデザインになります。 */
/* ----------------------------------- */
.cardsize-L {
	flex-direction: column;
	/* 画像とテキストは縦に並べる(Flexbox) */
}

/* ▽リンクカード内の画像枠 */
.cardsize-L .cardlinkimage {
	aspect-ratio: 1.91 / 1;
	/* 画像枠の縦横比を指定= (横)1.91：(縦)1 */
	width: 100%;
	/* 横幅は枠最大に拡げる */
	height: auto;
	/* 高さは自動計算 */
	border-radius: 6px 6px 0 0;
	/* 上側だけ角丸 */
}

/* ▽リンクカード内のテキスト枠 */
.cardsize-L .cardlinktextbox {
	border-top: 1px solid #ccc;
	/* 上側の枠線 */
}

/* ▽リンクカードのテキスト枠内の3要素 */
.cardsize-L .cardlinktitle {
	font-weight: bold;
}

/* 太字 */
.cardsize-L .cardlinkdescription {
	min-height: 2.5em;
}

/* 内容量が少ない場合でも一定の高さを確保 */
.cardsize-L .cardlinkurl {
	border-top: 1px solid #ddd;
	/* 上側の枠線 */
	margin-top: 0.5em;
	/* 上側の枠線より上の余白量 */
	padding-top: 0.5em;
	/* 上側の枠線より下の余白量 */
	font-size: 0.75rem;
	/* 文字サイズ(小さめ) */
}

.dlaf {
	max-width: 960px;
}

.events {
	padding: 10px;
}

.updateinfo {
	background: #e5e6fa;
	padding: 10px;
	width: 95%;
	overflow: scroll;
	font-size: 14px;
	margin: 20px auto;
	border-radius: 4px;
}

.updateinfo .inner {
	height: 350px;
	overflow-y: scroll;
}

.updateinfo .inner::-webkit-scrollbar {
	width: 5px;
}

.updateinfo .inner::-webkit-scrollbar-track {
	background: #e9e8fa;
}

.updateinfo .inner::-webkit-scrollbar-thumb {
	background: #ffffff;
	border-radius: 2px;
}

.updateinfo .inner dt {
	width: 150px;
}

.updateinfo .inner dd {
	width: calc(100% - 150px);
}


@media (max-width: 575px) {
	.updateinfo .inner {
		font-size: 12px;
	}

	.updateinfo .inner dt {
		width: 80px;
	}
}

@media (max-width: 575px) {
	.updateinfo .inner {
		font-size: 12px;
	}

	.updateinfo .inner dt {
		width: 80px;
	}
}

/* End of file */
