@charset "UTF-8";

/*子テーマ用「base.css」*/

/*サイドバーの横幅をカスタマイズ*/
 
@media (min-width : 768px){ /*横幅768px以上*/
     
    .col2 .keni-sub{
        width: 360px; /*サイドバーの横幅*/
    }
     
    .col2 .keni-main{
        margin-right: -360px; /*メインコンテンツ右側の余白*/
        padding-right: 360px;
    }
     
    .keni-sub .keni-section_wrap, .keni-footer .keni-section_wrap {
    margin-left: 20px; /*サイドバー左側の余白*/
    }
     
    .keni-section_wrap {
    margin: 0px; /*サイト全体の余白*/
    }
     
}/*横幅768px以上*/

/*サイト全体の横幅をカスタマイズ*/
 
@media (min-width : 768px){ /*横幅768px以上*/
     
    .col2 .keni-header_outer,
    .col2 .keni-gnav_outer,
    .col2 .keni-mv_outer,
    .col2 .archive_title_wrap,
    .col2 .keni-main_outer,
    .col2 .catch-area,
    .col2 .keni-breadcrumb-list_outer,
    .col2 .keni-footer_outer,
    .col2 .keni-copyright,
    .col2 .keni-sep-conts_outer,
    .col2 .keni-footer-panel_outer{
        max-width: 1200px;
    }
 
}/*横幅768px以上*/

 /* サイトの背景色と背景固定 */
