@charset "utf-8";

/**
* Author: Vanillaice (Akira) - http://vanillaice000.blog.fc2.com/
* Website skin name: Synchronicity
* The first edition: 2017.1.6
* 2017.1.25 - SNSシェアリンクをエンコード
* Latest update: 2017.4.17 - iPhoneでfixedされたinputが固定されないバグのApple修正に伴いhackを削除
*/

/***------------------------------------------
      reset
------------------------------------------***/

html, body, div, span, object, iframe,
p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i, p,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
caption,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

ul, ol {
  list-style-type: none;
}

strong, b {
  font-weight: bold;
}

i {
  font-style: italic;
}

address, small, time {
  display: block;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, main {
  display: block;
}

body {
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  tap-highlight-color: rgba(0,0,0,0);
  word-wrap: break-word;
}

blockquote, q {
  quotes: none;
}

q:before,
q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  vertical-align: bottom;
  background: transparent;
  outline: none;
}

table {
  max-width: 100%;
  word-break: break-all;
}

img {
  vertical-align: bottom;
  font-size: 0;
  line-height: 0;
  max-width: 100%;
  height: auto;
}

iframe, embed {
  max-width: 100%;
}

textarea {
  max-width: 100%;
}

input[type="text"], 
input[type="password"],  
input[type="search"], 
textarea {
  border-radius: 0;
  outline: none;
  font-size: inherit;
  -webkit-appearance: none;
  appearance: none;}

select {
  outline: none;
  border-radius: 0;
  font-size: inherit;
}

input[type="submit"] {
  border-radius: 0;
  outline: none;
  font-size: inherit;
  -webkit-appearance: button;
  appearance: button;
}

pre {
  word-wrap: break-word;
  white-space: pre-wrap;
  font-family: 'Menlo', 'consolas', 'Courier';
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

*:focus {
  outline: none;
}

/* fc2 */
.fc2_footer {
  margin: 20px 0;
}

#fc2_text_ad {
  font-size: 12px;
}

#change_mobile {
  display: none;
}


/***------------------------------------------
      clearfix
------------------------------------------***/

.cf:before,
.cf:after {
  content: "";
  display: table;
}

.cf:after {
  clear: both;
}


/***------------------------------------------
      blockquote
------------------------------------------***/

blockquote {
  margin: 2em 10px;
  border-left: 3px solid rgb(51,51,51);
  padding-left: 15px;
  position: relative;
  z-index: 1;
}

blockquote:before {
  content: "“";
  font-size: 500%;
  color: rgb(206,206,206);
  line-height: 1em;
  font-family: 'Times New Roman', 'Hiragino Kaku Gothic Pro W3', 'Meiryo', 'sans-serif';
  position: absolute;
  left: -12px;
  top: -30px;
  z-index: -1;
}


/***------------------------------------------
      common
------------------------------------------***/

span.month01:before {
  content: "January";
}
span.month02:before {
  content: "February";
}
span.month03:before {
  content: "March";
}
span.month04:before {
  content: "April";
}
span.month05:before {
  content: "May";
}
span.month06:before {
  content: "June";
}
span.month07:before {
  content: "July";
}
span.month08:before {
  content: "August";
}
span.month09:before {
  content: "September";
}
span.month10:before {
  content: "October";
}
span.month11:before {
  content: "November";
}
span.month12:before {
  content: "December";
}


/***------------------------------------------
      link
------------------------------------------***/

a {
  text-decoration: none;
  color: rgb(177,158,149); /* 注)基本リンク色 */
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

a:hover {
  color: rgb(51,51,51);
}


/***------------------------------------------
      layout
------------------------------------------***/

html,
body {
  height: 100%;
}

body { /* 注)記事内基本フォント関連 */
  background-color: white;
  color: rgb(51,51,51); /* 注)テキスト基本色 */
  font: 13px/1.8 'Trirong', '游ゴシック', 'YuGothic', 'Hiragino Sans', 'ヒラギノ角ゴシック', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', 'Meiryo', 'sans-serif';
  -webkit-font-smoothing: antialiased; /* 注)文字が細すぎると感じる場合はこの一行削除 1/2 */
  -moz-osx-font-smoothing: grayscale; /* 注)文字が細すぎると感じる場合はこの一行削除 2/2 */
}

#wrapper {
  margin: 0 auto;
  width: 100%;
  min-width: 80%;
}

#main-container {
  margin: 0 auto;
  width: 80%;
  max-width: 1400px;
  padding-bottom: 80px;
}

@media screen and (max-width: 1280px) {
  #main-container {
    width: 90%;
  }
}
@media screen and (max-width: 1160px) {
  #main-container {
    width: 95%;
  }
}
@media screen and (max-width: 940px) {
  #main-container {
    width: 100%;
  }
}

#primary {
  margin-right: -300px;
  width: 100%;
  float : left;
  padding-top: 70px;
  -webkit-animation: fadeIn 1.5s;
  animation: fadeIn 1.5s;
}

/* primary breakpoints */
@media screen and (max-width: 940px) {
  #primary {
    margin: 0 auto;
    width: 90%;
    float: none;
  }
}
@media screen and (max-width: 768px) {
  #primary {
    width: 95%;
  }
}
@media screen and (max-width: 640px) {
  #primary {
    width: 100%;
    padding: 40px 5px 0;
  }
}

#main {
  margin-right: 350px;
}

/* main break point */
@media screen and (max-width: 940px) {
  #main {
    margin: 0 auto;
    float: none;
  }
}

#secondary {
  width: 300px;
  float: left;
  -webkit-animation: fadeIn 1.7s;
  animation: fadeIn 1.7s;
}

@media screen and (max-width: 940px) {
  #secondary {
    margin: 0 auto;
    width: 100%;
    background-color: rgb(248,245,238);
    float: none;
    text-align: center;
  }
}
@media screen and (max-width: 610px) {
  #secondary {
    background-color: transparent;
    padding: 0 5px;
  }
}

#aside-container {
  padding-top: 70px;
}

/* animation */
@-webkit-keyframes fadeIn {
  0% {
   opacity: 0;
  }
  50% {
   opacity: 0;
  }
  100% {
   opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
   opacity: 0;
  }
  50% {
   opacity: 0;
  }
  100% {
   opacity: 1;
  }
}


/***------------------------------------------
      header
------------------------------------------***/

#header-banner {
  margin: 0 auto;
  padding: 20px 0;
}

/* blog title */
#blog-name-container {
  margin: 0 auto;
  width: 100%;
  padding:  0 8px;
  text-align: center;
}

/* blog-name-container breakpoint */
@media screen and (max-width: 768px) {
  #blog-name-container {
    width: 100%;
  }
}

