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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/***********************************************************/
/*リード*/
.lead01 {
	padding:1em 0.8em;
	border: solid 1px #cccccc; /*線の色*/
	border-radius: 0.5em;/*角丸*/
}	
/*マーカー*/
.marker { /*黄色マーカー*/
 background-color: #fdebb8;
}
.marker-red { /*赤色マーカー*/
 background-color: #fadede;
}
.marker-blue { /*青色(→黄緑)マーカー*/
  background-color: #ecf6cb;
}
.marker-under { /*黄色アンダーラインマーカー*/
 background: linear-gradient(transparent 80%, #f7bd15 80%);
}
.marker-under-red { /*赤色アンダーラインマーカー*/
 background: linear-gradient(transparent 80%, #ed9191 80%);
}
.marker-under-blue { /*青色(→黄緑)アンダーラインマーカー*/
 background: linear-gradient(transparent 80%, #bbe274 80%);
}
.red{
	color:#ee394a;
}
.bold-red {
}
.blue{
	color: #00a5f2;
}
.orange{
	color: #ea7711;
}
.yellow{
	color: #f7bd15;
}
/*********フォントカラー*********/
.f-color-000{
	color: #000 !important;
}
.f-color-c33{/*画像にメインで説明の枠　朱赤*/
	color: #c33 !important;
}
.f-color-36f{/*画像にサブで説明の枠　青色*/
	color: #36f !important;
}
.f-color-57c2d8{/*ing水色*/
	color: #57c2d8 !important;
}
.f-color-ff007d{/*DMMピンク*/
	color: #ff007d !important;
}

.f-color-333{/*濃いグレイ*/
	color: #333 !important;
}
.f-color-999{/*中濃いグレイ*/
	color: #999 !important;
}
.f-color-ccc{/*薄いグレイ*/
	color: #ccc !important;
}
.f-color-ddd{/*さらに薄いグレイ*/
	color: #ddd !important;
}
/*********フォントサイズ*********/
.fa-1x{
	font-size: 1em;
}
.fa-1dot1x{
	font-size: 1.1em;
}
.fa-1dot15x{
	font-size: 1.15em;
}
.fa-1dot2x{
	font-size: 1.2em;
}
/*********背景カラー*********/
.bg-fff{
	background-color: #fff !important;
}

/************************************
** H2~H5
************************************/
.article h2, .article h3, .article h4, .article h5, .article h6{
padding: 0;
margin: 1em 0;
font-size: medium;
border-collapse: separate;
border-spacing: 0;
border-top: none;
border-right: none;
border-bottom: none;
border-left: none;
line-height: none;
position:relative;
}

.article h2:before {
background-image: none;
}

.article h2{
position: relative;
overflow: hidden;
padding: 0.4em 0.2em 0.5em 0.5em;
margin-top:70px;
line-height:1.4;
font-size:24px;
color:#fff;
background-color:#54a6cb;/*57c2d8*/
border-radius:6px;
box-shadow: 0px 2px 10px 0 rgba(0,0,0,.2);
}
.article h2::before,
.article h2::after{
content: "";
position: absolute;
bottom: 0;
}
.article h2:before{
border-bottom: 5px solid #a3dee7;
width: 100%;
}
.article h2:after{
border-bottom: 5px solid #cccccc;
width: 100%;
}


/*480px以下*/
@media screen and (max-width: 480px){
.article h2{
padding: 0.6em 0.1em 1em 0.4em !important;

}
}




.article h3{
position: relative;
overflow: hidden;
padding: 0.4em 0.3em 0.5em 1.2em;
margin-top:2.1em !important;;/*1.1em*/
margin-bottom:1em !important;
line-height:1.4;
font-size:20px;
background-color:#d2eff3;
color:#004d82;
border-radius:6px;
box-shadow: 0px 2px 5px 0 rgba(0,0,0,.2);
}
.article h3::before,
.article h3::after{
content: "";
position: absolute;
bottom: 0;
}
.article h3:before{
border-bottom: 4px solid #a3dee7;
width: 100%;
}
.article h3:after{
border-bottom: 4px solid #cccccc;
width: 100%;
}



.article h4{
background-color:#fff;/*ebf8fa*/
line-height:1.4;
font-size: 20px;
font-weight:normal;
color:#004d82;
border-radius:4px;
padding: 0.7em 0.3em 0.7em 1.6em;
margin-top:50px;/*20px*/
margin-bottom: 20px;
box-shadow: 0px 2px 5px 0 rgba(0,0,0,.3);
border-left:8px solid #54a6cb;/*84d3df*/
}

.article h5{
background-color:#fff;
line-height:1.4;
font-size: 20px;
font-weight:normal;
color:#004d82;
border-radius:4px;
padding: 0.6em 0.3em 0.6em 2em;
margin-top:20px;
margin-bottom: 20px;
box-shadow: 0px 2px 5px 0 rgba(0,0,0,.2);
border-left:6px solid #ddd;
}

@media (max-width:480px){/*スマホ表示*/
.article h2{
font-size:18px;
padding:1.5em 0.3em 1.5em 0.5em;
}
.article h3{
font-weight:bold;
margin-top:3em;
margin-bottom:0em;
font-size:17px!important;
}
.article h4, .article h5, .article h6{
font-size:18px!important;
}
}

/***Cocoonのcat-label（カテゴリラベル）の位置と文字のカスタマイズ****/
.cat-label {
	top: 4%;
	left: 2.5%;
	line-height: 1.8;
	font-size: 0.67em;
	font-weight: 500;
	letter-spacing: 1px;
	opacity:0.9; 
}
.entry-categories,
.entry-card .cat-label,
.related-entry-card .cat-label{
	letter-spacing: 1px;
}



/**** 目次全体デザイン ********************************************************/
.toc-widget-box ol{/*色付きベース*/
padding:3px 0;
}
.toc-list > li, .toc-list > li li{/*デフォルトを消す*/
    list-style: none!important;
    margin: 0; 
    padding: 0;    
}
.toc-title{
color:#48bbda; 
background:#fff; 
}
.toc-title::before {
font-family: "Font Awesome 5 Free";
content : "\f4ba";/**/
font-weight: 900;
margin-right: 7px;
color: #48bbda;
}
.toc-list > li a {/*小見出し（H2）*/
/*font-weight: bold;*/
color: #7b7b7b;
display:block;
margin-top:5px;
margin-left: 0px;
border-bottom: 1px dotted silver;/*H2,H3両方につく*/
}
.toc-list > li a::before {/*小見出し（H2）の先頭につけるアイコン*/
font-family: "Font Awesome 5 Free";
content : "\f138";
font-weight: 900;
margin-right: 7px;
color: #48bbda;
}
.toc-list > li li a {/*小見出し（H3）*/
font-weight: normal;
font-size: 95%;
color: #7b7b7b;
margin-top:2px;
margin-left: 0.7em;
}
.toc-list > li li a::before {/*小見出し（H3）の先頭につける「・」*/
content: "";
width: 6px;
height: 6px;
left: -2px;
display: inline-block;
border-radius: 50%;
background: #ccc;/*ここで先頭の点の色を変更できます*/
position: relative;
margin-bottom: 2px;
}
@media (max-width:880px){/*モバイル表示*/
.toc-list > li a {
margin-left: -10px;
}
.toc-list > li li a {
margin-left: -1em;/*モバイルH3左マージン*/
}
.toc-list > li li a::before {
left: 3px;
margin-bottom:1px;
}
}
.toc{/*枠*/
background:#f5fcfd; 
box-shadow: 0px 2px 5px 0 rgba(0,0,0,.15);
padding:10px 15px;
}
/**** .目次全体デザイン ********************************************************/

/**** サイドバー目次追従+カレントカラー ********************************************************/
/* -----------------------------------------
 目次上に読んでる項目をマーク
------------------------------------------*/
#toc-2{
  width:100%;
}
/* 読んでる項目を明示 */
li.current {
  position: relative;
  padding-left: 1.5em;    /*アイコン分のスペース*/
  line-height: 1.4;
  background-color: #fff !important;/*fff7e4*/
	border:1px solid #FFC55F;
}
li.current::before {
font-family: "Font Awesome 5 Free";
content : "\f0a4";
font-weight:900;
  position: absolute;    /*絶対位置*/
  font-size: 1.4em;        /*サイズ*/
  left: 0;               /*アイコンの位置*/
  top: -2px;                /*アイコンの位置*/;
  color: #0093ba; /*アイコン色*/
}
/* 読んでる親項目を明示 */
a.current {
    background-color: #fff7e4 !important;/*fff0cb*/
}

/**** .サイドバー目次追従+カレントカラー ********************************************************/



/**** サイドバーのカテゴリーデザイン ****************************************************/
.search-submit:hover::before{/* 検索エンジン */
color:#90C31F;/*検索ボタンホバー時の色*/
}
.widget_search{
padding-bottom:1em;
}
.sidebar h3{/*サイドバーのタイトル表記と緑の点線*/
/*color:#7b7b7b;
border-radius: 0%;
border-bottom:3px dotted;
border-color:#90C31F;*/
padding:0.1em 0.1em 0.1em 0.3em;
margin-top:0.6em;
margin-bottom:0.1em;
font-size: 98%;
}
.widget_recent_entries ul li a, .widget_categories ul li a, .widget_archive ul li a, .widget_pages ul li a, .widget_meta ul li a, .widget_rss ul li a, .widget_nav_menu ul li a {/* widgetsの中身*/
background-color:#f7f7f7;
color:#999!important;
margin: 6px 0;
padding: 4px 10px;
border-left: 3px solid #ddd;
border-radius:4px;
transition: 0.4s
font-size: 80%;
line-height: 140%;
}
.widget_recent_entries ul li a:hover, .widget_categories ul li a:hover, .widget_archive ul li a:hover, .widget_pages ul li a:hover, .widget_meta ul li a:hover, .widget_rss ul li a:hover, .widget_nav_menu ul li a:hover{/* widgetsの中身　hover */
background-color:#65add6;
color:#fffff4!important;
border-left: 3px solid #ccc;
}
.tagcloud a{/*tag cloud*/
background-color:#f7f7f7;
color:#afafb0!important;
font-size: 80%;
line-height: 140%;
}
.tagcloud a:hover{
background-color:#90C31F;
color:#fffff4!important;
transition: 0.4s ;
}



/*profile*/
.author-widget-name{
font-size:80%;
}
.author-widget-name::after{/*milife only
font-size:160%;
font-family: "Font Awesome 5 Free";
content : "\f118";smile*/
}
.author-name a{
	display:none;
height:5px;
font-size:70%;
}
.author-description p{
margin-top:-20px;
font-size:80%;
}
.author-thumb img{/*milife only*/
	/*display:none;
width:10px;
height:10px;*/
}
/**** .サイドバーのカテゴリーデザイン ********************************************************/












/**** テーブルデザイン ********************************************************/

/******シンプルなテーブル*********************************************************/
.table01 {
border-collapse: collapse;

/*border: 1px solid #ccc !important;　デフォルトのブルーを使わない時用*/
line-height: 1.3;
font-size:1.1em;/*94%;*/
}
.table01 th {
padding: 10px;
font-weight: bold;
vertical-align: top;
background: #007b84;
color: #ffffff;

/*border: 1px solid #ccc !important;*/
}
.table01 td {
line-height: 1.4;
padding: 8px 5px 8px 8px;
vertical-align: top;
/*border: 1px solid #ccc !important;*/

background-color: #f1f7f9;/*薄いブルーグレイ　テーブル背景*/
}







/*figure .wp-block-table table {
	
}*/
/*悪い表記の時
figure.tbl-bad table td {
border: 1px solid #c9d2d2;
background: #f1f5f5;
color: #5e8185;
}*/
/*良い表記の時
figure.tbl-good table td {
border: 1px solid #fcaaa1;
background: #fcefed;
color: #ef503f;
}*/

/******メニューサンプルのためのテーブル*********************************************************/
.table02 {
border-collapse: collapse;
border: 1px solid #ccc;
line-height: 1.2;
font-size:94%;
/*border: 1px solid #58c2d9;セルリアンブルー*/
}
.table02 th {
padding: 10px;
font-weight: bold;
vertical-align: top;
background: #007b84;
color: #ffffff;

border: 1px solid #ccc;
}
.table02 td {
padding: 10px;
vertical-align: top;
border: 1px solid #ccc;
vertical-align: top;
}

.table02 tr.bg-green01, .table02 td.bg-green01 {
background: #a2dc96;/*グリーン01*/
}
.table02 tr.bg-green02, .table02 td.bg-green02 {
background: #dff5a9;/*グリーン02 少し黄緑*/
}
.table02 tr.bg-green03, .table02 td.bg-green03 {
background: #fafdda;/*グリーン03 さらに少し黄緑*/
}

.table02 tr.bg-egg01, .table02 td.bg-egg01 {
background: #ffeec1;/*たまごの黄身色01*/
}
.table02 tr.bg-orange01, .table02 td.bg-orange01 {
background: #FFC882;/*オレンジ01*/
}

/*.table02 tr:nth-child(odd) {
background: #efe0ff;
}*/
td.al-c {
text-align: center;
}
td.nowrap {
white-space: nowrap;
}







/**** .テーブルデザイン ********************************************************/

/*× 悪い表記の時*/
.bad01 {
border: 1px solid #c9d2d2;
background: #f1f5f5;
background-image: url(https://cho-lab.speciale.jp/wp-content/uploads/2021/09/bad01.gif);
background-position: left top;
background-repeat: no-repeat;
color: #375255;
padding:10px;
}
/*◯ 良い表記の時*/
.good01 {
border: 1px solid #fcaaa1;
background: #fcefed;
background-image: url(https://cho-lab.speciale.jp/wp-content/uploads/2021/09/good01.gif);
background-position: left top;
background-repeat: no-repeat;
color: #ef503f;
padding:10px;
}





/**** 固定ページで「更新日」を表示させたくないとき ********************************************************/
/*.page .date-tags {
    display: none;
}*/
/**** .固定ページで「更新日」を表示させたくないとき ********************************************************/



/**** processデザイン ********************************************************/
.flow {
  padding-left: 60px;
  padding-bottom: 10px;
  position: relative;
  border: 1px solid #ccc;
  box-sizing: border-box;
}

.flow > ul {
  padding: 0;
}

.flow > li {
  list-style-type: none;
	clear:both;/*画像テキスト回り込みリセット用*/
}
.flow > li {
  position: relative;
  border-left: 3px solid #ccc;
  margin-bottom: 40px;
}/*liに対しての縦ライン*/
.flow > li:not(:last-child) {
  margin-bottom: 45px;
}
.flow > li .process-num {
	width: 50px;
  font-size: 18px;
  font-weight: normal;
  color: #fff;
  background:#57c2d8;
/*  background: rgb(107,144,219);
  background: -moz-linear-gradient(left, rgba(107,144,219,1) 0%, rgba(102,213,233,1) 100%);
  background: -webkit-linear-gradient(left, rgba(107,144,219,1) 0%,rgba(102,213,233,1) 100%);
  background: linear-gradient(to right, rgba(107,144,219,1) 0%,rgba(102,213,233,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6b90db', endColorstr='#66d5e9',GradientType=1 );*/
  padding: 16px 6px 2px;
  display: block;
  position: absolute;
  text-align:right;
  top: 0;
  left: -65px;
  z-index: 100;
}

/*480px以下*/
@media screen and (max-width: 480px){
.flow > li .process-num {
	width: 50px;
  left: -58px;
}
}

.flow > li .process-num::before {
  font-size: 11px;
  color: #fff;
  content: "process";
  letter-spacing:1px;
  padding: 4px 3px;
  display: block;
  position: absolute;
  top: 1px;
  left: 0;
  z-index: 100;
}
.flow > li .process-num::after {
  content: "";
  border-style: solid;
  border-width: 5px 0 5px 6px;
  border-color: transparent transparent transparent #f00;
  position: absolute;
  top: 23%;
  left: 100%;
 -webkit-transform: translateY(-23%);
  transform: translateY(-23%);
}
.flow > li dl {
  padding: 0 6px 0 8px;
  position: relative;
}
.flow > li dl::before,
.flow > li dl::after {
  content: "";
  display: block;
  position: absolute;
  top: 23px;
}
.flow > li dl::before {
  width: 9px;
  height: 9px;
  margin-top: 0px;
  background: #ddd;
  border-radius: 50%;
  left: -6px;
  top:10px;
}
/*縦ライン*/
.flow > li dl::after {
  width: 3px;
border-left:3px solid #ccc;
  position: absolute;
left: -3px;
bottom: -36px;
}
.flow > li dl dt {
  font-size: 18px;
  font-weight: 600;
  line-height:1.3em;
  color: #0ba4ce;/*水色*/
  margin-bottom: 1vh;
  border-bottom:1px solid #ccc;
}
.flow > li dl dd {
  margin-left: 0.5em;
  font-size: 15px;
  font-weight: normal;
  line-height:1.3em;
  color: #666;
	padding: 6px 2px 20px 10px;
	display: table;
	height: inherit;
}
.flow > li dl dd strong {
  color:#005da8;
  font-weight: bold;
}

/**** .processデザイン ********************************************************/



/**** 共通 ********************************************************/
/**画像にテキストを回り込ませる時、テキスト側div 1要素目**/
.float-l-59per{
	float:left;
	width: 59%;
	margin: 0 1px 0 0;
	/*background-color:#ccf;*/
}
/**画像にテキストを回り込ませる時、画像側div ２要素目**/
.float-r-40per{
  float:right;
	width:40%;/*テキスト幅の残りを指定*/
	max-width:40%;/*最大幅を指定 330px目安*/
	height:auto;
}
/**画像にテキストを回り込ませる時、画像側div ２要素目**/
.float-l-40per{
  float:left;
	width:40%;/*テキスト幅の残りを指定*/
	max-width:40%;/*最大幅を指定 330px目安*/
	height:auto;
}

/**imgタグで画像にテキストを回り込ませる時：画像の位置で指定、幅をw○○で指定すること**/
.img-float-l{
	float:left;
	margin: 0 8px 8px 0; 
	height:auto;
}
.img-float-r{
	float:right;
	margin: 0 0 8px 8px; 
	height:auto;
}
.float-l{
  float:left;
}
.float-r{
  float:right;
}



/**imgタグで画像にテキストを回り込ませる時の幅、さほど大きい画像の必要がない場合**/
.w15per{
	width:15%; 
}
.w20per{
	width:20%; 
}
.w25per{
	width:25%; 
}
.w30per{
	width:30%; 
}
.w38per{
	width:38%; 
}
.w40per{
	width:40%; 
}
.w50per{
	width:50%; 
}
.w60per{
	width:60%; 
}
.w70per{
	width:70%; 
}
.w80per{
	width:80%; 
}
.w90per{
	width:90%; 
}
.w100per{
	width:100%; 
}

.w180{
	width:180px; 
}
.w300{
	width:300px; 
}

/**********手順などを画像とテキストの2カラムで表す時　　　　　　　　　　　　左に画像、右に説明**************/
.exp-box{
	width:100%;
	margin:50px 0 30px 0;
	padding:5px 0 10px 0; 
	border-top: 5px solid #b0d7e4;/*青type6*/
	border-left: 3px solid #b0d7e4;/*青type6*/
	/*border-bottom: 1px dotted #b0d7e4;/ *青type6* /*/
}
.exp-num{/*1-1表記の時*/
	font-size: 0.9em;
	color: #fff;
	width:80px;
	text-align:center;
	margin:-24px 0 5px -6px;
	padding:1px; 
	border: 1px solid #61a3c0;/*青type4*/
	border-radius: 10px;
	background-color:#61a3c0;/*青type4*/
}
.exp-num-long{/*長いテキストを入れる時　23(pc)25(sp)文字くらい*/
	font-size: 0.9em;
	color: #fff;
	width:360px;
	text-align:center;
	margin:-24px 0 5px -6px;
	padding:1px; 
	border: 1px solid #61a3c0;/*青type4*/
	border-radius: 10px;
	background-color:#61a3c0;/*青type4*/
}
.exp-pic-area{
	width:50%;
	float:left;
	padding-left:3px;
}
.exp-pic-area img{
	width:100%;
	max-width:400px;
	border: 5px solid #eee;
	border-top: 6px solid #eee;
	border-radius: 20px;
}

.exp-txt-area{
	width:50%;
	padding-left:15px;
	float:left;
}
.exp-txtonly-area{
	width:95%;
	padding-left:15px;
	float:left;
}


@media screen and (max-width: 480px){/*****スマホサイズの時は画像を大きめに　左右比率とpaddingを変える******/
.exp-pic-area{
	width:60%;
}
.exp-txt-area{
	width:40%;
	padding-left:5px;
}
}

.exp-txt-area .exp-txt00{
	font-size:0.9em;
	line-height:1.2;
	color:#666;
	margin:5px 0 15px;
	padding:5px 0;
	border-bottom:1px solid #ccc;
}
.exp-txt-area .exp-txt01{
	font-size:1em;
	line-height:1.1;
	color:#1c5f90;/*青type2*/
	margin:5px 0 10px;
}
.exp-txt-area .exp-txt02, .exp-txtonly-area .exp-txt02{
	font-size:0.85em;
	line-height:1.1;
	color:#0099ff;/*青type101*/
	margin:0 0 10px 30px;
}

/******画像に対して該当箇所が下部の時はpcだと見にくくなるので少し下げる、spはテキストのボリュームが多いため上から*********/
.pc-pad_t_01{
	padding-top: 100px;
}
.pc-pad_t_02{
	padding-top: 200px;
}
.pc-pad_t_03{/*画像の下部に説明が必要な時*/
	padding-top: 400px;
}
@media only screen and (max-width:650px) {
	.pc-pad_t_01{
		padding-top: 0;
	/*padding-top: initial;要素のスタイルをブラウザで設定している初期値の戻す*/
	}
	.pc-pad_t_02{
		padding-top: 50px;
	}
	.pc-pad_t_03{
		padding-top: 100px;
	}
}



/*****●に数字******/
  /*数字のデザイン変える*/
.cir-num-c33{
  display:inline-block;
    background-color:  #cc3333;/*朱赤*/
    border-radius: 20%; 
	  color: white;
  font-family: 'Avenir','Arial Black','Arial',sans-serif;
  font-weight:bold;
  font-size: 0.9em;
	line-height:1.5;
}
/*サブで説明の枠を青で指示したい時*/
.cir-num-36f{/*青色*/
  display:inline-block;
    background-color:  #3366ff;
    border-radius: 20%; 
	  color: white;
  font-family: 'Avenir','Arial Black','Arial',sans-serif;
  font-weight:bold;
  font-size: 0.9em;
	line-height:1.5;
}


/**********右のpaddingがあるのでスマホ縦17px、横15px、ipad縦は29px、pcは30px減らしたサイズが表示エリア**************/
.w343{
	width:343px; /*スマホ縦の最大343px(max360px-17px)*/
}
.w635{
	width:635px; /*スマホ横の最大(max650px-15px)*/
}
.w631{
	width:631px; /*ipad縦で右にサイドバーが表示される時の最大(max660px-29px)*/
}
.w800{/*pc、ipad横で右サイドバーが表示されるときの最大(max830px-30px)*/
	width:800px; 
}
.w926{/*pcでサイドバーなしで表示された時の最大、少しはみ出す(max956px-30px)*/
	width:926px; 
}


.border-b01{
	border-bottom: 1px solid #ccc;
}
.mgn_t_1em{
	margin-top: 1em;
}
.mgn_t_3em{
	margin-top: 3em;
}
.mgn_t_4em{
	margin-top: 4em;
}
.mgn_t_5em{
	margin-top: 5em;
}
.mgn_t_6em{
	margin-top: 6em;
}
.mgn_t_m1em{
	margin-top: -1em;
}
.mgn_t_m15em{
	margin-top: -1.5em;
}
.mgn_t_m2em{
	margin-top: -2em !important;
}
.mgn_b_1em{
	margin-bottom: 1em;
}
.mgn_l_30{
	margin-left: 30px;
}
.mgn_l_40{
	margin-left: 40px;
}
.mgn_l_50{
	margin-left: 50px;
}
.al-r{
	text-align: right;
}
.al-c{
	text-align: center;
}
.al-l{
	text-align: left;
}

.al-c-img{
	margin: 0 auto;
}
.val-m{
	vertical-align:middle;
}
.val-b{
	vertical-align:bottom;
}
.pad_t_1em{
	padding-top: 1em;
}

.pad_t_5em{
	padding-top: 5em;
}
.pad_t_10em{
	padding-top: 10em;
}
.pad_t_20em{
	padding-top: 20em;
}
.pad_t_30em{
	padding-top: 30em;
}
.pad_t_40em{
	padding-top: 40em;
}
.pad_t_50em{
	padding-top: 50em;
}

.pad_b_2em{
	padding-bottom: 2em;
}
.pad_b_5em{
	padding-bottom: 5em;
}


.bg-white{
background-color:#fff !important;
}
.bg-ccc{
background-color:#ccc !important;
}
.bg-ddd{
background-color:#ddd !important;
}
.bg-eee{
background-color:#eee !important;
}

h3.wp-block-heading span{
display: block !important; 
	}

/**商品リンク下に補足説明したい場合**/
.sup_info01{
	border-left: 5px solid #ccc;
	margin: -1em 0 0 40px;
	padding: 0 0 0 10px;
	font-size:90%;
	line-height:1.4em;
}


/*pタグ、divタグで下線にdotラインを付ける。入れ子にしたい時はdiv*/
p.line-dot, div.line-dot{
	border-bottom: 1px dotted #ccc;
	margin:1em 0 -0.2em;
	padding: 0;
}
/*主にpタグ：見出しにあたる文summary*/
.sum01{
background-color:#fff;
line-height:1.3;
font-size: 22px;
font-weight:normal;
color: #0ba4ce;/*水色*/
padding: 0.2em 0.1em;
margin-top:20px;
margin-bottom: 1em;
border-bottom:1px dashed #999;
}
/*pタグのすぐ下に来る場合：詳細details*/
.det01{
margin-left:2em;
margin-top:-1.5em;
line-height:1.5em;
}


.mgnL2em{
margin-left:2em;
margin-top:-1.5em;/*pタグのすぐ下に来る場合*/
line-height:1.5em;
}

.mgnL1em {
	margin-left: 1em;
}
.mgnL3em {
	margin-left: 3em;
}

/*簡易に目立たせ項目と字下げ*/
.ind5em{
	text-indent:-5em; 
	margin-left:5em;
}

.lh13 {
	line-height:1.3;
}	
.fz--16px{
font-size:16px;
}
.fz--18px{
font-size:18px;
}


.fz--90per{
font-size:0.9em;
}
.fz--85per{
font-size:0.85em;
}


/*関連リンクの下に　コメントしたい時　　　※○○については関連記事に詳細があります。*/
.bct-related .detail-txt{
font-size:0.85em;
	line-height:1.1;
	margin:-27px 0 10px 6em;
	padding:0;
	color:#333;
	text-indent:-1em;
}
/*
p{
line-height:1.5em !important;
}*/
	
	

/**floatが次の要素に影響しないように親要素に加えておく**/
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}
/**** .共通 ********************************************************/





/**** タイトル+囲み枠 01redトマト　デザイン ********************************************************/
.point-box01 {
position: relative;
	border:1px solid #ff6347; 
	border-radius:4px;
	margin: 1.2em 0 1em 1.2em;
	padding: 10px 5px 5px 10px;
}
.point-title01 {
  position: absolute;
  padding: 0 0.5em;
  left: 20px;
  top: -12px; 
  font-weight: bold;
  font-size:0.9em;
background-color:#fff;
color:#ff6347;
}
/**** .タイトル+囲み枠 01redトマト　デザイン ********************************************************/


/**** 数字付きリスト 01▼　デザイン ********************************************************/
.list_ol01 p {/*リストのタイトルとして*/
  font-size: 120%;
  margin-bottom: 0;
  font-weight: bold;
}
.list_ol01 ol {
  counter-reset:number; /*数字をリセット*/
  list-style-type: none!important; /*数字を一旦消す*/
  margin: 0 0 0.5em;
  padding:0.5em;
  border: solid 2px #57c2d8;
}
.list_ol01 ol li {
  position: relative;
  padding: 0.5em 0.1em 0 35px;
  line-height: 1.5em;
  /*border-bottom: 1px solid #ccc;*/
}
.list_ol01 ol li div {/*下線用*/
  border-bottom: 1px solid #ccc;
  padding-bottom: 0.5em;
}
.list_ol01 ol li:before{
  /* 以下数字をつける */
  position: absolute;
  counter-increment: number;
  content: counter(number);
  /*数字のデザイン変える*/
  display:inline-block;
  background: #57c2d8;
  color: white;
  font-family: 'Avenir','Arial Black','Arial',sans-serif;
  font-weight:bold;
  font-size: 15px;
  border-radius: 30%;/*角円にする*/
  left: 0;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  /*数字の枠Y位置*/
  top: 7px;
  -webkit-transform: translateY(1px);
  transform: translateY(1px);
}
.list_ol01 ol li:not(:last-child):after {/*吹き出しの ▼︎*/
  content: "";
  display: block;
  position: absolute;
  top: 34px;
  left: 7px;/*左からの位置*/
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: #ccc transparent transparent transparent;
  border-width: 13px 5px 0 5px;
  z-index: -5;
	}
/**** .数字付きリスト 01▼　デザイン ********************************************************/


/**** 数字付きリスト 02　▶︎デザイン ********************************************************/
.list_ol02 p {/*リストのタイトル*/
	margin-bottom: 2px;
}
.list_ol02 ol {
  counter-reset:number; /*数字をリセット*/
  list-style-type: none!important; /*数字を一旦消す*/
  padding:0.5em;
  border: solid 2px #57c2d8;
}
.list_ol02 ol li {
  position: relative;
  padding: 0.5em 0.5em 0.5em 35px;
  line-height: 1.5em;
  border-bottom: 1px solid #ccc;
}
.list_ol02 ol li:before{
  /* 以下数字をつける */
  position: absolute;
  counter-increment: number;
  content: counter(number);
  /*数字のデザイン変える*/
  display:inline-block;
  background: #57c2d8;
  color: white;
  font-family: 'Avenir','Arial Black','Arial',sans-serif;
  font-weight:bold;
  font-size: 15px;
  border-radius: 30%;/*楕円にする*/
  left: 0;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  /*以下 上下中央寄せのため*/
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.list_ol02 ol li:after {/*吹き出しの▶︎*/
  content: '';
  display: block;
  position: absolute;
  left: 20px;/*左からの位置*/
  height: 0;
  width: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 10px solid #f00;
  z-index: -5;
  /*以下 上下中央寄せのため*/
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

/**** .数字付きリスト 02▶︎　デザイン ********************************************************/




/********** レシピ関係 ******************************************************************************/

/********レシピの材料、作り方のとタイトルタブタイプ*********************/
p.howtomake-tit, p.ing-tit{
font-size: 20px;
line-height:1.1;
font-weight:normal;
margin: 0;
padding: 3px 10px;
width: 90%; /*80%; */
color: #fff; 
background-color: #57c2d8;
border-radius: 8px 8px 0 0;
}
p.ing-tit span,  p.howtomake-tit span{
font-size: 14px;
line-height:1.1;
font-weight:normal;
margin: 4px 0 2px 2px;
color: #fff; 
}

/********レシピの材料*********************/
.ingredients {
  padding: 12px　0;
}
.ingredients dl {
    background-color: #F7F7F7;
margin: 0;
    padding: 5px 15px;
    font-size: 100%; 
 border: 2px solid #57c2d8;
}

.ingredients dt {
    display: flex;
    justify-content: space-between;
    clear: both;
    width: 8em;
    float: left;
    padding-top: 10px;
	}

.ingredients dt::after {
      content: ":　"; 
}

/*詳細記述の下にライン*/
.ingredients dd {
    padding-top: 10px;
    padding-left: 100px; 
    margin-left: 0; 
	border-bottom: 1px dotted #ccc;
}
/*ddの下に詳細記述用*/
.detail01 {
	font-size:95%;
	line-height:1.2;
	text-indent:-0.8em;
	color:#09F;/*水色*/
    padding-top: 5px;
    padding-left: 80px; 
}
/* .list_ol01 ol li div こちらの中だとラインが付くので白ラインでかぶせる*/
.detail01-noline {
	font-size:95%;
	line-height:1.2;
	text-indent:-0.8em;
	color:#09F;
    padding-top: 5px;
    padding-left: 80px; 
  border-bottom: 1px solid #fff !important;
  margin-bottom: -8px;
}





/********** .レシピ関係 ******************************************************************************/
/********レシピの材料02 dl仕様ではなく枠を利用*********************/
.ingredients02 {
  padding: 12px　0;
}
.ingredients02 div.ing-inner02 {
	
    background-color: #F7F7F7;
margin: 0;
    padding: 5px 15px;
    font-size: 100%; 
 border: 2px solid #57c2d8;
	
}
.ingredients02 .detail02 {
	font-size:95%;
	line-height:1.2;
	text-indent:-0.8em;
	color:#09F;/*水色*/
    padding-top: 5px;
    padding-left: 25px; 
}
/********.レシピの材料02*********************/

/********水色の枠*********************/
div.bdr01 {
 border: 3px solid #57c2d8;
	margin: 0 0 2em 0;
    padding: 5px　5px 5px 15px;
	border-radius: 10px;
}
div.bdr01 p {
	margin: 12px 5px 8px 10px;
}
/********.水色の枠*********************/
/********グレイの枠*********************/
div.bdr02 {
 border: 3px solid #ccc;
	margin: 0 0 2em 0;
    padding: 5px　5px 5px 15px;
	border-radius: 10px;
}
div.bdr02 p {
	margin: 12px 5px 8px 10px;
}
/********.グレイの枠*********************/


/*********パラサイトクレンズ　3種のハーブ　カレンダー用**********/
.table-para td,.table-para th{ /* 各セルの指定 */
  padding:1px 3px !important;
  text-align:center;
  border-bottom:1px solid #c86b5b;
  border-right:1px dotted #ddd;
background-color:#fff;
}
.table-para th{ /* 表の見出しの指定 */
  color:#333;  
}

.table-para  th:nth-child(2),
.table-para  td:nth-child(2){  /* うすい緑 */
  border-left: 5px solid #A7B446; 
}

.table-para  th:nth-child(3){  /* うすい緑 */
  border-right: 5px solid #A7B446; 
}

.table-para  th:nth-child(4),
.table-para  tr.bond01 td:nth-child(4){  /* クローブ茶色*/
  border-left: 5px solid #76413C; 
}

.table-para  th:nth-child(4),
.table-para  td:nth-child(7),
.table-para  tr.bond01 td:nth-child(5){  /* クローブ茶色*/
  border-right: 5px solid #76413C; 
}

.table-para  th:nth-child(3),
.table-para  td:nth-child(4){  /* ヨモギL */
  border-left: 5px solid green ; 
}
.table-para  td.bond02l{  /* ヨモギL */
  border-left: 5px solid green !important; 
}
.table-para  th:nth-child(3),
.table-para  td:nth-child(5){  /* ヨモギR */
  border-right: 5px solid green; 
}
.table-para  td.bond02r{  /* ヨモギR */
  border-right: 5px solid green !important; 
}


	/*無寄生虫維持*/
.mukisei01 {
	/*mediumseagreen*/
	color: #3cb371;
}
.mukisei01 span {
	font-size:80%;
}
.mukisei01-01 {
	/*mediumseagreen*/
	color: #3cb371;
}
.bg_aliceblue {
	background-color: #f0f8ff !important;
}
/*********　.パラサイトクレンズ　3種のハーブ　カレンダー用**********/










/**** Rinker変更 ********************************************************/
/*--------------------------------------
Rinkerのデザイン変更
--------------------------------------*/
/*-----全体-----*/
div.yyi-rinker-contents {
	border: none;/*枠線を消す*/
	border-radius: 5px;/*枠線の丸み*/
	background-color: #f5f5f5/*背景色*/
}
div.yyi-rinker-box{/*PR表記用追記*/
	position: relative;
}
div.yyi-rinker-box::after  {/*PR表記用追記*/
position: absolute;
	content: "[PR]";
	color: #ccc;
	font-size: 11px;
	bottom:0;
	right:10px;
}
/*-----タイトル文字を少し小さく-----*/
div.yyi-rinker-info div.yyi-rinker-title a {
	font-size: 1em!important;
}
/*-----タイトル文字を左寄せ-----*/
.yyi-rinker-info {
	text-align: left!important; 
	line-height: 1.3em!important;
}
/*-----スマホ表示でタイトル幅を広く-----*/	
@media screen and (max-width: 500px){
div.yyi-rinker-contents div.yyi-rinker-box div.yyi-rinker-info {
	width: 100%!important;
	line-height: 1.2em!important;
}}
/*-----メーカー名の余白削除-----*/
div.yyi-rinker-detail div:not(:last-child) {
	padding-bottom: 1px!important;
}
/*-----内部の余白調整-----*/
div.yyi-rinker-contents div.yyi-rinker-box {
	padding: 5px 5px 0!important;
}
@media (min-width: 768px){
div.yyi-rinker-box div.yyi-rinker-info {
    padding-left: 0px;
}
div.yyi-rinker-contents div.yyi-rinker-box {
	padding: 10px 5px 0 5px!important;
}}
/*-----画像位置調整-----*/
.yyi-rinker-img-m .yyi-rinker-main-img{
	width:auto!important;
}
@media (min-width: 768px){
.yyi-rinker-img-m .yyi-rinker-main-img{
	width:auto!important;
	max-width:200px!important;
}}
div.yyi-rinker-contents div.yyi-rinker-image{
	align-items: center!important;
}
/*-----ボタンのデザイン-----*/
@media (min-width: 768px){
div.yyi-rinker-contents ul.yyi-rinker-links li{
    width: 47%;/*幅（2列になるように）*/
}}
/*ul.yyi-rinker-links a.yyi-rinker-link{
	box-shadow: none!important;ボタンの影を消す
}*/ 
/*-----ボタン下部のライン-----*/

div.yyi-rinker-contents ul.yyi-rinker-links li.amazonkindlelink{
	padding-top:2px;
margin-bottom: 10px;
box-shadow: 2px 2px 3px #585f70;
}
div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink {
	padding-top:2px;
margin-bottom: 10px;
box-shadow: 2px 2px 3px #f2a941;
}
div.yyi-rinker-contents ul.yyi-rinker-links li.rakutenlink {
	padding-top:2px;
margin-bottom: 10px;
box-shadow: 2px 2px 3px #dd5e5a;
}
div.yyi-rinker-contents ul.yyi-rinker-links li.yahoolink {
	padding-top:2px;
margin-bottom: 10px;
box-shadow: 2px 2px 3px #3f9be8;
}

@media (min-width: 768px){/*スマホのボタン縦幅*/
ul.yyi-rinker-links a.yyi-rinker-link {
	min-height: 34px!important;/*44px*/
}}
/*-----ボタン間の余白調整-----*/
@media (min-width: 768px){
div.yyi-rinker-info ul.yyi-rinker-links li:not(:last-child) {
    margin-right: 10px!important;/*12px*/
}}
/*-----ボタンの色-----*/
.amazonkindlelink a {/*Kindle*/
	color: #ffffff!important;/*文字色*/
	background: #6b7386!important;/*背景色**/
	line-height: 1.1em!important;
	margin-top:3px;
}
.amazonlink a {/*Amazon*/
	color: #ffffff!important;/*文字色*/
	background: #d97527!important;/*背景色*3A4D66*/
	line-height: 1.1em!important;
	margin-top:3px;
}
.rakutenlink a {/*-----楽天-----*/
	background: #b32c40!important;/*背景色ff7c74*/
	line-height: 1.1em!important;
	margin-top:3px;
}
.yahoolink a {/*-----Yahoo!-----*/
	background: #1459ab!important;/*背景色95cad7*/
	line-height: 1.1em!important;
	margin-top:3px;
}
/*-----キャンペーン-----*/
.yyi-rinker-link:before {
	border-radius: 10px;/*角丸にする*/
}
.rakutenlink:before, .rakutenlink .yyi-rinker-link:before {
	color: #FF4D4A!important;/*キャンペーンの楽天の文字色*/
}
@media (min-width: 768px){/*PCのキャンペーン表示を左寄せ*/
ul.yyi-rinker-links li.amazonkindlelink:before, ul.yyi-rinker-links li.amazonlink:before, ul.yyi-rinker-links li.rakutenlink:before, ul.yyi-rinker-links li.yahoolink:before {
    text-align: left;
}}

/**手動入力の時、画像がはみ出さないように調整*/
@media (min-width: 768px){
.yyi-rinker-img-m .yyi-rinker-main-img ,.yyi-rinker-image {
width: auto!important;
max-width: 140px!important;/*200px*/
}
}


/*-- Rinkerの画像自動リサイズ --*/
div.yyi-rinker-contents img {
  max-width: 140px;/*[＊ここの数値を変更すると画像MAXサイズを修正できます＊]*/
	max-height:140px;/*[＊ここの数値を変更すると画像MAXサイズを修正できます＊]*/
	width:auto;
	height:auto;
}
/*Rinkerここまで*/




/* rinker調節 文章の参考商品として用いたい場合　エリアの左側にマージンを設ける */
/* 初期はこちらが指定されていたが変わった 220402に商品は指定なしに左マージン*/
.yyi-rinker-contents{
	margin-left:40px!important;
	border-left: 5px solid #ccc!important;
}


/**** .Rinker変更 ********************************************************/


/***人気ランキングの数字背景********************************************************/
.sidebar .widget-entry-cards.ranking-visible .card-thumb::before { color: #fff; background:#65add6; font-size:15px; font-weight: 800; border-radius: 5px; font-style: italic; left: -5px; top: -5px; opacity: 1; padding-left:2px; padding-right:4px; padding-top:3px; padding-bottom:2px; }
/**background:#596275;**/
.widget-entry-cards.ranking-visible .no-1 .card-thumb::before { border:2px solid #fdcb6e; } .widget-entry-cards.ranking-visible .no-2 .card-thumb::before { border:2px solid #b2bec3; } .widget-entry-cards.ranking-visible .no-3 .card-thumb::before { border:2px solid #cd6133; } .widget-entry-cards.ranking-visible .card-thumb { counter-increment: p-rank; } .sidebar .widget-entry-cards.ranking-visible .card-thumb a:hover { transform: scale(1.05);}

/***.人気ランキングの数字背景********************************************************/


/***サムネイル画像左上の文字を非表示********************************************************/
.cat-label {
 display: none;
 }
/***.サムネイル画像左上の文字を非表示********************************************************/



/***********************************************************/
/***オリジナルで追加********************************************************/

/*注釈01*/
.notes01 {
	font-size: 90%;
	line-height:1.4;
	margin-left: 3em;
	margin-top: -1.5em;
	padding-left:10px !important;
	border-left:5px solid #eee;
}
/***アイキャッチ用の画像の高さを減らすため***/
figure.eye-catch img {
	width:1440px;
	height:300px;
	object-fit:cover;/*縦横のうち小さい方を基準にしてリサイズされ、ボックスからはみ出した部分はトリミングされる。w1440がmaxらしい*/
	font-family: 'object-fit: cover;';
}
	
/*834px以下*/
@media screen and (max-width: 834px){
figure.eye-catch img {
	width:100%;
	height:250px;
	object-fit:cover;
	font-family: 'object-fit: cover;';
}
}

/*480px以下*/
@media screen and (max-width: 480px){
figure.eye-catch img {
	width:100%;
	height:200px;
	object-fit:cover;
	font-family: 'object-fit: cover;';
}
}








/***.オリジナルで追加********************************************************/
	
/***2021.01.23.SNSボタン変更*************************/	
/*---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; /*ボタンの高さ*/
}	
	
/*SNSフォローボタン*/	
.sns-follow-message{	
	font-weight: bold; /*太字*/
	color: #875d5b; /*文字色*/
}	
.sns-follow-buttons {	
	justify-content: center; /*中央寄せ*/
}	
.sns-follow-buttons a {	
	border-radius: 50%; /*丸くする*/
	font-size: 20px; /*アイコンのサイズ*/
	margin: 0 10px; /*ボタン同士の間隔*/
}	
#main .sns-follow a {	
	width: 40px; /*ボタンの横幅*/
	height: 40px; /*ボタンの高さ*/
}	
	
/***end 2021.01.23.SNSボタン変更*************************/	


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

}

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
/*---------------------------------
固定ページの日付を非表示
--------------------------------*/
.post-29 .date-tags,/*お問い合わせ*/
.post-36 .date-tags,/*このサイトについて*/
.post-236 .date-tags,/*プロフィール*/
.post-1196 .date-tags/*サイトマップ*/ {
  display: none;
}


/*わかりにくい単語の直後に簡単な説明をつける*/
span.mean{
	font-size:80%;
	letter-spacing:1px;
	color:#72001f;/*注釈茶色type1*/
	}

/** brタグpc、spで調整 */
.br-sp {
    display: none !important;
}
@media screen and (max-width:767px) {
.br-sp {/*スマホ改行*/
    display: block !important;
    }
}



/*float指定で行間指定ががうまくいかない場合、行間を作る*/
span.line-spacing-1em{
  margin-top:1em;
  display:block; 
  content: "";
}




/*出典表記用 基本右側*/
.reference-r {
	float:right;
	font-size:11px !important;
	line-height:1;
	color: #C5BDB8;
	margin:6px 2px 5px 3em;
	text-indent:-3em;/*出典：　*/
}/*出典表記用 左側用*/
.reference-l {
	float:left;
	font-size:11px !important;
	line-height:1;
	color: #C5BDB8;
	margin:6px 2px 5px 3em;
	text-indent:-3em;/*出典：　*/
}


/****スマホだと画像が小さくなる場合****/
.res-width-img4060 {
margin: auto;
width: 40%;
}
@media screen and (max-width: 576px) {
.res-width-img4060 {
margin: auto;
width: 60%;
}
}








/****************↑共通*********************/


.author-description a {
	color: #444;
	text-decoration: none;
}
/*** 2023.03.13.milife追加*************************/	
#header-container {/*ヘッダーの二重下線*/
	border-bottom: 4px double #61a3c0;/*青type4*/
}








/**** .箇条書き 01▼　デザイン ********************************************************/

 .itemization01{
	 margin:10px 0 15px 0;
 }
 .itemization01 ul{
    list-style-type: square;
    list-style-position: inside;
    padding: 0.3em 0.2em;
	 border: 2px solid #93c4d4;/*青type5*/
 }
 .itemization01 li{
  line-height: 1.6; 
    padding: .1em .1em .1em 1.8em;
font-size:1.2em; 
text-indent: -1.5em;
 }
 .itemization01 li:not(:last-child) {
	 border-bottom: 1px dashed #93c4d4;/*青type5*/
}

 .itemization01 li::marker {
    color: #61a3c0;/*青type4*/
    font-size: 1.2em;
}
.itemization01-add {
    font-size:0.875em; 
    line-height: 1.3; 
    padding: .5em 0 .5em 1.5em; 
text-indent: -0.8em;
	color:#333;
 }
 .itemization01 span.external-icon{ /* リンクテキストの後ろにアイコン入れたいなら before を after に */
/*font-family: "Font Awesome 5 Free";  font awesomeを指定 */
/*content: "\f35d";  外部リンクを示すアイコンを指定 */
font-size: 85%; /* アイコンのサイズを指定 */
padding: 0 3px 0 2em !important; /* アイコンとリンクテキストの余白を指定 */
/*display:inline-block;  アイコンの下線を削除 */
}

/**** .箇条書き 01▼　デザイン ********************************************************/





/**** 数字付きリスト 01▼　デザイン ********************************************************/
.list_ol01 p {/*リストのタイトルとして*/
  font-size: 120%;
  margin-bottom: 0;
  font-weight: bold;
}
.list_ol01 ol {
  counter-reset:number01; /*数字をリセット*/
  list-style-type: none!important; /*数字を一旦消す*/
  margin: 0 0 0.5em;
  padding:0.5em;
  border: solid 2px #57c2d8;
}
.list_ol01 ol li {
  position: relative;
  padding: 0.5em 0.1em 0 35px;
  line-height: 1.5em;
  /*border-bottom: 1px solid #ccc;*/
}
.list_ol01 ol li div {/*下線用*/
  border-bottom: 1px solid #ccc;
  padding-bottom: 0.5em;
}

.list_ol01 ol li:before{
  /* 以下数字をつける */
  position: absolute;
  counter-increment: number01;
  content: counter(number01);
  /*数字のデザイン変える*/
  display:inline-block;
  background: #57c2d8;
  color: white;
  font-family: 'Avenir','Arial Black','Arial',sans-serif;
  font-weight:bold;
  font-size: 15px;
  border-radius: 30%;/*角円にする*/
  left: 0;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  /*数字の枠Y位置*/
  top: 7px;
  -webkit-transform: translateY(1px);
  transform: translateY(1px);
}

.list_ol01 ol li:not(:last-child):after {/*吹き出しの ▼︎*/
  content: "";
  display: block;
  position: absolute;
  top: 34px;
  left: 7px;/*左からの位置*/
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: #ccc transparent transparent transparent;
  border-width: 13px 5px 0 5px;
  z-index: -5;
	}
/**** .数字付きリスト 01▼　デザイン ********************************************************/









/**** 数字付きリスト 02▼　デザイン ********************************************************/
/********数字とタイトル、タブタイプ*********************/
.list_ol02 p.list_ol02_tit{/**タブのタイトル**/
font-size: 20px;
line-height:1.1;
font-weight:normal;
margin: 0;
padding: 3px 10px;
width: 80%; 
color: #fff; 
background-color: #61a3c0;/*青type4*/
border-radius: 8px 8px 0 0;
}
.list_ol02 p.list_ol02_tit span{/**タブのサブタイトル**/
font-size: 14px;
line-height:1.1;
font-weight:normal;
margin: 4px 0 2px 2px;
color: #fff; 
}

.list_ol02 ol {
  counter-reset:number02; /*数字をリセット*/
  list-style-type: none!important; /*数字を一旦消す*/
  margin: 0 0 0.5em;
  padding:0.5em;
  border: solid 1px #61a3c0;/*青type4*/ /*外枠*/
}
.list_ol02 ol li {
  position: relative;
  padding: 0.5em 0.1em 0 37px;
  line-height: 1.5em;
                                  
  border-bottom: none;
  
}
.list_ol02 ol li div.ol02_tit {
font-size:1em; 
	color: #fff;
  line-height: 1em;
background-color:#1c5f90;/*青type2*/
  margin-top: 1px;
padding:5px 0 5px 5px;
  border-radius: 6px;/*角円にする*/
  
/*  clear: left;*/
}


.list_ol02 ol li div.ol02_dis {
	font-size:0.9em;
	line-height:1.4;
	color:#333;/*09F水色*/
    padding: 0 0 0.5em 45px;
  margin-top: 8px;
  margin-bottom: -8px;
  margin-left: -23px;
  
  border-left:1px dotted #174061;/*青type1*//**左の縦方向**/
}

.list_ol02 ol li div.ol02_dis p {
	font-size:100% ;
	line-height:1.3;
	margin-top: 0 ;/*画像用にpを入れたとき用、divのみのときと揃える*/
	/*margin-bottom:2em;画像が隠れるため*/
}
.list_ol02 ol li div.ol02_dis p.fl-l {/*テキスト左、画像右の時のテキストエリア*/
  float: left;
	margin: 10px 6px 0 0 ;
	width: 55%;
}

.list_ol02 ol li div.ol02_dis p img {
	margin: 10px 0 0 0 ;
	max-width: 255px;/*スマホスクショ510px/2より*/
	height:auto;
}
@media only screen and  (min-width:1025px) and ( max-width:1096px) {/**/
.list_ol02 ol li div.ol02_dis p.fl-l {
  float: left;
	margin: 8px 0 0 0 ;
	width: 49%;
}
}
@media only screen and  (min-width:668px) and ( max-width:1024px) {/*668　1024*/
.list_ol02 ol li div.ol02_dis p.fl-l {
  float: left;
	margin: 8px 0 0 0 ;
	width: 51%;
}	
.list_ol02 ol li div.ol02_dis p img {
	margin-left: 5px ;
}
}
@media only screen and  (min-width:535px) and ( max-width:667px) {/*429　667*/
.list_ol02 ol li div.ol02_dis p.fl-l {
  float: left;
	margin: 10px 8px 0 0 ;
	width: 48%;
}
	
.list_ol02 ol li div.ol02_dis p img {
	margin:  0 ;
	max-width: 50%;
	height:auto;
}
}
@media only screen and (max-width:534px) {/*428　414*/
.list_ol02 ol li div.ol02_dis p.fl-l {
	float: none;
	margin: 20px 0 6px ;
	width: 100%;
}

.list_ol02 ol li div.ol02_dis p img {
	margin: 0 ;
	max-width: 100%;
	height:auto;
}
}


.list_ol02 ol li:before{
  /* 以下数字をつける */
  position: absolute;
  counter-increment: number02;
  content: counter(number02);
  /*数字のデザイン変える*/
  display:inline-block;
  background: #174061;/*青type1*/
  color: white;
  font-family: 'Avenir','Arial Black','Arial',sans-serif;
  font-weight:bold;
  font-size: 23px;
  border-radius: 30%;/*角円にする*/
  left: 0;
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  /*数字の枠Y位置*/
  top: 7px;
  -webkit-transform: translateY(1px);
  transform: translateY(1px);
}

.list_ol02 ol li:not(:last-child):after {/*吹き出しの ▼︎*/
  content: "";
  display: block;
  position: absolute;
  top: 44px;
  left: 10px;/*左からの位置*/
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: #ccc transparent transparent transparent;
  border-width: 13px 5px 0 5px;
  z-index: 5;
	}
.list_ol02 ol li:last-child:after {/*吹き出しの ▼︎ 最後*/
  content: "";
  display: block;
  position: absolute;
  top: 44px;
  left: 10px;/*左からの位置*/
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: #fff transparent transparent transparent;
  border-width: 13px 5px 0 5px;
  z-index: 5;
	}
/**** .数字付きリスト 02▼　デザイン ********************************************************/




/**** 数字付きリスト 03▼　デザイン ********************************************************/
/********数字とタイトル、タブタイプ*********************/
.list_ol03 p.list_ol03_tit{/**タブのタイトル**/
font-size: 20px;
line-height:1.1;
font-weight:normal;
margin: 0;
padding: 3px 10px;
width: 80%; 
color: #fff; 
background-color: #61a3c0;/*青type4*/
border-radius: 8px 8px 0 0;
}
.list_ol03 p.list_ol03_tit span{/**タブのサブタイトル**/
font-size: 14px;
line-height:1.1;
font-weight:normal;
margin: 4px 0 2px 2px;
color: #fff; 
}

.list_ol03 ol {
  counter-reset:number03; /*数字をリセット*/
  list-style-type: none!important; /*数字を一旦消す*/
  margin: 0 0 0.5em;
  padding:0.5em;
  border: solid 1px #61a3c0;/*青type4*/ /*外枠*/
}
.list_ol03 ol li {
  position: relative;
  padding: 0.5em 0.1em 0.5em 45px;
  line-height: 1.5em;
  border-bottom: 1px solid #93c4d4;/*青type5*/
}


.list_ol03 ol li:last-child {
	 border-bottom: none;
}



.list_ol03 ol li div.ol03_tit {
font-size:1.22em; 
	color: #307ca1; /*青type3*/
  line-height: 1.2em;
  margin-top: 1px;
padding:0 1px 5px 5px;
}


.list_ol03 ol li div.ol03_dis {
	font-size:1em;
	line-height:1.4;
	color:#0099ff;/*青type101*/
    padding: 5px 0 1em 60px;
  margin-top: 8px;
  margin-bottom: -8px;
  margin-left: -27px;
}



.list_ol03 ol li:before{
  /* 以下数字をつける */
  position: absolute;
  counter-increment: number03;
  content: counter(number03);
  /*数字のデザイン変える*/
  display:inline-block;
  background: #307ca1; /*青type3*/
  color: white;
  font-family: 'Avenir','Arial Black','Arial',sans-serif;
  font-weight:bold;
  font-size: 23px;
  border-radius: 50%;/*円にする*/
  left: 0;
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  /*数字の枠Y位置*/
  top: 7px;
  -webkit-transform: translateY(1px);
  transform: translateY(1px);
}

/**** .数字付きリスト 03▼　デザイン ********************************************************/













/**** 数字付きリスト 04▼　デザイン ********************************************************/
/********数字とタイトル、タブタイプ*********************/
.list_ol04 p.list_ol04_tit{/**タブのタイトル**/
font-size: 20px;
line-height:1.1;
font-weight:normal;
margin: 0;
padding: 3px 10px;
width: 80%; 
color: #fff; 
background-color: #1c5f90;/*青type2*/
border-radius: 8px 8px 0 0;
}
.list_ol04 p.list_ol04_tit span{/**タブのサブタイトル**/
font-size: 14px;
line-height:1.1;
font-weight:normal;
margin: 4px 0 2px 2px;
color: #fff; 
}


/*ol部分*/
.list_ol04 ol {
  counter-reset:number04; /*数字をリセット*/
  list-style-type: none!important; /*数字を一旦消す*/
  margin: 0 0 0.5em;
  padding:0.5em;
  border: solid 1px #61a3c0;/*青type4*/ /*外枠*/
}
/* 吹き出し本体 - 枠線付きの吹き出し */
.list_ol04 ol li {
    position: relative;
  padding: 10px;
  background-color: #e8f4f8;/*青type8*/
  border: 2px solid #ccc;
  border-radius: 10px;         /* 角丸を指定 */
  
  margin:10px 0 20px;
  }


.list_ol04 ol li:before{
  /* 以下数字をつける */
  position: absolute;
  counter-increment: number04;
  content: counter(number04);
  /*数字のデザイン変える*/
  display:inline-block;
  background: #1c5f90;/*青type2*/
  color: white;
  font-family: 'Avenir','Arial Black','Arial',sans-serif;
  font-weight:bold;
  font-size: 23px;
  border-radius: 50%;/*円にする*/
  left: 10px;
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  /*数字の枠Y位置*/
  top: 8px;
  -webkit-transform: translateY(1px);
  transform: translateY(1px);
}
.list_ol04 ol li div.ol04_tit {/*数字　四角枠のタイトル*/
font-size:1.15em; 
	color: #1c5f90;/*青type2*/
  line-height: 1.1em;
  margin-top: -2px;
padding:0 1px 5px 40px;
}
/*タイトルの下に説明が必要な時　水色*/
.list_ol04 ol li div.ol04_dis {
	font-size:0.9em;
	line-height:1.4;
	color:#0099ff;/*青type101*/
    padding: 3px 0 1em 100px;
  margin-top: 2px;
  margin-bottom: -8px;
  margin-left: -27px;
  
}
/* 吹き出し本体 - 枠線付きの吹き出し */
.fuki_b_tit01{
/**/
}

/* 三角アイコン下 - 枠線付きの吹き出し */
.fuki_b_tit01::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: 20px;
  bottom: -12px;
  border-top: 12px solid #c30;
  border-right: 8px solid transparent;
  border-left: 8px solid transparent;
}
/*最後は吹き出しなし*/
.fuki_b_tit01-none::before{
 
}



/*タイトル下▼　下にくる説明文*/
.list_ol04 ol div.ol04_div_dis{
	font-size:1.1em;
	line-height:1.4;
	/*color:#0099ff;*/
    padding: 5px 5px 1em 30px;
	width:96%;
}

/**** .数字付きリスト 04▼　デザイン ********************************************************/



/**** 数字付きリスト 05 シンプルデザイン　水色 ***************************************************/
div.list05-simple01 {     
counter-reset:number05; /* この要素ごとに数字をリセットする */ 
	
  list-style-type: none!important; /*数字を一旦消す*/
  margin: 1em　0;
  padding:0.5em　0;
} 
.list05-simple01-til {     
position:relative;     
margin-left:40px;     
padding:8px 10px 6px; 
border-bottom:solid 2px #57c2d8; 
} 
.list05-simple01-til:before {     
counter-increment:number05;     
content:counter(number05);     
position:absolute;     
top:0;     
left:-40px;     
padding:6px 10px;    
 border:solid 2px #57c2d8;     
color:#57c2d8;     
font-weight: bold; 
}
/**** .数字付きリスト 05 シンプルデザイン　水色 ***************************************************/




/********年表　timeline用********************/
.tl-box {
	width: 100%;
	margin: 5px auto 50px;
border-top: 2px dotted #1c5f90;/*青type2*/
}
ul.timeline {
display: flex;
flex-flow: row wrap;
/*border-bottom: 1px dotted #999;*/
padding: 5px 0;
margin: 0;
border-bottom: 2px dotted #1c5f90;/*青type2*/
}

ul.timeline li {
display: block;
margin: 1px;
}

ul.timeline li:nth-child(1) {
flex-basis: 6em !important;/*12%/
font-size: 90%;
padding: 4px;
vertical-align:top;
border-right: 2px solid #d0e9f0;/*青type7*/
background-color: #d0e9f0;/*青type7*/
line-height: 1.2;
}

ul.timeline li:nth-child(2) {
flex-basis: 14%;
color: #333;
font-size: 85%;
padding: 2px 1px 4px 4px;
text-align: left;
vertical-align:top;
border-right: 2px solid #d0e9f0;/*青type7*/
color:#307ca1;/*青type3*/
line-height: 1.2;
}
ul.timeline li:nth-child(3) {
flex-basis: 69%;
padding: 4px 0 4px 4px;
vertical-align:top;
line-height: 1.2;
}

@media screen and (max-width: 1099px) {/*3項目の％バランスのため668pxはsp用、1024はタブレット縦用、1099はpcでのタイミング*/
	
ul.timeline li:nth-child(1) {
border-right: none;
border-bottom: 2px solid #d0e9f0;/*青type7*/
}
ul.timeline li:nth-child(2) {
border-right: none;
flex-basis: max-content;
font-size: 90%;
}	
ul.timeline li:nth-child(3) {
padding-left:20px;
}
	
ul.timeline li:nth-child(2) .br-sp-nonewline{
/** brタグ スマホは改行させない*/
    display: none !important;
}


	
ul.timeline li:nth-child(3) {
border-right: none;
flex-basis: max-content;
vertical-align:top;
}
}








/********.年表　timeline用********************/



/**************タブ見出しボックス*******************/
.tab-caption-box-label{ 
	color: #fff;
	padding: 3px 16px 0; /*タブ内側余白*/
	font-size: 16px; 
	font-weight: normal; 
	border-radius: 3px 3px 0px 0px; 
}

.tab-caption-box-content {
	color: #333;
	position: relative; 
	top: 1px; /*上から(1px）移動*/
	border: 3px solid; /*ボックス線*/
	padding: 22px 18px; /*ボックス内側余白*/
	border-radius: 4px; /*ボックス角丸*/
	border-top-left-radius: 0px; /*ボックス左上角丸*/
}
/**************タブ見出しボックス オレンジ　この記事について***/
.tab-caption-box-label.thiskiji-l { 
	color: #fff;
	letter-spacing:3px;
	background-color: #ffb97e;/*濃いオレンジ*/
}

.tab-caption-box-content.thiskiji-c {
	line-height: 1.2;
	color: #333;
	border-color: #ffb97e; /*ボックス線*/
	background-color: #fff;/*#fff2e9薄いオレンジ*/
}
/*現時点では使えないdisplay: block;
content: "";
padding: 0 0 1em 0 !important;*/

/**************.タブ見出しボックス*******************/





/**************インデントで補足説明　水色*******************/
.asasidenote {
	font-size:1em;
	line-height:1.4;
	color:#0099ff;/*青type101*/
    padding: 0 0 0 5px;
  	margin: -24px 0 10px 60px;
	border-left: 8px solid #d0e9f0;/*青type7*/
}
hr.asasidenote-line {
	border: 1px dotted #eee;
  	margin: 8px 0;
}
/**************注意喚起の部分　枠付き*******************/
.heads-up {
	font-size:0.9em;
	line-height:1.3;
    padding: 10px;
  	margin: 10px 0;
	border: 1px solid #d0e9f0;/*青type7*/
	
}


/**************.注意喚起の部分　枠付き*******************/

hr.ht14{ /*行間用*/
	height: 14px;
	margin: none;
    border: none;
}
hr.ht-line{ /*行間+ライン用　この記事では　内*/
	height: 12px;
	margin-top: 12px;
	border-top: 1px dotted #cecece;
    border-left: none;
    border-right: none;
	border-bottom: none;
}
hr.ht-line_01{ /*行間+ライン用*/
	height: 1px;
	margin-top: -22px;
	margin-bottom: 10px;
	border-top: 1px dotted #cecece;
    border-left: none;
    border-right: none;
	border-bottom: none;
}

/**************.行間用span*******************/
span.br-1line{ /*1行分弱*/
	font-size:0.1em !important;
	line-height:1.2 !important;
	display: block !important;
}
span.br-2line{ /*2行分弱*/
	font-size:0.1em !important;
	line-height:2.4 !important;
	display: block !important;
}




/**** タイトル+囲み枠 01PR用 枠付き　文字右下********************************************************/
.pr-box01 {
position: relative;
	border:1px solid #ccc; 
	border-radius:4px;
	/*margin: 1.2em 0 1em 1.2em;*/
	margin: 1.2em auto 1em auto;
	padding: 10px 5px 5px 10px;
}
.pr-title01 {
  position: absolute;
  padding: 0 0.5em;
  right: 20px;
  bottom: -12px; 
  font-size: 11px !important;/*反映されないのでstyleでも記述*/
	font-weight: normal;
	font-family:sans-serif;
background-color:#fff;
color:#bbb;
}
/**** .タイトル+囲み枠 01PR用 枠付き　文字右下 ********************************************************/


/**** プロモーション使用の提示********************************************************/
.promo{
	font-size: 11px;
	color:#bbb;
}

/**** .プロモーション使用の提示********************************************************/