@charset "utf-8";

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

:root{
	--main-moji: #454545; /*  デフォルト文字用 */
	--haikei-hiro: #fefefe; /*  背景色 */
	--link-iro: #6bad94; /*  リンク色 */
	--line-iro: #676767; /*  線の色 */
}

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

/* ▼カード型リンクの装飾 */
.cardlink {
	display: inline-block;
	width: 100%;
	max-width: 500px;			/* 最大幅 (※横幅を制限したくない場合はこれを削除して下さい) */
	padding: 0 0.25em 0.5em 0;	/* 内側の余白量 */
	font-size: 0.8rem;			/* 文字サイズ */
	text-decoration: none;		/* リンク文字の下線を消す */
	vertical-align: middle;		/* 行内の上下方向では中央配置 */
}

	/* リンクカードの装飾(サイズS/L共通部分) */		/* ※後述の「サイズS用の追記」や「サイズL用の追記」と合わせて、1つのカードデザインになります。 */
	/* カード外枠 */
	.cardlinkbox {
		border: 1px solid var(--line-iro);		/* 枠線 */
		border-radius: 7px;						/* 角丸 */
		background-color: var(--haikei-hiro);	/* 背景色 */
		display: flex;							/* 内部レイアウトのFlexbox化 */
	}
		/* ▽リンクカード内の画像枠 (※読み込まれた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:var(--main-moji);		/* 文字色 */
				line-clamp: 2;				/* (既存指定の上書き) 最大2行まで見せる */
				-webkit-line-clamp: 2;		/* (既存指定の上書き) 最大2行まで見せる */
			}
			/* リンクドメイン */
			.cardlinkurl {
				color: var(--main-moji);	/* 文字色 */
			}

	/* リンクカードの装飾(サイズ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 var(--line-iro);	/* 左側の枠線 */
			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 var(--line-iro);	/* 上側の枠線 */
		}
			/* ▽リンクカードのテキスト枠内の3要素 */
			.cardsize-L .cardlinktitle { font-weight: bold; }			/* 太字 */
			.cardsize-L .cardlinkdescription { min-height: 2.5em; }		/* 内容量が少ない場合でも一定の高さを確保 */
			.cardsize-L .cardlinkurl {
				border-top: 1px solid var(--line-iro);		/* 上側の枠線 */
				margin-top:0.5em;				/* 上側の枠線より上の余白量 */
				padding-top:0.5em;				/* 上側の枠線より下の余白量 */
				font-size:0.75rem;				/* 文字サイズ(小さめ) */
			}

/* ▼汎用装飾(てがろぐ専用記法で書かれた場合のみ)：文字 */
/* B:太字(Bold) */
.decorationB {
	font-weight: bold;		/* 太字 */
}
/* D:削除(Delete) */
.decorationD {
	color: var(--main-moji);	/* 文字色 */
	text-decoration-line: line-through;	/* 取り消し線 */
	text-decoration-color: var(--main-moji);			/* 線の色 */
}
/* E:強調(Emphasis) */
.decorationE {
	color: var(--main-moji);	/* 文字色 */
	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 var(--line-iro);	/* 左端の枠線 */
	background-color: var(--haikei-hiro);		/* 背景色 */
	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: #16c4ab;		/* 線配色 */
}

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

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

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

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


/* ▼埋め込み動画 */
.embeddedmovie {
	display: inline-block;
	aspect-ratio: 16 / 9;
	max-width: 560px;
	width: 100%;
	height: auto;
}

/* ▼埋め込みTweet */	/* これはツイートが埋め込まれる処理「前」用の装飾です。実際に埋め込まれるツイートはTwitter側のiframeで装飾されますので、てがろぐ側では指定できません。(ただし横幅を制限することはできます。→後述) */
blockquote.twitter-tweet {
	background-color: var(--haikei-hiro);
	border: 1px dashed var(--line-iro);
	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%, #aaf0aa 60%);		/* 文字の下半分くらいにマーカーっぽい線を引く */
}

/* ------------------------------------------------------------ */

/* ■ページ最上部(ヘッダ)領域 */
header {
	margin: 0 auto;
	text-align: center;
}

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