#blog-title { /* 注)ブログタイトルフォント関連 */
  margin: 0 auto 15px;
  width: 100%;
  max-width: 850px;
  font: bolder 24px/1.4 'Trirong', '游明朝', 'YuMincho', 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', 'serif';
}

/* blog-title breakpoint */
@media screen and (max-width: 640px) {
  #blog-title {
    font-size: 22px;
  }
}

#blog-title a {
  color: rgb(51,51,51); /* 注)ブログタイトルリンク色 */
}

#site-description {
  margin: 0 auto;
  width: 100%;
  max-width: 850px;
}


/***------------------------------------------
      global navigation
------------------------------------------***/

.navi-menu {
  margin: 0 auto;
  width: 100%;
  background-color: white;
  text-align: center;
}

@media screen and (max-width: 640px) {
  .navi-menu {
    padding: 0 5px;
  }
}

.fixed-positioning {
  position: fixed;
  top: 0;
  z-index: 100004;
}

.navi-menu-adjust {
  top: 27px;
}

.ordinary-nav {
  margin: 0 auto;
  width: 80%;
  max-width: 1400px;
  border-top: 2px solid rgb(51,51,51); /* 注)グローバルナビ上ボーダー */
  border-bottom: 2px solid rgb(51,51,51); /* 注)グローバルナビ下ボーダー */
}

.dropmenu-ul {
  display: inline-block;
  position: relative;
}

@media screen and (max-width: 1280px) {
  .ordinary-nav {
    width: 90%;
  }
}
@media screen and (max-width: 1160px) {
  .ordinary-nav {
    width: 95%;
  }
}
@media screen and (max-width: 940px) {
  .ordinary-nav {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .ordinary-nav {
    width: 95%;
  }
}
@media screen and (max-width: 640px) {
  .ordinary-nav {
    width: 100%;
  }
}

.dropmenu-ul li {
  display: inline-block;
  line-height: 40px;
  padding: 0 2em;
  vertical-align: middle;
  font-size: 12px;
}

.dropmenu-ul li:first-of-type {
  padding-left: 0;
}

.dropmenu-ul li:last-of-type {
  padding-right: 0;
}

.dropmenu-ul .pc-hide,
.dropmenu-ul li .pc-hide {
  display: none;
}

.dropmenu-ul li:not(#expand-form) {
  position: relative;
  z-index: 3;
}

@media screen and (max-width: 768px) {
  .dropmenu-ul li {
    padding: 0 1em;
  }
  .dropmenu-ul li:first-of-type {
    padding-left: 0;
  }
  .dropmenu-ul li:last-of-type {
    padding-right: 0;
  }
}

.dropmenu-ul .pc-hide {
  display: none;
}

.dropmenu-ul li a {
  color: rgb(51,51,51);
}

/* site search */
#expand-form {
  margin: 0;
  width: 35px;
  height: 40px;
}

.search-btn {
  display: inline-block;
  background-color: transparent;
  border-radius: 50%;
  line-height: 40px;
  position: absolute;
  top: 0;
  right: 2px;
  text-align: center;
}

.search-btn .fa {
  color: rgb(51,51,51);
}

#search-form {
  margin: 0;
  width: 100%;
  height: 40px;
  position: absolute;
  top: 0;
  right: 0;
}

#search-form input[type="text"] {
  width: 35px;
  height: 40px;
  background-color: rgb(250,250,250);
  border: none;
  border-radius: 22px;
  color: rgb(51,51,51);
  cursor: pointer;
  opacity: 0;
  outline: none;
  position: absolute;
  top: 0;
  right: 0;
  transition: all .5s;
  z-index: 5;
}

#search-form input[type="text"]:focus {
  width: 100%;
  cursor: text;
  opacity: 1;
  padding: 0 5px 0 10px;
}

#search-form input[type="text"]::-webkit-input-placeholder {
  color: rgb(51,51,51);
  font-family: 'Trirong', 'serif';
  font-size: 12px;
  font-style: italic;
}

#search-form input[type="text"]::-moz-placeholder {
  color: rgb(51,51,51);
  font-family: 'Trirong', 'serif';
  font-size: 12px;
  font-style: italic;
}

#search-form input[type="submit"] {
  display: none;
}


/***------------------------------------------
      top page and individual
------------------------------------------***/

.main-body {
  margin-bottom: 70px;
  overflow: hidden;
}

/* article header(common) */
.entry-header {
  margin: 0 auto 10px;
  background-color: rgb(248,245,238); /* 注)各記事ヘッダー背景色 */
  border-bottom: 2px solid rgb(51,51,51); /* 注)各記事ヘッダー吹き出しボーダー */
  padding: 12px 0 10px;
  position: relative;
  text-align: center;
}

.entry-header:before,
.entry-header:after {
  content: "";
  width: 0;
  height: 0;
  border: solid transparent;
  line-height: 1.4;
  position: absolute;
  top: 100%;
  left: 50%;
}

.entry-header:before {
  margin-left: -12px;
  border-color: rgba(51,51,51,0);
  border-top-color: rgb(51,51,51); /* 注)各記事ヘッダー吹き出しボーダーの色を変更した方はここも変更 */
  border-width: 12px;
}
.entry-header:after {
  margin-left: -9px;
  border-color: rgba(248,245,238,0);
  border-top-color: rgb(248,245,238); /* 注)各記事ヘッダー背景色を変更した方はここも変更 */
  border-width: 9px;
}

.entry-title {
  margin: 0 auto 5px;
  line-height: 1.4;
  padding: 0 5px;
  font-size: 16px;
  font-weight: bolder;
}

.entry-title a {
  color: rgb(51,51,51);
}

.entry-title a:hover {
  color: rgb(177,158,149);
}

.main-body time {
  padding-right: .1em;
  font-size: 12px;
  text-align: right;
  font-style: italic;
}

/* category link and the number of comments */
.header-info-ul {
  font-family: 'Trirong', '游ゴシック', 'YuGothic', 'Hiragino Sans', 'ヒラギノ角ゴシック', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', 'Meiryo', 'sans-serif';
}

.header-info-ul li {
  display: inline-block;
  padding-right: .6em;
}

.header-info-ul li:last-of-type {
  padding-right: 0;
}

.header-info-ul a,
.header-info-ul span {
  margin-left: .3em;
}

.another-title {
  margin: 0 auto 30px;
  background-color: rgb(248,245,238); /* 注)comment, trackback, indexなどの見出し背景色 */
  border-bottom: 2px solid rgb(51,51,51); /* 注)comment, trackback, indexなどの見出し・コメントなどの吹き出しボーダー色 */
  padding: 12px 5px 10px;
  position: relative;
  font: 16px/1.4 'Trirong', '游ゴシック', 'YuGothic', 'Hiragino Sans', 'ヒラギノ角ゴシック', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', 'Meiryo', 'sans-serif';
  text-align: center;
}

