@charset "utf-8";

#twitter-box {
	margin-bottom: 20px;
}

/*====== 共通 ====== */
.side-box {
	margin-bottom: 20px;
	line-height: 130%;
	font-size: 13px;
}

.side-box h2.theme {
	margin-bottom: 0.8em;
}

.side-box h2.theme a, .side-box h2.theme span {
	display: block;
	padding-left: 20px;
	height: 30px;
	font-weight: normal;
	line-height : 31px;
	background: #FF4F90 url(../images/box-title.gif) no-repeat;
	color: #ffffff;
	text-shadow: 1px 1px 2px #240000;
}

@media screen and (max-width: 599px) {
	.side-box h2.theme a, .side-box h2.theme span {
		position: relative;
		background-image: none;
		border-radius: 4px;
	}
	
	.side-box h2.theme a:before, .side-box h2.theme span:before {
		content: "";
		position: absolute;
		left: 9px;
		top: 12px;
		display: block;
		width: 6px;
		height: 6px;
		background-color: #ffffff;
		border-radius: 3px;
	}
}

.side-box li {
	margin-bottom: 0.8em;
	border-bottom: 1px dotted #999999;
}

.side-box li .date {	
	margin-bottom: 0.8em;
	color:#333333;
	font-weight: bold;
	font-size: 92%;
}

.side-box li .date + a {
	float: left;
	display: block;
	margin-bottom: 1em;
}

.side-box li h3.theme, .side-box li .content {
	float: right;
	width: 134px;
}

@media screen and (max-width: 599px) {
	.side-box li h3.theme, .side-box li .content {
		float: none;
		width: auto;
		margin-left: 66px;
	}
}

.side-box select {
	width: 200px;
}

@media screen and (max-width: 599px) {
	.side-box select {
		box-sizing: border-box;
		width: 100%;
		font-size: 16px;
	}
}

.side-box h3.theme {
	margin-bottom: 0.3em;
}

.side-box h3.theme a { 
	color: #ff6699;
}

.side-box .content {
	margin-bottom: 1em;
	height: 30px;
	overflow: hidden;
	color: #333333;
	font-size: 84%;
}

.box-foot {
	clear: both;
	text-align: right;
	font-weight: 600;
}

.box-foot a {
	color: #ff6699;
}

/*====== Twitter ====== */
#twitter-box {
	width: 200px;
	height: 398px;
}

@media screen and (max-width: 599px) {
	#twitter-box {
		width: auto;
	}
}

/*====== 一覧, バックナンバー ====== */
.box-interview-part li, .box-column li, .box-column-related li, .box-column-series li, .box-links li {
	list-style: disc inside;
	text-indent: -1em;
	padding-left: 1em;
	border: none;
}

/*====== 更新情報 ====== */
.box-update {
	background: #f0f0f0;
}

.box-update .date {
	margin-left: 10px;
	font-size: 109%;
}

.box-update li {
	border: none;
	margin-bottom: 1em;
}

.box-update li .content{
	display: block;
	margin-bottom: 0;
	padding: 0 10px;
	width: 180px;
	height: auto;
}