/* ========== Base (全体設定) ========== */
/* body, html, 共通フォント, 背景色 */

@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@400&display=swap');

body{
  background-color: #e9e8f0; 
  font-family: 'M PLUS Rounded 1c', sans-serif;
  color: #2c494e;
  overflow-x: hidden;
}

/* ========== Layout (大きな枠組み) ========== */
/* nav, .top, .contents など */

/* ========== Components (部品) ========== */
/* .link, .icon, .btn, .thimgbg など */


/* ========== Typography (文字関連) ========== */
/* h2, h3, p, a など */

/* 本文 */
p {
  padding: 0.25em 1em;
}

/* 見出しh2 */
h2 {
  border-bottom: 3px double #bb6541;
  margin: 0.8em 0 1em;
  font-weight: bold;
}

/* h2副題 */
span.h2sub {
  font-size: 60%;
  padding: 0 0.7em;
}

/* 見出しh3 */
h3 {
  border-bottom: 1px solid #bb6541;
  padding-left: 0.5em;
  margin: 1.2em 0 0.8em;
  font-weight: bold;
}

/* h3副題（完結/連載ステータス） */
span.h3sub {
  font-size: 70%;
  color: #ffffff;
  background-color: #bb6541;
  border-radius: 1em;
  margin: 0 0.4em;
  padding: 0.1em 0.5em 0.1em 0.4em;
}

/* 見出しh4 */
h4 {
  margin: 1em 0 0.5em;
  font-weight: bold;
  font-size: 1em;
}

/* 罫線リセット */
hr {
  height: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

/* 罫線 */
hr {
  border: none;
  border-top: 1px solid #9f9ca7;
  width: 50%;
  margin: 2.5em auto;
}

/* リンク */
a{
  text-decoration: none;
  color: #9f342a;
  position: relative;
  display: inline-block;
  font-weight: 500;
}

.small{
    font-size: small;
}

/* リンクホバー */
a:hover {
  color: #9f9ca7;
  transition:0.3s;
}


/* ========== てがろぐ用 ========== */

	/* ------------------------- */
	/* ▼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.9rem;			/* 文字サイズ */
		text-decoration: none;		/* リンク文字の下線を消す */
		vertical-align: middle;		/* 行内の上下方向では中央配置 */
	}

		/* ------------------------------------- */
		/* リンクカードの装飾(サイズS/L共通部分) */		/* ※後述の「サイズS用の追記」や「サイズL用の追記」と合わせて、1つのカードデザインになります。 */
		/* ------------------------------------- */
		/* カード外枠 */
		.cardlinkbox {
			border: 1px solid #e9e8f0;		/* 枠線 */
			border-radius: 7px;			/* 角丸 */
			background-color: white;	/* 背景色 */
			display: flex;				/* 内部レイアウトのFlexbox化 */
		}
		/* (マウスが載ったとき) */
		.cardlinkbox:hover {
			background-color: #e9e8f0;	/* 背景色 */
			border-color: #9f9ca7;			/* 枠線色 */
		}
			/* ▽リンクカード内の画像枠 (※読み込まれたog:imageは、この枠に《背景画像として》描画されます) */
			.cardlinkimage {
				background-image: linear-gradient(-30deg, #9f9ca7, #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:#bb6541;					/* 文字色 */
					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 #e9e8f0;	/* 左側の枠線 */
				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 #e9e8f0;	/* 上側の枠線 */
			}
				/* ▽リンクカードのテキスト枠内の3要素 */
				.cardsize-L .cardlinktitle { font-weight: bold; }			/* 太字 */
				.cardsize-L .cardlinkdescription { min-height: 2.5em; }		/* 内容量が少ない場合でも一定の高さを確保 */
				.cardsize-L .cardlinkurl {
					border-top: 1px solid #e9e8f0;		/* 上側の枠線 */
					margin-top:0.5em;				/* 上側の枠線より上の余白量 */
					padding-top:0.5em;				/* 上側の枠線より下の余白量 */
					font-size:0.75rem;				/* 文字サイズ(小さめ) */
				}

				/* 吹き出し装飾 */
.deco-hukidasi {
  display: inline-block;
  position: relative;
  padding: 0.5em 0.75em;
  border: 1px solid #9f9ca7;
  border-radius: 0.75em;
  background-color: #ffffff;
  color: #2c494e;
  vertical-align: middle;
}

/* 外側の三角（枠線） */
.deco-hukidasi::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(-100%, -50%);
  border-width: 0.45em;
  border-style: solid;
  border-color: transparent;
  border-right-color: #9f9ca7;
}