.contents{
	margin: 0 auto;
	max-width: 900px;
}
	/* ▽メインタイトル */
	.maintitle {
		padding: 24px 0 10px;
		font-size: 28px;
		font-family: 'Outfit',sans-serif;
		text-align: center;
	}
	/* ▽メインタイトルのリンク */
	.maintitle a {
		color: var(--main-moji);	/* 文字色 */
	}

	/* ▽サブタイトル */
	.subtitle {
		display: inline-block;	/* インラインブロック化 */
		font-size: 0.55em;		/* 文字サイズ */
		justify-content: center;

	}

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

/* カテゴリのリンク */
.cattree{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 15px;
}
.catbranch{
	padding:0 8px;
}

/* ▼管理・投稿ボタン区画 */
.headcontrol {
	display: table-cell;	/* タイトルとボタンで2段組 */
	text-align: 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: skyblue;	/* 背景色 */
	background-image: linear-gradient( 180deg, skyblue, #8080ff 25%, blue );	/* 背景グラデーション */
	color: white;				/* 文字色 */
	text-decoration: none;		/* 下線を消す */
	white-space: nowrap;		/* 折り返さない */
}
/* ▼管理・投稿用リンクボタンにマウスが載った際 */
.headcontrol a:hover {
	text-decoration: underline;	/* 下線を引く */
	background-color: #ffffcc;	/* 背景色 */
	background-image: linear-gradient( 180deg, #ffffaa, #ffffcc 55%, white );	/* 背景グラデーション */
	color: blue;				/* 文字色 */
}

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

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

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


/* ■入力フォームの表示領域 */		/* ※これはQUICKPOST用です。新規投稿専用画面や編集画面ではCGI内蔵のCSSが使われるため、ここの記述は適用されません。 */

.postarea{
	margin: 0 auto;
	max-width: 900px;
}
.postform {
	background-color: #fefefe;	/* 背景色 */
	margin: 1em;			/* 外側の余白量 */
	padding: 1em;			/* 内側の余白量 */
}
.postform p {
	margin: 0;
}

/* ▼本文入力欄 */
textarea.tegalogpost {
	border: 1px #676767 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;	/* 折り返し方法 */
}
	/* ▽プレースホルダ(※入力文字数がゼロの際にだけ見える薄文字)の装飾 */
	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: #6bad94;			/* 背景色 */
		color: white;				/* 文字色 */
		font-size: 1rem;			/* 文字サイズ */
		font-weight: bold;			/* 太字 */
		text-decoration: none;		/* 下線を消す */
		padding: 0.25em 0.75em;		/* 内側の余白量 */
		border-radius: 1em;			/* 枠の角丸 */
	}

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

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

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

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


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

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

	/* ▼日付境界バー */
	.dateseparator {
		color: #454545;			/* 文字色 */
		padding: 2px 1em;		/* 内側の余白量 */
	}

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

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


/* ■投稿ボックス(一発言)ごとの表示 */	/* ※この領域は、内側スキンで生成しているHTMLに対する装飾です。 */

.onelogbox {
	margin: 0 auto;
	padding: 30px 0;
	width: 100%;			/* 横幅 */
}

	/* ▼投稿本文 */
	.comment {
		line-height: 1.8;		/* 行の高さ */
		min-height: 4em;		/* 最低限確保する高さ */
	}

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

		/* ▼続きを読むリンク（ボタン） */		/* ※注：「続きを読む」機能は、JavaScriptが無効な閲覧環境では機能せず、その場合はボタンも表示されません。 */
		/* ▽ボタン枠の装飾(共通) */
		.readmorebutton {
									/* 内側の余白 */
			margin: 0 1px;			/* 外側の余白 */
			text-decoration: underline;	/* 下線を加える */
		}
		/* ▽ボタン表面の装飾(共通) */
		.readmorebutton:link,
		.readmorebutton:visited {
			text-decoration: none;	/* リンク装飾を消す */
		}
		/* ▽ボタンにマウスが載った際の装飾(共通) */
		.readmorebutton:hover {
			background-image: none;		/* グラデーションなし */
		}

		/* ▽開く（続きを読む）ボタン専用の装飾 */
		.readmorebutton.readmoreopen {

		}

		/* ▽閉じる（畳む）ボタン専用の装飾 */
		.readmorebutton.readmoreclose {

		}

	/* ▼投稿日時やカテゴリ名などの情報表示 */
	.oneloginfo {
		margin: 0.75em 0 0 0;	/* 外側の余白量 */
		color: var(--main-moji);	/* 文字色 */
		text-align: left;		/* 右寄せ */
	}

		/* ▼投稿日時のリンク */
		.postdate a {
			display: inline-block;		/* インラインブロック化 */
			margin-bottom; 10px;
			font-size: 26px;			/* 文字サイズ */
			font-family: 'Outfit',sans-serif;
			color: var(--main-moji);		/* 文字色 */
			text-decoration: none;		/* 下線を消す */
		}

		/* ▼カテゴリ名 */
		.categories {
			font-size: 16px;
			margin-left: 10px;
		}
			/* ▽カテゴリリンク1つ */
			.categorylink {
				display: inline-block;
				text-decoration: none;		/* リンクの下線を消す */
			}
			/* ▽カテゴリ間のセパレータ */
			.catseparator {
				display: inline-block;
				margin: 0 5px;			/* 左右に1pxの余白 */
				color: var(--main-moji);/* 文字色 */
			}

		/* ▼編集リンク */
		.editlink a {
			font-size: 0.82em;		/* 文字サイズ */
			color: var(--main-moji);/* 文字色 */
			text-decoration: none;	/* 下線を消す */
		}

		/* ▽編集リンクにマウスが載ったとき */
		.editlink a:hover {
			color: white;			/* 文字色 */
			border-color: #08f;		/* 枠線の色 */
		}

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


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

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

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

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


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

▼ナビのリンクリスト */
.litylinks ul {
	color: darkgreen;			/* 文字色 */
}


■ページナビゲーション領域 */
.pagenavi {
	margin: 2.5em 0px;			/* 外側の余白 */
	padding: 0.5em 0px;			/* 内側の余白 */
	text-align: center;			/* 中央寄せ */
	border-width: 3px 0px;		/* 枠線の太さ */
	border-style: dotted;		/* 枠線の種類 */
	border-color: #80a080;		/* 枠線の配色 */
}

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

/* ▼ページ番号リンクの数字 */
.pagenums a.pagenumlink {
	margin: 0px 2px 0px 2px;	/* 外側の余白 */
	padding: 0.2em 0.5em;		/* 内側の余白 */
	font-size: 1em;				/* 文字サイズ */
}
/* ▽現在のページ番号の装飾 */
a.pagenumhere {
	text-decoration: none;		/* リンク装飾を消す */
	color: var(--main-moji);
}

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


■サブ領域 */
.area {
	margin: 1em 0 0 0;				/* 外側の余白量 */
	padding: 0 1em;					/* 内側の余白量 */
	background-color: #cec;			/* 背景色 */
	border-left: 1px solid #16c4ab;	/* 枠線(左側) */
}

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

/* ▼検索窓区画 */
.searcharea {
	margin: 0 0 1em 0;					/* 外側の余白量 */
	padding: 0 0 1em 0;					/* 内側の余白量 */
	border-bottom: 1px dashed #16c4ab;	/* 下線 */
}
/* ▼見出し */
.searcharea .cornertitle {
	font-weight: bold;
	margin: 0;
	color: #36c;
	text-shadow: 1px 1px 1px white;
}

	/* ▽検索フォーム */
	.searchbox {
		margin: 0;		/* 外側の余白量 */
	}
		/* 検索語(テキスト)入力欄 */
		.queryinput {
			border: 2px solid #8a8;
			border-radius: 0.5em;
			font-size: 1em;
			padding: 0.25em 0.5em;
			max-width: calc( 25vw - 9em);	/* 横幅最大値 */
			min-width: 150px;				/* 横幅最小値 */
		}
		/* 検索(送信)ボタン */
		.searchbox .submitbutton {
			background-color: green;
			border: 1px solid green;
			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: #0c0;
			color: white;
		}

	/* ▽検索対象を限定するチェックボックス */
	.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 {
	margin: 0 0 1em 0;					/* 外側の余白量 */
	padding: 0 0 1em 0;					/* 内側の余白量 */
	border-bottom: 1px dashed green;	/* 下線 */
}
/* ▼見出し */
.imagelistarea .cornertitle {
	margin: 0;							/* 外側の余白量 */
	font-weight: bold;					/* 太字 */
	color: #c96;						/* 文字色 */
	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;	/* 枠の下部に余計な空白ができるのを防ぐ */
		}

			/* ▽画像リストの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;		/* 文字サイズ */
		}