.another-title:before,
.another-title:after {
  content: "";
  width: 0;
  height: 0;
  border: solid transparent;
  line-height: 1.4;
  position: absolute;
  top: 100%;
  left: 50%;
}

.another-title:before {
  margin-left: -12px;
  border-color: rgba(51,51,51,0);
  border-top-color: rgb(51,51,51); /* 注)comment, trackback, indexなどの見出し・コメントなどの吹き出しボーダー色を変更した方はここも変更 */
  border-width: 12px;
}

.another-title:after {
  margin-left: -9px;
  border-color: rgba(248,245,238,0);
  border-top-color: rgb(248,245,238); /* 注)comment, trackback, indexなどの見出し・コメントなどの見出し背景色を変更した方はここも変更 */
  border-width: 9px;
}

.contents {
  padding: 20px;
}

/* back to default */
.inner-contents ul {
  margin: 1em 0;
  padding-left: 40px;
  list-style-type: disc;
}

.inner-contents ol {
  margin: 1em 0;
  padding-left: 40px;
  list-style-type: decimal;
}

.height-adjust {
  margin-top: -40px;
  padding-top: 60px;
}

.inner-contents a:hover {
  text-decoration: underline;
}

/* read more */
.read-more {
  padding-top: 30px;
  font-family: 'Trirong', 'sans-serif';
  text-align: center;
}

.read-more a {
  display: inline-block;
  background-color: rgb(51,51,51); /* 注)READ MORE背景色 */
  color: white;
  padding: .5em 2em;
}

.read-more a:hover {
  background-color: rgb(177,158,149); /* 注)READ MOREホバー時背景色 */
  text-decoration: none;
}

#postscript {
  margin-top: -40px;
  padding-top: 40px;
}

/* user tag */
.tags {
  padding-top: 40px;
}

.tags a {
  display: inline-block;
  margin: 2px 2px 2px 0;
  padding: .1em 1em;
  border: 1px solid rgb(238,238,240); /* 注)記事下タグ ボーダー色 */
}

.tags a:hover {
  background-color: rgb(51,51,51); /* 注)記事下タグ ホバー時背景色 */
  color: white;
  text-decoration: none;
}

/* article footer SNS share */
.entry-footer {
  text-align: right;
}

.entry-footer-sns-ul li {
  display: inline-block;
}

.entry-footer-sns-ul li a {
  display: block;
  color: rgb(51,51,51); /* 注)サイドメニューSNSリンク色 */
  padding: .8em .8em 0;
}

/* SNS brand color */
.entry-footer-sns-ul li .c-facebook:hover {
  color: rgb(59,89,152);
}

.entry-footer-sns-ul li .c-twitter:hover {
  color: rgb(73,171,242);
}

.entry-footer-sns-ul li .c-pinterest:hover {
  color: rgb(206,15,25);
}

.entry-footer-sns-ul li .c-google-plus:hover {
  color: rgb(221,75,57);
}

.entry-footer-sns-ul li .c-pencil:hover,
.entry-footer-sns-ul li .go-to-page:hover {
  color: rgb(231,184,187);
}


/***------------------------------------------
      posted comment
------------------------------------------***/

.border-container {
  min-height: 46px;
  padding-left: 55px;
  position: relative;
  font-weight: 600;
}

.border-container:before {
  content: "\f007";
  display: inline-block;
  width: 46px;
  height: 46px;
  background-color: rgb(207,207,207); /* 注)訪問者アイコン背景色 */
  border-radius: 50%;
  color: white;
  line-height: 46px;
  position: absolute;
  top: 0;
  left: 0;
  font-family: 'FontAwesome';
  font-size: 18px;
  text-align: center;
}

.visitor-name {
  font-size: 14px;
}

.comment-title {
  margin-bottom: 5px;
}

.comment-body {
  padding: 10px 0;
}

.visitor-fotter-info {
  margin-top: 10px;
  text-align: right;
}


/***------------------------------------------
      comment form
------------------------------------------***/

#comment_form {
  margin: 0 auto;
  width: 100%;
  max-width: 600px;
  vertical-align: middle;
  text-decoration: none;
}

#comment_form label {
  display: block;
  padding-bottom: 5px;
  font-size: 12px; /* 注)コメント投稿フォームラベルフォント大きさ */
}

#comment_form input {
  margin-bottom: 10px;
  width: 100%;
  background-color: rgb(250,250,250); /* 注)コメントフォーム各項目背景色 */
  border: 1px solid rgb(150,150,150); /* 注)コメントフォーム各項目ボーダー色 */
  padding: 12px;
}

#comment_form input:focus,
#comment:focus {
  background-color: white;
  border: 1px solid rgb(51,51,51);
}

#comment {
  margin-bottom: 10px;
  width: 100%;
  min-height: 200px;
  background-color: rgb(250,250,250); /* 注コメントフォームテキストエリア背景色 */
  border: 1px solid rgb(150,150,150); /* 注コメントフォームテキストエリアボーダー色*/
  line-height: 1.5;
  padding: 12px;
}

#comment_form input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px rgb(250,250,250) inset;
}

#community,
#trackback {
  margin-top: -40px;
  padding-top: 40px;
  position: relative;
}

/* checkbox */
#no-p input:focus {
  outline: none;
}

#no-p input[type=checkbox] {
  display: inline-block;
  margin-right: 6px;
}
#no-p input[type=checkbox] + label {
  display: inline-block;
  margin-right: 12px;
  cursor: pointer;
  line-height: 1.5px;
  position: relative;
  left: 0;
}
 
@media (min-width: 1px) {
  #no-p input[type=checkbox] {
    display: none;
    margin: 0;
  }

  #no-p input[type=checkbox] + label {
    padding: 2px 0 0 24px;
  }

  #no-p input[type=checkbox] + label:before {
    content: "";
    display: block;
    margin-top: -10px;
    width: 18px;
    height: 18px;
    background-color: white;
    position: absolute;
    top: 50%;
    left: 0;
  }

  #no-p input[type=checkbox] + label:before {
    border: 1px solid rgb(220,220,220); /* 注)secretコメントチェックボックスボーダー色 */
  }

  #no-p input[type=checkbox]:checked + label:after {
    content: "";
    position: absolute;
    top: 50%;
    display: block;
  }

  #no-p input[type=radio]:checked + label:after {
    margin-top: -4px;
    width: 8px;
    height: 8px;
    background: rgb(51,51,51); /* 注)secretコメントチェックマーク色 1/3 */
    border-radius: 8px;
    top: 2px;
    left: 5px;
  }

  #no-p input[type=checkbox]:checked + label:after {
    margin-top: -8px;
    width: 16px;
    height: 8px;
    border-bottom: 3px solid rgb(51,51,51); /* 注)secretコメントチェックマーク色 2/3 */
    border-left: 3px solid rgb(51,51,51); /* 注)secretコメントチェックマーク色 3/3 */
    left: 3px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
}

