@charset "UTF-8";

html {
  font-size:19px;
  color:#000;
}

@media only screen and (max-width: 859px) {
  html {
      font-size:16px;
  }
}

html,
body {
  margin:0;
  font-family:Hiragino Kaku Gothic W3 JIS2004, 'メイリオ', Meiryo, Verdana, 'ＭＳ Ｐゴシック', sans-serif;
  color:rgba(0,0,0,.87);
  background-color:#fff;
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
  word-break: normal;
  word-wrap: break-word;
}

a {
  color:#000;
  text-decoration:none;
  -webkit-transition:0.1s linear;
  transition-duration:0.1s linear;
  -webkit-tap-highlight-color:rgba(0,0,0,0);
}

a:link, a:visited {
  color:#000;
  text-decoration:none;
}

a:hover {
  color:#65a6ff;
  text-decoration:none;
}

h1,h2,h3,h4,h5,h6 {
  font-weight:normal;
}

h6 {
  font-size: 1em;
  text-align: left !important;
  margin-bottom: 0 !important;
  margin-top: 50px !important;
}

strong,b {
  font-family:Gothic MB101 DemiBold, sans-serif;
}

img.hatena-fotolife {/* 画像拡大させない */
  pointer-events:none;
}

/* ヘッダー */

#blog-title {
  display:none;
}

#header {
  height:60px;
  border-bottom:1px solid #dcdcdc;
}

#logo {
  width:860px;
  margin:0 auto;
  padding:13.5px 0 12px;
}

#logo img {
  width: 111.5px;
  height: 33.2px;
}

@media only screen and (max-width: 859px) {
  #logo {
    width:auto;
    margin:0 20px;
  }
  #logo img {
    display:block;
    margin:0 auto;
  }
}

#news{
  width:860px;
  margin:40px auto;
  font-size:26px;
}

@media only screen and (max-width: 859px) {
  #news {
    width:auto;
    margin:25px 20px;
    font-size:26px;
  }
  .page-index #news {
    text-align:center;
  }
}

/* wrapper */

#wrapper {
  width:860px;
  margin:0 auto;
}

@media only screen and (max-width: 859px) {
  #wrapper {
    width:100%;
  }
}

/*---------------------- インデックスページ ----------------------*/

.page-index #main-inner {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
}

.page-index .hentry {
  position:relative;
  width:400px;
  margin-bottom:75px;
}

@media only screen and (max-width: 859px) {
  .page-index .hentry {
    width:100%;
    margin-bottom:90px;
  }
}

.page-index .hentry:nth-child(odd) {
  margin-right:60px;
}

@media only screen and (max-width: 859px) {
  .page-index .hentry:nth-child(odd) {
    margin-right:0;
  }
}

.page-index .entry-header {
    padding-top:280px;
}

@media only screen and (max-width: 859px) {
  .page-index .entry-header {
    margin:0 20px;
    padding-top:70vw;
  }
}

.page-index .date {
  font-size:15px;
}

.date a {
  color:#787878 !important;
}

.date a:hover {
  opacity:0.8;
}

img.hatena-fotolife {
  cursor:default;
}

.entry-title {
  line-height:1.65;
  word-break:break-all;
  text-align:justify;
  text-justify:inter-ideograph;
}

.page-index .entry-title {
  position:relative;
  overflow:hidden;
  max-height:109px;/* 文字サイズ*行間*表示したい行数=全体の高さ */
  margin:3px 0 0;
  font-size:22px;
}

.page-index .entry-title:before, .entry-title:after {
  background:#fff;
  position:absolute;
}

.page-index .entry-title:before {
  content:'…';
  width:1em;
  right:0px;
  top:72px; /* 文字サイズ*行間*表示したい行数-1 *開始位置が一行分多いため */
}

.page-index .entry-title:after{
  content: "";
  height:100%;
  width:100%;
}

.entry-title a {
  color:#000;
}
.entry-title a:hover {
  color:#65a6ff;
}

