@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.entry-card-title {
font-size: 22px;
}
#main .button-caption {
	display: none; /*キャプション非表示*/
}
/*SNSシェアボタン*/
.sns-share-message{
	font-weight: bold; /*太字*/
	color: #875d5b; /*文字色*/
}
.sns-share-buttons {
	flex-wrap: nowrap; /*折り返さない*/
	justify-content: center; /*中央寄せ*/
}
.sns-share-buttons a {
	border-radius: 50%; /*丸くする*/
	font-size: 20px; /*アイコンのサイズ*/
	margin: 0 10px; /*ボタン同士の間隔*/
}
#main .sns-share a {
	width: 40px; /*ボタンの横幅*/
	height: 40px; /*ボタンの高さ*/
}
/*SNSフォローボタン*/
.sns-follow-message{
	font-weight: bold; /*太字*/
	color: #875d5b; /*文字色*/
}
.sns-follow-buttons {
	justify-content: center; /*中央寄せ*/
}
.sns-follow-buttons a {
	border-radius: 50%; /*丸くする*/
	font-size: 20px; /*アイコンのサイズ*/
	margin: 0 10px; /*ボタン同士の間隔*/
}
#main .sns-follow a {
	width: 40px; /*ボタンの横幅*/
	height: 40px; /*ボタンの高さ*/
}

/* 見出しリセット */
/* 見出し2 */
.article h2{
background:none;
padding: 0;
}

/* 見出し3 */
.article h3{
border-top:none;
border-bottom:none;
border-left:none;
border-right:none;
padding: 0;
}

/* 見出し4 */
.article h4{
border-top:none;
border-bottom:none;
padding: 0;
}

/* 見出し5 */
.article h5{
border-bottom:none;
padding: 0;
}

/* 見出し6 */
.article h6{
border-bottom:none;
padding: 0;
}
.article h1{
font-size: 28px;
font-weight:bold;
border-top: dotted 2px #839b5c;
border-bottom: dotted 2px #839b5c;
}
.entry-content h2{
color: #fff;
font-size: 24px;
position: relative;
padding: 8px 0 8px 24px;
border-radius: 32px 0;
background: #498af2;
}
.article h3{
font-size: 22px;
border-left:solid #498af2;
}
h3::first-letter {
padding-left:10px;
}
.entry-content h4{
border:none;
width:100%;
position: relative;
padding-bottom: 0.5em;
font-size: 18px;
}
.entry-content h4::after {
position: absolute;
content: '';
left: 0;
bottom: 0;
width: 100%;
height: 7px;
box-sizing: border-box;
border-top: 3px solid #498af2;
border-bottom: 1px solid #498af2;
}
.entry-content h5{
padding: 0.2em;
border-bottom: dotted 2px #fb8a8a;
font-size: 18px;
}
.internal-blogcard::after{
	content: '続きを読む \00bb'; /* 内部リンク右下枠の文言 */
	position: absolute;
	bottom: .5rem;
	right: 1rem;
	font-size: 70%;
	background-color: #262626; /* 内部リンク右下枠の背景色 */
	padding: .4em 3em;
	font-weight: bold;
	color: #fff; /* 内部リンク右下枠の文字色 */
	border-radius: 2px;
	}
.fb-like-content>div {
    padding-top: 28px;
}
/* プロフィールボックス 概要文字サイズ */
.author-box .author-description {
    font-size: 10px; /* .9em; */
  }
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
.entry-content h4::after {
position: absolute;
content: '';
left: 0;
bottom: 0;
width: 100%;
height: 7px;
box-sizing: border-box;
border-top: 3px solid #498af2;
border-bottom: 1px solid #498af2;
}
}
/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	.blogcard-snipet{
		display: none;
	}
}