/* send and delete button */
#sendbtn,
#delbtn {
  margin-top: 20px;
  width: 156px;
  height: 36px;
  background-color: rgb(51,51,51); /* コメントsend, deleteボタン背景色 */
  border: none;
  color: white; /* 注)send, deleteボタンテキスト色 */
  cursor: pointer;
  font-family: 'Trirong', 'sans-serif';
  font-size: 14px; /* 注)send, deleteボタンフォント大きさ */
  text-align: center;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

#sendbtn:hover,
#delbtn:hover {
  background-color: rgb(81,81,81); /* コメントsend, deleteボタンボバー時背景色 */
}

#sendbtn {
  margin-right: 1%;
}

#delbtn {
  margin-left: 1%;
}

.comment-info {
  text-align: right;
}


/***------------------------------------------
      trackback
------------------------------------------***/

.op,
#for-trackback-word {
  display: block;
  width: 100%;
  max-width: 600px;
}

.op {
  margin: 0 auto 10px;
  border: 1px solid rgb(220,220,220); /* 注)トラックバックボーダー色 */
  border-radius: 0;
  outline: none;
  padding: .5em;
}

.op:focus {
  border: 1px solid rgb(179,179,179); /* 注)トラックバックフォーカス時ボーダー色 */
}

#for-trackback-word {
  margin: 0 auto;
}


/***------------------------------------------
      related post, trackback list
------------------------------------------***/

.relate_dl,
.tb_dl {
  margin: 20px auto 0;
  border-radius: 3px;
  box-shadow: inset 0 0 15px rgba(0,0,0,.2);
  padding: 10px;
  font-size: 12px;
}

.relate_dt,
.tb_dt {
  font-weight: bold;
}

.date {
  padding-top: 10px;
}

.tb_li2 {
  text-align: right;
}

.inner-contents .relate_ul {
  margin: 0 0 0 1.5em;
  list-style-type: square;
  padding: 0;
}

/* with thumbnail */
#fc2relate_entry_thumbnail_area {
  margin: 90px auto 30px;
  padding: 10px;
  position: relative;
  z-index: 1;
}

#fc2relate_entry_thumbnail_area .relate_dt {
  display: none;
}

#fc2relate_entry_thumbnail_area .relate_dd {
  overflow: hidden;
}

#fc2relate_entry_thumbnail_area:before {
  content: "関連記事"; /* 注)関連記事 タイトル変更はここです */
  display: block;
  margin: auto;
  width: 100%;
  padding-top: 20px;
  position: absolute;
  top: -50px;
  z-index: 3;
  font-family: 'Trirong', 'serif';
  font-size: 16px;
  text-align: center;
}

#fc2relate_entry_thumbnail_area .relate_dd .relate_ul {
  list-style: none;
  overflow: hidden;
}

#fc2relate_entry_thumbnail_area .relate_dd .relate_ul li {
  width: 33.33%;
  height: 98px;
  float: left;
}

@media screen and (max-width: 1540px) {
  #fc2relate_entry_thumbnail_area .relate_dd .relate_ul li {
    width: 50%;
  }
}
@media screen and (max-width: 1200px) {
  #fc2relate_entry_thumbnail_area .relate_dd .relate_ul li {
    width: 100%;
    float: none;
  }
}

#fc2relate_entry_thumbnail_area .relate_entry_title {
  padding-right: 1em;
  word-break: break-all;
}

.related-overlay {
  position: relative;
}

.related-overlay:before {
  content: "No image";
  width: 90px;
  height: 90px;
  background-color: rgb(248,245,238); /* 注)No image 関連記事サムネイル背景色 */
  border-radius: 1px;
  color: rgb(51,51,51); /* 注)No image 関連記事サムネイル文字色 */
  line-height: 90px;
  position: absolute;
  z-index: 2;
  font-size: 11px;
  text-align: center;
}

@media screen and (max-width: 479px) {
  #fc2relate_entry_thumbnail_area .relate_entry_thumbnail {
    width: 90px !important;
    height: 90px !important;
  }
  #fc2relate_entry_thumbnail_area .relate_dd .relate_ul .relate_entry_thumbnail img {
    width: 90px !important;
    height: 90px !important;
  }
}


/***------------------------------------------
      index (title list), search page
------------------------------------------***/

.list-title {
  margin: 0 auto;
  line-height: 1.5;
  font-weight: bolder;
  font-size: 14px; /* 注)全記事リスト記事タイトルフォント大きさ */
}

.list-title a {
  text-decoration: none;
}

.list-entry {
  padding: 5px 0;
}

.list-entry-date,
.list-entry-category {
  text-align: right;
}

.list-entry-category {
  font-size: 12px; /* 注)全記事リストカテゴリフォント大きさ */
}

/* only for search page */
.list-entry .list-a {
  float: right;
  margin-left: 10px;
  margin-bottom: 10px;
  width: 72px;
  height: 72px;
}

.thumbnails {
  display: inline-block;
  width: 72px;
  height: 72px;
  overflow: hidden;
  position: relative;
}

.search-noimage {
  width: 100%;
  height: 100%;
  background-color: rgb(248,245,238); /* 注)No image 検索結果サムネイル背景色 */
  color: rgb(51,51,51);
  line-height: 72px;
  font-family: 'Trirong', 'sans-serif';
  font-size: 11px;
  text-align: center;
}

/* the number of comment/ trackback */
.number-of-cmtb-ul {
  text-align: right;
}

.number-of-cmtb-ul li {
  display: inline-block;
  margin-left: 1em;
}


/***------------------------------------------
      side menu(secondary)
------------------------------------------***/

.side-menu {
  display: inline-block;
  margin: 0 auto 20px;
  width: 300px;
  background-color: rgb(248,245,238); /* 注)サイドメニュー背景色 */
  line-height: 1.9;
  padding: 20px;
  vertical-align: top;
  font-size: 12px; /* 注)サイドメニューフォント大きさ */
}

@media screen and (max-width: 610px) {
  .side-menu {
    width: 100%;
    max-width: 400px;
  }
}

.sidebar-style {
  text-align: left;
}

.sidebar-style a {
  color: rgb(100,100,100); /* 注)サイドメニュー内リンク色 */
}

.side-menu h4 {
  margin: 0 auto 20px;
  background-color: rgb(248,245,238); /* 注)サイドメニューの見出し背景色 */
  border-bottom: 2px solid rgb(51,51,51); /* 注)サイドメニューの見出しボーダー色 */
  padding-bottom: 10px;
  position: relative;
  font: 15px/1.4 'Trirong', '游ゴシック', 'YuGothic', 'Hiragino Sans', 'ヒラギノ角ゴシック', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', 'Meiryo';
  text-align: center;
}

