@charset "UTF-8";
/* Blog 向けCSS
---------------------------------------------------------------------- */

/* Blog sideCol
------------------------------ */
.twoCol #sideCol .widget {
margin-bottom: 2em;
}
.twoCol #sideCol .widget:last-of-type {
margin-bottom: 0;
}
.twoCol #sideCol h2 {
display: block;
text-align: left;
font-size: 1.2rem;
}
.twoCol #sideCol ul {
margin-left: 1.3em;
}
.twoCol #sideCol li {
text-align: left;
list-style: square ;
color: #1ba135;
}

/* index
----------------------------------------- */
.Blog .pageTitle {
margin: 3em auto;
}
.Blog .wrapper {
padding: 2em 0;
}
.Blog .contentWrap {
padding-right: 2em;
}
#NewsIndex .postListWrap:nth-of-type(n+2) {
margin: 0.3em 0;
}

#NewsIndex .postDetail .category,
#NewsIndex .postDetail .tag {
display: none;
}
#NewsIndex section > header {
margin-bottom: 0.5em;
width: 100%;
display: table;
border-bottom: 1px solid #888888;
}
#NewsIndex section h2 {
display: table-cell;
font-size: 1.4rem;
}
#NewsIndex section header span {
width: 20%;
display: table-cell;
text-align: right;
font-size: 0.9rem;
}
#NewsIndex section header span a {
display: block;
}
#NewsIndex section header span a:hover {
background: #ddedc5;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
text-decoration: none;
-moz-transition: .3s all;
-webkit-transition: .3s all;
transition: .3s all;
}

#NewsIndex section h3 {
font-size: 1.2rem;
font-weight: normal;
}

#NewsIndex .postListWrap {
display: table;
}
#NewsIndex .postListWrap .data {
display: table-cell;
}
#NewsIndex .postListWrap .postDetail {
padding-left: 1.5em;
display: table-cell;
}

/* entryList
----------------------------------------- */
.Blog .archiveTitle {
margin-bottom: 0.5em;
width: 100%;
display: table;
border-bottom: 1px solid #888888;
}
.Blog .postList {
margin-bottom: 1.5em;
}
.Blog .postList.last {
margin-bottom: 0;
}
.Blog .postList .postWrap {
display: table;
}
.Blog .postList .postWrap .thume {
display: table-cell;
vertical-align: top;
}
.Blog .postList .postWrap .thume a {
margin-right: 1.5em;
}
.Blog .postList h3 {
margin-bottom: 0.5em;
font-size: 1.2rem;
text-align: left;
}
.Blog .postList .postWrap .dateWrap {
display: table-cell;
}
.Blog .postList .date {
margin-bottom: 0.5em;
}




.Blog .contentWrap .category {
display: inline-block;
font-size: 0.8rem;
word-break: keep-all;
}
.Blog .contentWrap .category a {
padding: 0.1em 0.5em;
display: block;
background: #ffffff;
}

.Blog .contentWrap .category.news a {
background: #cdddb5;
}

.Blog .contentWrap .tag {
display: block;
}

.Blog .contentWrap .tag a {
padding: 0 0.2em;
display: inline-block;
border: 1px solid #888888;
font-size: 0.7rem;
}

.Blog .contentWrap .category a:hover, 
.Blog .contentWrap .tag a:hover {
text-decoration: none;
}

.Blog .pagination {
margin-top: 2em;
}


/* shingle
----------------------------------------- */
.Blog .postDetail .eyeCatch {
margin-bottom: 1.5em;
display: inline-block;
}
.Blog .postDetailWrap header {
margin-bottom: 1em;
}

.Blog .postDetailWrap h3 {
font-size: 1.5rem;
}

.Blog .postDetailWrap .postDetail {
margin-bottom: 2em;
border-bottom: 1px solid #888888;
}

.Blog .postDetailWrap .postDetail #post-detail > p {
margin-bottom: 1.5em;
}
.Blog .postDetailWrap .postDetail #post-detail > p a img {
margin-right: 1em;
}
.Blog .postDetailWrap .postDetail #post-detail > p a:last-of-type img {
margin-right: 0;
}

.Blog .postDetail .category {
margin-top: 2em;
margin-bottom: 1em;
}
.Blog .postDetail .bc-caption {
margin-right: 1em;
margin-bottom: 1em;
display: inline-block;
}
.Blog .postDetail .bc-caption {
font-size: 0.9rem;
}
.Blog .postDetail a:hover img {
opacity: 0.7;
}


/* end */
/* ===========================================

 PC向け表示設定
 
============================================== */
@media only screen and (min-width: 900px){

/* -------------------------------------------
Blog base
============================================== */
.twoCol .container {
display: table;
}
.twoCol .contentWrap {
display: table-cell;
vertical-align: top;
}

/* -------------------------------------------
postList
============================================== */
.postList .postWrap .thume {
padding-right: 1em;
width: 22%;
}
/* -------------------------------------------
Blog Calendar
============================================== */
.twoCol #sideCol {
width: 25%;
display: table-cell;
text-align: center;
}

.twoCol #sideCol .blogCalendar {
width: 100%;
}
.twoCol #sideCol .blogCalendar th {
border-bottom: 1px solid #808080;
}
.twoCol #sideCol .blogCalendar .sunday {
color: red;
}
.twoCol #sideCol .blogCalendar .saturday {
color: blue;
}
.twoCol #sideCol .blogCalendar .month .wrap {
margin-bottom: 0.5em;
width: 100%;
display: table;
}
.twoCol #sideCol .blogCalendar .month .wrap span {
display: table-cell;
}
.twoCol #sideCol .blogCalendar .month .wrap .pre,
.twoCol #sideCol .blogCalendar .month .wrap .next {
width: 15%;
}

.blogCalendar .today {
background: #d6dfe2;
}


/* -------------------------------------------
 Blog Archive List
============================================== */
.twoCol #sideCol .widget h2 {
margin-bottom: 0.3em;
padding-left: 0.5em;
border-left: 10px solid  #1ba135;
}



}/* end */
/* 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

PC以外向け表示設定

〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜 */
@media only screen and (max-width: 899px){

/* 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
postList
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜 */



}/* end */
