/* カスタム CSS をここに入力してください */
h2#danraku2 {
}
h3#danraku3 {
}　
h4#danraku4 {
 background: #f8c1d9;/*背景色*/
padding: 0.5em;/*文字まわり（上下左右）の余白*/
}
 
/*リンクの装飾*/

a {
color: #01a9db;
text-decoration: none;
}

リンクのアンダーバー消す
a:hover {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}




 .midori-box {
    border: 4px solid #77d092;
 /*   border-radius: 9px;
*/    padding: 2em;
 
}


 hukidashi {
  position: relative;
  padding: 0.6em;
  background: #e0edff;
}

hukidashi:after {
position: absolute;
content: '';
top: 100%;
left: 30px;
border: 15px solid transparent;
border-top: 15px solid #e0edff;
width: 0;
height: 0;
}

 /*記事の見出しの装飾*/
h2,
.home.blog .entry-title {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: #494949;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #7db4e6;/*左線*/
}



/*左線色塗り*/
.entry-content h1 {
padding: 0.5em;/*文字周りの余白*/
color: #494949;/*文字色*/
background: #d7f9ff;/*背景色*/
border-left: solid 5px #00c7eb;/*左線（実線 太さ 色）*/
}

CSS

.entry-content h2{
	position: relative;
	color: #111;
	font-size: 1.3em;
	font-weight: bold;
	margin: 0 0 1.5em;
	border-bottom: 3px solid #4682b4;
}

.entry-content  h3{
	position: relative;
	margin: 0 0 1.5em;
	padding: 0.8em 0 0.8em 1.5em;
	font-size: 1.143em;
	font-weight: bold;
}

.entry-content h3:before{
	content: "";
	position: absolute;
	background: #000b39;
	top: 50%;
	left: 0.5em;
	margin-top :-15px;
	height: 30px;
	width: 5px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
}



 .post-content blockquote:before {
content: '';
font-family: 'FontAwesome';
font-size: 32px;
color: #777;
position: absolute;
top: 20px;
left: 12px;
}

.yellow-marker-line {
  background: linear-gradient(transparent 60%, #ffff72 0%);
}

.blue-marker-line {
  background: linear-gradient(transparent 60%, #99ffff 0%);
}

.pink-marker-line {
  background: linear-gradient(transparent 60%, #ffc0cb 0%);
}


/*左線色塗り*/
.midashi {
padding: 0.5em;/*文字周りの余白*/
color: #494949;/*文字色*/
background: #d7f9ff;/*背景色*/
border-left: solid 5px #00c7eb;/*左線（実線 太さ 色）*/
}

.midasidesign1{
  position: relative;
  color: white;
  background: #81d0cb;
  line-height: 1.4;
  padding: 0.5em 0.5em 0.5em 1.8em;
}

.midasidesign1:before {/*疑似要素*/
  font-family: "Font Awesome 5 Free";
  content: "\f14a";
  position: absolute;
  left : 0.5em; /*左端からのアイコンまでの距離*/
}
a {

text-decoration: none;

}

/*見出し付き囲み線*/
.pointbox {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #95ccff;
    border-radius: 8px;
}
.pointbox .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #95ccff;
    font-weight: bold;
}
.pointbox p {
    margin: 0; 
    padding: 0;
}

/*関連リンク*/
.kanrenlink {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #62c1ce;
}
.kanrenlink .box-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    vertical-align: middle;
    font-size: 17px;
    background: #62c1ce;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.kanrenlink p {
    margin: 0; 
    padding: 0;
}


/*関連リンク2*/
.kanrenlinkpink {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #ff69b4;
}
.kanrenlinkpink .box-titlepink {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    vertical-align: middle;
    font-size: 17px;
    background: #ff69b4;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.kanrenlinkpink p {
    margin: 0; 
    padding: 0;
}

.hasenwaku {
    padding: 0.5em 1em;
    margin: 2em 0;
    background: #f0f7ff;
    border: dashed 2px #5b8bd0;/*点線*/
}
.hasenwaku p {
    margin: 0; 
    padding: 0;
}

.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;
}
/*チェックリスト*/
.check ul {
  border: solid 2px #ffb03f;
  padding: 0.5em 1em 0.5em 2.3em;
  position: relative;
}

.check li {
  line-height: 1.5;
  padding: 0.5em 0;
  list-style-type: none!important;/*ポチ消す*/
}