/* 内側の三角（背景色） */
.deco-hukidasi::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(calc(-100% + 1px), -50%);
  border-width: 0.4em;
  border-style: solid;
  border-color: transparent;
  border-right-color: #ffffff;
}



				/* B:太字(Bold) */
	.decorationB {
		font-weight: bold;		/* 太字 */
	}
	/* D:削除(Delete) */
	.decorationD {
		color: #9f9ca7;	/* 文字色 */
		text-decoration-line: line-through;	/* 取り消し線 */
		text-decoration-color: #9f9ca7;			/* 線の色 */
	}
	/* E:強調(Emphasis) */
	.decorationE {
		color: #9f342a;	/* 文字色 */
		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 #9f9ca7;	/* 左端の枠線 */
		background-color: #e9e8f0;			/* 背景色 */
		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: #bb6541;		/* 線配色 */
	}

    .onelogbox ul.decorationL li:before {
  content: "";
  width: 5px;
  height: 5px;
  display: block;
  background: #bb6541;
  position: absolute;
  margin: auto;
  top: 0.6em;
  left: 0;
}

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

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

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

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

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

	/* -------------- */
	/* ▼埋め込み動画 */
	/* -------------- */

    	figure.embeddedvideo {
		margin: 0;
		padding: 0;
    max-width: 600px;
		display: flex;
		flex-direction: column-reverse;
	}

		.videotitle {
			text-align: center;
			background-color: #e9e8f0;
		}

	video.embeddedvideo {
		display: inline-block;
		max-width: 100%;
		width: 100%;
		height: auto;
	}

	/* --------------- */
	/* ▼埋め込みTweet */	/* これはツイートが埋め込まれる処理「前」用の装飾です。実際に埋め込まれるツイートはTwitter側のiframeで装飾されますので、てがろぐ側では指定できません。(ただし横幅を制限することはできます。→後述) */
	/* --------------- */
	blockquote.twitter-tweet {
		background-color: #f8f8f8;
		border: 1px dashed #e9e8f0;
		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%, #bb6541 60%);		/* 文字の下半分くらいにマーカーっぽい線を引く */
	}
/* ========================== */
/* ■ページ最上部(ヘッダ)領域 */
/* ========================== */
    header {
  width: 100%;
  margin: 0 auto;
  padding: 1px 0px 30px;
}
	/* -------------- */
	/* ▼タイトル区画 */
	/* -------------- */
	.headtitle {
		display: block;	/* タイトルとボタンで2段組 */
		margin: auto;				/* 外側の余白量 */
		padding: 0.2em;			/* 内側の余白量 */
		font-family: 'M PLUS Rounded 1c', sans-serif;
        color: #2c494e;		/* 文字色 */
		line-height: 1;			/* 行の高さ */
	}



		/* ▽メインタイトル */
		
h1.maintitle {
  text-align: center;
  font-weight: 600;
  margin: 40px auto 20px;
  font-size: 24px;
  line-height: 1.2em;
}
		/* ▽メインタイトルのリンク */
		h1.maintitle a {
  color: #2c494e;
  font-weight: 600;

}
h1.maintitle small.subtitle {
  font-size: 14px;
  text-align: center;
}

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


/* ====================== */
/* ■メイン(ログ掲載)領域 */
/* ====================== */

