@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
*/

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

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

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

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

/* 固定ページの日付を非表示 */
.page .post-date,
.page .post-update {
  display: none;
}

/*記事内の文字スタイル*/
.entry-content {
  font-size: 16px;
  line-height: 170%;
  letter-spacing: 0.05em;
}

/* リンクの下線消し */
a {
  text-decoration: none;
}

/* ホバー時だけ下線出す */
a:hover {
  text-decoration: underline;
}

/* divで画像の中央寄せ */
.img-c {
  text-align: center;
}

/* もくじテーブル */
.entry-content table {
  width: 100%;
  border: none;
  margin: 0 auto;
}

.mokuji {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 0 auto;
  table-layout: fixed;
}

.mokuji th {
  color: #fff;
  background-color: #69b076;
  font-size: 16px;
}

.mokuji tr:nth-child(even) td {
  background-color: #ccffe6;
}

.mokuji td {
  text-align: left;
  font-size: 16px;
}

.mokuji th,
.mokuji td {
  padding: 7px;
  border: 1px solid #ddd;
}


/* テーブル共通 */
.entry-content table {
  width: 100%;
  border: none;
  margin-bottom: 15px;
}

/* テーブルベース共通　a横b縦 */
.table-a,
.table-aauto,
.table-b {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
}

.table-a th,
.table-aauto th,
.table-b th {
  background-color: #a6c8b2;
  padding: 7px;
  border: 1px solid #ddd;
}

.table-a td,
.table-aauto td,
.table-b td {
  padding: 7px;
  border: 1px solid #ddd;
}

/* テーブルaとaauto共通 */
.table-a {
  table-layout: fixed;
}

.table-aauto {
  table-layout: auto;
}

.table-a tr:nth-child(odd) td,
.table-aauto tr:nth-child(odd) td {
  background-color: #e6eae3;
}

.table-a td,
.table-aauto td {
  text-align: center;
}

/* テーブルb縦用 */
.table-b td:nth-child(odd) {
  background-color: #e6eae3;
  text-align: center;
}

.table-b th,
.table-b td {
  text-align: center;
}

/* 見出しデザイン（記事内だけ） */
.entry-content h2 {
  position: relative;
  padding: .5em .75em;
  background-color: #69b076;
  color: #fff;
  border-radius: 6px;
}

/* h2 吹き出し部分 */
.entry-content h2::after {
  position: absolute;
  top: 100%;
  left: 30px;
  content: '';
  width: 0;
  height: 0;
  border: 10px solid transparent;
  border-top: 15px solid #69b076;
}

/* h3 */
.entry-content h3 {
  font-size: 22px;
  border-bottom: 3px solid #028760;
  padding-bottom: 5px;
  margin-top: 1.5em;
}

/* h4 */
.entry-content h4 {
  border-left: 15px solid #badcad;
  padding: 5px 0 5px 10px;
  margin-bottom: 0;
}

/* h5 */
.entry-content h5 {
  color: #000;
  padding: 0.5em;
  margin-top: 10px;
  margin-bottom: 0;
  display: inline-block;
  line-height: 1.3;
  background: #d6ffad;
  border-radius: 20px 5px 5px 20px;
}

.entry-content h5::before {
  content: '●';
  color: white;
  margin-right: 8px;
}

/* タイトル付きボックス */
.box1 {
  position: relative;
  margin: 3em 0;
  padding: 0.5em 0.5em 0 0.5em;
  border: 3px solid #f39800;
  border-radius: 0 5px 5px 5px;
  background: #fff;
}

/* ボックスのタイトル */
.box1 .box-title {
  position: absolute;
  top: -35px;
  left: -3px;
  padding: 0 9px;
  height: 35px;
  line-height: 37px;
  font-size: 20px;
  background: #f39800;
  color: #fff;
  font-weight: bold;
  border-radius: 5px 5px 0 0;
}

/* ボックスの中身 */
.box1 p {
  margin: 0;
  padding: 0.5em 0;
}

