@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    0.0.5
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1240px以下*/
@media screen and (max-width: 1240px){
  /*必要ならばここにコードを書く*/
}

/*1030px以下*/
@media screen and (max-width: 1030px){
  /*必要ならばここにコードを書く*/
}

/*768px以下*/
@media screen and (max-width: 768px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
.cstmreba {
width: 98%;
height:auto;
margin:36px 0;
font-family:'Lucida Grande','Hiragino Kaku Gothic ProN',Helvetica, Meiryo, sans-serif;
line-height: 1.5;
word-wrap: break-word;
box-sizing: border-box;
display: block;
}
.cstmreba a {
transition: 0.8s ;
color:#285EFF; /* テキストリンクカラー */
}
.cstmreba a:hover {
color:#FFCA28; /* テキストリンクカラー(マウスオーバー時) */
}
.cstmreba .booklink-box, .cstmreba .kaerebalink-box, .cstmreba .tomarebalink-box {
width: 100%;
background-color: #fff;  /* 全体の背景カラー */
overflow: hidden;
border: 1px solid #ddd;  /* 外枠 */
border-radius: 0px;
box-sizing: border-box;
padding: 12px 8px;
}
/* サムネイル画像ボックス */
.cstmreba .booklink-image,
.cstmreba .kaerebalink-image,
.cstmreba .tomarebalink-image {
width:150px;
float:left;
margin:0 14px 0 0;
text-align: center;
}
.cstmreba .booklink-image a,
.cstmreba .kaerebalink-image a,
.cstmreba .tomarebalink-image a {
width:100%;
display:block;
}
/* サムネイル画像 */
.cstmreba .booklink-image a img,.cstmreba .kaerebalink-image a img,.cstmreba .tomarebalink-image a img {
margin:0 ;
padding: 0;
text-align:center;
}
.cstmreba .booklink-info,.cstmreba .kaerebalink-info,.cstmreba .tomarebalink-info {
overflow:hidden;
line-height:170%;
color: #333;
}
/* infoボックス内リンク下線非表示 */
.cstmreba .booklink-info a,
.cstmreba .kaerebalink-info a,
.cstmreba .tomarebalink-info a {
text-decoration: none;	
}
/* 作品・商品・ホテル名 リンク */
.cstmreba .booklink-name>a,
.cstmreba .kaerebalink-name>a,
.cstmreba .tomarebalink-name>a {
border-bottom: 1px dotted ;
font-size:16px;
}
/* タイトル下にPタグ自動挿入された際の余白を小さく */
.cstmreba .kaerebalink-name p,
.cstmreba .booklink-name p,
.cstmreba .tomarebalink-name p {
margin: 0;
}
/* powered by */
.cstmreba .booklink-powered-date,
.cstmreba .kaerebalink-powered-date,
.cstmreba .tomarebalink-powered-date {
font-size:10px;
line-height:150%;
}
.cstmreba .booklink-powered-date a,
.cstmreba .kaerebalink-powered-date a,
.cstmreba .tomarebalink-powered-date a {
border-bottom: 1px dotted ;
color: #333;
}
.cstmreba .booklink-powered-date a:hover,
.cstmreba .kaerebalink-powered-date a:hover,
.cstmreba .tomarebalink-powered-date a:hover {
color:#333;
}
/* 著者・住所 */
.cstmreba .booklink-detail,.cstmreba .kaerebalink-detail,.cstmreba .tomarebalink-address {
font-size:12px;
}
.cstmreba .kaerebalink-link1 img,.cstmreba .booklink-link2 img,.cstmreba .tomarebalink-link1 img {
display:none !important;
}
.cstmreba .kaerebalink-link1,.cstmreba .booklink-link2,.cstmreba .tomarebalink-link1 {
display: inline-block;
width: 100%;
margin-top: 5px;
}
.cstmreba .booklink-link2>div, 
.cstmreba .kaerebalink-link1>div, 
.cstmreba .tomarebalink-link1>div {
float:left;
width:31%;
min-width:125px;
margin:0.5% 1%;
}
/***** ボタンデザインここから ******/
.cstmreba .booklink-link2 a, 
.cstmreba .kaerebalink-link1 a,
.cstmreba .tomarebalink-link1 a {
width: 100%;
display: inline-block;
text-align: center;
box-sizing: border-box;
font-size: 13px;
font-weight: bold;
line-height: 180%;
padding:3% 1%;
margin: 1px 0;
border-radius: 4px;
box-shadow: 0 2px 0 #ccc;
background: -moz-linear-gradient(top,#fafafa,#EEE);
background: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#eee));
}
.cstmreba .booklink-link2 a:hover,
.cstmreba .kaerebalink-link1 a:hover,
.cstmreba .tomarebalink-link1 a:hover {
text-decoration: underline;
}
/* トマレバ */
.cstmreba .tomarebalink-link1 .shoplinkrakuten a { color: #76ae25; }/* 楽天トラベル */
.cstmreba .tomarebalink-link1 .shoplinkjalan a { color: #ff7a15; }/* じゃらん */
.cstmreba .tomarebalink-link1 .shoplinkjtb a { color: #c81528; }/* JTB */
.cstmreba .tomarebalink-link1 .shoplinkknt a { color: #0b499d; }/* KNT */
.cstmreba .tomarebalink-link1 .shoplinkikyu a { color: #bf9500; }/* 一休 */
.cstmreba .tomarebalink-link1 .shoplinkrurubu a { color: #000066; }/* るるぶ */
.cstmreba .tomarebalink-link1 .shoplinkyahoo a { color: #ff0033; }/* Yahoo!トラベル */
/* カエレバ */
.cstmreba .kaerebalink-link1 .shoplinkyahoo a {color:#ff0033; letter-spacing:normal;} /* Yahoo!ショッピング */
.cstmreba .kaerebalink-link1 .shoplinkbellemaison a { color:#84be24 ; }	/* ベルメゾン */
.cstmreba .kaerebalink-link1 .shoplinkcecile a { color:#8d124b; } /* セシール */ 
.cstmreba .kaerebalink-link1 .shoplinkkakakucom a {color:#314995;} /* 価格コム */
/* ヨメレバ */
.cstmreba .booklink-link2 .shoplinkkindle a { color:#007dcd;} /* Kindle */
.cstmreba .booklink-link2 .shoplinkrakukobo a{ color:#d50000; } /* 楽天kobo */
.cstmreba .booklink-link2 .shoplinkbk1 a { color:#0085cd; } /* honto */
.cstmreba .booklink-link2 .shoplinkehon a { color:#2a2c6d; } /* ehon */
.cstmreba .booklink-link2 .shoplinkkino a { color:#003e92; } /* 紀伊國屋書店 */
.cstmreba .booklink-link2 .shoplinktoshokan a { color:#333333; } /* 図書館 */
/* カエレバ・ヨメレバ共通 */
.cstmreba .kaerebalink-link1 .shoplinkamazon a, 
.cstmreba .booklink-link2 .shoplinkamazon a { color:#FF9901; } /* Amazon */
.cstmreba .kaerebalink-link1 .shoplinkrakuten a , 
.cstmreba .booklink-link2 .shoplinkrakuten a { color: #c20004; } /* 楽天 */
.cstmreba .kaerebalink-link1 .shoplinkseven a, 
.cstmreba .booklink-link2 .shoplinkseven a { color:#225496;} /* 7net */
/***** ボタンデザインここまで ******/
.cstmreba .booklink-footer {
clear:both;
}
/***  解像度480px以下のスタイル ***/
@media screen and (max-width:480px){
.cstmreba .booklink-image,
.cstmreba .kaerebalink-image,
.cstmreba .tomarebalink-image {
width:100%;
float:none;
}
.cstmreba .booklink-link2>div, 
.cstmreba .kaerebalink-link1>div, 
.cstmreba .tomarebalink-link1>div {
width: 49%;
margin: 0.5%;
}
.cstmreba .booklink-info,
.cstmreba .kaerebalink-info,
.cstmreba .tomarebalink-info {
text-align:center;
padding-bottom: 1px;
}
}
/* 目次の外枠を設定 */
#toc_container{
	border:2px solid #696969; /* 線の設定 */
	padding:0px;              /* 余白設定 */
	margin: 0 auto;           /* 中央に表示 */
	border-radius: 3px        /* 角に丸みを持たせる */
}
/* 目次の外枠を設定(PC表示設定) */
@media screen and (min-width: 48em) {
	#toc_container{
		min-width: 500px; /* 横幅の最低サイズを指定 */
	}
}
/* 目次のタイトル表示設定 */
#toc_container p.toc_title{
	padding:6px;         /* 余白設定 */
	background:#696969;  /* 背景色設定 */
	color:#fff;          /* 文字色設定 */
}
/* タイトル前にアイコン表示 */
#toc_container p.toc_title:before{
	font-family:FontAwesome;
	content: "\f0ca\00a0\00a0"; /* \00a0は余白 */
}
/* 目次の表示/非表示切り替えの色を設定 */
#toc_container p.toc_title a{
	color:#fff;
}
/* 目次の表示/非表示のマウスオーバー設定 */
#toc_container p.toc_title a:hover{
	color:silver;
}
/* 目次行の余白設定 */
#toc_container li{
	padding:3px;
}
/* 目次表示部分の余白設定 */
#toc_container p.toc_title+ul.toc_list{
	margin-top:0px;
	padding:10px;
}
/* TOC+ ぶら下げインデント */
#toc_container > ul > li {
    padding-left: 1em !important;
}
#toc_container > ul > li {
    text-indent:  -1em !important; /* h2 */
}
#toc_container > ul > li > ul > li {
    text-indent:  -1.8em !important; /* h3 */
}
#toc_container > ul > li > ul > li > ul > li { 
    text-indent:  -2.4em !important;  /* h4 */
}
/* フォントを灰色にする */
body {
    font-family: "Mplus 1p", sans-serif;
    color:#333333 !important;
}
/* カテゴリーデザイン */
.widget_categories li{
margin-bottom:0px !important;
border-top:0px dashed #DCDCDC;
border-left:0px dashed #DCDCDC;
border-right:0px dashed #DCDCDC;
border-bottom:1px dashed #DCDCDC;
font-size:16px;
}
.widget_categories li a{
text-decoration: none;
color:#313131;
display:block;
line-height:40px;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all  0.6s ease;
}
.widget_categories li a:hover {
background:#DCDCDC;
margin-bottom:0px;
}
.widget_categories li a:before{
font-family: FontAwesome;
content:"\f14c";
margin-right:10px;
margin-left:10px;
color:#333333;
}
/*サイドメニュー見出し*/
#sidebar h3 {
border-bottom:2px solid #3c3c3c;
padding:10px 0;
font-size:18px;
}
#sidebar h3:before {
  font-family: "Font Awesome 5 Free";
  content: "\f2b5";
  padding-right: 8px;
  color: #333333;/*アイコンの色*/
}
#text-8 h3:before {
  font-family: "Font Awesome 5 Free";
  content: "\f108";
  padding-right: 8px;
  color: #333333;/*アイコンの色*/
}
#search-2 h3:before {
  font-family: "Font Awesome 5 Free";
  content: "\f108";
  padding-right: 8px;
  color: #333333;/*アイコンの色*/
}
#categories-2 h3:before {
  font-family: "Font Awesome 5 Free";
  content: "\f03a";
  padding-right: 8px;
  color: #333333;/*アイコンの色*/
}
#new_entries-2 h3:before {
  font-family: "Font Awesome 5 Free";
  content: "\f15c";
  padding-right: 8px;
  color: #333333;/*アイコンの色*/
}
#archives-6 h3:before {
  font-family: "Font Awesome 5 Free";
  content: "\f073";
  padding-right: 8px;
  color: #333333;/*アイコンの色*/
}
#sidebar-scroll h3:before {
  font-family: "Font Awesome 5 Free";
  content: "\f0f3";
  padding-right: 8px;
  color: #333333;/*アイコンの色*/
}
/*見出しクリア */
.article h2 {
    padding: 0;
    background: none;
}
.article h3 {
    border: none;
    padding: 0;
}
.article h4 {
    border: none;
    padding: 0;
}
/*---------------------------------
見出し
--------------------------------*/
.article h2 {
 font-size:21px;
 background-color: #3c3c3c;
 border-left: 0 none;
 color: #fff;
 padding: 15px 20px;
}
.article h3,
#comment-area h3,
#related-entries h3{
	font-size:20px;
	position: relative;
	padding-bottom: .5em;
	border-bottom: 4px solid #ccc;
}
.article h3::after {
	position: absolute;
	bottom: -4px;
	left: 0;
	z-index: 2;
	content: '';
	width: 20%;
	height: 4px;
	background-color: #3c3c3c;
}
.article h4,
#comment-area h4,
#related-entries h4{
	font-size:18px;
	position: relative;
	padding-bottom: .5em;
	border-bottom: 2px dashed #3c3c3c;
}
h4:before {
  font-family: "Font Awesome 5 Free";
  content: "\f14a";
  padding-right: 8px;
  color: #333333;/*アイコンの色*/
}
/* 関連記事・コメントの見出し */
.related-entry-heading,
.comment-title {
	margin: 22px 0;
	font-size: 18px; /* 文字サイズの変更30pxだと大きくなる */
}
/************************************
** ■関連記事カスタマイズ
************************************/
.related-entry-card-wrap.a-wrap.cf{ /*下余白クリア*/
  margin-bottom:0px;
  padding-bottom:0px;
}
.related-entry-card-content.card-content.e-card-content{ /*カード下余白設定*/
  padding-bottom:16px;
}
.related-entry-card-title.card-title.e-card-title{
  font-size: 14px!important; /*フォントサイズ*/
  height: 67px!important; /*メニュー縦幅設定*/
  display: flex;
  align-items: center; /*縦中央寄せ*/
}
/* スマホでのフォントサイズと下余白 */
@media screen and (max-width: 480px){
  .related-entry-card-title.card-title.e-card-title{
    font-size: 12px;
  }
  .related-entry-card-content.card-content.e-card-content{
    padding-bottom:0px;
  }
}
/* ページネーション(次ページ) */
.pagination-next, .next, .prev, .pager-prev-next{ display: none; }
.pager-numbers a { text-decoration: none; }
.page-numbers{
    border: none !important;
    border-radius: 50%;
    font-family: sans-serif;
    font-size: 80%;
    color: #666 !important;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.2);
    transition: all .1s ease;
    background-color: #ffffff;
}
/*フッター色変更*/
#footer {
  clear: both;
  background-color: #333333;
  color: #f9fbfc;
padding: 5px;
}
/* スライドイン背景色（モバイル） */
.mobile-menu-buttons {
background: rgba(240,248,255,0.9); /* RGBA形式 */
}
/* 固定ページでシェアボタン非表示 */
.page .sns-share {
    display: none;
}
/*固定ページで投稿日のみを消す場合*/
 .page .post-date {
    display: none;
}
.sidebar h3 {
background: none; /*背景色を解除*/
}