/* メイン表示領域 */
.contents{
  background-color: #ffffff;
  border-radius: 0.75em;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  color: #2c494e;
  width: 960px;
  display: block;
  margin: 2% auto;
  padding: 10px 20px;
}

.area {
    display:flex
}

@media screen and (max-width: 1000px) {
    .area {
        display:block
}
}

.preface {
	margin: 2em 1em 0 1em; 
}

.mainarea {
	margin: 1em;	/* 外側の余白量 */
	padding: 0;		/* 内側の余白量 */
    max-width: 77%;
    min-width: 0;
}

@media screen and (max-width: 1000px) {
    .mainarea {
        max-width: 90%;
}
}

	/* ------------------------------------------ */
	/* ▼表示対象の限定時などの「限定条件」表示行 */
	/* ------------------------------------------ */
	.situation {
		margin: 0 0 1em 0;	/* 外側の余白量 */
        border: 1px solid #9f9ca7;
        border-radius: 1em;
		color: #9f9ca7;		/* 文字色 */
	}
	.situation:empty { display: none; }	/* 限定表示がない場合は存在自体を消す */

	/* -------------- */
	/* ▼日付境界バー */
	/* -------------- */
	.dateseparator {
        font-size: 65%;
		color: #9f9ca7;			/* 文字色 */
		padding: 2px 1em;		/* 内側の余白量 */
	}

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

	/* ▼日付境界バー内のリンク(ボタン) */
	.dateseparator a {
		display: inline-block;	/* インラインブロック化 */
		margin-left: 1.5em;		/* 外側左の余白量 */
		color: #bb6541;			/* 文字色 */
		font-size: 0.75em;		/* 文字サイズ */
		font-weight: normal;	/* 太字を解除 */
		border: 1px solid #bb6541;	/* 枠線 */
		border-radius: 1em;		/* 枠の角丸 */
		padding: 0px 1em;		/* 内側の余白量 */
		text-decoration: none;	/* 下線を消す */
		vertical-align:middle;	/* 上下の中心寄せ */
	}
	/* ▼日付境界バー内のリンク(ボタン)にマウスが載ったとき */
	.dateseparator a:hover {
		background-color: #ffffff;	/* 背景色 */
		color: #9f9ca7;			/* 文字色 */
		border-color: #9f9ca7;		/* 枠線の色 */
	}
    
/* ================================ */
/* ■投稿ボックス(一発言)ごとの表示 */	/* ※この領域は、内側スキンで生成しているHTMLに対する装飾です。 */
/* ================================ */
.onelogbox {
    padding: 30px 0;
	display: table;					/* 投稿情報と投稿本文とで2段組 */
	border-collapse: separate;		/* 段の間隔を空ける */
	border-spacing: 0 0.75em;		/* 段の間隔量 */
	border-bottom: 1px #9f9ca7 solid;	/* 下線 */
	width: 100%;
    max-width: 100%;					/* 横幅 */
}

.onelogbox p{
    margin: 0.5em;
}

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

		/* ………………………………………… */
		/* ▼ユーザアイコン＆ユーザ名リンク */
		/* ………………………………………… */
		.usericonlink {
			display: block;				/* ブロック化 */
			margin: 0 1px;				/* 外側の余白量 */
			padding: 0.25em 0;			/* 内側の余白量 */
			color: #2c494e;				/* 文字色 */
			border-radius: 1em;			/* 枠の角丸 */
			font-size: 0.67em;			/* 文字サイズ */
			text-decoration: none;		/* 下線を消す */
		}
			/* ‥‥‥‥‥‥‥ */
			/* ▼アイコン部分 */
			/* ‥‥‥‥‥‥‥ */
			.iconarea {
				display: block;		/* ブロック化 */
			}

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

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

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

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

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

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

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

		/* ……………………………………………… */
		/* ▼投稿日時やカテゴリ名などの情報表示 */
		/* ……………………………………………… */
		.oneloginfo {
			margin: 0.75em 0 0 0;	/* 外側の余白量 */
			color: #9f9ca7;			/* 文字色 */
			font-size: 0.8em;		/* 文字サイズ */
			text-align: right;		/* 右寄せ */
		}
			/* ‥‥‥‥‥‥‥‥‥ */
			/* ▼投稿日時のリンク */
			/* ‥‥‥‥‥‥‥‥‥ */
			.postdate a {
				display: inline-block;		/* インラインブロック化 */
				padding: 0 0.25em;			/* 内側の余白量 */
				color: #9f9ca7;			/* 文字色 */
				text-decoration: none;		/* 下線を消す */
			}

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

			/* ‥‥‥‥‥‥ */
			/* ▼カテゴリ名 */
			/* ‥‥‥‥‥‥ */
			.categories {
			}