/* アプリーチの新デザイン */
.appreach {
  text-align: left;
  padding: 25px;
  margin: 20px;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0px 2px 5px 1px #c0c0c0;
}

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

.appreach img,
.appreach p {
  margin: 0;
  padding: 0;
}

.appreach a:after {
  display: none;
}

.appreach__icon {
  float: left;
  border-radius: 10%;
  overflow: hidden;
  margin: 0 3% 0 0 !important;
  width: 25% !important;
  height: auto !important;
  max-width: 120px !important;
}

.appreach__detail {
  display: inline-block;
  font-size: 20px;
  line-height: 1.5;
  width: 72%;
  max-width: 72%;
}

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

p.appreach__name {
  font-size: 16px;
  color: #3a3a3a;
  padding-bottom: 10px;
  font-weight: bold;
  line-height: 1.5em !important;
  max-height: 4em;
  overflow: hidden;
}

.appreach__info {
  font-size: 12px !important;
  color: #888;
}

.appreach__info a {
  color: #aaa;
}

.appreach__developper,
.appreach__price {
  margin-right: 0.5em;
}

.appreach__posted a {
  margin-left: 0.5em;
}

.appreach__links {
  float: left;
  height: 40px;
  margin-top: 15px;
  white-space: nowrap;
}

.appreach__aslink img {
  margin-right: 10px;
  height: 40px;
  width: 135px;
}

.appreach__gplink img {
  height: 40px;
  width: 134.5px;
}

@media only screen and (max-width: 786px) {
  .appreach {
    margin: 20px 0;
  }

  .appreach__info {
    font-size: 11px !important;
  }

  p.appreach__name {
    font-size: 15px;
  }
}