.entry-categories,
.categories {
  margin:25px 0 0;
  font-size:0;
}

.entry-categories a,
.categories a {
  display:inline-block;
  margin:0 5px 7px 0;
  padding:3px 8px;
  background-color:#1e1e1e;
  border-radius:4px;
  -webkit-border-radius:4px;
  color:#fff;
  font-size:12px;
}

.entry-categories a:hover,
.categories a:hover {
  opacity:0.8;
}

.page-index .entry-content {
  position:absolute;
  top:0;
  width:400px;
}

@media only screen and (max-width: 859px) {
  .page-index .entry-content {
    width:100%;
  }
}

.page-index .entry-content p {
  margin:0;
}

.page-index .entry-content :not(:first-child) {
  display:none;
}

.page-index .entry-footer {
  display:none;
}

/* ページャー */

.page-index .pager {
  width:100%;
  margin-top:15px;
  text-align:center;
}

.page-index .pager a {
  display:inline-block;
  padding:16px 36px;
  border:2px solid #0088cc;
  border-radius:4px;
  -webkit-border-radius:4px;
  color:#0088cc;
  line-height:1;
  vertical-align:middle;
}

.page-index .pager a:hover {
  border-color:#65a6ff;
  color:#65a6ff;
}

/*---------------------- サイドコンテンツ ----------------------*/

#box2 {
  width:100%;
  margin-top:90px;
  background-color:#f0f0f0;
}

#box2-inner {
  width:750px;
  margin:0 auto;
  padding:50px 0;
  font-size:0;
}

@media only screen and (max-width: 859px) {
  #box2-inner {
    width:auto;
    margin:0 20px;
    padding:30px 0;
  }
}

/* 人気記事 */

.hatena-module-entries-access-ranking {
  margin:0 0 80px;
}

@media only screen and (max-width: 859px) {
  .hatena-module-entries-access-ranking {
    margin:0 0 30px;
  }
}

.hatena-module-entries-access-ranking .hatena-module-title {
  margin-bottom:40px;
  font-size:24px;
  text-align:center;
}

@media only screen and (max-width: 859px) {
  .hatena-module-entries-access-ranking .hatena-module-title {
    margin-bottom:30px;
    font-size:21px;
  }
}

.hatena-module-entries-access-ranking .hatena-urllist {
  margin:0;
  padding:0;
}

.hatena-module-entries-access-ranking .urllist-item {
  margin-top:35px;
}

@media only screen and (max-width: 859px) {
  .hatena-module-entries-access-ranking .urllist-item {
    margin-top:30px;
  }
}

.hatena-module-entries-access-ranking .urllist-item-inner {
  line-height:1.65;
}

@media only screen and (max-width: 859px) {
  #box2 img {
    display:none;
  }
}

.urllist-with-thumbnails li .urllist-image {
  margin:0 18px 0 0;
}

.hatena-module-entries-access-ranking .urllist-date-link {
  margin:0 0 5px;
  font-size:15px;
}

.hatena-module-entries-access-ranking .urllist-date-link a {
  color:#787878;
}

.hatena-module-entries-access-ranking .urllist-date-link a:hover {
  opacity:0.8;
}

.hatena-module-entries-access-ranking .urllist-title-link {
  font-size:17px;
}

/* 月別アーカイブ・リンク・プロフィール */

.hatena-module-archive,
.hatena-module-links,
.hatena-module-profile {
  display:inline-block;
  width:230px;
  margin:0 30px 0 0;
  padding-top:20px;
  border-top:2px solid #000;
  font-size:15px;
  vertical-align:top;
}

@media only screen and (max-width: 859px) {
  .hatena-module-archive,
  .hatena-module-links,
  .hatena-module-profile {
    width:100%;
    margin:0 0 30px;
  }
}

.hatena-module-profile {
  margin:0;
}

