@charset "UTF-8";

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

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

/*目次*/
.toc{
	border-width:3px;/*外枠線の太さ*/
	border-color:#ffbc00;/*外枠線色*/
	width:80%;/*目次の横幅*/
}
.toc-title{
	color:#ffffff;/*「目次文字色」*/
	background:#FF8000;
	font-weight:bold;
}

.toc-content{
	padding:0 1em;
}

.toc .toc-content ol{
	color:#FF8000;/*段落の番号色*/
	font-weight:bold;

}
/*目次ここまで*/
/*h2タグ*/
.article h2{
	border-radius: 6px;
	padding:18px;
}
/*ここまで*/

/*h3タグ*/
.article h3{
border-radius: 1px;
}
/*ここまで*/

.sidebar h3{/*サイドバー見出し*/
	display:inline-block;
	color:#161616;/*文字色*/
	background:#fff;/*背景色*/
	border-bottom:2px solid #20287c;/*下線*/
	padding:0;
	line-height:1;
}
.sidebar h3:first-letter{/*サイドバー見出し最初の文字*/
	color: #20287c;/*文字色*/
	font-size:1.6em;/*文字の大きさ*/
}

/*記事本文の行間と余白*/
.entry-content p {
	line-height: 1.75;
	margin: 2.3em 1em;
}

.entry-content dl {
	margin: 1.7em 1em;
	padding:10px;
	border: solid 1px #ededed;
}

.entry-content dd {
	line-height: 2;
	margin:1.2em 0.5em 1.2em 1.7em;
}

.blank-box{
	font-weight:bold;
}

/*青系ulデザイン*/
li{
	font-weight:bold;
}
ul.ul-list1 li {
	line-height: 1.5; /*文の行高*/
	padding: 0.5em 0; /*前後の文との余白*/
	list-style-type: none!important;
	font-weight:bold;
}

.ul-list1 li:before {/*疑似要素*/
	font-family: FontAwesome;
	content: "\f138";/*アイコンの種類*/
	position: absolute;
	left : 1.5em;/*左端からのアイコンまでの距離*/
	color: #999999;/*アイコン色*/
}

/*青系olデザイン*/
ol.ol-list1 li {
	line-height: 1.5; /*文の行高*/
	padding: 0.5em 0; /*前後の文との余白*/
	font-weight:bold;
}

/*オレンジ系ulデザイン*/
.ul-list2 li {
	line-height: 1.5; /*文の行高*/
	padding: 0.5em 0; /*前後の文との余白*/
	list-style-type: none!important;
	font-weight:bold;
}

ul.ul-list2 li:before {/*疑似要素*/
	font-family: FontAwesome;
	content: "\f138";/*アイコンの種類*/
	position: absolute;
	left : 1em;/*左端からのアイコンまでの距離*/
	color: #FF8000;/*アイコン色*/
}

/*オレンジ系olデザイン*/
.ol-list2 li {
	line-height: 1.5; /*文の行高*/
	padding: 0.5em 0; /*前後の文との余白*/
	font-weight:bold;
}

/*青系ポイントボックス*/
.point-box1 {
	position: relative;
	margin: 3em 2em;    
	border: solid 2px #0B3861;
	background: #f1f8ff;/*背景色*/
}
.point-box1 .box-title1 {
	position: absolute;
	display: inline-block;
	top: -30px;
	left: -2px;
	padding: 0 9px;
	height: 28px;
	line-height: 28px;
	vertical-align: middle;
	font-size: 18px;
	background: #0B3861;
	color: #ffffff;
	font-weight: bold;
	border-radius: 5px 5px 0 0;
}
.point-box1 p {
	margin: 0; 
	padding: 0;
}

/*オレンジ系ポイントボックス*/
.point-box2 {
	position: relative;
	margin: 3em 2em;	
	border: solid 2px #FF8000;
	background: #f1f8ff;/*背景色*/
}
.point-box2 .box-title2 {
	position: absolute;
	display: inline-block;
	top: -30px;
	left: -2px;
	padding: 0 9px;
	height: 28px;
	line-height: 28px;
	vertical-align: middle;
	font-size: 18px;
	background: #FF8000;
	color: #ffffff;
	font-weight: bold;
	border-radius: 5px 5px 0 0;
}

.point-box2 p {
	margin: 0; 
	padding: 0;
}

/*ポイント付ポイントボックス*/
.point-box3 {
	position: relative;
	padding: 1em .5em;
	margin:0 2em;
	font-weight:bold;
	border-radius: 5px;
	border: 2px solid #7ED1E6;
}
.point-box3:after{
	content: "POINT";
	position: absolute;
	top: -1em;
	left: 10px;
	background: #fff;
	font-size: 1em;
	color: #7ED1E6;
	padding:0 10px;
}

a{ /*リンクテキスト装飾無し*/
	text-decoration: none;
	font-weight:bold;
}
a:hover { /*リンクテキストホバー時アンダーライン表示*/
	text-decoration: none;
	font-weight:bold;
}

/*フロント固定ページのタイトルを非表示*/
.home.page .entry-title{
	display: none;
}
/*フロント固定ページのシェアボタンを非表示*/
.home.page .sns-share{
	display: none;
}
/*フロント固定ページのフォローボタンを非表示*/
.home.page .sns-follow{
	display: none;
}
/*フロント固定ページの投稿日を非表示*/
.home.page .post-date{
	display: none;
}
/*フロント固定ページの更新日を非表示*/
.home.page .post-update{
	display: none;
}
/*投稿者名を非表示*/
.home.page .author-info{
	display: none;
}

/*文字装飾*/
.futo {
	font-weight: bold;
}

.futoaka {
	font-weight: bold;
	color: red;
}

.futoakadeka {
	font-weight: bold;
	font-size:20px;
	color: red;
}

.futodeka {
	font-weight: bold;
	font-size:20px;
}

/*カテゴリー装飾*/
.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; /*上部にボーダーを引く*/
}
.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: .3em;
	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 { /*子カテゴリのボックス*/
	padding-top: 0px;
	padding-bottom:10px;
	border-bottom: 1px dotted #ccc;
}
.widget_categories ul li ul li a { /*子カテゴリ用のコード*/
	color: #333;
	text-decoration: none;
	padding: 0 4px 0 4px;
	display: block;
	border: none;
}
.widget_categories ul li ul li a::before { /*子カテゴリのアイコン*/
	font-family: FontAwesome;
	content: "・";
	padding: 0;
}

/*-- 人気記事デザイン --*/
ul.wpp-list li {
	border-bottom: 1px dashed #79c06e;/*記事間の点線と色*/
	position: relative;/*相対位置*/
}
 
ul.wpp-list li img {/*アイキャッチ画像*/
	margin: 10px 10px 10px 0px;/*画像の余白*/
	padding: 3px;/*画像の位置*/
}
 
ul.wpp-list li a.wpp-post-title {/*記事タイトル*/
	display: block;/*ブロック形式で表示*/
	font-size: 15px;/*文字サイズ*/
	color: #333;/*文字色*/
	padding: 12px;/*タイトル位置*/
	text-decoration: none;/*タイトルの下線なし*/
}
 
ul.wpp-list li a.wpp-post-title:hover {
	color: #4169e1;/*ホバー時のタイトル色*/
}

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