/* ▼日付一覧リスト・日付検索区画 */
.datelistarea {
	margin: 0 0 1em 0;					/* 外側の余白量 */
	padding: 0 0 1em 0;					/* 内側の余白量 */
	border-bottom: 1px dashed green;	/* 下線 */
}
/* ▼見出し */
.datelistarea .cornertitle {
	margin: 0;							/* 外側の余白量 */
	font-weight: bold;					/* 太字 */
	color: #969;						/* 文字色 */
	text-shadow: 1px 1px 1px white;		/* 文字の影 */
}

	/* ▼日付リンクリスト区画 */
	/* ▽日付リスト(年単位) */
	.datelimitlist {
		margin: 0.5em 0;		/* 外側の余白量 */
		padding: 0 0 0 20px;	/* 内側の余白量 */
		padding: 0.5em 0.5em 0.5em 1.5em;		/* 内側の余白量 */
		background-color: #efe;	/* 背景色 */
		border-radius: 0.5em;	/* 角丸 */
	}
	/* ▽日付リスト(月単位) */
	.datelimitsublist {
		margin: 0;				/* 外側の余白量 */
		padding: 0 0 0 5px;		/* 内側の余白量 */
		list-style-type: none;	/* リストの先頭記号(なし) */
		font-size: 0.9em;		/* 文字サイズ */
	}
		/* ▽年表記が単独で存在する場合に、月表示を横に並べる */	/* 縦に並べたい場合は、この区画を削除して下さい。 */
		.datelimitlist .datelimitsublist .datelimit-month {
			display: inline-block;
			margin-right: 0.9em;
		}
		/* ▽年表記が単独で存在する場合に、月リンク内に含まれる年表記を非表示にする */	/* 年表記も表示したい場合は、この区画を削除して下さい。(詳細解説→ https://www.nishishi.com/cgi/tegalog/custom/#customizecss-datelist ) */
		.datelimitlist .datelimitsublist .year {
			display: none;
		}

	/* ▽日付リスト内の該当件数 */
	.datelimitlist .num {
		font-size: 0.85em;		/* 文字サイズ */
		color: #66a;			/* 文字色 */
		margin-left: 0.3em;		/* 外側左の余白量 */
	}

	/* ▼日付プルダウンメニュー区画 */
	.datelimitbox {
		margin: 0.5em 0;		/* 外側の余白量 */
		padding: 0.9em 0.6em;	/* 内側の余白量 */
		background-color: #efe;	/* 背景色 */
		border-radius: 0.5em;		/* 角丸 */
	}

	/* ▽昇順/降順選択ラジオボタン区画 */
	.datelimitboxoptions {
		display: block;			/* ブロック化 */
		font-size: 0.9em;		/* 文字サイズ */
	}

	/* ▽ラジオボタンのラベル */
	.datelimitboxoptions label {
		display: inline-block;	/* インラインブロック化 */
		margin-right: 0.5em;	/* 外側右の余白量 */
	}

