/* 文字指定と文字色 */
body {
font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI","Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
color:#666666 !important;
}
  .sample{
    padding-left:1em;
    text-indent:-1em;
  }
  .sample:before{
    content:"※";
  }
/* h2 見出しのリセット */
.article h2,
.article h2::before,
.article h2::after {
   content: none;
   background: none;
   border: none;
   border-radius: 0;
}
/* h2 見出しのカスタマイズ */
.article h2 {
  background: #57B196;/*背景色*/
  color:#ffffff;/*文字の色*/
  margin:0;
  padding: 0.5em;/*文字まわり（上下左右）の余白*/
  border-radius: 4px;
  font-size:22px;/*文字のサイズ*/
}
/* h3 見出しのカスタマイズ */
.article h3{
 padding: 0.25em 0.5em;/*上下 左右の余白*/
  color: #494949;/*文字色*/
  background: transparent;/*背景透明に*/
  border-left: solid 5px #57B196;/*左線*/
}
#related-entries h2{
  font-size:20px;
  border-bottom:5px solid #57B196;
  padding:10px 0;
}
/* 記事リスト境界線 */
#main .entry {
    border-bottom: 1px dotted #333333;
    padding-bottom: 15px;
}

.entry-read a{
 color:#fff;
 font-size:14px;
 background-color:#FF837B;
 border:1px solid #FF837B;
 border-radius:2px;
 padding:3px 10px 3px 5px;
 text-decoration:none;
 }
/* 記事を読むボタン色 */ 
.related-entry-read a{
 color:#fff;
 font-size:14px;
 background-color:#FF837B;
 border:1px solid #FF837B;
 border-radius:2px;
 padding:3px 10px 3px 5px;
 text-decoration:none;
 }
 
.entry-read a:hover{
 color:#fff;
 background-color:#FFC3BF;
 border:1px solid #FFC3BF;
}
.entry-read a:hover{
 color:#fff;
 background-color:#FFC3BF;
 border:1px solid #FFC3BF;
}
/* 記事を読むボタン　右 */ 
.entry-read {
  text-align: right;
  margin-right: 10px; /* ここはお好みで */
}
/* 上段部分 */
.next-page-link {
  width:100%;
  margin: 40px 0 10px 0;
  text-align:center;
  border-radius:30px;
  background: #333;
}
.next-page-link a {
  display:block;
  margin:5px 0;
  color: #fff;
  text-decoration:none;
}
.next-page-link:hover {
  background: #555;
}
 
/* 下段部分 */
.page-link{
  margin: 10px 0 40px 0;
  text-align:center;
}
.comment-page-link{
  margin: 1em 1em 3em;
  text-align: center;
}
.page-link span,
.comment-page-link span,
.comment-page-link a{
  margin-right: 3px;
  padding: 5px 8px;
  border: 1px solid #ddd;
  background: #ddd;
  border-radius:5px;
}
.page-link a span,
.comment-page-link a{
  background: #fff;
  color:#000;
}
.page-link a{
  border-bottom: none;
  color: #000;
  text-decoration:none;
}
 
.page-link a span:hover,
.comment-page-link a:hover{
  background: #eee;
  color: #000;
}
/* 関連記事リスト境界線 */
#main .related-entry {

    border-bottom: 1px dotted #333333;

    padding-bottom: 15px;

}
/* 行間調整 */
.article li {

  margin: 0 0 1.5em;

  line-height: 1.9;

  position: relative;

  padding-left: 10px;

}
#ez-toc-container {
display: block !important;
width: 100% !important;
background: #fff;
border: 1px solid #ccc;
font-size: 95%;
box-sizing: border-box;
line-height: 1.4;
margin: 36px auto;
padding: 1em 2em;
}
.under {
  border-bottom: dashed 1px #ff8c00;
}
/* TOC もくじのカスタマイズ */
#toc_container{
 margin-top:25px;
 margin-bottom:35px;
 border-radius: 4px; 
 font-size: 16px; /* 文字の大きさ */
 padding-right: 16px;
 padding-left: 16px;
 background-color: #FFFBF4; /* 背景色 */
 border: 2px solid #F89174; /* 外枠の設定 */
}

#toc_container .toc_title{
 font-size: 18px; /* タイトルの文字の大きさ */
 font-weight:bold;
 color: #F89174; /* タイトルの文字色 */
 text-align: left; 
}