.side-menu h4:after,
.side-menu h4:before {
  content: "";
  width: 0;
  height: 0;
  border: solid transparent;
  line-height: 1.4;
  position: absolute;
  top: 100%;
  left: 50%;
}

.side-menu h4:before {
  margin-left: -10px;
  border-color: rgba(51,51,51,0);
  border-top-color: rgb(51,51,51); /* 注)サイドメニューの見出しボーダー色を変更した方はここも変更 */
  border-width: 10px;
}
.side-menu h4:after {
  margin-left: -7px;
  border-color: rgba(248,245,238,0);
  border-top-color: rgb(248,245,238); /* 注)サイドメニューの見出し背景色を変更した方はここも変更 */
  border-width: 7px;
}

.side-menu ul {
  margin-left: 1.3em;
  list-style-type: circle;
}

.side-menu ol {
  margin-left: 1.3em;
  list-style-type: decimal;
}

#sidebar-style-sns-ul {
  padding-top: 10px;
  text-align: center;
}

.fit-sidebar-fixed{
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  position: fixed;
}

.fit-sidebar-blank{
  z-index: 0;
  background-color: transparent;
  visibility: hidden;
}

/* SNS on side menu */
#sidebar-style-sns-ul {
  margin: 0 auto;
  list-style: none;
  padding: 0;
  text-align: center;
}

#sidebar-style-sns-ul li {
  display: inline-block;
  margin: 0 2px 2px;
}

#sidebar-style-sns-ul li a {
  display: block;
  width: 32px;
  height: 32px;
  background-color: rgb(51,51,51); /* 注)サイドメニューSNS背景色 */
  color: white;
  line-height: 32px;
}

/* SNS brand color */
#sidebar-style-sns-ul li .c-facebook:hover {
  background-color: rgb(59,89,152);
}

#sidebar-style-sns-ul li .c-twitter:hover {
  background-color: rgb(73,171,242);
}

#sidebar-style-sns-ul li .c-instagram:hover {
  background-color: rgb(63,114,155);
}

#sidebar-style-sns-ul li .c-pinterest:hover {
  background-color: rgb(206,15,25);
}

#sidebar-style-sns-ul li .c-google-plus:hover {
  background-color: rgb(221,75,57);
}

.entry-footer-sns-ul li .c-pencil:hover,
.entry-footer-sns-ul li .go-to-page:hover {
  color: rgb(46,92,180);
}


/***------------------------------------------
      official plug-in
------------------------------------------***/

/* calendar */
.calender {
  margin: 0 auto;
  width: 250px;
  border-spacing: 3px 6px;
  table-layout: fixed;
  font-size: 12px;
  text-align: center;
}

.calender caption {
  margin-bottom: 10px;
}

.calender caption a {
  display: inline-block;
  width: 20%;
}

#sun {
  color: rgb(161,12,0);
}

.calender td {
  height: 30px;
  line-height: 28px;
  padding: 0;
}

.calender td a {
  display: block;
  margin: 0 auto;
  width: 30px;
  height: 30px;
  border: 1px solid rgb(177,158,149); /* 公式プラグインカレンダー リンクボーダー */
  border-radius: 50%;
}

.calender td a:hover {
  background-color: rgb(51,51,51); /* 公式プラグインカレンダー リンクホバー時背景色 */
  border-color: rgb(51,51,51); /* 公式プラグインカレンダー リンクホバー時ボーダー色(上記背景色と同色) */
  color: white; /* 公式プラグインカレンダー リンクホバー時文字色 */
}

/* profile */
 .plugin-myimage {
  text-align: center !important;
  margin-bottom: 10px;
}

/* mail form */
.sidebar-style form {
  display: block;
  margin: 0 auto;
  max-width: 260px;
}

.sidebar-style input:not([type="submit"]),
.sidebar-style textarea,
.sidebar-style select {
  display: inline-block;
  margin-left: 1%;
  width: 98% !important;
  background-color: white;
  border: 1px solid rgb(207,207,207);  
  border-radius: 2px;
  outline: none;
  padding: .5em;
}

.sidebar-style input[type="submit"] {
  display: inline-block;
  margin-left: 1%;
  width: 98% !important;
  background-color: rgb(51,51,51); /* 注)サイドメニュー内input ボタン背景色 */
  border: none;
  color: white;
  cursor: pointer;
}

/* search */
.plugin-search {
  margin: 0 auto;
  width: 98%;
}

.plugin-search input {
  margin-bottom: 8px;
}

/* tag */
.plugin-tag a {
  display: inline-block;
  margin: 0 1px 3px 0;
  border: 1px solid rgb(177,158,149); /* 注)公式プラグインタグ ボーダー色 */
  padding: .2em 1em;
}

.plugin-tag a:hover {
  background-color: rgb(177,158,149); /* 注)公式プラグインタグ ホバー時背景色 */
  color: white;
  text-decoration: none;
}


/***------------------------------------------
      pager
------------------------------------------***/

/* general */
.pager {
  margin: 70px auto 50px;
  width: 100%;
  font-family: 'Trirong', 'sans-serif'; 
}

.simple-pagination {
  margin: 0;
  overflow: hidden;
  position: relative;
  text-align: center;
}

.simple-pagination ul {
  display: inline-block;
  margin: 0;
  list-style: none;
  padding: 0;
  position: relative;
}

.simple-pagination li {
  display: block;
  margin: 0 5px 3px 0;
  box-shadow: 1px 0 0 0 rgb(229,229,229), 
              0 1px 0 0 rgb(229,229,229), 
              1px 1px 0 0 rgb(229,229,229),
              1px 0 0 0 rgb(229,229,229) inset, 
              0 1px 0 0 rgb(229,229,229) inset;
  float: left;
  list-style: none;  
}

.light-theme a,
.light-theme span {
  display: inline-block;
  width: 35px;
  height: 35px;
  background: transparent;
  color: rgb(51,51,51);
  line-height: 35px;
  vertical-align: middle;
  text-align: center;
  font-size: 12px; /* 注)汎用ページ送りフォント大きさ */
}

.light-theme a:hover {
  background-color: rgb(51,51,51); /* 注)汎用ページ送りマウスホバー時背景色 */
  color: white;
  opacity: 1;
}

.prev,
.next {
  border: none !important;
  font-weight: bolder;
}

.light-theme .current {
  background-color: rgb(245,245,245); /* 注)汎用ページ送り現在ページ背景色 */
  color: rgb(51,51,51);
}

