@charset "UTF-8";

/* ************************************************ */
/* 基本セット */
/* ************************************************ */



/* ************************************************ */
/* コミュニティ情報 */
/* ************************************************ */
.content.circle {
	position:relative;
	overflow:hidden;
	text-overflow:ellipsis;
}
.content.circle.official .thumb-area::before {
	content:"Official";
	display:block;
	position:absolute;
	top:0em;
	right:-1em;
	z-index:2;
	font-size:.9em;
	background-color:orange;
	border:.2em solid darkorange;
	border-radius:2em;
	color:white;
	line-height:1em;
	padding:.1em .5em;
	transform:rotate(20deg);
}

.content.circle h1 {
}
.content.circle .thumb-area {
	position:relative;
	z-index:1;
	width:200px;
	height:200px;
	float:right;
	margin:0 0 10px 10px;
}
.content.circle .thumb-area img {
	width:100%;
	height:100%;
	border:1px solid silver;
}
.content.circle .category a {
	margin:.3em 0;
}
.content.circle .desc {
	border:1px solid silver;
	background:#f5f5f5;
	padding:0 .5em;
	margin:0 210px 1em 0;
	line-height:1em;
}
.content.circle .desc li {
	display:inline-block;
	width:49%;
	box-sizing:border-box;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	padding:.5em 0;
	font-size:.9em;
	border-bottom:1px dotted gray;
}
.content.circle .desc li:last-child {
	width:100%;
	line-height:1.8em;
	border:0;
}
.content.circle .desc li span:first-child {
	color:#888;
	font-size:.75em;
	line-height:1.2em;
	padding:0;
	margin-right:.5em;
}
.content.circle .desc li span:first-child:after { content:":"; }
.content.circle .profile img {
	width:1.8em;
	height:1.8em;
	border:1px solid silver;
	float:none;
	vertical-align:middle;
	margin-right:.2em;
}
.content.circle .desc li:last-child span:first-child {
	display:inline;
}
.content.circle .comment {
	display:inline;
}
.content.circle .join {
	margin:1em 0;
}
.content.circle .join a { margin-bottom:.5em; }
.content.circle .tag-list {
	font-size:.8em;
	color:#777;
	margin:1em 0;
}
.content.circle .social { text-align:right; }
.content.circle .social > * { margin-left:6px !important; height:20px !important; }
.content.circle .social * { vertical-align:top !important; }
.content.circle .social .twitter-share-button { margin-top:2px; }



/* ************************************************ */
/* トピック一覧 */
/* ************************************************ */
.topic-list {
	margin:1em 0;
	overflow:hidden;text-overflow:ellipsis;
	line-height:1.3;
}
.topic-list > li {
	border-bottom:1px dotted silver;
	padding:.5em 0 0 0;
	min-height:2.5em;
}
.topic-list > li [timeview] { font-size:.9em; margin-left:.5em; }
.topic-list > li:first-child {
	border-top:1px dotted silver;
}
.topic-list > li a { letter-spacing:-.03em; }
.topic-list .type {
	position:relative;
	overflow:hidden;
	text-overflow:ellipsis;
	font-size:1.2em;
}
.topic-list .type::before {
	display:inline-block;
	margin-top:-.1em;
	margin-right:.3em;
	border-radius:.2em;
	line-height:1.5em;
	background:chocolate;
	color:white;
	padding:0 .5em;
	font-size:.7em;
	content:"掲示板";
	vertical-align:middle;
	text-decoration:none;
}
.topic-list .type-2::before {
	content:"ブロトピ";
	background:darkolivegreen;
}
.topic-list .count {
	display:inline-block;
	font-size:.9em;
	margin-left:.5em;
	padding-left:20px;
	background:url(/img/1.0/icon_comment.png) left 1px no-repeat;
	vertical-align:middle;
}
.topic-list .t-updates {
	margin:0;
	margin-top:.3em;
	font-size:.75em;
}
.topic-list .t-updates > li {
	padding-left:1em;
	line-height:1.5;
}
.topic-list .t-updates > li > div {
	display:inline-block;
	max-width:80%;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	padding-right:1em;
	margin-right:.5em;
	border-bottom:1px dashed silver;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
}
.topic-list .t-updates > li:last-child > div { border:initial; }
.t-updates span {
	color:#999;
	text-decoration:none;
}
.t-updates .upd-type-1::before { content:"┃"; color:chocolate; }
.t-updates .upd-type-2::before { content:"┃"; color:darkolivegreen; }
.t-updates a:hover { text-decoration:underline; }



/* ************************************************ */
/* 最新記事 */
/* ************************************************ */
.content.user-item .jq-bim-widget { font-size:.9em; }



/* ************************************************ */
/* サイド(概要) */
/* ************************************************ */
#side .circle {
	border:2px solid #282634;
	padding:.3em;
	letter-spacing:-.04em;
}
#side .circle .header {
	display:table;
	table-layout:fixed;
	width:100%;
	line-height:1.1em;
}
#side .circle .header > * {
	position:relative;
	display:table-cell;
	vertical-align:top;
}
#side .circle .header .thumb {
	width:4.5em;
}
#side .circle .header img {
	width:4em;
	height:4em;
	border:1px solid gray;
}
#side .circle .header .title .looks {
	font-size:.6em;
	color:gray;
	text-decoration:none;
	line-height:1.2;
	letter-spacing:0;
	margin-bottom:.2em;
}
#side .circle .header .title a {
	font-size:1.2em;
}
#side .circle .count {
	margin-top:.3em;
	font-size:.7em;
}
#side .circle .count a {
	color:#797;
	text-decoration:none;
}
#side .circle .count a span {
	text-decoration:underline;
}
#side .circle .count a:hover {
	color:tomato;
}
#side .topic-list {
	font-size:.8em;
	margin:.5em 0;
}
#side .topic-list > li {
	padding:0;
	min-height:0;
}
#side .topic-list > li:nth-child(odd) {
	background-color:#f0f0f0;
}
#side .topic-list a {
	color:#777;
	text-decoration:none;
	display:block;
	padding:.4em 0;
	line-height:1.3em;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	padding-left:.3em;
}
#side .topic-list a:hover {
	color:tomato;
	text-decoration:underline;
}
#side .topic-list .type span { display:none; }
#side .topic-list [timeview] { display:none; }
#side .topic-list .type::before {
	content:"掲示";
}
#side .topic-list .type-2::before {
	content:"トピ";
}
#side .topic-list .count { display:none; }



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

.content.circle .thumb-area {
	width:6em;
	height:6em;
}
.content.circle .category { margin-top:1.5em; }
.content.circle.official .thumb-area::before { font-size:.5em; }
.content.circle .desc {
	clear:both;
	margin:0 0 1em 0;
}
.content.circle .desc li span:first-child {
	font-size:.7em;
	display:block;
}
.topic-list .t-updates > li { padding-left:.5em; height:2em; }
.topic-list .t-updates > li > div { max-width:98%; padding-right:.5em; }
.topic-list .type { font-size:1.1em; }

/* /@media */
}