body{
	background-color: #fff; /* サイトの背景色 */
	background-image: url(https://hatodaisuki.com/wp-content/uploads/2022/06/842x542_touka.png);
	/*バック壁紙の画像*/
	background-attachment: fixed;/*背景を固定する*/
	background-size: cover;/*背景を横幅Maxまで広げる*/
}

/*タイトル上の斜めのボーダーを非表示*/
.keni-container .keni-header_wrap,
.keni-section_wrap .keni-section .entry_title,
.keni-main .archive_title{
	padding-top: 0px;
	background-size: 0px 0px;
}

/*記事タイトル上のボーダーを非表示*/
.keni-section h1{
	background-size: 0px 0px;
}

/*ヘッダーのタイトル*/
.keni-header .site-title,
	.keni-header_col1 .site-title{
		float: left;
		max-width: 100%;
		font-size: 2.5rem; /*説明文の大きさ*/
	}

/* ヘッダータイトルを中央へ */
.keni-header .site-title, .keni-header_col1 .site-title {
	float: none;
	max-width: 100%;
	text-align: center;
}

/* ヘッダーの背景色を変更する */
.keni-header_wrap{
	background-color: rgba(0,0,0,0.0);
}

/* グローバルメニューの位置を中央 */
.keni-gnav_inner ul {
	margin: auto;
	background: transparent;
}

/*グローバルナビの背景色（サイド）*/
.keni-gnav_wrap {
	background-color: rgba(0,0,0,0.0);
}

/* グローバルメニューの背景を変える */
.keni-gnav_inner li a {
	background-color: rgba(0,0,0,0);
	border-bottom-color: rgba(0,0,0,0);
}

/* グローバルメニューのカラーと下線 */
.keni-gnav ul li a: {
    color:#fff; /* 文字色 */
	background-color: rgba(0,0,0,0.0); /* メニューボタンの背景色を変える */
	border-bottom-color: background-color: rgba(0,0,0,0.0);	
}

/* グローバルメニューのホバーエフェクトのカラーと下線 */
.keni-gnav ul li a:hover {
    color:#fff; /* 文字色 */
	background-color: #0dcc80; /* 背景色 */
	border-bottom-color: #0dcc80; /* 下線 */
}

/* グローバルメニューの背景を変える メニューボタンの背景*/
.keni-gnav_inner li a {
	font-weight: bold;	/* 文字を太字にする */
	font-size: 130%;		/* 文字を大きくする */
	color: #000000;		/* 文字色を変更する */
	text-shadow: 3px 3px 3px #999999;	/* 文字に影を付ける */
}

/* グローバルメニューのホバーエフェクトの色を変える */
.keni-gnav_inner li a:hover {
	font-weight: bold;	/* 文字を太字にする */
	font-size: 130%;		/* 文字を大きくする */
	text-shadow: 3px 3px 3px #000000;	/* 文字に影を付ける */
}

/*トップページのアイキャッチ画像の大きさ*/
.entry-list .entry_thumb img {
   width: 279px;
   height: auto;
   box-shadow: 1.5px 1.5px 3px #acacac; /* ボックス影（不要なら行を削除） */
 z-index: auto;
}

/*マウスオーバーでリンクが下に動く*/
a:hover { top:5px;  position:relative; 
}

/* SNSボタンの囲み */
.sns-btn_wrap > div{ 
	border: solid 1.5px #0dcc80;/*囲みの線の色を変更*/
}

/*トップページの記事一覧のタイトルを大きくする*/
.entry-list .entry_title{
	margin-top: 0;
	margin-bottom: 5px;
	padding: 0;
	border: 0;
	background-color: transparent;
	font-weight: bold;
	font-size: 1.8rem; /*文字の大きさ変える（元は1.6rem）*/
	line-height: 1.8;
}

/*文字、フォントサイズ、文字間、行間、改行の行間*/
body {
    color: #111111; /*文字カラー*/
}

body, input, textarea {
    font-family: Noto, "Hiragino Sans", Helvetica, Arial, sans-serif; /*フォント*/
} 


.keni-main {
    letter-spacing: .05em;
    font-size: 2.0rem;
    line-height: 2.0em; /*行間*/
}

.article-body p {
    margin-bottom: 0.3em; /*改行したときの行間*/
	line-height: 130%;
}

/*ページトップボタン鳩*/
.page-top {
	border-radius: 50%; /*ボタンを丸にする*/
	background: #0dcc80; /*ボタン背景色*/
	box-shadow: 0 0 3px #000; /*影の上下左右の向き・ぼかしの度合い・影の色*/
	right: 15px; /*画面右からの距離*/
    bottom: 15px; /*画面下からの距離*/
}
.page-top a {
	display: block;
	padding: 20px 15px; /*ボタンの大きさ*/
	text-align: center;
	text-decoration: none;
}

.page-top a::after {
    font-family: "Font Awesome 5 Free"; 
    content: "\f062""\f4ba"; /*アイコン*/ 
    font-size:25px; /*アイコンの大きさ*/ 
	font-weight:900;
    color: #fff; /*アイコンの色*/
}

.page-top a::before {
	display:none
}

.page-top a:hover { 
	top:0 ;left:0; /*リンク時に下に動かさない*/
}

/*サイドバーのテキスト＋画像のテキスト透過とフォント*/
.widget_recent_entries_img02 .widget_recent_entries_img_entry_title {
    background: rgba(13,204,128,0.40);

}
.widget_recent_entries_img02 .widget_recent_entries_img_entry_title a {
    color: #fff;
	font-size: 110%;		/* 文字を大きくする */
	text-shadow: 2px 2px 2px #999999;	/* 文字に影を付ける */
}

/*サイドバーカテゴリーとメタ情報などの横線消す*/
.widget_archive .keni-section > ul li,
.widget_categories .keni-section > ul li,
.widget_pages .keni-section > ul li,
.widget_rss .keni-section > ul li,
.widget_meta .keni-section > ul li{
	border: none;
}


/*検索ボックス*/
.search-box{
	padding: 1px 1px;
	border: 2px solid #0dcc80;
}

/* リンクの文字カラーgoogleと同じ色 */
a {
    color: #1111cc;
}

/* サイドバーの見出しの文字変更 */
.keni-section .sub-section_title {
	color: #fff;
	text-indent: 0.3em;
	font-size: 1.3em;
}

.keni-section .sub-section_title::after{
	float: left;
	font-family:  "Font Awesome 5 Free";
	content:"\f4ba";
	font-weight:900;
}

/* 検索ボックスの横幅をサイドバーの横幅に合わせる */
@media (min-width : 768px) {
.keni-sub #search-2 {
  padding-left:0;
  padding-right: 0;
}

.keni-sub #search-2 .search-box {
  max-width:100%;
  position: relative;
  top: -13px;
}
}

@media only screen and (max-width : 768px){
.widget_search .search-box {
    max-width: 100%;
}
.widget_search .keni-section .btn-search {
    top: 14px;
}
}