.light-theme .ellipse {
  font-weight: bold;
  color: rgb(51,51,51);
}

.light-theme .prev,
.light-theme .next {
  width: auto;
  background-color: rgb(51,51,51); /* 注)汎用ページ送りprev/ next背景色 */
  box-shadow: none;
  color: white;
  padding: 0 1em;
}

/* article */
.posted-pager {
  display: table;
  table-layout: fixed;
  margin: 0 auto 50px;
  width: 98%;
  font-size: 12px; /* 注)個別記事ページ送りフォント大きさ */
}

.page-left-cell,
.page-center-cell,
.page-right-cell {
  display: table-cell;
  vertical-align: middle;
}

.page-center-cell {
  text-align: center;
}

.page-right-cell {
  text-align: right;
}

.prev-a {
  display: block;
  width: 100%;
  height: 100%;
  padding-left: 40px;
  position: relative;
  text-align: left;
}

.prev-a:before {
  content: "\f104";
  margin: auto;
  width: 35px;
  height: 35px;
  background-color: rgb(51,51,51); /* 注)個別記事prevページ送り背景色 */
  color: white;
  line-height: 35px;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  font-family: 'FontAwesome';
  text-align: center;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.page-center-cell {
  width: 50px;
  height: auto;
  text-align: center;
}

.center-a {
  width: 100%;
  height: 100%;
}

.center-a .fa {
  width: 35px;
  height: 35px;
  background-color: rgb(51,51,51); /* 注)個別記事homeページ送り背景色 */
  color: white;
  line-height: 35px;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.center-a .fa:before {
  line-height: 35px;
}

.next-a {
  display: block;
  width: 100%;
  height: 100%;
  padding-right: 40px;
  position: relative;
  text-align: right;
}

.next-a:before {
  content: "\f105";
  margin: auto;
  width: 35px;
  height: 35px;
  background-color: rgb(51,51,51); /* 注)個別記事nextページ送り背景色 */
  color: white;
  line-height: 35px;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  font-family: 'FontAwesome';
  text-align: center;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.prev-a:hover:before,
.center-a:hover .fa,
.next-a:hover:before {
  background-color: rgb(51,51,51); /* 注)個別記事ページ送りホバー時背景色 */
  color: white;
}

/* side pagination */
.side-pager-left,
.side-pager-right {
  width: 180px;
  height: 80px;
  opacity: 0;
  position: fixed;
  z-index: 100003;
  top: 40%;
  font-size: 12px; /* 注)サイドページ送りフォント大きさ */
  -webkit-transition: opacity .7s ease;
  transition: opacity .7s ease;
  
}

.side-pager-left {
  left: -157px;
}

.side-pager-right {
  right: -157px;
}

.page-div-right,
.page-div-left {
  display: block;
  margin: 0;
  width: 180px;
  height: 80px;
}

.side-pager-right a,
.side-pager-left a {
  display: block;
  width: 100%;
  height: 100%;
  color: rgb(51,51,51);
  word-break: break-all;
  -webkit-transition: none;
  transition: none;
}

.page-table {
  display: table;
  width: 100%;
  height: 100%;
}

.circle-cell {
  display: table-cell;
  width: 80px;
  height: 80px;
  vertical-align: top;
}

.circle {
  display: block;
  width: 80px;
  height: 80px;
  background-color: rgba(51,51,51,.2); /* 注)個別記事ページサイドページ送りnext, prev背景色 */
  border-radius: 50%;
  line-height: 80px;
  text-align: center;
}

.title-cell {
  display: table-cell;
  width: 100%;
  padding: 0 10px;
  vertical-align: middle;
}

.appear {
  opacity: 1;
}

/* title list */
.titlelist-pager {
  display: table;
  table-layout: fixed;
  margin: 0 auto 50px;
  width: 100%;
  max-width: 300px;
}

.t-prev-a,
.t-center-a,
.t-next-a {
  display: inline-block;
  width: 100%;
  height: 100%;
  text-align: center;
}

.t-prev-a .fa,
.t-center-a .fa,
.t-next-a .fa {
  display: inline-block;
  width: 35px;
  height: 35px;
  background-color: rgb(51,51,51); /* 注)全記事リストページ送りprev/ next背景色 */
  color: white;
  line-height: 35px;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.t-prev-a .fa:before,
.t-center-a .fa:before,
.t-next-a .fa:before {
  line-height: 35px;
}

.t-prev-a:hover .fa,
.t-center-a:hover .fa,
.t-next-a:hover .fa {
  background-color: rgb(51,51,51); /* 注)全記事リストページ送りホバー時背景色 */
  color: white;
}


/***------------------------------------------
      footer
------------------------------------------***/

#pagetop {
  display: none;
  width: 40px;
  height: 40px;
  background: rgba(255,255,255,.4);
  border: 1px solid rgba(179,171,180,.5);
  color: rgb(94,157,31);
  position: fixed;
  z-index: 100003;
  bottom: 140px;
  right: 60px;
}

#pagemiddle {
  display: none;
  width: 0;
  height: 0;
  font-size: 0;
}

#pagebottom {
  display: none;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(179,171,180,.5);
  background: rgba(255,255,255,.4);
  color: rgb(94,157,31);
  position: fixed;
  z-index: 100003;
  bottom: 90px;
  right: 60px;
}

#pagetop a,
#pagebottom a {
  display: inline-block;
  width: 100%;
  height: 100%;
  line-height: 40px;
}

@media screen and (max-width: 940px) {
  #pagetop {
    bottom: 190px;
    right: 8px;
  }

  #pagebottom {
    right: 8px;
  }

  #pagemiddle {
    display: none;
    width: 40px;
    height: 40px;
    background: rgba(255,255,255,.4);
    border: 1px solid rgba(179,171,180,.5);
    color: rgb(94,157,31);
    position: fixed;
    z-index: 100003;
    bottom: 140px;
    right: 8px;
    font-size: 11px;
  }

  #pagemiddle a {
    display: inline-block;
    width: 100%;
    height: 100%;
    line-height: 40px;
  }
}

.new {
  margin-left: 1em;
  color: red;
  font-size: 11px;
}

.end {
  width: 100%;
  line-height: 1.3;
  padding: 20px 5px;
  font-size: 12px;
  text-align: center;
}

.end a:hover {
  color: rgb(150,150,150);
}

.foot, #copyright {
  font-size: 12px;
  text-align: center;
}

#ad1, #ad2 {
  color: rgb(150,150,150);
  font-size: 11px;
}


/***------------------------------------------
      personal settings
------------------------------------------***/

/* for video */
.box-for-video {
  position: relative;
  width: 100%;
}

.box-for-video:before {
  content:"";
  display: block;
  padding-top: 56.25%; /* 注)動画縦横比設定 デフォルト: 縦幅が横に対して56.25% 正方形は100%指定 */
  overflow: hidden;
}

