@charset "utf-8";
@media all and (min-width: 800px) {
	.headarea {
		display: flex;
		align-items: baseline;
	}

	.change-mode {
		width: 755px;
		margin: 0 auto;
	}

	.spacer {
		margin-left: 5px;
	}

	.contents {
		display: flex;
		flex-direction: column;
		margin: 0 auto;
		padding-top: 80px;
		background-color: #fcfcfc;
		width: 1000px !important;
	}

	.contents .mainarea {
		width: calc(95% - 2em);
		margin: 0 auto;
		padding: 0;
		vertical-align: top;
	}
	.subarea {
		display: flex;
		flex-direction: column;
		margin: 0 auto;
		background-color: #fcfcfc;
		width: 1000px !important;
		/* 		display: none; */
	}
	.subarea >.postarea {
		padding: 1em 1em 0;
	}

	.categoryarea {
		text-align: center;
	}

		ul.cattree {
			display: flex;
			flex-direction: row;
			justify-content: center;
			flex-wrap: wrap;    
		}
		ul.cattree li {
			display: flex;
			align-items: center;
			flex-direction: row;
			width: auto;
			height: 20px;
			margin: 0 5px 6px 0;
			padding: 2px 10px;
			background-color: #c1dd7a;
			border-radius: 3px;
		}
			ul.cattree :hover {
				background-color: #ddd;
			}

		ul.cattree li a {
			white-space: nowrap;
			color: #006e54; 
			font-size: 14px;
			font-weight: 500; 
		}

		ul.cattree.depth1 .num {
		font-weight: 500;
		color: #006e54;
		font-size: 12px;
		}

	.dateseparator {
	color: white;
	padding: 2px 1em;
	}

	/* ▼日付境界バー内のリンク(ボタン) */
	.dateseparator a {
		display: inline-block;
		margin-left: 1.5em;
		color: #ffc;
		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: green;
		border-color: skyblue;
	}

	.gallerybox {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		margin: 0;
		padding: 0;
	}

	.onelogbox {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: calc(100% / 4 - 0px);
		/* 横幅100%から(n)px引いた幅を４等分する */
		height: 210px;
		margin: 0;
		padding: 0;
		border-bottom: none;
	}

	.oneloghead {
		margin: 0;
		width: 80%;
		height: 6px;
	}
	.iconarea {
		display: flex;
		margin-top: 0;
	}
	.memonum {
		margin: 0.3em 0;
		font-size: 0.8em;
		color: gray;
	}

	.postdate {
		/* display: none; */
		display: inline-block;
		font-size: 0.8em;
		color: #606984;
	}

	.newsign {
		display: inline-block;
		color: #f55;
		margin-right: 0.35em;
	}

	.categories {
		display: block;
	}

	.categorylink {
		display: block;
		width: fit-content;
		height: 14px;
		margin: 6px 2px 0 0;
		padding: 0 5px;
		background-color: #fcfcfc;
		color: green;
		border: 1px solid green;
		font-size: 11px;
		line-height: 1.3;
		text-decoration: none;
	}

	.categorylink:hover {
		background-color: #c1dd7a;
		color: #fff;
		border: 1px solid #c1dd7a;
		text-decoration: none;
	}

	.catseparator {
		display: inline-block;
		margin: 0 1px;
		color: gray;
	}

	.onelogmain {
		margin: 0;
	}

	.imagebox {
		margin: 0;
	}

	p.imagebox {
		line-height: 1.0;
	}

/* 	p.imagebox.caution {
		line-height: 1.0;
	} */

	.embeddedimage {
		max-width: 100%;
		max-height: 170px;
		width: 170px;
		height: auto;
		aspect-ratio: 1 / 1;
		object-fit: cover;
		padding: 4px;
		border: 1px solid rgb(209, 209, 209, 0.8);
	}

	/* .imagebox .nsfw {
		display: block;
		overflow: hidden;	/* ぼかし領域がfigureのボックスからはみ出ないようにする */
	/* 	width: inherit;
		height: 180px;
		margin-top: 4px;
	} */
	/* img.embeddedimage.nsfw {
		-webkit-filter: blur(30px);
		filter: blur(30px);
	} */

	/* ▼特定カテゴリ（caution）の画像にクッション画像を挟む指定 */
	.caution .embeddedimage {
		display: none;
	}

	.caution .imagelink {
		display: inline-block;
		width: 170px;
		height: 170px;
		background-image: url("/izuruya/cgi-bin/izwitter/images/sensitive.png");
		background-size: 100% 100%;
		/* リンクをブロック化して背景画像を表示する */
		padding: 4px;
		border: 1px solid rgb(209, 209, 209, 0.8);
	}

	p.imagebox.cushion {
		line-height: 1.01;
	}

	.onelogtext {
		font-size: 12px;
		line-height: 1.5;
		overflow-wrap: break-word;
	}
	.arrowlink {
		display: block;
		width: 27px;
		height: 20px;
		position: relative;
		top: -24px;
		left: 3px;
		background-color: #ffffffee;
		color: #86b80a;
		border-radius: 3px;
		z-index: 1;
	}
	.arrowlink::before {
		font-family: fontawesome;
		content: '\f2f6';
		font-size: 14px;
		font-weight: 100;
		position: relative;
		top: -1px;
		left: 0;
	}
	.arrowlink:hover {
		color: #c1dd7a;
		text-decoration: none;
	}

	/* Font Awesomeサイズ */
	.my-small {
		font-size: 0.8em;
	}

	/* Font Awesomeサイズ */
	.my-tiny {
		font-size: 0.6em;
	}

	.onelogtext .taglink {
		text-decoration: none;
		font-size: 0.75em;
		padding: 0 0.25em;
		background-color: #eee;
		border: 1px solid #aaa;
		border-radius: 3px;
		vertical-align: middle;
	}

	.onelogtext {
		display: none;
	}
	.onelogfoot {
		display: inline-block;
		text-align: center;
		width: 80%;
		height: 24px;
		font-size: 14px;
	}

	.username {
		display: block;
		padding-top: 4px;
	}

	.postuserid {
		margin: 0 0.3em;
		display: none;
	}

	.postuserid a {
		text-decoration: none;
		color: inherit;
	}

	.postuserid a:hover {
		text-decoration: underline;
	}

	.usericon {
		display: none;
	}

	footer {
		width: 1000px;
	}

	footer .control-links {
		text-align: center;
	}

}