/*480px以下*/
@media screen and (max-width: 480px){
 /* 見出しリセット */
/* 見出し2 */
	.article h2{
		background:none;
		padding: 0;
	}

/* 見出し3 */
	.article h3{
		border-top:none;
		border-bottom:none;
		border-left:none;
		border-right:none;
		padding: 0;
	}

/* 見出し4 */
.article h4{
border-top:none;
border-bottom:none;
padding: 0;
}

/* 見出し5 */
.article h5{
border-bottom:none;
padding: 0;
}

/* 見出し6 */
.article h6{
border-bottom:none;
padding: 0;
}
.article h1{
font-size: 22px;
border-top: dotted 2px #839b5c;
border-bottom: dotted 2px #839b5c;
}
.entry-content h2{
color: #fff;
font-size: 24px;
position: relative;
padding: 8px 0 8px 24px;
border-radius: 32px 0;
background: #498af2;
}
.article h3{
font-size: 22px;
border-left:solid #498af2;
}
h3::first-letter {
padding-left:10px;
}
.entry-content h4{
border:none;
width:100%;
position: relative;
padding-bottom: 0.5em;
font-size: 18px;
}
.entry-content h4::after {
position: absolute;
content: '';
left: 0;
bottom: 0;
width: 100%;
height: 7px;
box-sizing: border-box;
border-top: 3px solid #498af2;
border-bottom: 1px solid #498af2;
}
.entry-content h5{
padding: 0.2em;
border-bottom: dotted 2px #fb8a8a;
font-size: 18px;
}
	 /*必要ならばここにコードを書く*/

.internal-blogcard-date {
  font-size: 70%;
  margin-top: 0.5em;
}
.blogcard {
	padding: 1rem;
	color: #666;
	position: relative;
	border-color: #262626 !important; /* 枠線の色を変更 */
}

a.blogcard-wrap:hover{
	background-color: transparent!important;
	opacity: 0.8;
}

a.blogcard-wrap:hover img.blogcard-thumb-image{
	transform: scale(1.1);
	transition: .3s;
}

.blogcard-thumbnail {
	line-height: 0;
	margin-right: 1rem;
	overflow: hidden;
}

.blogcard-title{
	margin-bottom: .5rem;
}

.blogcard-snipet{
	font-size: 70%;
	line-height: 1.7;
	padding-right: 10%;
}
  .column-wrap {
      flex-direction: column;
  }

  .column-wrap.column-3 > div {
      width: 100%;
  }
} 
@media (max-width: 390px){
	.blogcard-thumbnail{
		width: 40%;
	}
	.blogcard-snipet{
		display: none;
	}

	.internal-blogcard-footer{
	display: none; /* 内部ブログカードのアイコンとURLを非表示 */
	}

	.internal-blogcard::after{
	content: '続きを読む \00bb'; /* 内部リンク右下枠の文言 */
	position: absolute;
	bottom: .5rem;
	right: 1rem;
	font-size: 70%;
	background-color: #262626; /* 内部リンク右下枠の背景色 */
	padding: .4em 3em;
	font-weight: bold;
	color: #fff; /* 内部リンク右下枠の文字色 */
	border-radius: 2px;
	}
	.blogcard-content {
  max-height: 30em;
	}

	.blogcard{
		position: relative;
		padding-bottom:50px;
	}
	.blogcard-snipet{
		display: none;
	}

.article h1{
font-size: 22px;
border-top: dotted 2px #839b5c;
border-bottom: dotted 2px #839b5c;
}
.entry-content h2{
color: #fff;
font-size: 24px;
position: relative;
padding: 8px 0 8px 24px;
border-radius: 32px 0;
background: #498af2;
}
.article h3{
font-size: 22px;
border-left:solid #498af2;
}
h3::first-letter {
padding-left:10px;
}
.entry-content h4{
border:none;
width:100%;
position: relative;
padding-bottom: 0.5em;
font-size: 18px;
}
.entry-content h4::after {
position: absolute;
content: '';
left: 0;
bottom: 0;
width: 100%;
height: 7px;
box-sizing: border-box;
border-top: 3px solid #498af2;
border-bottom: 1px solid #498af2;
}
.entry-content h5{
padding: 0.2em;
border-bottom: dotted 2px #fb8a8a;
font-size: 18px;
}
	}
	/* モバイルトップメニュー 横スクロール*/
	@media screen and (max-width: 480px){
	ul.menu-mobile{
		overflow-x: auto;
		overflow-y: hidden;
		display: flex !important;
		flex-wrap: nowrap;
		font-size: 14px;
		justify-content: flex-start;
		padding: 0 1em;
		-webkit-overflow-scrolling: touch;
		position: relative;
	}

	ul.menu-mobile > li{
		padding-right: 1em;
		white-space: nowrap;
	}
	ul.menu-mobile　.item-label{
		white-space: nowrap;
		font-size: 14px;
	}

}

/*-------------------------------------*/
/* スマホのキャッチフレーズを消す*/
@media screen and (max-width: 1023px) {
  .tagline {
    display: none;
  }
}
	/************************************
****　モバイル表示　ヘッダーメニュー・検索アイコン
************************************/
.mobile-menu-buttons{
height:50px;
box-shadow: none;
}
.mobile-menu-buttons > li {
padding-top:0;
}
.menu-button{
margin: auto;
}
.mobile-menu-buttons .menu-button:hover{
background-color:white;
}
/* ギャラリー */
.gallery { /** ギャラリーを囲むボックス **/
    width: 101%;
    overflow: hidden;
}

.gallery br {display: none;} /** 自動で挿入される clearfix の余白解除 **/

.gallery-item { /** 画像共通のスタイル **/
    margin-bottom: 5px!important;
}

.gallery-icon img {
    width: 100%;
    height: auto;
}

.gallery-caption { /** キャプション **/
    color: #505050!important;
    font-size: 14px!important;
    margin-top: -5px!important;
    margin-bottom: 5px!important;
}