.box-for-video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* shadow for image */
.shadow-attachment {
  box-shadow: 6px 6px 6px rgba(0,0,0,.2); /* 注)記事内画像に自動ドロップシャドウ 不要な方は削除 */
}

.emoji {
  vertical-align: middle;
}

/* for image */
.zoom-in {
  position: relative;
  display: inline-block;
  z-index: 1;
}

.zoom-in:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  background: rgba(0,0,0,.6);
  opacity: 0;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out; 
}

.zoom-in:after {
  content: "\f065";
  font-family: 'FontAwesome';
  text-align: center;
  font-size: 20px;
  color: white;
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  margin-top: -17px;
  z-index: 3;
  opacity: 0;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.zoom-in:hover:before, .zoom-in:hover:after {
  opacity: 1;
}

.zoom-in-round {
  position: relative;
  display: inline-block;
  z-index: 1;
}

.zoom-in-round:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  background: rgba(0,0,0,.6);
  border-radius: 1px;
  opacity: 0;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out; 
}

.zoom-in-round:after {
  content: "\f065";
  font-family: 'FontAwesome';
  text-align: center;
  font-size: 20px;
  color: white;
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  margin-top: -17px;
  z-index: 3;
  opacity: 0;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.zoom-in-round:hover:before, .zoom-in-round:hover:after {
  opacity: 1;
}

/* darkbox */
#darkbox {
  z-index: 100005 !important;
}

#darkbox_next:hover,
#darkbox_prev:hover {
  border-color: rgb(177,158,149) !important;
}

/* colorbox overlay */
#cboxOverlay,
#cboxWrapper,
#colorbox {
  z-index: 100005 !important;
}
CSS

