@charset 'utf-8';


#contentheader {
	width: 720px;
	height: 66px;
	padding: 0;
	background: url(../image/info/contentheader.png) no-repeat;
	text-indent: -1000em;
}

#rewelog #contentheader {
	background: url(../image/rewelog/contentheader.png) no-repeat;
}

#wrap_article,
#wrap_article_category {
	margin: 40px 0 0 40px;
	padding: 0;
}

#wrap_article {
	background: url(../image/common/back_article.png);
	color: #685032;
}

.articlelistitem {
	margin: 0;
	min-height: 170px;
	margin-bottom: 1px;
	padding: 20px 20px 20px 300px;
	background: url(../image/common/back_article_static.png);
	position: relative;
	cursor: pointer;
}

.articlelistitem.hover {
	background: url(../image/common/back_article_collagen.png);
}

.articlelistitem a {
	color: #fff;
}

.articlelistitem figure {
	position: absolute;
	top: 20px;
	left: 20px;
}

.articlelistitem h1,
.articletitle h1 {
	margin: 0;
	font-size: 1.2em;
	line-height: 1.4em;
}

.articletitle {
	margin: 0 0 10px 0;
	padding: 20px;
	position: relative;
}

.articlebody {
	margin: 0 0 30px 0;
	background: url(../image/common/back_article.png);
}

.articletitle h1 {
	padding: 0 0 5px 0;
	border-bottom: 1px solid #806b28;
}

.articlelistitem span,
.articletitle span,
.articlelistitem time,
.articletitle time {
	padding: 0 2em 0 0;
	font-size: 0.8em;
	line-height: 1.2em;
	position: relative;
}

.articlelistitem span a:after,
.articlelistitem .more a:after,
.articletitle span a:after {
	content: '';
	width: 0;
	height: 0;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 5px solid #fff;
	position: absolute;
	top: 3px;
	left: -10px;
}

.articletitle span a:after {
	border-left-color: #806b28;
}

.articlelistitem p {
	padding: 10px 0;
	font-size: 1em;
	line-height: 1.6em;
}

.articlelistitem .more {
	font-size: 0.9em;
	text-align: right;
	line-height: 1.2em;
}

.articlelistitem .more a {
	position: relative;
}

.articlelistitem .more a:after {
	top: 4px;
	left: -10px;
}

.socialmedia {
	height: 20px;
	vertical-align: top;
	position: absolute;
	bottom: 20px;
	right: 20px;
}

.socialmedia ul {
	list-style: none;
	display: inline-block;
	height: 20px;
	letter-spacing: -.5em;
}

.socialmedia li {
	list-style: none;
	display: inline-block;
	width: 24px;
	height: 20px;
	margin-left: 2px;
	letter-spacing: normal;
}

.socialmedia li a {
	display: inline-block;
	width: 24px;
	height: 20px;
	background: url(../image/common/btn_social_icon.png);
	text-indent: -1000em;
}

.socialmedia li#sm_facebook a {
	background-position: -24px 0;
}

.socialmedia li#sm_google a {
	background-position: -48px 0;
}

.socialmedia li#sm_line a {
	background-position: -72px 0;
}

.socialmedia li#sm_feed a {
	background-position: -96px 0;
}

.socialmedia li#sm_twitter a:hover {
	background-position: 0 -20px;
}

.socialmedia li#sm_facebook a:hover {
	background-position: -24px -20px;
}

.socialmedia li#sm_google a:hover {
	background-position: -48px -20px;
}

.socialmedia li#sm_line a:hover {
	background-position: -72px -20px;
}

.socialmedia li#sm_feed a:hover {
	background-position: -96px -20px;
}


.articlebody .caution p {
	margin-bottom: .5em;
	padding-left: 1.2em;
	color: #c29361;
	font-size: .85em;
	line-height: 1.4em;
	position: relative;
}

.articlebody .caution p:after {
	content: '※';
	width: 1em;
	height: 1em;
	position: absolute;
	top: 0;
	left: 0;
}