.hatena-module-archive .hatena-module-title,
.hatena-module-links .hatena-module-title,
.hatena-module-profile .hatena-module-title {
  margin:0 0 15px;
  font-size:17px;
  text-align:center;
}

.hatena-module-archive .hatena-module-title a {
  text-decoration:none;
}

@media only screen and (max-width: 859px) {
  .hatena-module-archive .hatena-module-title,
  .hatena-module-links .hatena-module-title,
  .hatena-module-profile .hatena-module-title {
    text-align:left;
  }
}

.archive-module-year .archive-module-button {
  font-size:9px;
  opacity:1;
}

.archive-module-year .archive-module-month {
  margin:0 0 0 25px !important;
}

.hatena-module-archive .hatena-urllist,
.hatena-module-links .hatena-urllist {
  list-style-type:none;
  margin:0;
  padding:0;
}

.hatena-module-profile .profile-description {
  line-height:1.6;
}

.hatena-module-profile .profile-description p {
  margin:5px 0 0;
}

/* 検索 */

.hatena-module-search-box {
  width:100%;
}

@media only screen and (max-width: 859px) {
  .hatena-module-search-box {
    margin:30px 0 0;
    padding:20px 0 0;
    border-top:2px solid #000;
  }
}

@media only screen and (max-width: 859px) {
  .hatena-module-search-box .hatena-module-title {
    margin:0 0 15px;
    font-size:17px;
  }
}

.search-form {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  width:550px;
  margin:70px auto 15px;
  padding:4px 10px;
  background:#fff;
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
  font-size:15px;
}

@media only screen and (max-width: 859px) {
  .search-form {
    width:100%;
    margin:0;
  }
}

.search-module-input {
  -webkit-box-flex:1;
  -ms-flex:1 0;
  flex:1 0%;
  height:20px;
  padding:5px;
  border:none;
  font-size:15px;
  outline:0;
}

.search-module-button {
  width:30px;
  height:30px;
  padding:0;
  background:transparent url(https://cdn.blog.st-hatena.com/images/theme/search@2x.png?version=d521df40822702b2798181e2322e97) no-repeat center;
  background-size:30px;
  border:none;
  outline:none;
  color:transparent;
  overflow:hidden;
  opacity:.5;
  cursor:pointer;
}

.search-module-button:hover {
  opacity:.35;
}

/* カテゴリー */

.hatena-module-category {
  padding:20px 0 50px;
  border-top:2px solid #000;
  font-size:15px;
}

@media only screen and (max-width: 859px) {
  .hatena-module-category {
    display:none;
  }
}
.hatena-module-category .hatena-module-title {
  margin-bottom:10px;
  font-size:20px;
  text-align:center;
}

.hatena-module-category ul {
  display:inline;
  margin:0;
  padding:0;
}

.hatena-module-category ul li {
  display:inline-block;
  list-style:none;
  margin-top:5px;
  margin-right:20px;
}

/* カテゴリー プルダウン(スマホのみ) */

#bottom-editarea {
  display:none;
}

@media only screen and (max-width: 859px) {
#bottom-editarea {
  display:block;
  background-color:#f0f0f0;
}

#bottom-editarea .category {
  margin:0 20px;
  padding:20px 0 40px;
  border-top:2px solid #000;
}

#bottom-editarea .category .hatena-module-title {
  margin:0 0 15px;
  font-size:17px;
}

#bottom-editarea .categories-menu {
  position:relative;
  overflow:hidden;
  width:100%;
  margin:0 auto;
}

#bottom-editarea .categories-menu select{
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  background-color:#fff;
  display:block;
  width:100%;
  padding:8px 10px;
  border:none;
  outline:none;
  border-radius:0;
  line-height:1.5;
  font-size:15px;
  color:#757575;
}

#bottom-editarea .categories-menu .fa-angle-down {
  position:absolute;
  top:0;
  right:0;
  display:block;
  padding:0.5em 1em;
  font-size:20px;
  font-weight:bold;
  pointer-events:none;
}
}