.cstmreba {
	width:100%;
	height:auto;
	margin:36px 0;
}
.booklink-box, .kaerebalink-box, .tomarebalink-box {
	width:100%;
	background-color: #fff;
	overflow: hidden;
}
/* サムネイル画像ボックス */
.booklink-image,
.kaerebalink-image,
.tomarebalink-image {
	width:150px;
	float:left;
	margin:0 14px 0 0;
	text-align: center;
}
.booklink-image a,
.kaerebalink-image a,
.tomarebalink-image a {
	width:100%;
	display:block;
}
/* サムネイル画像 */
.booklink-image a img, .kaerebalink-image a img, .tomarebalink-image a img {
	margin:0 ;
	padding: 0;
	text-align:center;
}
.booklink-info, .kaerebalink-info, .tomarebalink-info {
	overflow:hidden;
	line-height:170%;
	color: #333;
}
/* infoボックス内リンク下線非表示 */
.booklink-info a,
.kaerebalink-info a,
.tomarebalink-info a {
	text-decoration: none;	
}
/* 作品・商品・ホテル名 リンク */
.booklink-name>a,
.kaerebalink-name>a,
.tomarebalink-name>a {
	border-bottom: 1px dotted ;
	color:#2098A8;
	font-size:16px;
}
/* 作品・商品・ホテル名ホテル名 リンク ホバー時 */
.booklink-name>a:hover,
.kaerebalink-name>a:hover,
.tomarebalink-name>a:hover {
	color: #722031;
}
/* powered by */
.booklink-powered-date,
.kaerebalink-powered-date,
.tomarebalink-powered-date {
	font-size:10px;
	line-height:150%;
}
.booklink-powered-date a,
.kaerebalink-powered-date a,
.tomarebalink-powered-date a {
	border-bottom: 1px dotted ;
	color: #2098A8;
}
/* 著者・住所 */
.booklink-detail, .kaerebalink-detail, .tomarebalink-address {
	font-size:12px;
}
.kaerebalink-link1 img, .booklink-link2 img, .tomarebalink-link1 img {
	display:none;
}
.booklink-link2>div, 
.kaerebalink-link1>div, 
.tomarebalink-link1>div {
	float:left;
	width:31%;
	min-width:125px;
	margin:0.5% 1%;
}
.booklink-link2 a, 
.kaerebalink-link1 a,
.tomarebalink-link1 a {
	width: 100%;
	display: inline-block;
	text-align: center;
	font-size: 13px;
	font-weight: bold;
	line-height: 180%;
	padding:3% 1%;
	border-radius: 4px;
	box-shadow: 0 2px 0 #ccc;
	background: -moz-linear-gradient(top,#FFF 0%,#EEE);
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));
}
.booklink-link2 a:hover,
.kaerebalink-link1 a:hover,
.tomarebalink-link1 a:hover {
	text-decoration: underline;
}
/* ボタンカラー */
/* トマレバ */
.tomarebalink-link1 .shoplinkrakuten a { color: #76ae25; }/* 楽天トラベル */
.tomarebalink-link1 .shoplinkjalan a { color: #ff7a15; }/* じゃらん */
.tomarebalink-link1 .shoplinkjtb a { color: #c81528; }/* JTB */
.tomarebalink-link1 .shoplinkknt a { color: #0b499d; }/* KNT */
.tomarebalink-link1 .shoplinkikyu a { color: #bf9500; }/* 一休 */
.tomarebalink-link1 .shoplinkrurubu a { color: #000066; }/* るるぶ */
.tomarebalink-link1 .shoplinkyahoo a { color: #ff0033; }/* Yahoo!トラベル */
/* カエレバ */
.kaerebalink-link1 .shoplinkyahoo a {color:#ff0033;} /* Yahoo!ショッピング */
.kaerebalink-link1 .shoplinkbellemaison a { color:#84be24 ; }	/* ベルメゾン */
.kaerebalink-link1 .shoplinkcecile a { color:#8d124b; } /* セシール */ 
.kaerebalink-link1 .shoplinkkakakucom a {color:#314995;} /* 価格コム */
/* ヨメレバ */
.booklink-link2 .shoplinkkindle a { color:#007dcd;} /* Kindle */
.booklink-link2 .shoplinkrakukobo a{ color:#d50000; } /* 楽天kobo */
.booklink-link2  .shoplinkbk1 a { color:#0085cd; } /* honto */
.booklink-link2 .shoplinkehon a { color:#2a2c6d; } /* ehon */
.booklink-link2 .shoplinkkino a { color:#003e92; } /* 紀伊國屋書店 */
.booklink-link2 .shoplinktoshokan a { color:#333333; } /* 図書館 */
/* カエレバ・ヨメレバ共通 */
.kaerebalink-link1 .shoplinkamazon a, 
.booklink-link2 .shoplinkamazon a { color:#FF9901; } /* Amazon */
.kaerebalink-link1 .shoplinkrakuten a , 
.booklink-link2 .shoplinkrakuten a { color: #c20004; } /* 楽天 */
.kaerebalink-link1 .shoplinkseven a, 
.booklink-link2 .shoplinkseven a { color:#225496;} /* 7net */
/* ボタンカラー ここまで*/
.booklink-footer {
	clear:both;
}
/***  解像度480px以下のスタイル ***/
@media screen and (max-width:480px){
.booklink-image,
.kaerebalink-image,
.tomarebalink-image {
	width:100%;
	float:none;
}
.booklink-link2>div, 
.kaerebalink-link1>div, 
.tomarebalink-link1>div {
	width: 48%;
}
.booklink-info,
.kaerebalink-info,
.tomarebalink-info {
	text-align:center;
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
.cstmreba {
	width:100%;
	height:auto;
	margin:36px 0;
}
.booklink-box, .kaerebalink-box, .tomarebalink-box {
	width:100%;
	background-color: #fff;
	overflow: hidden;
}
/* サムネイル画像ボックス */
.booklink-image,
.kaerebalink-image,
.tomarebalink-image {
	width:150px;
	float:left;
	margin:0 14px 0 0;
	text-align: center;
}
.booklink-image a,
.kaerebalink-image a,
.tomarebalink-image a {
	width:100%;
	display:block;
}
/* サムネイル画像 */
.booklink-image a img, .kaerebalink-image a img, .tomarebalink-image a img {
	margin:0 ;
	padding: 0;
	text-align:center;
}
.booklink-info, .kaerebalink-info, .tomarebalink-info {
	overflow:hidden;
	line-height:170%;
	color: #333;
}
/* infoボックス内リンク下線非表示 */
.booklink-info a,
.kaerebalink-info a,
.tomarebalink-info a {
	text-decoration: none;	
}
/* 作品・商品・ホテル名 リンク */
.booklink-name>a,
.kaerebalink-name>a,
.tomarebalink-name>a {
	border-bottom: 1px dotted ;
	color:#2098A8;
	font-size:16px;
}
/* 作品・商品・ホテル名ホテル名 リンク ホバー時 */
.booklink-name>a:hover,
.kaerebalink-name>a:hover,
.tomarebalink-name>a:hover {
	color: #722031;
}
/* powered by */
.booklink-powered-date,
.kaerebalink-powered-date,
.tomarebalink-powered-date {
	font-size:10px;
	line-height:150%;
}
.booklink-powered-date a,
.kaerebalink-powered-date a,
.tomarebalink-powered-date a {
	border-bottom: 1px dotted ;
	color: #2098A8;
}
/* 著者・住所 */
.booklink-detail, .kaerebalink-detail, .tomarebalink-address {
	font-size:12px;
}
.kaerebalink-link1 img, .booklink-link2 img, .tomarebalink-link1 img {
	display:none;
}
.booklink-link2>div, 
.kaerebalink-link1>div, 
.tomarebalink-link1>div {
	float:left;
	width:31%;
	min-width:125px;
	margin:0.5% 1%;
}
.booklink-link2 a, 
.kaerebalink-link1 a,
.tomarebalink-link1 a {
	width: 100%;
	display: inline-block;
	text-align: center;
	font-size: 13px;
	font-weight: bold;
	line-height: 180%;
	padding:3% 1%;
	border-radius: 4px;
	box-shadow: 0 2px 0 #ccc;
	background: -moz-linear-gradient(top,#FFF 0%,#EEE);
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));
}
.booklink-link2 a:hover,
.kaerebalink-link1 a:hover,
.tomarebalink-link1 a:hover {
	text-decoration: underline;
}
/* ボタンカラー */
/* トマレバ */
.tomarebalink-link1 .shoplinkrakuten a { color: #76ae25; }/* 楽天トラベル */
.tomarebalink-link1 .shoplinkjalan a { color: #ff7a15; }/* じゃらん */
.tomarebalink-link1 .shoplinkjtb a { color: #c81528; }/* JTB */
.tomarebalink-link1 .shoplinkknt a { color: #0b499d; }/* KNT */
.tomarebalink-link1 .shoplinkikyu a { color: #bf9500; }/* 一休 */
.tomarebalink-link1 .shoplinkrurubu a { color: #000066; }/* るるぶ */
.tomarebalink-link1 .shoplinkyahoo a { color: #ff0033; }/* Yahoo!トラベル */
/* カエレバ */
.kaerebalink-link1 .shoplinkyahoo a {color:#ff0033;} /* Yahoo!ショッピング */
.kaerebalink-link1 .shoplinkbellemaison a { color:#84be24 ; }	/* ベルメゾン */
.kaerebalink-link1 .shoplinkcecile a { color:#8d124b; } /* セシール */ 
.kaerebalink-link1 .shoplinkkakakucom a {color:#314995;} /* 価格コム */
/* ヨメレバ */
.booklink-link2 .shoplinkkindle a { color:#007dcd;} /* Kindle */
.booklink-link2 .shoplinkrakukobo a{ color:#d50000; } /* 楽天kobo */
.booklink-link2  .shoplinkbk1 a { color:#0085cd; } /* honto */
.booklink-link2 .shoplinkehon a { color:#2a2c6d; } /* ehon */
.booklink-link2 .shoplinkkino a { color:#003e92; } /* 紀伊國屋書店 */
.booklink-link2 .shoplinktoshokan a { color:#333333; } /* 図書館 */
/* カエレバ・ヨメレバ共通 */
.kaerebalink-link1 .shoplinkamazon a, 
.booklink-link2 .shoplinkamazon a { color:#FF9901; } /* Amazon */
.kaerebalink-link1 .shoplinkrakuten a , 
.booklink-link2 .shoplinkrakuten a { color: #c20004; } /* 楽天 */
.kaerebalink-link1 .shoplinkseven a, 
.booklink-link2 .shoplinkseven a { color:#225496;} /* 7net */
/* ボタンカラー ここまで*/
.booklink-footer {
	clear:both;
}
/***  解像度480px以下のスタイル ***/
@media screen and (max-width:480px){
.booklink-image,
.kaerebalink-image,
.tomarebalink-image {
	width:100%;
	float:none;
}
.booklink-link2>div, 
.kaerebalink-link1>div, 
.tomarebalink-link1>div {
	width: 48%;
}
.booklink-info,
.kaerebalink-info,
.tomarebalink-info {
	text-align:center;
}
}

.posi {
margin:5px 0px 20px 5px;
}

/* ========タイトル背景画像　====== */
#head-img {
padding: 0px 0 0px 0; min-height: 190px;
background: url(https://blog-imgs-110-origin.fc2.com/t/v/p/tvpalog/20171229053856rokubaka-1.png) right top no-repeat;
}
body #header {padding: 0px 0 0px 0;}
/* ================= 背景おわり　== */