/* タイトル前のアイコン　FontAwesomeの設定 */
#toc_container .toc_title:before{
 content: "\f046"; /* FontAwesomeのコード */
 font-family: FontAwesome;
 padding-right: 6px;
 font-size:18px; /* アイコンの大きさ */
 color: #F89174;
}

#toc_container .toc_toggle a{
 color: #F89174; 
}

#toc_container ul{
 counter-reset:number;
 list-style:none;
}

#toc_container ul li{
 line-height: 1.25em;
 margin-bottom: 0.9em;
 margin-top:10px;
}

#toc_container ul li:before{
 counter-increment: number;
 content: counter(number);
 font-weight: bold;
 color: #555555;
 padding-right:12px;
 margin-left:-25px;
}

#toc_container ul li a{
 font-weight: bold;
 color: #555555;
 text-decoration:none;
}
#toc_container ul li a:hover{
 text-decoration:underline
}

#toc_container ul ul{
 margin-top: 0.5em;
}

#toc_container ul ul li{
 line-height: 1.25em;
 margin-bottom: 0.5em;
 font-size:14px;
 margin-left:-50px;
}

#toc_container ul ul li:before{
 content: "\f0da";
 font-family: FontAwesome;
 padding-right: 6px;
 margin-left:0px;
 color: #CCC;
 margin-left:-10px;	
}

#toc_container ul ul li a{
 color: #3D3D3D;
 font-weight: normal;
 padding-right:6px;
	text-decoration:none
}

#toc_container ul ul li a:hover{
 text-decoration:underline
}
/* サイドバー　枠 */
#sidebar{
    border:none;
    background: transparent;
    padding: 0;
}

#sidebar .widget {
    background-color: #fff;
    padding: 5px 8px;
    border-radius: 4px;
    border: 1px solid #ddd;
}
/*---------------------------------
グローバルナビの上下にラインを入れる
--------------------------------*/
#navi {
 border-top:solid 1px #5FB3F5;
 border-bottom:solid 1px #5FB3F5;
}
/*---------------------------------
ポインタを乗せた時の下のラインと文字色を変更
--------------------------------*/
#navi ul li a:hover{
  color: #ffffff !important;
}
#navi ul li a:before{
  background:#5FB3F5 !important;
}
#navi ul,#navi{
  background-color:white;
}
/*---------------------------------
トップアイコンの色
--------------------------------*/
.topicon {color: #5FB3F5}
/*---------------------------------
ポイント　枠
--------------------------------*/
.box26 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px#91D8AC;
    border-radius: 8px;
}
.box26 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #ff6600;
    font-weight: bold;
}
.box26 p {
    margin: 0; 
    padding: 0;
}
/*サイドバーの人気記事と記事の間に線*/
.widget_new_entries ul li, .widget_new_popular ul li, .widget_popular_ranking ul li{
    border-bottom: 3px dotted #d3d3d3;
}

/*******************************
* 左からの吹き出し
********************************/
.left_balloon {
    position: relative;
    background: #fff;
    border: 1px solid #777;
    margin: 10px;
    padding: 10px;
    border-radius: 15px;
    margin-right: 20%;
    clear: both;
    max-width: 500px;
    float: left;
}
.left_balloon:after,
.left_balloon:before {
    right: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}
.left_balloon:after {
    border-color: rgba(255, 255, 255, 0);
    border-right-color: #fff;
    border-width: 7px;
    margin-top: -7px;
}
.left_balloon:before {
    border-color: rgba(0, 0, 0, 0);
    border-right-color: #000;
    border-width: 8px;
    margin-top: -8px;
}
 
/*******************************
* 右からの吹き出し
********************************/
.right_balloon {
    position: relative;
    background: #85e249;
    border: 1px solid #777;
    margin: 10px;
    padding: 10px;
    border-radius: 15px;
    margin-left: 20%;
    clear: both;
    max-width: 500px;
    float: right;
}
.right_balloon:after,
.right_balloon:before {
    left: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}
.right_balloon:after {
    border-color: rgba(133, 226, 73, 0);
    border-left-color: #85e249;
    border-width: 7px;
    margin-top: -7px;
}
.right_balloon:before {
    border-color: rgba(119, 119, 119, 0);
    border-left-color: #777;
    border-width: 8px;
    margin-top: -8px;
}
 