/* footer */

#footer {
  padding:20px 0;
  background:#f5f5f5;
  font-size:13px;
  color:#bdbdbd;
  text-align:center;
  line-height:1.6;
}

@media only screen and (max-width: 859px) {
  #footer {
    padding:20px;
  }
}

#footer a {
  color:#bdbdbd;
}

#footer .footer-address a img {
  display:none;
}

#footer .services {
  margin:0;
}

/*---------------------- 記事ページ ----------------------*/

@media only screen and (max-width: 859px) {
  .entry .entry-header {
    margin:0 20px;
  }
}

.entry .date {
  font-size:16px;
  line-height:1;
}

@media only screen and (max-width: 859px) {
  .entry .date {
    font-size:16px;
  }
}

.entry .entry-title {
  margin:20px 0 20px;
  font-size:28px;
  line-height:1.5;
}

@media only screen and (max-width: 859px) {
  .entry .entry-title {
    font-size:23px;
  }
}

.entry .entry-content {
  margin:40px 0 90px;
}

.entry .entry-content > p {
  margin:0 0 40px;
}

.entry .entry-content p:not(:nth-child(1)),
.entry .entry-content div,
.entry .entry-content ul,
.entry .entry-content ol,
.entry .entry-content dl,
.entry .entry-content table,
.entry .entry-content pre,
.entry .entry-content .hatena-asin-detail {
  width:750px;
  margin:20px auto;
}
.entry .entry-content ul > li > ul {
  margin-top: 10px;
}

@media only screen and (max-width: 859px) {
  .entry .entry-content p:not(:nth-child(1)),
  .entry .entry-content ul,
  .entry .entry-content div,
  .entry .entry-content ol,
  .entry .entry-content dl,
  .entry .entry-content table,
  .entry .entry-content pre,
  .entry .entry-content .hatena-asin-detail {
    width:auto;
    margin:20px;
    box-sizing:border-box;
  }
  .entry .entry-content ul > li > ul {
    margin-top: 10px !important;
  }
}

.entry .entry-content h1 {font-size:1.75em;}
.entry .entry-content h2 {font-size:1.6em;}
.entry .entry-content h3 {font-size:1.4em;}
.entry .entry-content h4 {font-size:1.2em;}
.entry .entry-content h5 {font-size:1.1em;}

.entry .entry-content h1,
.entry .entry-content h2,
.entry .entry-content h3,
.entry .entry-content h4,
.entry .entry-content h5,
.entry .entry-content h6 {
  width:750px;
  margin:80px auto 30px;
  text-align:center;
  line-height:1.65;
}

@media only screen and (max-width: 859px) {
  .entry .entry-content h1,
  .entry .entry-content h2,
  .entry .entry-content h3,
  .entry .entry-content h4,
  .entry .entry-content h5,
  .entry .entry-content h6 {
    width:auto;
    margin:80px 20px 30px;
  }
}

.entry .entry-content p {
  line-height:2;
}

.entry .entry-content p:not(:nth-child(1)) {
  margin-top:30px;
  margin-bottom:50px;
}

.entry .entry-content p img {
  display:block;
  margin:0 auto;
}

.entry .entry-content a {
  color:#0088cc;
}

.entry .entry-content a:hover {
  color:#65a6ff;
}

.entry .entry-footer-section {
  margin:0 0 5px;
  font-size:15px;
  text-align:center;
}

.entry .entry-footer-section .author {
  display: none;
}

.entry .hatena-star-container {
  margin:0;
  text-align:center;
  line-height:1.2;
}

/* シェアボタン */

.share-flat {
  margin-top:40px;
  text-align:center;
  font-size:0;
}

@media only screen and (max-width: 859px) {
  .share-flat {
    width:100%;
    /*padding:0 20px;*/
    box-sizing:border-box;
  }
}

.share-flat a {
  display:inline-block;
  margin-right:8px;
  vertical-align:top;
}

