@charset "UTF-8";

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

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

/*全体のフォントを指定する　2020/03/12*/

body {
  font-family: 'Hiragino Kaku Gothic ProN', Meiryo, Helvetica, Arial, sans-serif;
  background-color: transparent;
}

/*---------------------------------*/

/*h2、h3、h4見出しを装飾　2019/05/26*/

/* 見出しを変更 */

.article h2 {
  margin-left: 1px;
  margin-right: 1px;
  border-left:7px solid #0769bf;
  border-right:7px solid #0769bf;
  border-top:3px solid #0769bf;
  border-bottom:3px solid #0769bf;
  border-radius: 10px 10px 10px 10px; 
  background-color: #d5e6f5; /*枠の中の背景色*/
  padding: 15px 15px;
	/* box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.3); */ /*シャドー（影）*/
}	
	
	
	
.article h3{
  font-size:23px;
  border-left:5px solid #0769bf;
  border-bottom:3px solid #0769bf;
  border-radius: 10px 10px 10px 10px; 
  background-color: #d5e6f5;
  padding:10px 15px;
	/* box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.3); */ /*シャドー（影）*/
}

.article h4{
  font-size:20px;
  border-bottom:2px solid #0769bf;
  border-radius: 10px 10px 10px 10px; 
  background-color: #d5e6f5;
  padding:8px 20px;
	/* box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.3); */ /*シャドー（影）*/
}

/*-----------------------------------------------*/
/*サイドバー見出しの装飾 2019/05/26*/

#sidebar h3 {
  font-size:19px;
  padding-left: 10px;
  border-left:5px solid #0769bf;
  border-bottom:3px solid #0769bf;  
  border-radius: 10px 10px 10px 10px; 
  background-color: #d5e6f5;
  padding:8px 15px;
	/* box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.3); */ /*シャドー（影）*/
}

/*-----------------------------------------------*/
/*目次 2019/05/30*/

.toc {
  border: 1px solid #0769bf; /*全体の枠線の色*/
  font-size: 16px; /*フォントサイズ*/
  line-height: 2; /*行の高さ指定*/
  padding: 0;
  margin-top: 3em; /*目次上の空間*/
  margin-bottom: 1em; /*目次下の空間*/
  min-width:90%; /*目次横幅*/
  border-radius: 6px;/*角丸コーナー*/
  background: #fff9fc; /*背景カラー*/
  /* box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.3); */ /*シャドー（影）*/
}
@media screen and (max-width: 1030px){
  .toc {
    min-width:100%; /*モバイル時の目次横幅*/
  }
}
.toc-title {
  /* background: #d5e6f5; */ /*目次タイトル背景カラー*/
  	border-bottom: 1px solid #0769bf; /*タイトル部分の枠の下線*/
  color: #000; /*目次タイトルフォントカラー*/
  font-size: 18px; /*目次タイトルフォントサイズ*/
  text-align: center; /*目次タイトル中央寄せ*/
  padding: 6px 16px;
  font-weight: bold; /*文字強調*/
		color: #0769bf; /*タイトル文字の色*/
  /*font-style: oblique;*/ /*斜体フォント*/
}
.toc-title::before {
  font-family: FontAwesome;
  content: '\f0f6'; /*目次タイトルのアイコン指定*/
  margin-right: 0.3em;
  font-weight: 500; /*アイコンの太さ*/
  font-style: normal; /*通常フォント*/
}
.toc-content {
  padding: 20px;
}
.toc-content li a:hover {
  text-decoration:none; /*選択時装飾無し*/
  background: #ffddee; /*選択時の背景カラー*/
  /* transition: all 0.8s ease; */ /*ふわっと変化するアニメーション*/
}
.toc ul.toc-list>li, .toc ol.toc-list>li {
  margin-top: 0.4em; /*h2の上側の空間*/
}
.toc ul.toc-list>li>a, .toc ol.toc-list>li>a {
  border-bottom: 1px solid #0769bf; /*h2のアンダーラインの太さとカラー*/
  font-weight: bold;
}
.toc ul li a, .toc ol li a {
  display: block;
  border-bottom: 1px dotted #0769bf; /*h3～h6のアンダーラインの太さとカラー*/
  margin-left: -20px; /*アンダーライン調整*/
  padding-left: 20px; /*アンダーライン調整*/
}

/*-----------------------------------------------*/
/*検索窓の装飾　2019/12/29 by https://web-ashibi.net/archives/2865 */

