@charset "UTF-8";

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

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

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

#main .button-caption {
	display: none; /*キャプション非表示*/
}

/*---SNSボタンを丸くする---*/
#main .button-caption {
	display: none; /*キャプション非表示*/
}

/*SNSシェアボタン*/
.sns-share-message{
	font-weight: bold; /*太字*/
	color: #875d5b; /*文字色*/
}
.sns-share-buttons {
	flex-wrap: nowrap; /*折り返さない*/
	justify-content: center; /*中央寄せ*/
}
.sns-share-buttons a {
	border-radius: 50%; /*丸くする*/
	font-size: 20px; /*アイコンのサイズ*/
	margin: 0 10px; /*ボタン同士の間隔*/
}
#main .sns-share a {
	width: 40px; /*ボタンの横幅*/
	height: 40px; /*ボタンの高さ*/
}

.page .sns-share,
.page .sns-follow {
    display: none;
}

.page .post-date {
display: none;
}

nav#navi, .menu-header .sub-menu{
    font-weight: bold;
    box-shadow: 0 5px 15px -5px rgba(0,0,0,0.2);
}

.menu-header .sub-menu .item-label{
    font-size: 80%;
}
.menu-header .item-label{
    color: #b5b5b5 !important;
}
.menu-header .current-menu-item,
.menu-header .current-post-item,
.menu-header .current-menu-ancestor,
.menu-header .current-post-ancestor,
.menu-header .menu-item:hover {
    color: #333 !important;
    border-bottom: 3px solid #FDD835;
    transition: all .2s ease;
}

.menu-header .sub-menu .menu-item,
.menu-header .sub-menu .menu-item:hover{
    border-bottom: none;
}
.menu-header .current-menu-item>a .item-label,
.menu-header .current-post-item>a .item-label,
.menu-header .current-menu-ancestor>a .item-label,
.menu-header .current-post-ancestor>a .item-label,
.menu-header .item-label:hover{
    color: #333 !important;
    transition: all .2s ease;
}

.sidebar h3 { 
    background: none; /*背景色を解除*/ 
    padding: 0; /*余白をなしに*/ 
    font-size: 16px; /*文字サイズを小さく*/
    letter-spacing: 2px; /*文字の間隔を少し広く*/ 
} 

