@charset "UTF-8";

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

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

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

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

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
　/*ブログカードの長い説明を消す*/
.blogcard-snipet{
	display: none;
}
}


/*Twitterやインスタを中央に配置する*/
.video-container, 
.instagram-container, 
.facebook-container,
.twitter-tweet,
.instagram-media {
    margin: 30px auto !important;
}


/*フロント固定ページのタイトルを非表示*/
.home.page .entry-title{
  display: none;
}

/*フロント固定ページのシェアボタンを非表示*/
.home.page .sns-share{
  display: none;
}

/*フロント固定ページのフォローボタンを非表示*/
.home.page .sns-follow{
  display: none;
}

/*フロント固定ページの投稿日を非表示*/
.home.page .post-date{
  display: none;
}

/*フロント固定ページの更新日を非表示*/
.home.page .post-update{
  display: none;
}

/*フロント固定ページの投稿者名を非表示*/
.home.page .author-info{
  display: none;
}



/* 目次の文字指定ここから */
.toc-title {
	text-align:left;
	margin: 20px 20px 20px -10px;
	padding-left: -20px;
	font-size: 15px;
        font-weight: 300;
	color: #3f2f23; /* 目次の文字色を変える場合はここを変更 */
}

/* 目次のアイコン設定 */
.toc-title:before {
	top: 0;
        left: -45px;
        width: 50px;
        height: 50px;
	font-family: "Font Awesome 5 Free";
	content : "\f1b2"; /* アイコンを変える場合はここを変更 */
	font-size:17px;
	margin-right:5px;
	color:#FFF; /* アイコンの色を変える場合はここを変更 */
	background-color:#3f2f23; /* アイコンの背景色を変える場合はここを変更 */
	border-radius: 50%;
	-webkit-border-radius: 50%;
 	-moz-border-radius: 50%;
	padding:14px;
	font-weight: 900;
}

/* 目次のデザインカスタマイズ */
.toc-content ol {
  	padding: 0 0.5em;
  	position: relative;
}
.toc-content ol li {
  	line-height: 1.5;
  	padding: 0.7em 0 0.5em 1.4em;
  	border-bottom: dashed 1px silver;
  	list-style-type: none!important;
}

/* 目次の各節の先頭にあるアイコンを設定 */
.toc-content ol li:before {
	font-family: "Font Awesome 5 Free";
  	content: "\f054"; /* アイコンを変える場合はここを変更 */
  	position: absolute;
  	left : 0.5em;
  	color: #3f2f23; /* 色を変える場合はここを変更 */
	font-weight: 900;
}
.toc-content ol li:last-of-type {
	border-bottom: none;
}
.toc-content .toc-list li {
	font-weight:700; /* h2のみ太文字に */
}
.toc-content .toc-list li li {
	font-weight:normal; /* h3以降の文字サイズを普通に */
}

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

/* 見出しリセットここまで */


/* 見出しのデザインカスタマイズ */

/* H2 */
.article h2 {
  position: relative;
  font-size:1.5em;
  padding: .5em 1em .5em 1.5em;
  color: #383c3c;
  
}
.article h2::after {
  position: absolute;
  top: .2em;
  left: .5em;
  content: '';
  width: 6px;
  height: -webkit-calc(115% - 1em);
  height: calc(115% - 1em);
  background-color: #383c3c;
  border-radius: 4px;
}


/* H3 */

.article h3 {
    padding: 15px 4px 13px 40px;
    background-color: #f6f6f6;
    border-radius: 5px;
	color: #383c3c;
}




/* H4 */


.article h4 {	
border: none;
margin-bottom: 20px;	
padding: 10px;	
width: 100%;	
color: #333;	
font-size: 110%;	
border-top: 3px double #1A140F;	
border-bottom: 3px double #1A140F;
font-weight: normal;
}