.gallery-columns-2 .gallery-item { /** 2カラム **/
    width: 48%;
    margin: 0 5px;
}

.gallery-columns-3 .gallery-item { /** 3カラム **/
    width: 31.8%;
    margin: 0 5px;
}

.gallery-columns-8 .gallery-item { /** 8カラム **/
    width: 120px;
    margin: 0 1.5px;
}

.gallery-columns-8 .gallery-caption { /** 8カラム キャプション **/
    color: #505050!important;
    font-size: 13px!important;
    margin-top: -5px!important;
}

@media screen and (max-width: 640px) { /* 640px以下用の記述 */
.gallery-columns-3 .gallery-item {
    width: 48%;
    margin: 0 5px;
}
table.tablepress tr {
  background-color: transparent;
}
/*=================================================================================
	カエレバ・ヨメレバ・トマレバ
=================================================================================*/

.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;
}
/* WordPressで自動挿入されるPタグの余白を対処 */
.cstmreba p {
	margin: 0;
	padding: 0;
}
.cstmreba a {
	transition: 0.8s ;
	color:#285EFF; /* テキストリンクカラー */
}
.cstmreba a:hover {
	color:#FFCA28; /* テキストリンクカラー(マウスオーバー時) */
}
.booklink-box, .kaerebalink-box, .tomarebalink-box {
	width: 100%;
	background-color: #fff;  /* 全体の背景カラー */
	overflow: hidden;
	border: 1px solid #ddd; /* 外枠 */
	border-radius: 0px;
	box-sizing: border-box;
	padding: 12px 8px;
}
/* サムネイル画像ボックス */
.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 ;
	font-size:16px;
}
/* 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: #333;
}
.booklink-powered-date a:hover,
.kaerebalink-powered-date a:hover,
.tomarebalink-powered-date a:hover {
	color:#333;
}
/* 著者・住所 */
.booklink-detail, .kaerebalink-detail, .tomarebalink-address {
	font-size:12px;
}
.kaerebalink-link1 img, .booklink-link2 img, .tomarebalink-link1 img {
	display:none !important;
}
.kaerebalink-link1, .booklink-link2, .tomarebalink-link1 {
	display: inline-block;
	width: 100%;
	margin-top: 5px;
}
.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;
	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));
}
.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 .shoplinkwowma a { color:#ea5404; } /* Wowma */ 
.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 .shoplinkebj a { color:#f8485e; } /* ebookjapan */
.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;
}
.logo-header a span{
font-family: font-family: 'Avenir','Helvetica Neue';
font-size:36px;
font-weight: 700;
text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
              -1px 1px 0 #FFF, 1px -1px 0 #FFF,
              0px 1px 0 #FFF,  0-1px 0 #FFF,
              -1px 0 0 #FFF, 1px 0 0 #FFF;
}
.logo-menu-button img.site-logo-image {
    width: 124px;
    height: 44px;
}
/***  解像度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: 49%;
	margin: 0.5%;
}
.booklink-info,
.kaerebalink-info,
.tomarebalink-info {
	text-align:center;
	padding-bottom: 1px;
}
	}
@media screen and (max-width: 1024px) {
.tagline {
		display: none;
	
}
.logo-header {
display: none;
}
.logo-footer {
display: none;
}
	}
.top-categories{
	margin-bottom:1em;
}
.top-categories a{
	background:#498af2;
	padding:2px 10px;
	border-radius:0;
	border-top-left-radius: 10px;
}
.top-tags a{
	background:#498af2;
	color:#fff;
	border:none;
	border-radius:0;
	border-top-right-radius: 10px;
	padding:2px 8px;
}
.top-tags a:hover,
.cat-link:hover {
	opacity: 1;
	background: #2f9976;
	transition: all .5s ease;
	color:#fff;
}
	.mobile-menu-buttons {
    min-height: 40px;
}
@media screen and (max-width: 1023px) {
    body {
        margin-top: 80px;
    }
}
	@media screen and (max-width: 480px){
	ul.menu-mobile{
		overflow-x: auto;
		overflow-y: hidden;
		display: flex !important;
		flex-wrap: nowrap;
		font-size: 14px;
		justify-content: flex-start;
		padding: 0 1em;
		-webkit-overflow-scrolling: touch;
		position: relative;
	}

	ul.menu-mobile > li{
		padding-right: 1em;
		white-space: nowrap;
	}
	ul.menu-mobile　.item-label{
		white-space: nowrap;
		font-size: 14px;
	}
}
	/*480以下でロゴの大きさ変更*/
@media screen and (max-width: 1023px){
.logo-menu-button img {
	width: 170px;
    　　max-height: none;
	margin: 2px auto 0;
}
}
#toc-2 li.current {
	background-color: #ffbc0099; /* ハイライト色 */
}
	