/*ヘッダーロゴ画像だけマウスオーバーした時に動かさない*/
.site-title a:hover { top:0 ;left:0;
}

/*ディスクリプションを非表示*/
.site-description {
  display:none;
}

/*コピーライトをセンターに*/
.keni-copyright {
    text-align: center;
}    

/*コピーライト上の線を消す*/
.keni-copyright_wrap {
    border: none;
}

/*パンくずリストの記事名を取る*/
.keni-breadcrumb-list li:nth-last-child(2)::after {
    margin: 0 10px;
    content: none !important;
}
.keni-breadcrumb-list_inner li:last-child {
  display: none;
}

/*パンくずリスト背景色*/
.keni-breadcrumb-list_wrap {
    background-color: rgba(0,0,0,0.0);
    border: none;
}

/*パンくずリスト＞のカラー*/
.keni-breadcrumb-list li {
    color: #1a9a1a;
}

/*パンくずリスト文字色*/
.keni-breadcrumb-list li a {
    color: #1111cc;
}

/*h2を無効化する*/
.article-body h2 {
background: transparent!important;
color: #000;
}

.article-body h2 {
  position: relative;
  background: #24e595!important;/* 背景色 */
  font-size: 23px;
  color: #fff;
  text-indent: 0.3em;
  border-radius: 10px 10px 10px 10px;/*箱の角の丸み調整 */
  width:97%;
  margin-left:17px;/* 文字タイトルを右方向に微調整 */
  padding: 5px 5px 5px 40px;
  text-shadow: 2px 2px 2px #444;/* 文字に影を付ける */
  border: 2px dashed #fff;/* ステッチの太さ・種類・カラー */
  box-shadow: 0 0 3px 5px #24e595;
}

.article-body h2:before {
  font-family: "Font Awesome 5 Free";
  content: "\f4ba";/*アイコンのユニコード*/
  font-weight: 900;
  position: absolute;/*絶対位置*/
  font-size: 1.2em;/*サイズ*/
  left: 10px;/*アイコンの位置*/
  top: 5px;/*アイコンの位置*/
  color: #fff; /*アイコン色*/
}

/*H3見出し変更*/
.article-body h3 {
  position: relative;
  padding-left: 2em;/*アイコン分のスペース*/
}