/* ▼ハッシュタグリスト区画 */
.hashtaglistarea {
	margin: 0 0 1em 0;					/* 外側の余白量 */
	padding: 0 0 1em 0;					/* 内側の余白量 */
	border-bottom: 1px dashed green;	/* 下線 */
}
/* ▼見出し */
.hashtaglistarea .cornertitle {
	margin: 0;							/* 外側の余白量 */
	font-weight: bold;					/* 太字 */
	color: #585;						/* 文字色 */
	text-shadow: 1px 1px 1px white;		/* 文字の影 */
}
	/* ▽ハッシュタグリスト */
	.hashtaglist {
		list-style-type: none;	/* リストの先頭記号(なし) */
		margin: 0.5em 0;		/* 外側の余白量 */
		padding: 0.75em;		/* 内側の余白量 */
		background-color: #efe;	/* 背景色 */
		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;
	}

	/* ▼カテゴリツリー区画 */
	.categoryarea {
		margin: 0 0 1em 0;					/* 外側の余白量 */
		padding: 0 0 1em 0;					/* 内側の余白量 */
		border-bottom: 1px dashed green;	/* 下線 */
	}
		/* ▽見出し */
		.categoryarea .cornertitle {
			margin: 0;							/* 外側の余白量 */
			font-weight: bold;					/* 太字 */
			color: #585;						/* 文字色 */
			text-shadow: 1px 1px 1px white;		/* 文字の影 */
		}
		.categoryTree {
			background-color: #efe;	/* 背景色 */
			border-radius: 0.5em;	/* 角丸 */
			border: 1px solid #eee;	/* 枠線 */
			margin: 1em 0;		/* 外側の余白量 */
			padding: 0.25em;	/* 内側の余白量 */
		}
			/* ▽カテゴリツリー */
			.categoryTree ul {
				padding-left: 30px;		/* 左側の余白量 */
				list-style-type: disc;	/* 箇条書き記号(何も付けたくなければ none に) */
				line-height: 1.2;		/* 行の高さ */
			}
				/* カテゴリ1項目 */
				.categoryTree li {
					margin-top: 0.25em;		/* 上側の余白量 */
				}

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

				/* ▽カテゴリ名 */
				.categoryTree .cattext {
				}

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

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

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

	/* プルダウンメニュー版カテゴリ一覧の装飾 */
	.catpull {
	    max-width: 200px;
	}

	/* ▼新着投稿リスト区画 */
	.latestpostarea {
		margin: 0 0 1em 0;					/* 外側の余白量 */
		padding: 0 0 1em 0;					/* 内側の余白量 */
		border-bottom: 1px dashed green;	/* 下線 */
	}
	/* ▼見出し */
	.latestpostarea .cornertitle {
		margin: 0;							/* 外側の余白量 */
		font-weight: bold;					/* 太字 */
		color: #585;						/* 文字色 */
		text-shadow: 1px 1px 1px white;		/* 文字の影 */
	}
		/* ▽新着投稿グリスト */
		.latestpostlist {
			margin: 0.5em 0;			/* 外側の余白量 */
			padding: 0.6em 0.5em 0.3em 1.7em;		/* 内側の余白量 */
			background-color: #efe;	/* 背景色 */
			border-radius: 0.5em;	/* 角丸 */
			line-height: 1.25;		/* 行の高さ */
		}
			/* 各項目 */
			.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: #558855; }	/* 投稿者名 */
				.latestpostlist .userid   { color: #555588; }	/* 投稿者ID */
				.latestpostlist .postid   { color: gray; }		/* 投稿番号 */
				.latestpostlist .length   { color: gray; }	/* 本文文字数 */


	/* ▼フリースペース区画 */
	.freespacearea {
		margin: 0 0 1em 0;					/* 外側の余白量 */
		padding: 0 0 1em 0;					/* 内側の余白量 */
		border-bottom: 1px dashed green;	/* 下線 */
	}
	/* ▼見出し */
	.freespacearea .cornertitle {
		margin: 0;							/* 外側の余白量 */
		font-weight: bold;					/* 太字 */
		color: #aa5;						/* 文字色 */
		text-shadow: 1px 1px 1px white; 	/* 文字の影 */
	}

		/* ▽フリースペースの本文 */
		.freespacebody {
			margin: 0.5em 0;		/* 外側の余白量 */
			padding: 0.75em;		/* 内側の余白量 */
			background-color: #efe;	/* 背景色 */
			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;			/* 内側の余白 */
}

	/* ▼管理操作リンク群 */
	footer .control-links {
		margin: 0.5em;			/* 外側の余白量 */
		text-align: center;
		font-size: 0.8em;
	}
	.kanri{
		margin-right: 10px;
	}

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

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


/* End of file */