/* ▼メディアクエリー */
@media all and (max-width: 480px) {
	.situation {
		margin: 0;
	}
	.contents .mainarea {
		width: calc(100% - 2em);
		margin: 0 auto;
		padding: 10px 15px 0;
		vertical-align: top;
	}
	.gallerybox {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		margin-top: 0.5em;
	}
	.onelogbox {
		display: flex;
		flex-direction: column;
		align-items: center;
		border: none;
		width: calc(100% / 3 - 0px);
		margin: 0;
	}
	.arrowlink {
/* 		display: block;
		width: 26px;
		height: 20px;
		position: relative;
		top: 75px;
		left: -32px;
		background-color: #fff; */
		color: #86b80a;
		border-radius: 1px;
		z-index: 1;
	}
	.arrowlink::before {
		font-family: fontawesome;
		content: '\f2f6';
		font-size: 14px;
		font-weight: 100;
		position: relative;
/* 		top: -2px;
		left: 6px; */
	}
	.embeddedimage {
		aspect-ratio: 1 / 1;
		width: 98px;
		height: auto;
		object-fit: cover;
		padding: 3px;
		border: 1px solid rgb(209, 209, 209, 0.8);
	}
	.video .imagelink {
		display: inline-block;
		width: 98px;
		height: 98px;
		padding: 3px 2px;
		border: 1px solid rgb(209, 209, 209, 0.8);
		border-radius: 0;
/* 		background-image: url("../img/playback.png/play.png");
		background-size: 100% 100%;
		background-color: #b6d5ce; */
	}
	.nsfw .embeddedimage {
		display: none;
	}
	.imagelink.nsfw {
		display: inline-block;
		width: 85px;
		height: 85px;
		margin-top: 4px;
		padding: 2.5px 2px;
		border: 1px solid rgb(209, 209, 209, 0.8);
		border-radius: 2px;
		background-image: url("../images/playback.png/play.png");
		background-size: 100% 100%;
		background-color: #b6d5ce;
	}

	p.imagebox {
		line-height: 0;
	}

	.oneloghead {
		display: block;
		width: fit-content;
		height: 0;
	}

	.onelogfoot {
		display: block;
		width: 80%;
		height: 24px;
		text-align: center;
		font-size: 12px;
	}
	.subarea {
		width: 100%;
	}
		ul.cattree {
			display: flex;
			flex-direction: row;
			justify-content: center;
			flex-wrap: wrap;    
		}
		ul.cattree li {
			display: flex;
			align-items: center;
			flex-direction: row;
			width: auto;
			height: 20px;
			margin: 0 5px 6px 0;
			padding: 2px 10px;
			background-color: #c1dd7a;
			border-radius: 3px;
		}
			ul.cattree :hover {
				background-color: #ddd;
			}

		ul.cattree li a {
			white-space: nowrap;
			color: #006e54; 
			font-size: 14px;
			font-weight: 500; 
		}

		ul.cattree.depth1 .num {
		font-weight: 500;
		color: #006e54;
		font-size: 12px;
		}

}

/* End of file */