@media only screen and (max-width: 859px) {
  .share-flat a {
    margin:0;
  }
}

.share-flat a .button {
  display:table-cell;
  border-radius:2px;
  width:60px;
  height:30px;
  background-color:#666;
  vertical-align:middle;
  text-align:center;
  font-size:0;
}

@media only screen and (max-width: 859px) {
  .share-flat a .button {
    border-radius:0;
    height:44px;
  }
}

.share-flat a .button:hover {
  opacity:.9;
}

.share-flat .twitter .button {
  background-color:#000000;
}
.share-flat .twitter img {
  width: 16px;
  height: 16px;
}

.share-flat .facebook .button {
  background-color:#3b5998;
}

.share-flat .hatena .button {
  background-color:#00a4de;
}

.share-flat .google .button {
  background-color:#dc4e41;
}

.share-flat .pocket .button {
  background-color:#e7374a;
}

.share-flat .small-text {
  display:block;
  text-align:center;
  line-height:20px;
  font-size:12px;
}

.share-flat .facebook .small-text {
  color:#3b5998;
}

.share-flat .hatena .small-text {
  color:#00a4de;
}

/* 関連記事 */

.hatena-module-related-entries {
  width:750px !important;
  border-top:1px solid #ebebeb;
  border-bottom:1px solid #ebebeb;
  margin:60px auto 0;
  padding:60px 0;
}

@media only screen and (max-width: 859px) {
  .hatena-module-related-entries {
    width:auto !important;
    margin:40px 20px 0;
    padding:40px 0;
  }
}

.hatena-module-related-entries .hatena-module-title {
  font-size:24px;
  text-align:center;
}

@media only screen and (max-width: 859px) {
  .hatena-module-related-entries .hatena-module-title {
    font-size:21px;
  }
}

.related-entries {
  margin:0;
  padding:0;
}

.related-entries-item {
  margin:30px 0 0;
  line-height:1.65;
}

.related-entries-image-link {
  display:none;
}

.related-entries-date-link {
  font-size:15px;
}

.related-entries-date-link a {
  color:#787878 !important;
}

.related-entries-date-link a:hover {
  opacity:0.8;
}

.related-entries-title {
  display:block;
  margin-top:5px;
  font-size:17px;
}

.related-entries-entry-body {
  display:none;
}

/* ページャー */

.entry .pager {
  display:block;
  margin:90px 0 0;
  line-height:1.4;
}

@media only screen and (max-width: 859px) {
  .entry .pager {
    width:auto;
    margin:60px 20px 0;
  }
}

.entry .pager:after {
  content: "";
  clear: both;
  display: block;
}

.entry .pager-prev {
  float:left;
  width:45%;
  text-align:left;
}

.entry .pager-next {
  float:right;
  width:45%;
  text-align:right;
}

.entry .pager a {
  color:#0088cc;
}

.entry .pager a:hover {
  color:#65a6ff;
}

/*---------------------- アーカイブ ----------------------*/

.page-archive .archive-heading {
  margin:0 0 60px;
  font-size:26px;
}

@media only screen and (max-width: 859px) {
  .page-archive .archive-heading {
      margin:0 20px 60px;
      line-height:1.4;
  }
}

.page-archive .archive-entry {
  margin:0 0 60px;
}

.page-archive .entry-title {
  margin:15px 0 20px;
}

.page-archive .archive-date {
  line-height:1;
}

.page-archive .categories {
  margin:20px 0 0;
}

.page-archive .entry-thumb-link,
.page-archive .archive-entry-body {
  display:none;
}

.page-archive .archive-header-category {
  margin:0;
}

.page-archive .archive-heading {
  margin:5px 0 60px;
  font-size:26px;
}

@media only screen and (max-width: 859px) {
  .page-archive .archive-heading {
    margin:5px 20px 60px;
    line-height:1.4;
  }
}

@media only screen and (max-width: 859px) {
  .page-archive .archive-entries {
    margin:0 20px;
  }
}

