/*
 * blog-card
 */
 .blog-card {
    border:1px solid #f4f4f4;
    word-wrap:break-word;
    max-width:100%;
    border-radius:0px;
    margin: 1.6rem 0;
    padding:15px;

    position:relative;
}
.blog-card + br{
    display: none;
}

@media only screen and (max-width: 576px) {
    .blog-card {
        padding:10px;
    }
}
.blog-card p{
    margin:0px;
    padding:0px
}

.blog-card:hover {
    background: #fffff4;
}
.blog-card a {
    text-decoration: none;
}
.blog-card-title {
    color: #0b57d0;
    display: block;
}
.blog-card-thumbnail {
    float:left;
    margin-right:10px;
}
.blog-card-thumbnail img {
    display: block;
    padding: 0;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
    max-height:90px;
}
.blog-card-content {
    line-height:1.3;
}
.blog-card-title {
    font-weight: normal;
    text-decoration:underline;
}
.blog-card-excerpt {
    margin-top:10px;
    font-size:0.9rem;
    color:#888;
    line-height:1.6;
}
@media only screen and (max-width: 576px) {
    .blog-card-excerpt {
        padding:0;
        margin-top:5px;
        display: -webkit-box;           /* Flexboxを使ってテキストをボックスに配置 */
        -webkit-box-orient: vertical;   /* 縦方向にボックスを配置 */
        overflow: hidden;               /* はみ出した部分を非表示にする */
        -webkit-line-clamp: 2;          /* 表示する行数を制限（ここでは2行） */
        text-overflow: ellipsis;        /* 省略記号「...」を表示 */
    }
}

.blog-card .clear {
    clear: both;
}
.blog-card .blog-card-header{
    position:absolute;
    top:-10px;
    left:6px;
    background-color:#fff;
    font-size:0.8rem;
    line-height:1rem;
    border:0px #eee solid;
    padding:0px 10px;
}