@charset "utf-8";
	html {
	scroll-behavior: smooth;
	}
	body {
		font-family:sans-serif;
		margin: 0; padding: 0;
		background-color: #ececec;
	-webkit-text-size-adjust: 100%;
	}
		header {
		display: flex;
		justify-content: space-between;
		width: 100%;
		background-color: white;
		border-bottom: 1px solid #acb1b4;
		box-shadow: 1px 1px 0px #dae0e4;
		margin: 0;
		padding: 20px; 
		}
	#headericon{
	padding: 10px 30px; 
	}
/* ▼大外枠の装飾 */
	.contents {
		display: flex;
		flex-direction: row;
		justify-content:center; 
		width: 100%;
		border-collapse: separate;
		border-spacing: 1em 0;
		margin: 0; padding: 0;
		}	
	/* ▼メイン段 */
		.contents .mainarea {
			width: 67%; 
			vertical-align: top;
			margin: 1em 0.7em 0 1.5em;
			padding: 0;
			background-color: #fff;
			box-sizing:border-box
		}
		.mainarea { width: 100%; } 
	/* ▼サブエリア */			
		.contents .subarea {
			width: 27%; height: auto;
			vertical-align: top;
			margin: 0.5em;
			box-sizing:border-box
				}
/* ■投稿ボックス(一発言)ごとの表示 */
	.onelogbox {
		display: block; 
		margin: 0;
		padding: 0.3em 0.5em 1em 0.5em;
		border-bottom: 1px #ececec solid;
		align-items:flex-start;
		box-sizing:border-box
		}
	.situation + .onelogbox {
		/* 限定条件表示行の直下に表示される場合 */
		width: 100%; height: auto;
		border-top: 1px #ececec solid;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		}
	.iconarea {
		display: inline-block;
		width: auto; height: auto;
		margin: 0em; padding: 2px;
		 	}
/* ▼投稿内容側 */
	.onelog {
		display: block; 
		width: 100%; height: auto;
		margin: 0 0.2em 0 0;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		}
		.onelogcontent {
		margin: 0; padding: 0;
		max-width: 100%; height: auto;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		}
	/* ▼投稿情報表示 */
	.oneloginfo {
			margin: 0.2em 0;
			font-size: 0.9em;
			}
			.onelogctrl {
				margin: 0;
				float: right;
			}
	/* ▼ユーザ名領域 */
	.username {
			margin: 0 0.2em 0 0;
			font-weight: bold;
		}
		/* ▼ユーザ名のリンク */
		.username a {
			color: black;
		}
		/* ▼ユーザ名のリンクにマウスが載ったとき */
		.username a:hover {
			color: #0a71ae;
		}
/* ▼投稿日時領域 */
		.postdate {
			font-size: 1em;
			text-decoration: none;
		}
		/* ▼投稿日時のリンク */
		.postdate a {
			display: inline-block;
			color: #555;
			background-color: white;
			border-radius: 0.5em;
			padding: 0 0.5em;
			text-decoration: none;
		}
		/* ▼投稿日時リンクにマウスが載ったとき */
		.postdate a:hover {
			color: #0a71ae;
			  text-decoration: underline;
		}
		.newsign{color: #F78181;}
		/* ▼投稿No. */
	.postnum {
			font-size: 0.75em;
			color: #555;
			text-decoration: underline;
		}
		/* ▼文字数 */
		.length {
			font-size: 0.8em;
			color: #555;
		}
		/* ▼編集ボタン */
		.editlink {
			font-size: 0.67em;
		}
		.editlink a {
			text-decoration: none;
			display: inline-block;
			color: #f7a4b9;
			background-color: #eef;
			border: 1px solid #ccf;
			border-radius: 5px;
			padding: 0 3px;
		}
		.editlink a:hover {
			background-color: blue;
			color: white;
			border-color: blue;
		}
/* ▼投稿本文 */
	.onelogcontent {
		max-width: 100%;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		margin: 0 0.2em;
		}
		.comment {
			line-height: 1.7;
			width: 100%;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		}
		/* ▽投稿本文に含まれるURLリンク */
		.comment .url {
		color: #f2698e;
		}
		.comment .url:hover {
		 color: #5858FA;
		text-decoration:none;
		}

		/* ▽投稿本文に含まれるハッシュタグリンク */
		.onelog .taglink {
			display: inline-block;
			color: orange;
			text-decoration: none;
			word-break:break-all;	/* 自動リンクのはみ出しを防ぐ */
		}
		/* ▽投稿本文に含まれるハッシュタグリンクにマウスが載ったとき */
		.onelog .taglink:hover {
			text-decoration: underline;
		}
/* ▼続きを読むリンク（ボタン） */	
			/* ▽ボタン枠の装飾(共通) */
			.readmorebutton {
				display: inline-block;	/* インラインブロック化 */
				padding: 1px 0.5em;		/* 内側の余白 */
				margin: 0 1px;			/* 外側の余白 */
				border: 1px solid #ecc;	/* 枠線の装飾 */
				border-radius: 0.5em;	/* 枠線の角丸 */
			}
			/* ▽ボタン表面の装飾(共通) */
			.readmorebutton:link,
			.readmorebutton:visited {
				background-color: #eee;	/* 背景色(グラデーション非対応の環境のみ) */
				background-image: linear-gradient( 0deg, #dcc, #edd 55%, white );	/* 背景グラデーション */
				color: crimson;		/* 文字色 */
				text-decoration: none;	/* リンク装飾を消す */
			}
			/* ▽ボタンにマウスが載った際の装飾(共通) */
			.readmorebutton:hover {
				background-image: none;		/* グラデーションなし */
				background-color: #f88;		/* 背景色 */
				color: white;				/* 文字色 */
				text-decoration: underline;	/* 下線を加える */
			}
			/* ▽開く（続きを読む）ボタン専用の装飾 */
			.readmorebutton.readmoreopen {
				font-size: 0.95em;		/* 文字サイズ */
			}
			/* ▽閉じる（畳む）ボタン専用の装飾 */
			.readmorebutton.readmoreclose {
				font-size: 0.75em;		/* 文字サイズ */
			}
	.subbox,.subbox-tag,.subbox-cat,.datelistarea {
		display: flex;
		flex-direction: column;	
		width: 100%; height: auto; max-width: 100%;
		margin: 5px 0; padding:10px;
		background-color: #fff;
		border: 2px solid #ccc; border-radius: 20px;  
		text-align: left;
		line-height: 1.7;
		box-sizing:border-box;
		}
		.subbox ul { list-style-type: disc;	}
		.subbox li { 
		font-size: 1em; 
		max-width: 100%;
		padding: 0 0 0 0.5em;
		}
		.subbox-tag li {
		  display:inline-block; 
		}
		.cornertitle{
			font-weight: bold;
			margin: 0.2em 0.5em; padding: 0.1em 0.5em;
			border-bottom: 1px dashed #eaa;
			font-weight: bold;
			background-color: #ffd8c1;
			font-weight: bold;
			color: rgba(153, 102, 153, 1);
			text-shadow: 1px 1px 1px pink;
			}
		.hashtaglist {
			padding: 0 1em;
			font-size: 0.95em;}
/* ▼日付別リスト区画 */
		/* ▽日付リスト(年単位) */
		.datelimitlist {
			margin: 0.3em;
			padding: 0.5em 1em;
			list-style-type: none;
			font-size: 0.95em;
		}
		/* ▽日付リスト(月単位) */
		.datelimitsublist {
			margin: 0;
			padding: 0 5px 0 5px;
			list-style-type: none;
		}
			/* ▽年表記が単独で存在する場合に、月表示を横に並べる */
			.datelimitlist .datelimitsublist .datelimit-month {
				display: inline-block;
				margin: 0 0.4em;
				white-space: normal;
			}
			/* ▽年表記が単独で存在する場合に、月リンク内に含まれる年表記を非表示にする*/
			.datelimitlist .datelimitsublist .year {
				display: none;
			}
		/* ▽日付リスト内の該当件数 */
		.datelimitlist .num {
			font-size: 0.85em;
			color: #66a;
			margin-left: 0.3em;
		}
		/* ▽日付リンク項目 */
		.datelistlink:hover {
			color: white;
			background-color: green;
			border-radius: 3px;
		}

		/* ▽日付プルダウンメニュー区画 */
		.datelimitbox {
			margin: 0.5em;
		}

		/* ▽昇順/降順選択ラジオボタン区画 */
		.datelimitboxoptions {
			display: block;
			font-size: 0.9em;
		}
		.datelimitboxoptions label {
			display: inline-block;
			margin-right: 0.5em;
		}

	.pagedown {
	display: flex;
	justify-content:right;
	position: fixed; bottom: 9px; right:10px;
	opacity: 0.5;
	z-index: 2;
	}
	.pagedown img { transform:rotate(180deg); }
	.pagetop {
	display: flex;
	justify-content:right;
	position: fixed; bottom: 10px; right:52px;
	opacity: 0.5;
	z-index: 2;
	}
	summary	{
	font-size: 1em;
	cursor: pointer;
	text-decoration: underline;
	padding-left: 1em;
	}
	a { color: #04B4AE; }
	a:visited {
	 color:#FF8000;
	text-decoration: none;
	 }
	a:hover {
		color: #4000FF;
		text-decoration: underline;
	}

	/* ▼URLが書かれた場合の装飾 */
	.url {
		display:inline-block;
		word-break:break-all;	/* 自動リンクのはみ出しを防ぐ */
	}
		
/* ▼汎用装飾(てがろぐ専用記法で書かれた場合のみ)：文字 */
			/* B:太字(Bold) */
			.decorationB {
				font-weight: bold;		/* 太字 */
			}
			/* D:削除(Delete) */
			.decorationD {
				color: #888;
				text-decoration-line: line-through;
				text-decoration-color: red;	/* 線の色 */
			}
			/* E:強調(Emphasis) */
			.decorationE {
				font-style: normal;
				font-weight: bold;
				color: #c00;
			}
			/* I:斜体(Italic) */
			.decorationI {
				font-style: italic;		/* 斜体 */
			}
			/* Q:引用(Quote) */
			.decorationQ {
				border-left: 5px double pink;
				margin: 1em 0.3em 1em 1em;
				padding: 0.75em 0.5em;
				background-color: #fff8f8;
				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: orange;		/* 線配色 */
			}
/* ▼自由装飾用の装飾の例 */	/* 自由装飾は [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;	/* 下線 */
		}
.decoration1 { background:linear-gradient(transparent 60%, #ff99ea); }
.decoration2 { background:linear-gradient(transparent 60%, #8ecee0); }
.deco-moo { background-color: #d6ffff; }
.deco-sna { background-color: #d6ff99:; }
.deco-papa { background-color: #e0e2f4; }
.deco-mama { background-color: #ffe5d6; }
.deco-flo { background-color: #ffff99; }
.deco-mee { background-color: #ffaded; }

	/* ▼汎用装飾(てがろぐ専用記法で書かれた場合のみ)：画像 */	/* この部分は、文字装飾領域内に含まれた画像を装飾するための記述です。 */
	/* B:太字(Bold)に含まれる画像に対する装飾 */
	.decorationB img {
		box-shadow: 5px 5px 5px #e88;		/* 右下に濃赤色の影を付ける */
	}
	/* D:削除(Delete)に含まれる画像に対する装飾 */
	.decorationD img {
		opacity: 0.5;	/* 半透明にする */
	}
	/* E:強調(Emphasis)に含まれる画像に対する装飾 */
	.decorationE img {
		outline: 8px ridge rgba(255, 70, 50, 0.6);		/* 浮き上がる紅色の枠線を付加 */
	}
	/* I:斜体(Italic)に含まれる画像に対する装飾 */
	.decorationI img {
		box-shadow: -5px 5px 5px #ee5;	/* 左下に黄色の影を付ける */
	}
	/* 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 pink;	/* 右下にピンク色の影を付ける */
	}
/* ▼埋め込み画像 */
	/* ▽画像ボックス(FIGオプション指定時) */
	.embeddedpictbox {
		margin: 0;					/* 外側の余白を消す */
		padding: 0;					/* 内側の余白を消す */
		display: inline-table;		/* 横方向に並べる */
		border-collapse: collapse;	/* displayをinline-tableにする場合に必要 */
		border: 1px solid #e0eee0;	/* 枠線 */
		vertical-align: top;		/* 行内では上に寄せる */
	}
		/* キャプション */
		.embeddedpictbox figcaption {
			display: table-caption;		/* キャプションが画像幅から外に出ないようにする */
			caption-side: bottom;		/* キャプションの位置(上にしたければtop) */
			font-size: 0.8em;			/* 文字サイズ */
			text-align: center;			/* センタリング */
			background-color: #F2F2F2;	/* 背景色 */
		}

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

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

/* ▽画像そのもの */
	.embeddedimage {
		max-width: 100%;	
		max-height: 600px;
		width: auto;
		height: auto;
	}
	/* ▽フラグ付き画像 (※設定や採用記法によって出力パターンが複数あるため、あらゆるパターンに対応させるべく同じスタイルを2重に指定しています。) */
	figure.nsfw {
		overflow: hidden;	/* ぼかし領域がfigureのボックスからはみ出ないようにする */
	}
	.imagelink.nsfw {
		overflow: hidden;	/* ぼかし領域がfigureのボックスからはみ出ないようにする */
	}
	img.nsfw {
		filter: blur(9px);	/* ぼかす */
	}
/* ▼埋め込み動画 */
	/* ▽[VIDEO:キャプション]URL記法で、キャプション付きで掲載される場合の外側要素 */
	figure.embeddedvideo {
		margin: 0;
		padding: 0;
		display: flex;
		flex-direction: column-reverse;
	}
		/* ▽[VIDEO:キャプション]URL記法で、キャプション付きで掲載される場合のキャプション部分 */
		.videotitle {
			text-align: center;
			background-color: #dcf3dc;
		}

	/* ▽[VIDEO]URL記法（または [VIDEO:キャプション]URL記法）で掲載されるvideo要素部分 */
	video.embeddedvideo {
		display: inline-block;
		max-width: 100%;
		width: auto;
		height: auto;
			}

	@media all and (max-width: 600px) {
		.embeddedmovie {
			display: inline-block;
			max-width: 100%;	/* はみ出ないようにする */
			width: auto;
			height: auto;
		}
	}
		
/* ▼埋め込みTweet */	
	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;
	}
 /* ▼埋め込みmp3.mp4 */	
	iframe,
	audio,
	video {
		max-width: 100%;
	}
		/* ------------ */
	/* ▼本文入力欄 */
	/* ------------ */
	textarea.tegalogpost {
		border: 2px #DF7401 solid;
		border-radius: 0.67em;
		background-color: white;
		padding: 0.5em;
		font-size: 100%;
		box-sizing: border-box;
		width: 100%;
		height: 1500px;
		overflow-wrap: break-word;
		overflow: auto;
		margin-bottom: 0.25em;
	}
		textarea.tegalogpost:placeholder-shown { color: #777; }
		textarea.tegalogpost:focus:placeholder-shown { color: #bbb; }
		textarea.tegalogpost:-ms-input-placeholder { color: #aaa; }

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

	/* 横幅800px以下の環境の場合 */
@media all and (max-width: 800px) {
		textarea.tegalogpost {
			font-size: 16px;
			padding: 0.4em;
		}
	}
	/* ▼投稿ボタン */
	.postbutton {
		background: #f7a4b9;
		color: white;
		font-size: 1rem;
		border-radius: 1em;
		padding: 0.25em 0.75em;
		font-weight: bold;
		border: 1px solid #f58ee8;
		text-decoration: none;
		display: inline-block;
	}
		.postbutton:hover {
		background-color: #f2698e;
	}
	/* ▼表示対象の限定時などの「限定条件」表示行 */
	.situation {
		margin: 1em;
		font-weight: bold;
		color: #05f;
		}
		.situation:empty { display: none; }	/* 限定表示がない場合はボックス自体を非表示にする。 */
		/* ▼日付セパレータ行 */
		.dateseparator {
		background-color: #ffd847;
		color: black;
		font-weight: bold;
		border-color: #b79100;
		border-width: 1px 0px;
		border-style: solid;
	}
	.datetitle { padding: 2px 1em; }
	/* ▼日付セパレータ行内のリンク */
	.dateseparator a {
		background-color: #faf8f5;
		font-size: 80%;
		font-weight: normal;
		display: inline-block;
		border-radius: 1em;
		margin: 0px 0.25em;
		padding: 0px 0.5em;
	}
/* ■一発言だけが表示される際に追加表示されるユーティリティリンク群の装飾 */
	.utilitylinks {
		margin: 2em 1em 1em 1em;
		padding: 0.5em;
		border: 1px solid #b2defc;
		border-radius: 1em;
		background-color: #eff8fe;
		font-size: 0.9em;
	}
	.utilitylinks ul {
		color: darkblue;
	}
/* ■ページナビゲーション領域 */
	.pagenavi {
		margin: 2.5em 0px;			/* 外側の余白 */
		padding: 0.5em 0px;			/* 内側の余白 */
		text-align: center;			/* 中央寄せ */
		border-width: 3px 0px;		/* 枠線の太さ */
		border-style: solid;		/* 枠線の種類 */
		border-color: #ddd6cc;		/* 枠線の配色 */
		background-color: #faf8f5;	/* 背景色 */
	}
	.pagenavi p {
		margin: 0;
		text-align: center;
	}
/* ▼ページ前後移動リンク群ボックス全体 */
	.pagelinks {
		margin: 0.75em;		/* 外側の余白 */
	}

	/* ▼ページ移動リンクの文字 */
	.pagelinks a {
		font-weight: bold;
	}
	/* -------------------------------- */
	/* ▼ページ番号リンク群ボックス全体 */
	/* -------------------------------- */
	p.pagenums {
		margin: 0.5em;		/* 外側の余白 */
	}

	/* ▼ページ番号リンクの数字 */
	.pagenums a.pagenumlink {
		margin: 0px 2px 0px 2px;	/* 外側の余白 */
		padding: 0.2em 0.5em;		/* 内側の余白 */
		font-size: 1em;				/* 文字サイズ */
		font-weight: bold;			/* 太字 */
	}
	/* ▽現在のページ番号の装飾 */
	a.pagenumhere {
		text-decoration: none;		/* リンク装飾を消す */
		background-color: #fb5;		/* 背景色 */
		color: white;				/* 文字色 */
		border-radius: 1em;			/* 角丸 */
	}
	/* ▽ページ番号リンクにマウスが載った際の装飾 */
	a.pagenumlink:hover {
		text-decoration: none;		/* リンク装飾を消す */
		background-color: #f7a4b9;		/* 背景色 */
		color: white;				/* 文字色 */
		border-radius: 0.3em;		/* 角丸 */
	}
/* ▼限定解除リンク(＝HOMEに戻るリンク) */
	.pagehome {
		font-weight: bold;
	}
/* ■入力フォームの表示領域 */
	.postform {
		background-color: #feede6;
		margin: 0;
		padding: 1em;
	}
	.postform p {
		margin: 0;
	}
/* ▼戻るリンク */
	.backlink {
		text-align: center;			/* 中央寄せ */
		padding: 1em;
	}
/* Powered-by表記のデザイン */
	.poweredby { margin: 2em 1em 0.5em 1em; font-size: 0.8em; text-align:left;}
	.poweredby a {text-decoration: none;}
	
/* 投稿欄下部：「鍵付き」チェックボックスと「個別鍵」ボタンの間を詰める一時的なスタイル */
	.funcUIs .catChecks { margin:0 0.75em 0 0; }
	.funcUIs .catChecks label { margin: 0; }

	.passkeyform {
	display: inline-block;
	margin: 0;
	padding: 0.6em;
	background-color: #feeff4;
	border: 1px solid #facad8;
	border-radius: 0.25em;
}
	/* ▼鍵違いエラーの表示 */
	.passkeyerror {
		display: block;
		color: white;
		background-color: #f37c9d;
		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 {
		}
/* ■ページ最下部(フッタ)領域 */
footer {
	width: 100%; 
	margin: 1em 0px 0px 0px;
	padding: 10px 25px; 
	border-top: 3px solid #acb1b4;
	background-color: #fff;
}
footer p {
	margin: 0;
	padding: 5px 0;
}
/* ▼カード型リンクの装飾 */
	.cardlink {
		display: inline-block;
		width: 100%;
		max-width: 800px;
		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;
		}
		.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;
				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;
				}
				
/* ▼カスタマイズ */
	h1 { 
		margin: 0;
		font-size: 2em;
		padding: 0; 
		}
	.hukudai{
		 margin: 0px; 	color: #23937c; }
	.rep {
		float: right; 
		position:relative; bottom: 1em; right: 1em; 
		width: 24px; height: 24px;}	
	.note { 
		line-height: 1.5;
		margin: 0; padding: 0.2em;
		}
/* ▼カード型リンクの装飾 */
	.cardlink {
		display: inline-block;
		width: 100%;
		max-width: 800px;
		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;
		}
		.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;
				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;
				}
	
	/* ‥‥‥‥‥‥‥ */
	/* ▼折り畳み空間 */		/* details要素＋summary要素で実現されており、JavaScriptが無効でも動作します。 */
	/* ‥‥‥‥‥‥‥ */
	/* ▽ボタンカバー */
	.foldswitch {
		width: fit-content;     /* 横幅を中身のサイズに制限 */
	}
	/* ▽ボタン */
	.foldlabel {
		display: inline-block;  /* インラインブロック化 */
		padding:0.25rem 0.5rem; /* 内側の余白 */
		border:1px solid #bcb;  /* 枠線の装飾 */
		border-radius:5px;      /* 枠線の角丸 */
		background-color: #ded; /* 背景色(グラデーション非対応の環境のみ) */
		background-image: linear-gradient( 0deg, #cdc, #ded 55%, white ); /* 背景グラデーション */
		color: darkblue;        /* 文字色 */
		line-height: 1;         /* 行高 */
		cursor: pointer;        /* マウス形状をポインタに */
	}
	/* ▽マウスが載った際の装飾(共通) */
	.foldlabel:hover {
		background-image: none; /* グラデーションなし */
		background-color: #3ba; /* 背景色 */
		color: white;           /* 文字色 */
	}
	/* ▽折り畳まれている空間 */
	.foldedarea {
		border-left:3px solid yellowgreen; /* 左側の枠線 */
		margin: 0.25rem 0 0 0.125rem;      /* 外側の余白 */
		padding: 0.25rem 0.5rem;           /* 内側の余白 */
	}
	
@media screen and (max-width: 768px)
	{
body
	{ font-size: 1em; }
header {
	width: 100%;
	margin: 0; padding: 10px; 
	font-size: 0.9em;
	box-sizing:border-box
	}
/* ▼大外枠の装飾 */
	.contents {
		display: block;
		margin: 0;
		padding: 0;
		width: 100%;
		box-sizing:border-box
		overflow-x: hidden;
		}	
/* ▼メイン段 */
		.contents .mainarea {
			width: 100%; 
			vertical-align: top;
			margin: 0;
			padding: 0;
			box-sizing:border-box
		}
/* ▼サブエリア */
		.contents .subarea {
			width: 100%; height: auto;
			vertical-align: top;
			margin: 0;
			padding: 0;
			box-sizing:border-box
				}
	#pmn {
	text-align:right; 
	font-weight:bold;
	margin: 2px 10px 10px 10px;
	clear:both;
	}
	.headtitle {
		display: table-cell;
		margin: 0;
		padding: 0 0.2em;
		color: #66757f;
		line-height: 1;
	}
	.headtitle a {
		text-decoration: none;
	}
	.hukudai { 
	font-size: 1.2em;
	 padding: 0 10px;
	 }
/* ▽タイトル直下の文章 */
	.headguide {margin: 0.2em; }

	.subbox,.subbox-tag,.subbox-cat,.datelistarea {
		width: 97%; height: auto; max-width: 100%;
		margin: 5px auto; padding:10px;
		box-sizing:border-box
		}
.onelogbox {
	display: block; 
	padding: 0.5em;
	width: 100%;
	box-sizing:border-box
	}
.onelogcontent {
	margin: 0; padding: 0;
		}
.onelogbox img {
	max-width: 100%;
	}
footer{
	width: 100%; 
	padding: 10px 25px; 
	box-sizing:border-box
	}
	.rep {
	float: right; 
	position:relative; bottom: 1.5em; right: 1em; 
	}	
	}
@media screen and (max-width: 600px)
	{
h1 {
	font-size: 1.5em ;
	margin: 0; padding: 0 5px;
	}
	.hukudai{ font-size: 1em ; padding: 0 5px;}
	#koibumi_wrap { margin: 0 10px 15px 0; }
	.note { 
	line-height: 1.5;
	padding: 0.5em;}
}