@charset "UTF-8";

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

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

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*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){
  /*必要ならばここにコードを書く*/
}

  /*目次カスタマイズここから*/
.toc {
    border: 1px solid #666;
    font-size: 0.9em;
    line-height: 1.5;
    padding: 0;
    margin-bottom: 1em;
    display: table;
    margin-left: auto;
    margin-right: auto;
}
.toc-title {
    background: #666; /*目次タイトルの背景色*/
    color: #fff; /*目次タイトルの文字色*/
    font-size: 1.1em;
    text-align: center;
    padding: 6px 16px;
}
.toc-title::before {
    font-family: FontAwesome;
    content: '\f0ca'; /*目次タイトルのアイコン*/
    margin-right: 0.5em;
}
.toc-content {
    padding: 8px;
}
.toc ul li a, .toc ol li a {
    display: block;
    border-bottom: 1px dashed #666; /*h3以下の下側ボーダー*/
    margin-left: -20px;
    padding-left: 20px;
}
.toc ul.toc-list>li, .toc ol.toc-list>li {
    margin-top: 1em;
}
.toc ul.toc-list>li>a, .toc ol.toc-list>li>a {
    border-bottom: 2px solid #666; /*h2の下側ボーダー*/
    font-weight: bold;
}
 /*目次カスタマイズここまで*/

 /*--良い点悪い点ここから--*/
ul.point55{border:3px solid #009688;background:#e0f2f1;margin:3em 0 1em 0;padding:0.5em 0 0 0;position:relative;border-radius:0 16px 0px 16px;}
ul.point55::before{content:'良い点・悪い点';position:absolute;top:-2.1em;left:-3px;display:inline-block;background:#009688;color:#fff;padding:0.1em 8px 0 8px;line-height:2em;font-weight:bold;}
ul.point55 li{list-style-type:none;margin:0 1em 0.2em 1em;padding:0.2em 0 0.2em 1em;}
ul.point55 li:not(:last-of-type){border-bottom:3px dotted #00796b;}
ul.point55 li::before{display:inline-block;font-family:FontAwesome;text-indent:-1em;}
ul.point55 li.good::before{content:'\f10c';color:#4caf50;text-indent:0;margin:0 0.5em 0 -1em;}
ul.point55 li.bad::before{content:'\f00d';color:#f44336;text-indent:0;margin:0 0.5em 0 -1em;}
/*--良い点悪い点ここまで--*/

 /*私の評価（ピンク）ここから*/
ul.point2{border:3px solid #df8182;padding:1.2rem 0 0 0;background: #fffbf5;margin:1.5em 0;position:relative;}
ul.point2::before{content:'私の評価';position:absolute;top:calc(-0.7rem - 2px);left:2em;display:inline-block;background:#df8182;color:#fff;padding:0 0.8em 0 1.2em;font-size:0.9rem;font-weight:bold;line-height:1.4rem;border-radius:0.7rem;}
ul.point2::after{content:'\f041';font-family:FontAwesome;position:absolute;top:calc(-1rem - 2px);left:0.5em;display:inline-block;background:#df8182;color:#fff;font-size:1rem;line-height:2rem;width:2rem;text-align:center;border-radius:1rem;}
ul.point2 li{list-style-type:none;margin:0 0 0.2em 1em;padding:0 0 0 1em;}
ul.point2 li::before{display:inline-block;font-family:FontAwesome;text-indent:-1.2em;}
ul.point2 li.good::before{content:'\f00c';color:#4caf50;}
ul.point2 li.bad::before{content:'\f067';color:#f44336;transform:rotate(45deg);text-indent:0;margin:0 0.5em 0 -1.2em;}
 /*私の評価（ピンク）ここまで*/

 /*内部リンク本文消す*/
.internal-blogcard-snipet {
  display: none;
}
 /*内部リンク本文消すここまで*/

/*外部リンク本文消す*/
.external-blogcard-snipet {
  display: none;
}
 /*外部リンク本文消すここまで*/

 /*ボタンに影をつけるここから*/
.btn{
	box-shadow: 0 7px 10px -5px rgba(0,0,0,0.5);
}
 /*ボタンに影をつけるここまで*/

/*表カスタマイズここから*/
.entry-content table {
  border-collapse: collapse;
	max-width: 500px
}
.entry-content th {
  border: solid 1px #999999 !important;
  color: #000000;
  background-color: #f5f5f5;
}
.entry-content td {
  border: solid 1px #999999 !important;
  color: #000000;
  text-align: center;
  background-color: #ffffff;
}
.entry-content thead th {
  background-color: #656565;
  color: #FFFFFF;
}
 /*表カスタマイズここまで*/

/*中心表示*/
.img_center {
 	text-align: center;
}

 /*アプリボタンここから*/

.appreach {
  text-align: left;
  padding: 10px;
  border: 1px solid #7C7C7C;
  overflow: hidden;
}
.appreach:after {
  content: "";
  display: block;
  clear: both;
}
.appreach p {
  margin: 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;
}
.appreach__name {
  font-size: 16px;
  line-height: 1.5em !important;
  max-height: 3em;
  overflow: hidden;
}
.appreach__info {
  font-size: 12px !important;
}
.appreach__developper, .appreach__price {
  margin-right: 0.5em;
}
.appreach__posted a {
  margin-left: 0.5em;
}
.appreach__links {
  float: left;
  height: 40px;
  margin-top: 8px;
  white-space: nowrap;
}
.appreach__aslink img {
  margin-right: 10px;
  height: 40px;
  width: 135px;
}
.appreach__gplink img {
  height: 40px;
  width: 134.5px;
}
.appreach__star {
  position: relative;
  font-size: 14px !important;
  height: 1.5em;
  width: 5em;
}
.appreach__star__base {
  position: absolute;
  color: #737373;
}
.appreach__star__evaluate {
  position: absolute;
  color: #ffc107;
  overflow: hidden;
  white-space: nowrap;
}
 /*アプリボタンここまで*/

/*青色のBOXここから*/

.box3-blue {
	position: relative;	/* 配置に関するもの(ここを基準に) */
	max-width:600px; /* ボックスの横幅 */
	margin: 2em auto;	/* ボックスの外側余白(上下:2em　左右:auto) */
	padding: 0.7em 1em;	/* ボックスの内側余白(上下:1.7em　左右:2em) */
	border: 4px solid #0e7ac4;	/* ボックスの線 (太さ　線の種類　線の色)*/
	border-radius: 4px;	/* ボックスの角丸 */
}
.box3-blue .box-title {
	position: absolute; /* 配置に関するもの(ここを動かす) */
	top: -10px; /* 上から（-10px）移動*/
	left: 30px; /* 左から(30px)移動 */
	background: #fff; /* タイトル背景色 */
	color: #0e7ac4; /* タイトル文字色 */
	padding: 0 10px;/* タイトルの余白 */
	line-height: 1;/* タイトルの行の高さ */
	font-size: 18px;/* タイトル文字の大きさ */
	font-weight: bolder;/* タイトル文字の太さ */
}
.box3-blue p {
	margin: 0; /* 文字の外側余白リセット*/
	padding: 0; /* 文字の内側余白リセット*/
}
 /*青色のBOXここまで*/

 /*CTA BOXカスタマイズここから*/
.cta-box {
border: solid 1px #9d9d9d;
border-radius: 8px;
background-color: #fff;
color:#444;
font-size: 16px
}
 /*CTA BOXカスタマイズここまで*/