.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: #d5e6f5; /*入力部分の背景色*/
  padding: 0 10px;
  border: none; /*ボーダー（枠線）を消す*/
  border-radius: 50px 0 0 50px; /*入力部分の左上、左下のみ角丸*/
  font-size: 16px;
}
.search-submit {
  width: 20%; /*ボタン部分の長さ*/
  background: #0769bf; /*ボタン部分の背景色*/
  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: #818181; /*プレースホルダーの色*/
}
.search-box input:focus, .search-box button:focus {
  outline: 0; /*フォーカス時の枠線を消す*/
}

/*-----------------------------------------------*/
/*内部・外部ブログカードの装飾 2019/06/07*/

.blogcard {
	padding: 2.5rem;
	color: #666;
	position: relative;
	border-color: #0769bf !important; /* 枠線の色を変更 */
}

.internal-blogcard-footer{
	display: none; /* 内部ブログカードのアイコンとURLを非表示 */
}

.blogcard::before{
	content: '関連記事'; /* タイトルの文言 */
	position: absolute;
	top: -.8rem;
	left: 1.5rem;
	/*left: auto;*/
	font-size: 75%;
	background-color: #0769bf; /* タイトルの背景色 */
	padding: .6em 1em;
	font-weight: bold;
	color: #fff;  /* タイトルの文字色 */
	border-radius: 2px;
}

.internal-blogcard::after{
	content: '続きを読む \00bb'; /* 内部リンク右下枠の文言 */
	position: absolute;
	bottom: .5rem;
	right: 1rem;
	font-size: 75%;
	background-color: #0769bf; /* 内部リンク右下枠の背景色 */
	padding: .4em 3em;
	font-weight: bold;
	color: #fff; /* 内部リンク右下枠の文字色 */
	border-radius: 2px;
}

/*-----------------------------------------------*/
/*コメント欄の装飾　2019/06/14*/
/*コメント入力欄を表示するボタンのカスタマイズ*/
.comment-btn {
  background-color: #0769bf;
  color: #fff;
  border: none;
  font-size: 20px;
  transition: 0.5s;
}
.comment-btn:hover {
  background-color: #49add1;
  color: #fff;
  transition: 0.5s;
}

/*コメント入力欄のカスタマイズ*/
.comment-respond { /*入力欄全体の枠*/
  border: 1px solid #0769bf;
  margin-top: -2px;
	border-radius: 6px;/*角丸コーナー*/
}
.comment-respond p {
  margin: 1em 0;
}
#commentform { /*フォーム部分の枠*/
  padding: 20px;
}
p.comment-notes { /*注意書きの文字サイズ*/
  font-size: 14px;
}
p.form-submit {
  margin: 2em 0 1em 0;
}
#commentform input[type="text"], #commentform textarea { /*入力スペースの装飾*/
  padding: 11px;
  border: none;
  border-radius: 4px;
  font-size: 18px;
  width: 100%;
  background: #d5e6f5; /*入力スペースの背景色*/
}
#commentform input[type="submit"] { /*送信ボタンの装飾*/
  -webkit-appearance: none;
  padding: 11px;
  width: 100%;
  margin: 0;
  cursor: pointer;
  background: #0769bf;
  color: #fff;
  border: none;
  font-size: 16px;
  transition: 0.5s;
}
#commentform input[type="submit"]:hover { /*送信ボタンのマウスホバー時*/
  background: #49add1;
  transition: 0.5s;
}

/*-----------------------------------------------*/
/*右下の投稿者名の表示を消す*/
/*固定ページの場合*/
.page .author-info {
    display: none;
}
/*投稿ページ*/
.post .author-info {
    display: none;
}

/*-----------------------------------------------*/
/* ブログカードなどのホバー時の背景色変更　2019/08/29 */

.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,
.navi-in a:hover,
.navi-footer-in a:hover,
.a-wrap:hover,
.comment-reply-link:hover,
.recent-comments .a-wrap:hover .recent-comment-content,
.pagination a:hover,
.pagination-next-link:hover, .comment-btn:hover,
.pager-links a:hover span,
.pager-links a:hover span,
.mobile-menu-buttons .menu-button:hover,
.menu-drawer a:hover,
.bp-login-widget-register-link a:hover{
  background-color: #ffddee; /*背景色*/
  transition: all 0.1s ease; /*アニメーション*/
  color: #333; /*フォントカラー*/
}

/*-----------------------------------------------*/
/*コメント欄にナンバーを付ける　2019/11/20*/
.commets-list {
padding-left: 25px;
list-style: decimal;
}