/* ヨメレバ・カエレバ・トマレバ */
.booklink-box, .kaerebalink-box, .tomarebalink-box{
 box-sizing: border-box;
 border: solid 1px #ccc;
 border-radius: 2px;
 padding: 10px;
 margin-bottom: 10px;
 display: -webkit-flex;
 display: flex;
 -webkit-align-items: center;
 align-items: center;
}
.booklink-image, .kaerebalink-image, .tomarebalink-image{
 margin:0 15px 0 0;
 width: 160px;
 text-align: center;
 -webkit-flex: 0.4;
 flex: 0.4;
}
.cstmreba img{
 margin: 0 auto;
 text-align: center;
}
.booklink-info, .kaerebalink-info, .tomarebalink-info{
 -webkit-flex: 1;
 flex: 1;
 margin:0;
 line-height: 1.2em;
 overflow: hidden;
}
.booklink-name, .kaerebalink-name, .tomarebalink-name{
 line-height:1.3em;
}
.booklink-name a, .kaerebalink-name a, .tomarebalink-name a{
 text-decoration: none;
 font-weight: bold;
}
.booklink-powered-date, .kaerebalink-powered-date, .tomarebalink-powered-date{
 background-color: #DDD;
 padding: 2px;
 font-size: .6em;
 text-align: right;
 line-height: 1.2em;
 margin-bottom: 3px;
}
.booklink-powered-date a, .kaerebalink-powered-date a, .tomarebalink-powered-date a {
 text-decoration: none;
}
.booklink-detail, .kaerebalink-detail, .tomarebalink-address {
 font-size: .7em;
}
.booklink-link2, .kaerebalink-link1, .tomarebalink-link1{
 flex-wrap: wrap;
 display: -webkit-flex;
 display: flex;
}
.booklink-link2 a,
.kaerebalink-link1 a,
.tomarebalink-link1 a {
 -moz-border-radius: 5px;
 -webkit-border-radius: 5px;
 border-radius: 5px;
 display: inline-block;
 margin: 3px 3px 0 0;
 padding: 10px 0px;
 text-align: center;
 text-decoration: none;
 font-weight: bold;
 font-size: 12px;
}
.booklink-link2 a:hover, .kaerebalink-link1 a:hover, .tomarebalink-link1 a:hover{
 color:#fff;
 transform: scale(0.95); /* 変化するボタンの大きさ */
 transition: all 0.6s ease;
}
.shoplinkamazon, .shoplinkrakuten, .shoplinkkindle, .shoplinkkakakucom, .shoplinkrakukobo, .shoplinkyahoo, .shoplinkseven, .shoplinkjtb, .shoplinkjalan {
 width: 48%;
 display: -webkit-flex;
 display: flex;
 -webkit-align-items: center;
 align-items: center;
 -webkit-justify-content: center;
 justify-content: center;
}
.shoplinkamazon a, .shoplinkrakuten a, .shoplinkkindle a, .shoplinkkakakucom a, .shoplinkrakukobo a, .shoplinkyahoo a, .shoplinkseven a, .shoplinkjtb a, .shoplinkjalan a {
 width: 100%;
}
/* amazon */
.shoplinkamazon a {
 color: #FFF; /* 文字の色 */
 border: solid 1px #FF9901; /* ボーダー色 */
 background-color: #FF9901; /* ホバー外のボタン色 */
}
.shoplinkamazon a:hover {
 background-color: #ff9901; /* カーソルを重ねた時の背景色 */
}
/* 楽天 */
.shoplinkrakuten a {
 color: #FFF; /* 文字の色 */
 border: solid 1px #c20004; /* ボーダー色 */
 background-color: #c20004; /* ホバー外のボタン色 */
}
.shoplinkrakuten a:hover {
 background-color: #c20004; /* カーソルを重ねた時の背景色 */
}
/* yahoo */
.shoplinkyahoo a {
 color: #FFF; /* 文字の色 */
 border: solid 1px #3366ff; /* ボーダー色 */
 background-color: #3366ff; /* ホバー外のボタン色 */
}
.shoplinkyahoo a:hover {
 background-color: #3366ff; /* カーソルを重ねた時の背景色 */
}
.shoplinkyahoo img {
 display: none;
}
.shoplinkyahoo a {
 font-size: 9px;
}
/* kobo */
.shoplinkrakukobo a {
 color: #FFF; /* 文字の色 */
 border: solid 1px #990000; /* ボーダー色 */
 background-color: #990000; /* ホバー外のボタン色 */
}
.shoplinkrakukobo a:hover {
 background-color: #990000; /* カーソルを重ねた時の背景色 */
}
/* kindle */
.shoplinkkindle a {
 color: #FFF; /* 文字の色 */
 border: solid 1px #007dcd; /* ボーダー色 */
 background-color: #007dcd; /* ホバー外のボタン色 */
}
.shoplinkkindle a:hover {
 background-color: #007dcd; /* カーソルを重ねた時の背景色 */
}
/* 価格 */
.shoplinkkakakucom a {
 color: #FFF; /* 文字の色 */
 border: solid 1px #314995; /* ボーダー色 */
 background-color: #314995; /* ホバー外のボタン色 */
}
.shoplinkkakakucom a:hover {
 background-color: #314995; /* カーソルを重ねた時の背景色 */
}
/* 7net */
.shoplinkseven a {
 color: #82c36f ; /* 文字の色 */
 border: solid 1px #82c36f; /* ボーダー色 */
 background-color: #82c36f; /* ホバー外のボタン色 */
}
.shoplinkseven a:hover {
 background-color: #82c36f; /* カーソルを重ねた時の背景色 */
}
/* jtb */
.shoplinkjtb a {
 color: #FFF ; /* 文字の色 */
 border: solid 1px #990000; /* ボーダー色 */
 background-color: #990000; /* ホバー外のボタン色 */
}
.shoplinkjtb a:hover {
 background-color: #990000; /* カーソルを重ねた時の背景色 */
}
/* jalan */
.shoplinkjalan a {
 color: #FFF ; /* 文字の色 */
 border: solid 1px #FF9901; /* ボーダー色 */
 background-color: #FF9901; /* ホバー外のボタン色 */
}
.shoplinkjalan a:hover {
 background-color: #FF9901; /* カーソルを重ねた時の背景色 */
}
.booklink-footer{display: none;}