﻿@charset "utf-8";
	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
				}
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;}	
/* ■投稿ボックス(一発言)ごとの表示 */
	.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;
			}
			/* ▽年表記が単独で存在する場合に、月リンク内に含まれる年表記を非表示にする(詳細解説→ 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;
		}
		/* ▽日付リンク項目 */
		.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;
		}
.note { 
	line-height: 1.5;
	margin: 0; padding: 0.2em;
	}
footer{
	width: 100%; 
	padding: 10px 25px; 
	}
@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;}
}