.check li:before {
  font-family: "Font Awesome 5 Free";
  content: "\f00c";
  position: absolute;
  left : 1em; /*左端からのアイコンまで*/
  color: #ffb03f; /*アイコン色*/
}
.my-orange {color: #ffb03f}

/* ===============消しちゃダメ============== */

/* kaereba/yomereba Customize Settings 1.0.0 ver */

/* Created by Cazuki Hoshina */

/* Copyright (c) @cazuki All rights Reserved. */

/* ======================================== */



.kaerebalink-box, .booklink-box {

  width: 100%;

  margin: 0 0 2rem;

  padding: 1rem;

  background: #ffffff;

  border: 1px solid;

  border-color: #eaeaea #dddddd #d0d0d0;

  -webkit-border-radius: 3px;

  -moz-border-radius: 3px;

  border-radius: 3px;

  box-sizing: border-box;

  /zoom:1;

}

.kaerebalink-box:after, .booklink-box:after {

  content:"";

  display:block;

  visibility:hidden;

  height:0;

  clear:both;

}

.kaerebalink-image, .booklink-image {

  float:left;

  width:128px;

  margin:0;

  text-align:center;

}

.kaerebakink-image img, .booklink-image img { width:128px; height:auto; }

.kaerebalink-info, .booklink-info { margin: 0 0 0 140px; line-height: 1.6rem; }

.kaerebalink-name, .booklink-name {

  font-size: 1.0625rem;

  font-weight: bold;

  margin: 0;

}

.kaerebalink-name a, .booklink-name a { color: #2b2b2b; }

.kaerebalink-name a:hover, .booklink-name a:hover { text-decoration: underline; }

.kaerebalink-powered-date, .booklink-powered-date { font-size: 0.75rem; font-weight: normal; }

.kaerebalink-detail, .booklink-detail { font-size: 0.9375rem; margin: 0 0 0.5em; }

.kaerebalink-link1, .booklink-link2 { width:100%; }

.kaerebalink-link1 div, .booklink-link2 div {

  float: left;

  width: 49.5%;

  margin-bottom: 1%;

  font-size: 0.875rem;

  font-weight: bold;

  text-align: center;

  box-sizing: border-box;

}

.kaerebalink-link1 div:nth-child(even), .booklink-link2 div:nth-child(even) { margin-left: 1%; }

.kaerebalink-link1 div a, .booklink-link2 div a { display:block; padding:3px 0; text-decoration:none; }

.shoplinkamazon a, .shoplinkrakuten a, .shoplinkrakukobo a, .shoplinkyahoo a, .shoplinkyahooAuc a,

.shoplinkseven a, .shoplinkbellemaison a, .shoplinkcecile a, .shoplinkkakakucom a,

.shoplinkkindle a, .shoplinkbk1 a, .shoplinkehon a, .shoplinkkino a,

.shoplinkjun a, .shoplinktoshokan a {

  display:block;

  text-decoration:none;

}

.shoplinkamazon a { color:#ffffff; background:#ff9900; }

.shoplinkkindle a { color:#ffffff; background:#1882c9; }

.shoplinkrakuten a { color:#ffffff; background:#bf0000; }

.shoplinkrakukobo a { color:#ffffff; background:#ff2626; }

.shoplinkyahoo a { color:#ffffff; background:#fc1d2f; }

.shoplinkyahooAuc a { color:#252525; background:#ffdb00; }

.shoplinkseven a { color:#ffffff; background:#225093; }

.shoplinkbellemaison a { color:#ffffff; background:#83be00; }

.shoplinkcecile a { color:#ffffff; background:#6b053d; }

.shoplinkkakakucom a { color:#ffffff; background:#00138e; }

.shoplinkbk1 a { color:#ffffff; background:#0484d2; }

.shoplinkehon a { color:#ffffff; background:#00006a; }

.shoplinkkino a { color:#ffffff; background:#003e9d; }

.shoplinkjun a { color:#4b5854; background:#d8c9b7; }

.shoplinktoshokan a { color:#ffffff; background:#29b6e9; }

.booklink-footer { clear:both !important; }



@media only screen and (min-width:460px) and (max-width:640px) {

	.kaerebalink-link1 div, .booklink-link2 div { float: none; width: 100%; }

	.kaerebalink-link1 div:nth-child(even), .booklink-link2 div:nth-child(even) { margin-left: 0; }

}

@media only screen and (max-width:459px) {

	.kaerebalink-image, .booklink-image {

	  float:none;

	  width:100%;

	  margin:0;

	  text-align:center;

	}

	.kaerebalink-image img, .booklink-image img { width:180px; height:auto; }

	.kaerebalink-info, .booklink-info { margin: 0; }

	.kaerebalink-link1 div, .booklink-link2 div { float: none; width: 100%; }

	.kaerebalink-link1 div:nth-child(even), .booklink-link2 div:nth-child(even) { margin-left: 0; }

}


/* Header Navi Animation */
#gnavi li a:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 0%;
	border-bottom: 3px solid #fff;
	transition: 0.4s;
}
#gnavi li a:hover:after {
	width: 100%;
}

/*全体*/
.hidden_box {
    margin: 2em 0;/*前後の余白*/
    padding: 0;
}

/*ボタン装飾*/
.hidden_box label {
    padding: 15px;
    font-weight: bold;
    border: solid 2px black;
    cursor :pointer;
}

/*ボタンホバー時*/
.hidden_box label:hover {
    background: #efefef;
}

/*チェックは見えなくする*/
.hidden_box input {
    display: none;
}

/*中身を非表示にしておく*/
.hidden_box .hidden_show {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}

/*クリックで中身表示*/
.hidden_box input:checked ~ .hidden_show {
    padding: 10px 0;
    height: auto;
    opacity: 1;
}