/*-----------------------------------------------*/
/* パンくずリストのカスタマイズ 2020/02/17*/
.breadcrumb.sbp-main-before, .breadcrumb.sbp-footer-before, .breadcrumb.pbp-main-before, .breadcrumb.pbp-footer-before {
    background-color: #1E73BF; /*--背景色--*/
    padding: 8px 5% 6px; /*--余白を調整--*/
    color: #00f;/*--文字の色--*/
    width: 100%;/*--幅を広げる--*/
}
.breadcrumb a {
    color: #00f; /*--文字の色--*/
    text-decoration: none; /*--下線を非表示--*/
	    font-size: 1.2em; /*--文字のサイズを変更--*/
    padding-right:1em; /*--余白を調整--*/
}
.fa-home:before {
    font-size: 1.5em; /*--ホームの絵文字のサイズを変更--*/
    padding: 2px; /*--余白を調整--*/
}
.fa-folder:before {
    font-size: 1.2em; /*--ホルダーの絵文字のサイズを変更--*/
    padding: 2px; /*--余白を調整--*/
}
.fa-file-o:before {
    font-size: 1.2em; /*--ファイルの絵文字のサイズを変更--*/
    padding: 2px; /*--余白を調整--*/
}
.fa-home {
    width: 2em !important; /*--アイコンと文字の間隔を広げる--*/
}
.fa-folder {
    width: 2em !important; /*--アイコンと文字の間隔を広げる--*/
}
.fa-file-o {
    width: 2em !important; /*--アイコンと文字の間隔を広げる--*/
}
.breadcrumb span.sp {
    margin: 0 10px; /*--余白を調整--*/
}

/*-----------------------------------------------*/
/* ヘッダーの高さを小さくする　 2023/04/30*/
.logo.logo-header.logo-text {
	padding: 0px 0px 10px;
}

/*-----------------------------------------------*/
/* フッターの高さを小さくする　 2023/04/30*/
/* 上下に余白を持たせる */
.footer {
 padding: 5px 0;
}
/* 不要な余白をリセット */
.footer-bottom {
 margin-top: 0;
}
/* 不要な余白をリセット */
.copyright {
 margin-top: 0;
}

/*-----------------------------------------------*/
/* SNS ボタンをまとめて小さくする  2023/05/03*/

/*トップシェアボタンの枠組み*/
.sns-share.ss-top .sns-share-buttons {
	justify-content: flex-end; /*右に寄せる*/
}

/*ボトムシェア・フォローボタンの枠組み*/
.sns-share.ss-bottom .sns-share-buttons,
.sns-follow.sf-bottom .sns-follow-buttons,
.sns-follow.sf-widget .sns-follow-buttons {
	justify-content: center; /*中央に寄せる*/
	flex-wrap: wrap; /*折り返す*/
}

/*シェア・フォローボタンのリンク*/
.sns-share.ss-top .sns-buttons a,
.sns-share.ss-bottom .sns-buttons a,
.sns-follow.sf-bottom .sns-buttons a,
.sns-follow.sf-widget .sns-buttons a {
	width: 40px; /*横幅*/
	height: 28px; /*高さ*/
	margin-right: 4px; /*右側の余白*/
	margin-left: 4px; /*左側の余白*/
	border-radius: 3px; /*丸み*/
}

/*シェアボタンのアイコン*/
.sns-share.ss-top .sns-buttons a .social-icon,
.sns-share.ss-bottom .sns-buttons a .social-icon {
	font-size: 16px; /*アイコンの大きさ*/
}

/*フォローボタンのアイコン*/
.sns-follow.sf-bottom .sns-follow-buttons .follow-button,
.sns-follow.sf-widget .sns-follow-buttons .follow-button {
	font-size: 20px; /*アイコンの大きさ*/
}

/*シェアボタンのキャプション*/
.sns-share.ss-top .sns-buttons a .button-caption,
.sns-share.ss-bottom .sns-buttons a .button-caption {
	display: none; /*非表示*/
}

/*シェア・フォローボタンのシェア数*/
.sns-share.ss-top .sns-buttons a .share-count,
.sns-share.ss-bottom .sns-buttons a .share-count,
.sns-follow.sf-bottom .sns-buttons a .follow-count,
.sns-follow.sf-widget .sns-buttons a .follow-count {
	right: 1px; /*右側からの距離*/
	bottom: 0; /*下側からの距離*/
	font-size: 10px; /*文字の大きさ*/
}

/*-----------------------------------------------*/
/*箇条書き、番号付きリストの文どうしの間隔を広くする  2023/10/29*/
ul li, ol li {
padding-top:8px;
padding-bottom:8px;
line-height:1.5;}
/*-----------------------------------------------*/







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

/*-----------------------------------------------*/