.categorylink:before {
  font-family: "Line Awesome Free", "Line Awesome Brands";
  content: "\f07b";
  font-weight: bold;
  font-size: 1em;
  color: #9f9ca7;
  vertical-align: middle;
}

				/* ▽カテゴリリンク1つ */
				.categorylink {
                    margin: 0 2px;
                    color: #bb6541;
                    border: 1px solid #bb6541;
                    border-radius: 0.5em;
					display: inline-block;
					text-decoration: none;		/* リンクの下線を消す */
				}
				/* ▽カテゴリリンクにマウスが載ったとき */
				.categorylink:hover {
                    color: #9f9ca7;
				}
				/* ▽カテゴリ間のセパレータ */
				.catseparator {
					display: inline-block;
					margin: 0 1px;			/* 左右に1pxの余白 */
					color: gray;			/* 文字色 */
				}

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


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



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


/* ========================== */
/* ■ページナビゲーション領域 */
/* ========================== */
.pagenavi {
	margin: 2.5em 0px;			/* 外側の余白 */
	padding: 0.5em 0px;			/* 内側の余白 */
	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: #bb6541;	/* 背景色 */
		color: white;				/* 文字色 */
		border-radius: 1em;			/* 角丸 */
	}
	/* ▽ページ番号リンクにマウスが載った際の装飾 */
	a.pagenumlink:hover {
		text-decoration: none;		/* リンク装飾を消す */
		background-color: #9f9ca7;	/* 背景色 */
		color: white;				/* 文字色 */
		border-radius: 0.3em;		/* 角丸 */
	}

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


/* ========== */
/* ■サブ領域 */
/* ========== */
.subarea {
	margin: 1em 0 0 0;				/* 外側の余白量 */
	padding: 0 1em;					/* 内側の余白量 */
	border-left: 1px solid #e9e8f0;	/* 枠線(左側) */
    border-bottom: none;
    max-width: 28%;
    min-width: 0;
    font-size: 80%;
}

@media screen and (max-width: 1000px) {
    .subarea {
        max-width: 90%;
}
}

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

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

	

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

		/* …………………………… */
		/* ▼日付リンクリスト区画 */
		/* …………………………… */
		/* ▽日付リスト(年単位) */
		.datelimitlist {
			margin: 0.5em 0;		/* 外側の余白量 */
			padding: 0 0 0 20px;	/* 内側の余白量 */
			padding: 0.5em 0.5em 0.5em 1.5em;		/* 内側の余白量 */
			border-radius: 0.5em;	/* 角丸 */
		}
		/* ▽日付リスト(月単位) */
		.datelimitsublist {
            font-size: 0.9em;
			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: #bb6541;			/* 文字色 */
			margin-left: 0.3em;		/* 外側左の余白量 */
		}

        .datelimit-expand {
            font-size: 0.9em;
	border-left: 3px solid #9f9ca7;   /* 左端の縦線 */
	padding-left: 0.5rem;   /* 左側の(縦線より)内側の余白量 */
	margin-left: 0.2rem;   /* 左側の(縦線より)外側の余白量 */
	margin-bottom: 0.5rem;   /* 下側の余白量 */
}

	/* ------------------------ */
	/* ▼ハッシュタグリスト区画 */
	/* ------------------------ */
	.hashtaglistarea {
		margin: 0 0 1em 0;					/* 外側の余白量 */
		padding: 0 0 1em 0;					/* 内側の余白量 */
		border-bottom: 1px dashed #9f9ca7;	/* 下線 */
	}
	/* ▼見出し */
	.hashtaglistarea .cornertitle {
		margin: 0;							/* 外側の余白量 */
		font-weight: bold;					/* 太字 */
		color: #9f9ca7;						/* 文字色 */
	}