/*******************************
* 割り込みを解除
********************************/
.clear_balloon{
  clear: both;
}
/*---------------------------------
アフィリエイトリンク用ボタン
--------------------------------*/
.btn-link {
    max-width: 600px; /*最大文字幅 */
    text-align: center;/*テキストを中央表示*/
    margin:10px auto 10px auto;
    font-weight: bold;/*テキストを太文字*/
    color: #ffffff !important;
    height: auto;    
}
.btn-link > img{
    display:inline !important;
}

.btn-link a {
 text-decoration: none !important;
 color: #ffffff !important;/*リンク文字の色*/
 display:block;
 padding: 10px;
 background-color: #0000FF;/*背景色*/
    margin-right: auto;
    margin-left: auto;
    border-radius: 10px;/*角を丸く*/  
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}

.btn-link a:hover {
 text-decoration: none !important;
 color:#0000FF !important;/*マウスを置いた時の文字色*/
 background-color: #fff;/*マウスを置いた時の背景色*/
 border:2px solid #0000FF;/*マウスを置いた時の枠線*/
}

/* アフィリエイトリンク終わり */
.btn-1 {
    background-color: #FF9F8A; /* ボタン背景色 */
    color: #fff; /* ボタン文字色 */
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.2);
    font-weight: bold;
    border-radius: 4px;
    max-width: 80%;
    margin: 0.5em auto;
    padding: 0;
    text-align: center;
    line-height: 1.4;
    transition: all .2s ease;
    opacity: 0.8;
}

.btn-1:hover {
    box-shadow: none;
    transform: translateY(2px);
}

.btn-1 a {
    text-decoration: none !important;
    color: #fff !important;
    display: block;
    margin: 0;
    padding: 0.5em;
}

.btn-1 > img { float: left; }
.btn-1::after{ content: ''; clear: left; }
/* 画像サイズ最適表示 */
img {
max-width: 100%;
height:auto;
}
/* サイドバーカテゴリータイトルにアイコンをつける */
.widget_categories h3:before{
 margin-right:5px;
 font-family:"FontAwesome";
 content:"\f07c";
}
/*　親カテゴリー　アイコン表示　*/
#categories-2 > ul > li:before {
  content: "	\f0a4";
  font-family: fontawesome;
  margin-right: 10px;
  color: #eccdf7;
}
/* トリプル　囲み枠 */
.kakomi-triple1 {
 position: relative;
 border: 1px solid #007b43; /*左枠線*/
 width: 90%;
 margin: 2em auto;
 padding: 20px 15px 15px 20px;
 z-index: 0;
}
.kakomi-triple1::before,
.kakomi-triple1::after {
 position: absolute;
 content: '';
 width: 100%;
 height: 100%;
}
.kakomi-triple1::before {
 border: 1px solid #3eb370; /*中枠線*/
 bottom: -4px;
 right: -4px;
 z-index: 1;
}
.kakomi-triple1::after {
 border: 1px solid #7ebea5; /*右枠線*/
 bottom: -7px;
 right: -7px;
 z-index: 2;
}
/* 赤　囲み枠 */
.box2 {
    padding: 0.5em 1em;
    margin: 2em 0;
    font-weight: bold;
    color: #666666;/*文字色*/
    background: #FFF;
    border: solid 3px #FF0000;/*線*/
    border-radius: 10px;/*角の丸み*/
}
.box2 p {
    margin: 0; 
    padding: 0;
}
/* リストデザイン */
/*--------------------
  丸数字のリスト
--------------------*/
ol{
   margin:2em 1em;
   list-style:none;
   counter-reset:count;
}

ol li{
    counter-increment:count;
}

ol li:before{
    content:counter(count);
    margin-right:7px;        /*丸数字右側の余白*/
/*以下 丸の設定*/
    display:inline-block;
    width:22px;
    height: 22px;
    height:22px;
    background:#f69;         /*丸の色*/
    color:white;             /*数字の色*/
    border-radius:50%;
    line-height:22px;        /*行の高さ(heightと同じにしてください)*/
    text-align:center;
}

/* 波線 */
.underline {
  text-decoration: underline wavy ;
}
#toc_container {
  margin: 0 auto;
}