.article-body h3:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 5px;
  content: '';
  background-image: -webkit-gradient(linear, left top, right top, from(#0dcc80), to(#bfffe5));
  background-image: -webkit-linear-gradient(left, #0dcc80 0%, #bfffe5 100%);
  background-image: linear-gradient(to right, #0dcc80 0%, #bfffe5 100%);
}

.article-body h3{
    font-size: 1em;/* 文字の大きさ */
    font-weight: bold;/* 文字の太さ */
    color: #1a9a1a!important;/* 文字の色 */
    border: none;
	margin-left:20px;/* 文字タイトルを右方向に微調整 */
}

.article-body h3:before {
  font-family: "Font Awesome 5 Free";
  content: "\f4ba";/*アイコンのユニコード*/
  font-weight: 900;
  position: absolute;/*絶対位置*/
  font-size: 1.2em;/*サイズ*/
  left: 10px;/*アイコンの位置*/
  top: 10px;/*アイコンの位置*/
  color: #5acc0d; /*アイコン色*/
}

/*H4見出し変更*/
.article-body h4{
	border-bottom: 3px dotted #000;
    font-size: 1.0em;/* 文字の大きさ */
    font-weight: bold;/* 文字の太さ */
    color: #1a9a1a!important;/* 文字の色 */
	margin-left:10px;/* 文字タイトルを右方向に微調整 */
	position: relative;
    padding-left: 2.5em;/*アイコン分のスペース*/
}

.article-body h4:before {
  font-family: "Font Awesome 5 Free";
  content: "\f4ba";/*アイコンのユニコード*/
  font-weight: 900;
  position: absolute;/*絶対位置*/
  font-size: 1em;/*サイズ*/
  left: 20px;/*アイコンの位置*/
  top: -1px;/*アイコンの位置*/
  color: #5acc0d; /*アイコン色*/
}

/*続きを読むボタンの背景色*/
.ently_read-more .btn {
   background: #d0ffe2!important;
   color: #193b03!important;
}

/*関連記事に影をつける*/
.related-entry-list li {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
}

/*関連記事のフォントサイズ変更/*
.related-entry-list .related-entry_title a {
   font-size: 1.4em;
}

/*目次*/
.toc-area{
	position: relative;
	margin: 10px auto; /*目次の上下の余白を狭くする*/
	border: 3px solid #1a9a1a; /*メインカラー「ターコイズ」に変更*/
	box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4); /*影を付ける*/
}

.toc-area_inner .toc-area_list > li::before{
	border-radius:50%;
	-webkit-border-radius: 50%;
        -moz-border-radius: 50%; /*radius「50％」指定で丸に変更*/
}

.toc-area ol a{
	text-decoration: none; /*見出しリンクの下線を消す*/
}

/*h3見出しのリスト装飾をWEBフォント変更*/
.toc-area_inner .toc-area_list ol li::before{
	position: absolute;
	left: -7px;
	background: transparent;
	font-size: 14px;
	color: #1a9a1a;
	font-family: "Font Awesome 5 Free";
	content:"\f152";
	font-weight:900;
}

/*h4見出しのリスト装飾をWEBフォント変更*/
.toc-area_inner .toc-area_list ol li li::before{
	position: absolute;
	left: -7px;
	background: transparent;
	font-size: 14px;
	color: #1a9a1a;
	font-family: "Font Awesome 5 Free";
	content:"\f054";
	font-weight:900;
}

/*h3見出し以降の行間を詰める*/
.toc-area_inner .toc-area_list ol ol{
	margin: 0;
	padding: 0;
}
/*1行毎の行間を詰める*/
.toc-area_inner .toc-area_list li{
	margin-bottom: 0;
}

.toc-area_inner .toc-area_list::after{
	content:url(); /*アップロードした先のURL*/
	position:absolute;
	bottom:5px; /*下からの距離*/
	right:-10px; /*右横からの距離*/
	opacity:0.5; /*画像の透明度*/
}

.toc-area:before {
	font-family: "Font Awesome 5 Free";
	content: "\f02d";
	font-weight: bold;
	font-size: 170%; /*フォントの大きさ*/
	color: #1a9a1a;
	position: absolute;
	left:100px; /*左からの位置*/
	top:5px; /*上からの位置*/
}

/*タブレット・PC表示*/
@media (min-width : 768px){
	.toc-area:before{
		left: 200px;		
}
}

/*目次に画像を入れる*/
.toc-area_inner .toc-area_list::after{
	content:url(https://hatodaisuki.com/wp-content/uploads/2022/06/haku_200.png); /*アップロードした先のURL*/
	position:absolute;
	bottom:0px; /*下からの距離*/
	right:16px; /*右横からの距離*/
	opacity:0.7; /*画像の透明度*/
}

/*目次のグレー部分を透明*/
.toc_title {
    background-color: rgba(0,0,0,0.0); /*目次の背景ボーダーを透明にする*/
}

/* いぬBOX B*/
.inu-box-b {
 position: relative;
 margin: 3em auto;
 padding: 20px 50px 20px;
 width: 85%; /* ボックス幅 */
 background: #fff; /* ボックス背景色 */
 color: #333; /* 文字色 */
 font-weight: bold; /* テキスト太字（不要なら行を削除） */
 text-align: center; /* テキスト中央（不要なら行を削除） */
 border: 5px solid #666; /* ボックス枠線(太さ・線種・色)*/
 border-radius: 50px;
 box-shadow: 1.5px 1.5px 3px #acacac; /* ボックス影（不要なら行を削除） */
 z-index: auto;
}
.inu-box-b::before, 
.inu-box-b::after {
 height: 4.5em;
 width: 2.5em;
 position: absolute;
 content:'';
 top: -15px;
}
.inu-box-b::before { 
 left: -2%;
 background: #E6B78A; /* 左耳背景色 */
 border: 5px solid #666; /* 左耳枠線(太さ・線種・色) */
 border-radius: 100px 50px;
 transform: rotate( 30deg );
}
.inu-box-b::after {
 right: -2%;
 background: #4E2A16; /* 右耳背景色 */
 border: 5px solid #666; /* 右耳枠線(太さ・線種・色)*/
 border-radius: 50px 100px;
 transform: rotate( -30deg );
}

/* テープBOX */
.tape-box {
  margin: 1em 0;
  padding: 1em;
  background-color: rgba(200,255,200,0.7);/* 背景色 */
  box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.15);
}

.tape{
  display: block;
  background-color: rgba(200,255,103,1.0);/* テープの色 */
  opacity: 1.5;
  transform: rotate(3deg);
  width: 40%;
  height: 35px;
  margin: -2em auto 0 auto;
  border-left: 3px dotted rgba(0,0,0,.3);
  border-right: 3px dotted rgba(0,0,0,.3);
}

.tape-box p{
  margin: 0;
  padding: 0;
}

/*BOX囲み*/
.box1 {
    padding: 1em 1.5em;
    margin: 2em 0;
    background: rgba(200,255,200,0.7);/*背景色３つの数字はカラー、最後は透過度*/
    border:2px solid #0dcc80;/*枠線*/
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);/*影*/
    color:#000000;/*文字色*/
}
.box1 p {
    margin: 0; 
    padding: 0;
}

.box2 {
    padding: 0.5em 1em;
    margin: 2em 0;
	background: rgba(200,255,200,0.7);/*背景色３つの数字はカラー、最後は透過度*/
    border: double 5px #0dcc80;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.3);/*box影*/
}
.box2 p {
    margin: 0; 
    padding: 0;
}

.box3 {
    padding: 0.5em 1em;
    margin: 2em 0;
    color: #000;
    background: rgba(200,255,200,0.7);/*背景色３つの数字はカラー、最後は透過度*/
    border-bottom: solid 6px #0dcc80;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.25);
    border-radius: 9px;
}
.box3 p {
    margin: 0; 
    padding: 0;
}

/* フッターの背景色 */
.keni-footer_wrap{
	background: rgba(0,0,0,0.0); /* フッターの背景色（透過） */
}

/*サイドバーの背景枠のカラーをつけて透過*/
.keni-section_wrap{
	margin: 0 0 20px;
	padding: 20px;
	background-color: rgba(0,0,0,0.0);/*３つの数字はカラー、最後は透過度*/
}

/*リンクの基本色*/
a{
	color: #3c0d27;
}

/*リンクカードのアイキャッチ画像の大きさ*/
@media (min-width: 768px){
.keni-link-card_thumb {
    width: 200px;
    height: 190px;
}
.keni-link-card_title,
.keni-link-card_desc {
    margin-right: 200px;
}
.keni-link-card_wrap {
    min-height: 200px;
}
}

/*リンクカードの外枠*/
.keni-link-card_wrap {
    border: none; /*外枠の線をなし*/
    padding: 10px; /*クラス名「keni-link-card」との余白*/
    background-color: rgba(200,255,200,0.7);/*内部背景色、３つの数字はカラー、最後は透過度*/ 
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4); /*リンクカードの影*/
}

/*リンクカード内部の装飾*/
.keni-link-card_wrap .keni-link-card {
    padding: 10px; /*タイトルとの余白*/
    border:2px dashed #0dcc0d; /*ステッチ風の線*/
    border-radius: 6px; /*ステッチの丸み*/
	margin-right: 0px;
	min-height: 210px;
}

/*リンクカードURL*/
.keni-link-card_url {
	font-size: 1.4rem;
	white-space: normal;
}

/*リンクカードURL*/
    .keni-link-card_url a {
    color: #1111cc; /*リンクカードURLの色*/
}

/*アイキャッチ画像の位置*/
    .keni-link-card_thumb{
    top: 7px;
    right: 7px;
}

/*タイトルの文字の大きさ*/
.keni-link-card_title{
	font-size: 1.1em;/* 文字の大きさ */
    font-weight: bold;/* 文字の太さ */
}

/*タイトルの文字色*/
.keni-link-card_title a {
    color: #3c0d27;
	text-decoration: none;/* リンクの下線を消す */
}

.keni-link-card_title a:hover{
	text-decoration: none;/* マウスオーバーでリンクの下線を消す */
}

/*descriptionの文字の大きさ*/
.keni-link-card_desc{
	font-size: 1.6rem;
}
