@charset "UTF-8";
/*
----------
blog.css
2016.9.15
----------
*/


/*
----------
clearfix
----------
*/
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {
    display: inline-block;
}

* html .clearfix {
    height: 1%;
}

.clearfix {
    display: block;
}


/**/
.post-footer:after
{
content:"";
height:0;
display:block;
clear:both;
}
.post-footer
{
_zoom:1;
}

/*
上書き
*/

#blog .hdg-1{padding:8px 16px;font-size:28px; font-weight:bold;margin-bottom:20px; box-shadow: #ddd 0 2px 2px 0;
background-color:#e5f5f1; border-bottom:2px solid #01a27a;color:#01a27a}
#blog .hdg-2{font-size:24px;color:#006633; border-bottom:none; line-height:110%}/*共通の設定に上書き*/
#blog .hdg-3{padding:8px 12px 6px;ont-size:16px; font-weight:bold; background-color: #eee;margin-bottom:8px;}
#blog .hdg-4{border-left:4px solid #3eb3ed;margin-bottom:8px; padding:0 8px;font-weight:bold; }


/*
Blog
*/

.blog-main{ width:430px; float:left; margin-left:20px}

.blog-index{border-top:none; border-left:none; margin-bottom:16px; width:100%}
.blog-index td{ padding:16px 4px; border-bottom:1px dotted #999;border-right:none; vertical-align:top}

#blog article{ padding:20px 0; border-bottom:1px dotted #5AC3A9}

/*
.post-box{ border:8px solid #F4FBFF; padding:16px 16px 8px; margin-bottom:16px}
.post-header h2{background-color: #E3F5FF;padding:8px;font-size:18px;margin-bottom:16px; font-weight:normal}
.post-box p{ margin-bottom:16px}
.post-footer{ border-top:2px dotted #ccc;padding:8px 0; font-size:12px; margin-top:32px}
.post-footer .date{margin:0}
.post-footer .category li{ float:left; padding:0 4px 0 0; margin:0}
*/

.blog-side{width:180px; float:right; margin-right:20px}
.blog-side h4{color:#01a27a; padding-bottom:4px; border-bottom:1px solid #01a27a; font-size:14px}
.profile,
.posts ul{ font-size:12px; line-height:125%}
.avatar { padding:0; border:1px solid #01a27a}
#blog .sns ul:after {
    content: "";
    height: 0;
    display: block;
    clear: both;
}
#blog .sns ul li{
	float: left;
	margin-right: 10px;
}
.blog-cate{
	font-size: 12px;
	color:#fff;
	background:#01a27a;
	padding: 1px 5px 0;
	display:inline-block;
	border-radius:5px;
	-moz-border-radius:5px;
	-ms-border-radius:5px;
	-o-border-radius:5px;
	-webkit-border-radius:5px;
}
/*
blog-post-bottom
*/
.blog-post-bottom{
	margin-top: 10px;
}
.blog-post-bottom:after {
    content: "";
    height: 0;
    display: block;
    clear: both;
}
.blog-post-bottom .previous{
	float: left;
}
.blog-post-bottom .next{
	float: right;
}



/*
blog-list
*/
.blog-list .hdg-1{
	margin-bottom: 0 !important;
}
.blog-list .hdg-2 {
    width: 630px;
}
.blog-list .avatar { 
    float: right;
    margin: 0 0 10px 10px;
}
.blog-list-inner .blog-list-box{
	display:block;
	padding: 10px 20px 0;
}
.blog-list-inner .blog-list-box:hover{
	background:#e5f5f1;
	text-decoration:none;
}
.blog-list-inner .blog-list-box .blog-list-date,
.blog-list-inner .blog-list-box .blog-list-erea{
	color:#222 !important;
}
.blog-list-inner .blog-list-box .blog-list-cate,
.blog-list-inner .blog-list-box .blog-list-erea{
	display:inline-block;
}
.blog-list-erea {margin-left:5px;}
.blog-list-inner .blog-list-box .blog-list-cate{
	font-size: 12px;
	color:#fff;
	background:#01a27a;
	padding: 1px 5px 0;
	border-radius:5px;
	-moz-border-radius:5px;
	-ms-border-radius:5px;
	-o-border-radius:5px;
	-webkit-border-radius:5px;
}

.blog-list .blog-list-inner h3 {
	border-bottom: 1px dashed #01A27A;
	padding: 5px;
	color: #01A27A;
	margin: 10px 15px 0 !important;
}

.single .blog-main .avatar { 
    float: left;
    margin: 0 10px 10px 0;
}
.blog-side .avatar { 
    float: right;
    margin: 0 0 10px 10px;
}

/*
pagenation
*/
.blog-list-inner .pagenation{
	text-align: center;
	margin-top:30px;
}
.blog-list-inner a.page-numbers,
.blog-list-inner .pagenation .current{
    margin: 0 5px;
    padding: 5px 12px;
    background: #e5f5f1;
	border: 1px solid #01a27a;
    box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
.blog-list-inner .pagenation .current{
	background: #01a27a;
    color: #fff;
    border: none;
}
.blog-list-inner a.page-numbers:hover {
	color:#fff;
	text-decoration:none;
	background-color: #01a27a;
}