/* パンくず */

.breadcrumb {
  width:860px;
  margin:0 auto;
  font-size:14px;
}

@media only screen and (max-width: 859px) {
  .breadcrumb {
    width:auto;
    margin:0 20px;
  }
}

.breadcrumb a {
  color:#787878 !important;
}

.breadcrumb a:hover {
  opacity:0.8;
}

/* 検索結果 */

.search-result {
  margin:0 0 60px;
}

.search-result .archive-heading {
  margin:0 0 20px;
}

@media only screen and (max-width: 859px) {
  .search-result .archive-heading {
    margin:0 20px 20px;
  }
}

.search-result-form {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  padding:4px 10px;
  border:1px solid #c1c1c1;
  border-radius:0;
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
  font-size:15px;
}

@media only screen and (max-width: 859px) {
  .search-result-form {
    max-width:100%;
    margin:0 20px;
  }
}

.search-result-form .search-result-input {
  -webkit-box-flex:1;
  -ms-flex:1 0;
  flex:1 0%;
  height:20px;
  padding:5px;
  border:none;
  font-size:15px;
  outline:0;
}

.search-result-form .search-result-button {
  width:30px;
  height:30px;
  padding:0;
  background:transparent url(https://cdn.blog.st-hatena.com/images/theme/search@2x.png?version=d521df40822702b2798181e2322e97) no-repeat center;
  background-size:30px;
  border:none;
  outline:none;
  color:transparent;
  overflow:hidden;
  opacity:.5;
  cursor:pointer;
}

.search-result-form .search-result-button:hover {
  opacity:.35;
}

.page-archive span.highlight {
  margin:.1em;
  padding:.05em .2em;
  background-color:#ffc;
  border:none;
  border-radius:0;
  font-weight:normal;
}

@media only screen and (max-width: 859px) {
  .page-archive p {
    margin:0 20px;
  }
}

/* プロフィール */

.page-about dd {
  margin:0 0 20px;
}

@media only screen and (max-width: 859px) {
  .page-about dl {
    margin:0 20px;
  }
}

/*---------------------- sytle ----------------------*/

.entry-content hr {
  width:100%;
  height:1px;
  background-color:#ebebeb;
  border:0;
}

@media only screen and (max-width: 859px) {
  .entry-content hr {
    width:auto;
    margin:0 20px;
  }
}

.entry-content .hatena-asin-detail {
  margin:0 auto 30px;
  padding:40px;
  box-sizing:border-box;
}

@media only screen and (max-width: 859px) {
  .entry-content .hatena-asin-detail {
    padding:20px;
  }
}

.hatena-asin-detail .hatena-asin-detail-image {
  margin:0 15px 15px 0;
}

.hatena-asin-detail ul {
  margin:0 !important;
}

.entry-content blockquote {
  position:relative;
  width:750px;
  margin:0 auto;
  padding:10px 15px 10px 50px;
  box-sizing:border-box;
  font-style:italic;
  color: #555;
}

@media only screen and (max-width: 859px) {
  .entry-content blockquote {
    width:auto;
    margin:0 20px;
  }
}

.entry-content blockquote:before{
  display:inline-block;
  position:absolute;
  top:10px;
  left:-3px;
  vertical-align:middle;
  content:"“";
  font-family:sans-serif;
  color:#cfcfcf;
  font-size:90px;
  line-height:1;
}

.entry-content blockquote p {
  margin:10px 0;
  font-size:0.9em;
}

.entry-content blockquote cite {
  display:block;
  font-size:0.9em;
}

.entry-content ul,
.entry-content ol {
  margin:0;
  padding:0;
}

.entry-content ol ul li,
.entry-content ul ol li,
.entry-content ul ul li,
.entry-content ol ol li {
  margin-left:20px;
}

@media only screen and (max-width: 859px) {
  .entry-content ol ul,
  .entry-content ul ol,
  .entry-content ul ul,
  .entry-content ol ol {
    margin:0 !important;
  }
}

.entry-content li {
  list-style-position:outside;
  margin: 0 0 .6em 1.4em;
}

.entry-content table,
.entry-content tr {
  width:auto !important;
}

.entry-content table {
  margin:0 auto !important;
  border-collapse:collapse;
}

.entry-content th,
.entry-content td {
  padding:5px 10px;
  border:solid 1px #f0f0f0;
  font-size:.9em;
  text-align:center;
}

.entry-content pre {
  padding:30px;
  background-color:#f5f5f5;
  font-size:.8em;
  box-sizing:border-box;
  color:#787878;
}

.entry-content .figure-image figcaption {
  font-size:85%;
}

.entry-content iframe {
  display:block;
  margin:0 auto !important;
}

.entry-content iframe + .hatena-citation {
  text-align:center;
  margin-bottom:20px;
}

.entry-content .twitter-tweet {
  margin:0 auto!important;
}

/* ブログカード */

.embed-card {
  margin:0 auto !important;
}

.embed-card + .hatena-citation {
  text-align:center;
}

/* ゲスト footer */

.guest-footer-content p {
  display:none;
}

/*---------------------- インデックスページ 一覧形式 ----------------------*/
.page-index .archive-entries {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
}
.page-index .archive-entry {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-flow:column;
  flex-wrap:wrap;
  width:400px;
  margin-bottom:75px;
}
.page-index .archive-entry:nth-child(odd) {
  margin-right:60px;
}
.page-index .entry-thumb-link {
  position:relative;
  z-index:1;
  display:block;
  width:100%;
  margin-bottom:15px;
  padding-top:66.27906977%; /* 画像比率固定 570/860 */
  order:-1;
}
.page-index .entry-thumb {
  float:none;
  position:absolute;
  top:0;
  left:0;
  z-index:1;
  display:block;
  width:100%;
  height:100%;
  margin:0;
  background-repeat:no-repeat;
  background-position:50% 50%;
  background-size:100% auto;
}
.page-index .entry-title {
  margin:3px 0 0 0;
}
.page-index .archive-date {
  line-height:inherit;
}

@media only screen and (max-width: 859px) {
  .page-index .archive-entries {
    margin-left:0;
    margin-right:0;
  }
  .page-index .archive-entry-header,
  .page-index .categories {
    margin-left:20px;
    margin-right:20px;
  }
  .page-index .archive-entry {
    width:100%;
    margin-bottom:90px;
  }
  .page-index .archive-entry:nth-child(odd) {
    margin-right:0;
  }
}

table {
  width: 100%;
  table-layout: fixed;
  word-break: break-all;
  word-wrap: break-all;
}

.no-entry .entry-content {
  position: relative;
}

.no-entry .entry-content :not(:first-child) {
  display: block;
}

figure {
  max-width: 100%;
}

/* Static Page */
.page-static_page #news,
.page-static_page header {
  display: none;
}
.page-static_page h2:first-of-type {
  font-weight: bold;
}
.page-static_page h2,
.page-static_page h3 {
  margin-top: 60px !important;
}
.page-static_page p {
  text-align: justify;
  line-height: 1.8 !important;
  margin-bottom: 30px !important;
}
.page-static_page th {
  font-weight: bold;
  text-align: left;
}
.page-static_page .hatena-module-category,
.page-static_page .hatena-module-entries-access-ranking {
  display: none;
}

/* Source code title */
pre.code {
  margin-bottom: 1.5em;
  padding: 1em;
  position: relative;
  border-radius: 3px;
}
.code-title {
position: relative;
}
.code-title pre.code {
  padding-top: 2.4em;
  margin-left: 0 !important;
}
.code-title::before{
  content: attr(data-title);
  padding: 0 1em;
  background: #666;
  color: #fff8e1;
  font-size: 0.8em;
  border-radius: 3px 0 0 0;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}