.sidebar h3:after { /*グラデーションのラインを引く*/ 
    content:""; 
    display:block; 
    height:1px; 
    width:100%; 
    background: -webkit-linear-gradient(left, #40bfa0 0%,#fef785 82%,#f37b7b 100%); 
    background: linear-gradient(to right, #40bfa0 0%,#fef785 82%,#f37b7b 100%); 
} 

.widget_categories ul li a { /*親カテゴリ用のコード*/ 
    color: #333; 
    text-decoration: none; 
    padding: 6px 0; 
    display: block; 
    padding-right: 4px; 
    padding-left: 4px; 
    border-top: 1px dotted #ccc; /*上部にボーダーを引く*/ 
    font-size: 16px; 
} 
.widget_categories ul li a::before { /*親カテゴリのアイコン*/ 
    font-family: FontAwesome; 
    content: "\f0da"; 
    padding-right: 10px; 
} 
.widget_categories > ul > li > a:first-child {  
    border-top: none; /*最初の親カテゴリは上部ボーダーを消す*/ 
} 
.widget_categories > ul > li > a:last-child { 
    border-bottom: 1px dotted #ccc; /*最後の親カテゴリは下部ボーダーを引く*/ 
} 
.widget_categories ul li a .post-count { /*記事数用のコード*/ 
    display: block; 
    float: right; 
    background: #ededed; 
    padding: 0 1em; 
    font-size: 14px; 
    margin-top: .2em; 
    border-radius: 4px; 
} 
.widget_categories ul li a:hover { /*親子共通マウスホバー時*/ 
    background: none; 
    transition: 0.5s; 
    color: #72c7e6; 
} 
.widget_categories ul li a:hover .post-count { /*記事数のマウスホバー時*/ 
    background: #72c7e6; 
    color: #fff; 
    transition: 0.5s; 
} 
.widget_categories ul li ul { /*子カテゴリのボックス*/ 
    border-bottom: 1px dotted #ccc; 
} 
.widget_categories ul li ul li a { /*子カテゴリ用のコード*/ 
    color: #333; 
    text-decoration: none; 
    padding: 0 4px 4px 4px; 
    display: block; 
    border: none; 
} 
.widget_categories ul li ul li a::before { /*子カテゴリのアイコン*/ 
    font-family: FontAwesome; 
    content: "・"; 
    padding: 0; 
} 



.sidebar .search-box, .search-menu-content .search-box { 
  width: 100%; 
  margin: 1em 0 2em; 
  position: relative; 
  display: flex; 
  border-radius: 50px; /*全体を囲むボックスの角丸*/ 
  box-shadow:0px 4px 6px 0px #c4c4c4; /*全体を囲むボックスのシャドウ*/ 
} 
.search-menu-content .search-box { 
  box-shadow:0px 4px 6px 0px #333; /*スライドイン表示でのシャドウ*/ 
} 
.sidebar .search-edit, .search-menu-content .search-edit { 
  width: 80%; /*入力部分の長さ*/ 
  background: #fff; /*入力部分の背景色*/ 
  padding: 0 10px; 
  border: 1px solid #47585c; /*ボーダーを消す*/ 
  border-radius: 50px 0 0 50px; /*左上、左下のみ角丸*/ 
  font-size: 16px; 
} 
.search-submit { 
  width: 20%; /*ボタン部分の長さ*/ 
  background: #47585c; /*ボタン部分の背景色*/ 
  color: #fff; /*アイコンの色*/ 
  position: static; 
  right: auto; 
  top: auto; 
  font-size: 20px; /*アイコンの大きさ*/ 
  cursor: pointer; 
  line-height: 40px; /*検索窓の高さ*/ 
  border: none; 
  border-radius: 0 50px 50px 0; /*右上、右下のみ角丸*/ 
  padding: 0; 
} 
.search-box input::placeholder { 
  color: #bbb; /*プレースホルダーの色*/ 
} 
.search-box input:focus, .search-box button:focus { 
  outline: 0; /*フォーカス時の枠線を消す*/ 
} 

.author-box {
	border: none !important;
	padding: 0 !important;
}

.pwa .author-box {
	text-align: left; /* 文字を左揃えに */
}
.author-box .author-widget-name{
	color: #666;
	background-color: #eaedf2;
	display: inline-block;
	margin: 0 auto 3px 1rem;
	padding: .4em;
	border-radius: 4px;
	font-weight: bold;
	position: relative;
	z-index: 2;
	font-size: .9em;
}

.author-box .author-widget-name::before {
	content: '';
	position: absolute;
	left: 20%;
	bottom: -15px;
	display: block;
	width: 0;
	height: 0;
	border-right: 15px solid transparent;
	border-top: 15px solid #eaedf2;
	border-left: 15px solid transparent;
	z-index: 1;
}

.author-box figure.author-thumb{
	float: none;
	margin: 0 !important;
	text-align: center;
	width: 100% !important;
	background: url(https://tohokunooto.com/wp-content/uploads/2019/11/plo_juhyo.jpg) center no-repeat; /* カバー画像を指定 */
	background-size: cover;
	position: relative;
	height: 0;
	/* フル表示にしたい場合のpadding-topの値： 表示画像の高さ(px) ÷ 表示画像の幅(px) × 100(%) */
	padding-top: 40%;
	z-index: 0;
}

.author-box figure.author-thumb img{
	border: 3px solid #fff;
	box-shadow: 0 2px 5px 0 rgba(0,0,0,0.2);
	height: auto;
	width: 30%;
	max-width: 200px;
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	bottom: -4.5em;
}

.author-box .author-content{
	margin-left: 0 !important;
	margin-top: 5.5em !important;
}

.author-box .author-content .author-name{
	text-align: center;
	font-size: 1.3rem;
}

.author-box .author-content .author-name a{
	color: #14171a;
	text-decoration: none;
}
.author-box .author-content .author-name a:hover{
	color: #14171a;
	text-decoration: underline;
}

.author-box .author-content .author-description p{
	margin: .5em auto;
	line-height: 1.5 !important;
	max-width: 500px;
	font-size: 90%;
	text-align: left;
}

.author-box .author-content .author-description p a{ text-decoration: none; }
.author-box .author-content .author-description p a:hover{ text-decoration: underline; }
.author-box .author-content .author-follows .sns-buttons{ justify-content: center; }

.author-box .author-content .author-follows .sns-buttons a.follow-button{
	border-radius: 50%;
	border: none;
	width: 40px;
	height: 40px;
	color: #fff;
	margin-bottom: .5em;
	margin-right: .5em;
	box-shadow: 0 2px 5px 0 rgba(0,0,0,0.2);
}

.author-box .bc-brand-color.sns-follow .website-button{ background-color: #6eb6fd !important; }
.author-box .bc-brand-color.sns-follow .twitter-button{ background-color: #7dcdf7 !important; }
.author-box .bc-brand-color.sns-follow .facebook-button{ background-color: #7c9dec !important; }
.author-box .bc-brand-color.sns-follow .hatebu-button{ background-color: #2c6ebd !important; }
.author-box .bc-brand-color.sns-follow .google-plus-button{ background-color: #dd4b39 !important; }
.author-box .bc-brand-color.sns-follow .instagram-button{ background: linear-gradient(135deg, #427eff 0%, #f13f79 80%) no-repeat !important;}
.author-box .bc-brand-color.sns-follow .youtube-button{ background-color: #cd201f !important; }
.author-box .bc-brand-color.sns-follow .flickr-button{ background-color: #111 !important; }
.author-box .bc-brand-color.sns-follow .pinterest-button{ background-color: #bd081c !important; }
.author-box .bc-brand-color.sns-follow .line-button{ background-color: #00c300 !important; }
.author-box .bc-brand-color.sns-follow .amazon-button{ background-color: #ff9900 !important; }
.author-box .bc-brand-color.sns-follow .github-button{ background-color: #4078c0 !important; }
.author-box .bc-brand-color.sns-follow .feedly-button{ background-color: #2bb24c !important; }
.author-box .bc-brand-color.sns-follow .rss-button{ background-color: #f26522 !important; }

.author-box .author-content .author-follows .sns-buttons a.follow-button span{ line-height: 40px; }
.author-box .author-content .author-follows .sns-buttons a.follow-button span::before{ font-size: 20px !important; }

main .author-box{
	max-width: 400px;
	margin: 0 auto;
	font-size: 80%;
}


/* 見出し２ */
.article h2{
color: #333333;
padding: 0.5em;
width:100%;
line-height: 2;
background: #bed2c3;
vertical-align: middle;
border-radius: 30px 0px;
}
.article h2:before {
content: '●';
color: #333333;
margin-right: 8px;
}

/*マウスオーバー時にリンクを凹ませる*/
a:hover{ position:relative;top:3px ;left:3px; }



/*マウスオーバー時にリンクを半透明に光らせる*/
a:hover img{
opacity:0.5;
filter:alpha(opacity=50);
-ms-filter: “alpha( opacity=50 )”;
}


.sb-id-7 .speech-balloon {
  background-color: #d3d3d3; /* 吹き出しメイン部分の背景色 */
  border: 2px solid #333; /* 吹き出しメイン部分のボーダー */
  color: #333; /* セリフの文字色 */
}
.sb-id-7 .speech-balloon::before {
  border-right: 12px solid #333; /* 三角部分の外側（ボーダー）の太さ・形状・色 */
}
.sb-id-7 .speech-balloon::after {
  border-right: 12px solid #d3d3d3; /* 三角部分の内側（背景）の色 */
}
@media screen and (max-width: 480px){
  .sb-id-7 .speech-balloon::before { border-right: 7px solid #333; /* スマホでの三角部分の外側 */
  }
  .sb-id-7 .speech-balloon::after { border-right: 7px solid #d3d3d3; /* スマホでの三角部分の内側 */
  }
}

.sb-id-11 .speech-balloon {
  background-color: #ffe9a9; /* 吹き出しメイン部分の背景色 */
  border: 2px solid #333; /* 吹き出しメイン部分のボーダー */
  color: #333; /* セリフの文字色 */
}
.sb-id-11 .speech-balloon::before {
  border-right: 12px solid #333; /* 三角部分の外側（ボーダー）の太さ・形状・色 */
}
.sb-id-11 .speech-balloon::after {
  border-right: 12px solid #ffe9a9; /* 三角部分の内側（背景）の色 */
}
@media screen and (max-width: 480px){
  .sb-id-11 .speech-balloon::before { border-right: 7px solid #333; /* スマホでの三角部分の外側 */
  }
  .sb-id-11 .speech-balloon::after { border-right: 7px solid #ffe9a9; /* スマホでの三角部分の内側 */
  }
}


.sb-id-12 .speech-balloon {
  background-color: #fdeff5; /* 吹き出しメイン部分の背景色 */
  border: 2px solid #c85554; /* 吹き出しメイン部分のボーダー */
  color: #333; /* セリフの文字色 */
}
.sb-id-12 .speech-balloon::before {
  border-right: 12px solid #c85554; /* 三角部分の外側（ボーダー）の太さ・形状・色 */
}
.sb-id-12 .speech-balloon::after {
  border-right: 12px solid #fdeff5; /* 三角部分の内側（背景）の色 */
}
@media screen and (max-width: 480px){
  .sb-id-12 .speech-balloon::before { border-right: 7px solid #c85554; /* スマホでの三角部分の外側 */
  }
  .sb-id-12 .speech-balloon::after { border-right: 7px solid #fdeff5; /* スマホでの三角部分の内側 */
  }
}


.sb-id-13 .speech-balloon {
  background-color: #d6e9ca; /* 吹き出しメイン部分の背景色 */
  border: 2px solid #3b7960; /* 吹き出しメイン部分のボーダー */
  color: #333; /* セリフの文字色 */
}
.sb-id-13 .speech-balloon::before {
  border-right: 12px solid #3b7960; /* 三角部分の外側（ボーダー）の太さ・形状・色 */
}
.sb-id-13 .speech-balloon::after {
  border-right: 12px solid #d6e9ca; /* 三角部分の内側（背景）の色 */
}
@media screen and (max-width: 480px){
  .sb-id-13 .speech-balloon::before { border-right: 7px solid #3b7960; /* スマホでの三角部分の外側 */
  }
  .sb-id-13 .speech-balloon::after { border-right: 7px solid #d6e9ca; /* スマホでの三角部分の内側 */
  }
}


.sb-id-15 .speech-balloon {
  background-color: #bbdbf3; /* 吹き出しメイン部分の背景色 */
  border: 2px solid #4496d3; /* 吹き出しメイン部分のボーダー */
  color: #333; /* セリフの文字色 */
}
.sb-id-15 .speech-balloon::before {
  border-right: 12px solid #4496d3; /* 三角部分の外側（ボーダー）の太さ・形状・色 */
}
.sb-id-15 .speech-balloon::after {
  border-right: 12px solid #bbdbf3; /* 三角部分の内側（背景）の色 */
}
@media screen and (max-width: 480px){
  .sb-id-15 .speech-balloon::before { border-right: 7px solid #4496d3; /* スマホでの三角部分の外側 */
  }
  .sb-id-15 .speech-balloon::after { border-right: 7px solid #bbdbf3; /* スマホでの三角部分の内側 */
  }
}


.sb-id-16 .speech-balloon {
  background-color: #fad09e; /* 吹き出しメイン部分の背景色 */
  border: 2px solid #ee7800; /* 吹き出しメイン部分のボーダー */
  color: #333; /* セリフの文字色 */
}
.sb-id-16 .speech-balloon::before {
  border-right: 12px solid #ee7800; /* 三角部分の外側（ボーダー）の太さ・形状・色 */
}
.sb-id-16 .speech-balloon::after {
  border-right: 12px solid #fad09e; /* 三角部分の内側（背景）の色 */
}
@media screen and (max-width: 480px){
  .sb-id-16 .speech-balloon::before { border-right: 7px solid #ee7800; /* スマホでの三角部分の外側 */
  }
  .sb-id-16 .speech-balloon::after { border-right: 7px solid #fad09e; /* スマホでの三角部分の内側 */
  }
}


.cat-link { /* カテゴリー */
    color: #333;
    text-decoration: none;
    display: inline-block;
    margin-right: 5px;
    padding: 2px 8px;
    font-size: 12px;
    background-color: #bed2c3;
    border-top-right-radius: 10px; /* 右上の角だけ丸く */
    border-bottom-left-radius: 10px; /* 左下の角だけ丸く */
    word-break: break-all;
}
.cat-link:hover { /* マウスホバー時 */
    opacity: 1;
    background: #cee4ae;
    transition: all .5s ease; /* ふわっと変化するアニメーション */
    color: #7d7d7d;
}
.tag-link { /* タグ */
    color: #fff;
    text-decoration: none;
    display: inline-block;
    margin-right: 5px;
    padding: 2px 8px;
    font-size: 12px;
    background-color: #72c7e6;
    border: none;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    word-break: break-all;
}
.tag-link:hover {
    background: #49add1;
    transition: all .5s ease;
    color: #fff;
}

.cat-label {
    top: 0.5em; /*上からの距離*/
    left: 0.5em; /*左からの距離*/
    border: none; /*ボーダーを消す*/
    font-size: 12px; /*文字サイズ*/
    color: #fff; /*文字色*/
    background-color: #00a3af; /*背景色*/
    padding: 1px 10px; /*余白*/
    border-radius: 14px; /*角を丸く*/
}

.list-6{
   counter-reset:number;
   list-style-type: none;
   padding:0;
   margin:0;
}
.list-6 li { 
   border-bottom:2px dashed;
   border-color:#cdcdcd; /* 線の色 */
   position: relative;
   margin:0.5em 0 !important;
   max-width:500px; /* 横幅 */
   padding: 0 0 0.5em 1.8em;
}
.list-6 li:last-child { 
   border:none;
}
.list-6 li:before {
   counter-increment: number;
   content: counter(number);
   background-color: #69b076; /* 文字背景色 */
   color: #fff; /* 文字色 */
   position: absolute;
   font-weight:bold;
   font-size: 14px;
   border-radius: 50%;
   left: 0;
   top:0.5em;
   width: 22px;
   height: 22px;
   line-height: 22px;
   text-align: center;
}

.box6-green {
	position:relative;/* 配置に関するもの(ここを基準に) */
	padding: 2em 2em 1.7em;	/* ボックスの内側余白(上:2em　左右:2em 下：1.7em) */
	margin: 2.5em auto;/*ボックス外側余白*/ 
	background-color: #eef8f3; /*ボックス背景色*/ 
	box-shadow: 0px 1px 5px rgba(0,0,0,0.1);/*ボックス影*/ 
	border-radius:4px;/* ボックス角丸 */
	max-width:600px;/*ボックス横幅*/ 
}
.box6-green .box-title {
	position: absolute;/* 配置に関するもの(ここを動かす) */
	top: -22px;/* 上から（-22px）移動*/
	left: 30px;/* 左から（30px）移動*/
	padding: 0.2em 2em;/* テープ内側余白*/
	color: #58be89; /* テープ文字色 */
	font-weight: bold;/* テープ文字太さ*/
	font-size:18px;/* テープ文字大きさ*/
	background-color: rgba(255,255,255,.1);/* テープ背景色と透過*/
	border-left: 2px dotted rgba(0,0,0,.1);/* テープのギザギザ左*/
	border-right: 2px dotted rgba(0,0,0,.1);/* テープのギザギザ→*/
	box-shadow: 0 0 5px rgba(0,0,0,0.2); /* テープ影*/
	transform: rotate(-3deg);/* テープの傾き*/
}
.box6-green p{
	margin: 0; /* 文字の外側余白リセット*/
	padding: 0; /* 文字の内側余白リセット*/
}


/** 投稿者名非表示 **/
.author-info {
display: none;
}

.go-to-top {
    right: 20px;
    bottom: 55px;
 }

.go-to-top-button {
	width: 80px; /* 横幅指定 */
	height: auto; /* 画像の高さpx指定でもOK！ */
}

/************************************
** 比較表
************************************/
/* 比較表全体 */
.compare-box {
  display:-webkit-box;/* 配置 */
  display:-ms-flexbox;/* 配置 */
  display:flex;/* 配置 */
  max-width:600px;/* 横幅 */
  margin: 0 auto 2rem;/* 余白 */
  border-radius:4px;/* 角丸 */
  box-shadow: 0 1px 3px rgba(0, 0, 0, .2); /* 影 */
  background: #fef9ed; /* 背景色 */
}
/* 左のボックス、右のボックス */
.compare-box .compare-left-wrap, .compare-box .compare-right-wrap{
  width:50%;/* 横幅半分ずつ */
  overflow:hidden;/* はみ出さないように*/
}
/* 左のタイトル、右のタイトル */
.compare-box .compare-left-head, .compare-box .compare-right-head{
  background: #fdc44f; /* 背景色 */
  text-align: center;/* 中央寄せ */
  color: #FFF; /* 文字色 */
  font-weight: bold;/* 文字太さ */
  padding:0em 1em;/* 余白 */
  font-size:15px;/* 文字大きさ */
  line-height:1.5;/* 行間 */
  height:65px;/* 縦幅 */
  display:table-cell;/* 形式 */
  vertical-align:middle;/* 高さ中央寄せ */
  width:1000px;/* 横幅 */
}
/* 左のタイトル */
.compare-box .compare-left-head{
  border-radius:4px 0 0 0;/* 角丸 */
}
/* 右のタイトル */
.compare-box .compare-right-head{
  border-radius:0 4px 0 0;/* 角丸 */
}
/* 左のコンテンツ、右のコンテンツ */
.compare-box .compare-left, .compare-box .compare-right{
  padding:1.5em;/* 余白 */
  font-size:15px;/* 文字大きさ */
  line-height:2;/* 行間 */
  text-align: justify;/* 段落両端 */
  text-justify: inter-ideograph;/* 段落両端 */
}
/* 文章 */
.compare-box p {
  padding: 0;/* 余白 */
  margin: 0 0 20px 0;/* 余白 */
}
/*スマホで見たとき*/
@media screen and (max-width: 480px){
  /* 左のタイトル、右のタイトル */
  .compare-box .compare-left-head, .compare-box .compare-right-head{
    font-size:12px;/* 文字大きさ */
    height:50px;/* 高さ */
  }
  /* 左のコンテンツ、右のコンテンツ */
  .compare-box .compare-left, .compare-box .compare-right {
      padding: 1.2em;/* 余白 */
      font-size: 12px;/* 文字大きさ */
   }
}
/************************************
** 比較表 箇条書き(記号)
************************************/
/* 箇条書き(記号) */
.compare-box .list{
   list-style: none !important;/* 行頭記号リセット */
   padding:0 !important;/* 余白リセット */
   margin:0 !important;/* 余白リセット */
   border:none !important;/* 線リセット */
}
/* 箇条書き 行 */
.compare-box .list li { 
   border-bottom:1px dashed #cdcdcd;/* 線(太さ 種類　色) */
   position: relative;/* 配置 */
   margin:0.5em 0 !important;/* 余白 */
   max-width:500px;/* 横幅 */
   padding: 0 0 0.7em 1.4em !important;/* 余白 */
   line-height:1.8;/* 行間 */
}
/* 箇条書き 行最後 */
.compare-box .list li:last-child{ 
   border:none;
}
/* 箇条書き 行頭記号 */
.compare-box .list li:before {
   background-color:  #ffa952; /* 色 */
   position: absolute;/* 配置 */
   content: '';/* 空文字 */
   top: 10px;/* 上からの距離 */
   left: 7px;/* 下からの距離 */
   width: 7px;/* 横幅 */
   height: 7px;/* 縦幅 */
   border-radius: 4px;/* 角丸 */
}
/*スマホで見たとき*/
@media screen and (max-width: 480px){
  /* 箇条書き 行頭記号 */
  .compare-box .list li:before {
    top: 9px;/* 上からの距離 */
    left: 3px;/* 下からの距離 */
    width:5px;/* 横幅 */
    height:5px;/* 縦幅 */
  }
}
/************************************
** 比較表　箇条書き(番号)
************************************/
/* 箇条書き(番号) */
.compare-box .list-number{
   counter-reset:number; /* 番号リセット */
   list-style: none !important;/* 行頭番号削除) */
   padding:0 !important;/* 余白リセット */
   margin:0 !important;/* 余白リセット */
   border:none !important;/* 線リセット */
}
/* 箇条書き(番号) 行 */
.compare-box .list-number li {
   position: relative;/* 配置 */
   margin:0.5em 0 !important;/* 余白 */
   max-width:500px; /* 横幅 */
   padding: 0 0 0.5em 1.8em !important;/* 余白 */
   line-height:1.8;/* 行間 */
  border-bottom:1px dashed #cdcdcd;/* 線(太さ 種類　色) */
}
/* 箇条書き 行最後 */
.compare-box .list-number li:last-child{ 
   border:none;
}
/* 箇条書き(番号) 行頭番号 */
.compare-box .list-number li:before {
   counter-increment: number;/* 番号 */
   content: counter(number);/* 番号 */
   background-color: #fdc44f; /* 背景色 */
   color: #fff; /* 番号色 */
   position: absolute;/* 配置 */
   font-weight:bold;/* 文字太さ */
   font-size: 12px;/* 文字大きさ */
   border-radius: 50%;/* 角丸 */
   left: 0;/* 左からの距離 */
   top:5px;/* 上からの距離 */
   width: 18px;/* 横幅 */
   height: 18px;/* 縦幅 */
   line-height: 18px;/* 行間 */
   text-align:center;/* 中央寄せ */
}
/* 箇条書き 行頭記号リセット */
.compare-box .list-number li:after{
  content:'';
}
/*スマホで見た時*/
@media screen and (max-width: 480px){
  /* 箇条書き(番号) 行 */
  .compare-box .list-number li{
     padding: 0 0 0.5em 1.8em !important;/* 余白 */
  }
  /* 箇条書き(番号) 行頭番号 */
  .compare-box .list-number li:before {
    font-size:10px;/* 文字大きさ */
    width: 16px;/* 横幅 */
    height: 16px;/* 縦幅 */
    line-height: 16px;/* 行間 */
    top:2px;/* 上からの距離 */
  }
}

/************************************
** 比較表セパレート
************************************/
/* 全体左 */
.compare-box-separate .compare-left{
background:#f0f9fc !important;
height:100%;
}
/* 全体右 */
.compare-box-separate .compare-right{
background:#fff6f2 !important;
height:100%;
}
/* タイトル左 */
.compare-box-separate .compare-left-head{
background:#6fc7e1 !important;
}
/* タイトル右 */
.compare-box-separate .compare-right-head{
background:#ffa883 !important;
}
/* 箇条書き(記号) 行頭番号 左 */
.compare-box-separate .compare-left .list li:before {
background:#6fc7e1 !important;
}
/* 箇条書き(番号) 行頭番号 左 */
.compare-box-separate .list-number li:before {
background:#6fc7e1 !important;
}
/* 箇条書き(記号) 行頭番号 右 */
.compare-box-separate .compare-right .list li:before {
background:#ffa883 !important;
}
/* 箇条書き(番号) 行頭番号 右 */
.compare-box-separate .compare-right .list-number li:before {
background:#ffa883 !important;
}


.pagination-next-link {
  background-color: #a8bf93;
  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: #badcad;
  transition: all 0.5s ease;
  color: #fff;
}
.page-numbers {
  color: #a8bf93;
  border: 1px solid #a8bf93;
  border-radius: 50%;
  box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); /*数字部分の影*/
}
.pagination .current {
  background-color: #a8bf93;
  color: #fff;
}
.page-numbers.dots {
  opacity: 1;
  background: none;
}
.pagination a:hover {
  background-color: #badcad;
  color: #fff;
}
a.prev, a.next {
  display: none;
}
@media screen and (max-width: 480px) {
.page-numbers {
  width: 48px;
  height: 48px;
  line-height: 48px;
}
}


.bct-related .blogcard::before{/*関連記事*/
	background-color:#00008b;
}
.bct-reference .blogcard::before{/*参考記事*/
	background-color:#ff8c00;
}
.bct-popular .blogcard::before{/*人気記事*/
	background-color:#dc143c;
}
.bct-together .blogcard::before{/*あわせて読みたい*/
	background-color:#165e83;
}
.bct-detail .blogcard::before{/*詳細はこちら*/
	background-color:#c71585;
}
.bct-check .blogcard::before{/*チェック*/
	background-color:#d2691e;
}
.bct-pickup .blogcard::before{/*ピックアップ*/
	background-color:#8b008b;
}
.bct-official .blogcard::before{/*公式サイト*/
	background-color:#ffd700;
}