/* H5 
.article h5{
background-color: #a8bf93;
border-radius: 1.25em;
padding: 0.8em;
}

.article h5:before {
content: "●";
color: #fff;
margin-right: 0.3em;
}
*/


/* H5 */
.article h5{
border-bottom:none;
padding: 10px 30px;
}
 
h5 {
  position: relative;
  padding: 5px 20px;
  background: #FFD700;
  color: #fff;
}
h5::after {
  position: absolute;
  left: 0px;
  top: 0px;
  content: '';
  box-shadow: 1px 1px 1px #FFBD00;
  border-style: solid;
  border-width: 0 0 20px 20px;
  border-color: #fff #fff #EFAF00;
}

/* H6 */
.article h6 {
  position: relative;
  padding: 1rem .5rem;
  font-size: 1.4em;
  font-weight:normal; 
}

.article h6:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 5px;
  content: '';
  background-image: -webkit-gradient(linear, left top, right top, from(#e6b422), to(#ffffff));
  background-image: -webkit-linear-gradient(left, #e6b422 0%, #ffffff 50%);
  background-image: linear-gradient(to right, #e6b422 0%, #ffffff 50%);
}







/*引用デザイン--ここから↓↓--*/
/*--------------------------------------
  引用のデザインをかっこ付きに
--------------------------------------*/
.entry-content blockquote {
    box-sizing: border-box;
    position: relative;
    padding: 4em 1.5em 3em 2em;
    border: none;
	background: #f9f9f9;
}
.entry-content blockquote:before {
    font-style: italic;
    color: #eee!important;
    line-height: 2.3em;
    width: 2.4em;
    height: 3em;
    position: absolute;
    display: inline-block;
    border-left: solid 2px #eee;
    border-top: solid 2px #eee;
    top: 0;
    left: 0;
    padding-left: .6em;
}
.entry-content blockquote:after{
    content: '';
	font-family:  'Times New Roman' ,"ＭＳ Ｐゴシック" ,sans-serif;
    width: 2em;
    height: 2em;
    position: absolute;
    display: inline-block;
    border-right: solid 2px #eee;
    border-bottom: solid 2px #eee;
    bottom: 0;
    right: 0;
}
.entry-content blockquote cite{
    text-align: left;
}
.entry-content blockquote cite a{
    color: #888;
    text-decoration: underline;
}
/*引用デザイン--ここまで↑↑--*/





/*ページ送りカスタマイズ　TYPE２--ここから↓↓--*/

    .pagination-next-link {
      background-color: #e6b524;
      color: #fff;
      border: none;
      border-radius: 30px;
      box-shadow: 0 2px 6px 0 rgba(0,0,0,0.2); /*「次のページ」部分の影*/
    }
    .pagination-next-link:hover {
      background-color: #fccd12;
      transition: all 0.5s ease;
      color: #fff;
    }


    .page-numbers {
      color: #e6b524;
      border: 1px solid #e6b524;
      border-radius: 50%;
      box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); /*数字部分の影*/
    }
    .pagination .current {
      background-color: #e6b524;
      color: #fff;
    }
    .page-numbers.dots {
      opacity: 1;
      background: none;
    }
    .pagination a:hover {
      background-color: #fccd12;
      color: #fff;
    }

a.prev, a.next {
  display: none;
}
@media screen and (max-width: 480px) {
.page-numbers {
  width: 48px;
  height: 48px;
  line-height: 48px;
}
}


/*ページ送りカスタマイズ　TYPE２--ここまで↑↑--*/


/*タイムライン--ここから--*/

.timeline-box {				
	margin-bottom: 20px;				
	border: 0px solid #ccc;				
	border-radius: 4px;				
	padding: 16px 5px;				
	box-sizing: border-box;				
}								
.timeline-box *{				
	box-sizing: border-box;				
}				
.timeline-box .timeline {				
	list-style: none;				
	padding: 0;				
	margin: 0;				
}								
.timeline-title {				
	font-weight: bold;				
	font-size: 1.1em;				
	text-align: center;				
}							
.timeline > li {				
	margin-bottom: 80px;				
}				
.timeline > li.timeline-item {				
	overflow: hidden;				
	margin: 0;				
	position: relative;				
}							
.timeline-item-label {				
	width: 110px;				
	float: left;				
	padding-top: 18px;				
	text-align: right;				
	padding-right: 1em;				
	font-size: 14px;				
}							
.timeline-item-title {				
	font-weight: bold;				
}							
.timeline-item-content {				
	width: calc(100% - 110px);				
	float: left;				
	padding: .8em 1.4em;				
	border-left: 3px #f4f1f4 solid;				
}								
.timeline-item:before {				
	content: '';				
	width: 13px;				
	height: 13px;				
	background: #3d7a99;				
	position: absolute;				
	left: 110px;				
	top: 24px;				
	border-radius: 100%;				
}				
				
/* for Smartphone */				
@media screen and (max-width: 480px) {				
.timeline-box .timeline {				
	padding-left: 10px;				
}							
.timeline > li.timeline-item {				
	overflow: visible;				
	border-left: 3px #e5e5d1 solid;				
}								
.timeline-item-label {				
	width: auto;				
	float: none;				
	text-align: left;				
	padding-left: 16px;				
}							
.timeline-item-content {				
	width: auto;				
	padding: 8px;				
	float: none;				
	border: none;				
}								
.timeline-item:before {				
	top: 19px;				
	width: 21px;				
	height: 21px;				
}				
}				
.timeline-box ul > li:before {				
	content: "";			
}				
.partsUl-1 .timeline-box ul {				
	background-color: transparent;			
}				
.timeline > li.timeline-item {				
	padding-left: 0;			
}				
.content .timeline-item-content  {				
	margin-top:0;			
}				
.content .timeline-item-snippet  {				
	margin-top:0;			
}				
/* for PC */				
@media screen and (min-width: 481px) {				
.timeline-box ul > li:before {				
	left:105px;			
}				
}				
/* for Smartphone */				
@media screen and (max-width: 480px) {				
.timeline-box ul > li:before {				
	left:-12px;			
}				
}


/*タイムライン--ここまで↑↑--*/













/*--------------------------------------------------
カエレバ・ヨメレバ・トマレバ　WordPressの場合
---------------------------------------------------*/.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:double #d2d7e6;
border-radius: 5px;
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: 95%;
margin: 0 auto 8px auto;
float:none;
}
.cstmreba .booklink-info,
.cstmreba .kaerebalink-info,
.cstmreba .tomarebalink-info {
text-align:center;
padding-bottom: 1px;
}
}
/*--------------------------------------------------
カエレバ・ヨメレバ・トマレバ　ここまで
---------------------------------------------------*/

/*--------------------------------------------------
ここからCSSテスト用｜poppyou.comより
---------------------------------------------------*/
.testbox1 {
   width: 260px;/* 紙の横幅 100%にすると全幅表示に */
   padding: 15px;
   margin: 2em auto;
   background: #f7f092;/* 紙の色 */
   color: #000;/* 文字色 */
   box-shadow: 4px 4px 4px rgba(0,0,0,0.03);transform:rotate(-2deg);
   word-break: break-all;
}
.testbox1 p {
    margin: 0; 
    padding: 0;
    font-size: 0.9em;
}
.testbox1_tape {
    width: 50%;
    height: 35px;
    margin: -25px auto 0;
    background: #989898;
    transform: rotate(-3deg);
    opacity: 0.1;
}
.testbox1_title {
    text-align: center;
    font-size: 1.3em!important;
    margin-top: 10px!important;
}
.testbox1_subtitle {
    text-align: center;
    font-size: 0.7em!important;
    margin-bottom: 1em!important;
}


/*--------------------------------------------------
ここまでCSSテスト用
---------------------------------------------------*/