ul.hashtaglist li:before {
  font-family: "Line Awesome Free", "Line Awesome Brands";
  content: "\f292";
  font-weight: bold;
  font-size: 1em;
  color: #9f9ca7;
  vertical-align: middle;
}

		/* ▽ハッシュタグリスト */
		.hashtaglist {
			list-style-type: none;	/* リストの先頭記号(なし) */
			margin: 0.5em 0;		/* 外側の余白量 */
			padding: 0.75em;		/* 内側の余白量 */
            color: #bb6541;
			border-radius: 0.5em;	/* 角丸 */
			line-height: 1.5;		/* 行の高さ */
		}

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

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

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

	/* -------------------- */
	/* ▼カテゴリツリー区画 */
	/* -------------------- */
	.categoryarea {
		margin: 0 0 1em 0;					/* 外側の余白量 */
		padding: 0 0 1em 0;					/* 内側の余白量 */
		border-bottom: 1px dashed #9f9ca7;	/* 下線 */
	}

  ul.cattree.depth1 > li:before {
  font-family: "Line Awesome Free", "Line Awesome Brands";
  content: "\f07b";
  font-weight: bold;
  font-size: 1em;
  color: #9f9ca7;
  vertical-align: middle;
  margin-right: 5px;
}
		/* ▽見出し */
		.categoryarea .cornertitle {
			margin: 0;							/* 外側の余白量 */
			font-weight: bold;					/* 太字 */
			color : #bb6541;;						/* 文字色 */
		}
		.categoryTree {
			border-radius: 0.5em;	/* 角丸 */
			margin: 1em 0;		/* 外側の余白量 */
			padding: 0.25em;	/* 内側の余白量 */
		}
			/* ▽カテゴリツリー */
			.categoryTree ul {
				padding-left: 30px;		/* 左側の余白量 */
				list-style-type: none;	/* 箇条書き記号(何も付けたくなければ 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: #9f9ca7;
				}

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

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

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

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

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

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

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

			/* 曜日行 */
			.daysofweek th {
				background-color: #e9e8f0;
				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 {
				text-decoration: none;		/* 下線を消す */
				background-color: #ffffff;	/* 背景色 */
				color: #bb6541;				/* 文字色 */
			}
			/* 日付数値のリンクにマウスが載った際 */
			.calendar td a:hover {
				background-color: #bb6541;	/* 背景色 */
				color: white;				/* 文字色 */
			}

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

            .calendarlinks a{
                font-size: 0.9em;
                text-align: center;
            }



	/* ▼その他の情報表示 */
	.infotitle {
		margin: 1em 0 0 0;
		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: #ffffff;	/* 背景色 */
	color: #9f342a;				/* 文字色 */
}

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

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

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

	/* Powered-by表記のデザイン */
	.poweredby { margin: 2em 1em 0px 1em; font-size: 0.8em; }
/* ========== Responsive (メディアクエリ) ========== */
/* @media 以下をここにまとめる */

/* スマホ対応 */
@media screen and (max-width: 750px) {

.contents{
  background-color: #ffffff;
  border-radius: 0.75em;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  font-size: 95%;
  color: #2c494e;
  width: 95%;
  margin: 2% auto;
  padding: 8px 2%;
  display: block;
}

p{
    margin: 0.4em 0;
}

}