@charset "UTF-8";

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

/************************************
** 子テーマ用のスタイルを書く
************************************/

/*　見出しを一旦無効化　*/

/* H1 */
.article h1{
background:none;
border-top:none;
border-bottom:none;
border-left:none;
border-right:none;
padding: 0;
}

/* H2 */
.article h2{
background:none;
border-top:none;
border-bottom:none;
border-left:none;
border-right:none;
padding: 0;
}
 
/* H3 */
.article h3{
background:none;
border-top:none;
border-bottom:none;
border-left:none;
border-right:none;
padding: 0;
}
 
/* H4 */
.article h4{
border-top:none;
border-bottom:none;
padding: 0;
}
 
/* H5 */
.article h5{
border-bottom:none;
padding: 0;
}
 
/* H6 */
.article h6{
border-bottom:none;
padding: 0;
}


/************************************
/* グローバルナビの上下に線を入れる
************************************/
nav#navi, .menu-header .sub-menu{
     border-bottom:1px solid #f9d6b3; 
}

#navi .navi-in > ul li{
	height: 60px;
}


/************************************
/* ページ送りの部分
************************************/
.pagination-next-link {
  background-color: #49add1; /*背景色*/
  color: #fff; /*文字色*/
  border: none; /*ボーダーを消す*/
}
.page-numbers { /*通常時*/
  color: #49add1;
  border: 1px solid #49add1;
}
.pagination .current { /*現在のページ*/
  background-color: #49add1;
  color: #fff;
}
.page-numbers.dots { /*ドット「…」の部分*/
  opacity: 1;
  background: none;
}
.pagination a:hover { /*マウスホバー時*/
  background-color: #49add1;
  color: #fff;
	}


/************************************
/* カテゴリシールのデザイン
************************************/
.cat-link {
 background-color: #faf0e6;
 color: #7f0c00;
}
.cat-link::before{
 display:none;
}


/************************************
/* ブログカードラベルの色
************************************/
.blogcard-type .blogcard-label{
  background-color:#7c7979;
}


/************************************
/* サイドバー新着記事一覧カスタム
************************************/

.widget-entry-cards .a-wrap { /* ブログカード風にする */
  border: 1px solid #EAEAEA;
  box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
  border-radius: 10px;
  padding-bottom: 3px;
	padding-top: 10px;
	padding-left: 10px;
}

.widget-entry-cards .a-wrap:hover { /* マウスオーバーで浮かせる */
  box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
  transform: translateY(-5px);
  background-color: white; 
  transition: all .3s ease;
}
.widget-entry-cards .a-wrap:hover img { /* サムネイル画像の透過を無効に */
  opacity: 1;
}


/************************************
/* サイドバー新着記事四角の中の文字
************************************/
.widget-entry-card-content{
 font-size: 12pt;
}
.sidebar {
font-size: 0.9em;
}
.widget-entry-card-title {
	position: absolute;
	left: 140px; 
	top: 10px;
	height: 59px;
	overflow: hidden;
}


/************************************
/* サイドバー人気記事四角の中の文字
************************************/
.popular-entry-card-title {
	position: absolute;
	left: 140px; 
	top: 10px;
	height: 59px;
	overflow: hidden;
	}


/************************************
/* 見出しデザイン変更
************************************/

.article h1 {
    font-weight: normal;
	padding: 0.5em 0.4em;
	margin: 50px 0px 30px 0px;
    font-size: 26px;
	border-bottom: solid 6px #faf0e6;
}



 /* 下のh2はこれ以上触らない！  */

.article h2 {
  font-weight: normal;
  padding: 0.25em 1.0em;/*上下 左右の余白*/
  margin: 50px 5px;
  color: #494949;/*文字色*/
  background: transparent;/*背景透明に*/
  border-left: solid 15px #faf0e6; /*左線*/
  border-bottom: solid 2px #faf0e6;
}


 /* 下のh3はこれ以上触らない！  */

.article h3 {
 font-weight: normal;
 font-size: 22px;
 padding: 0.25em 1.0em;/*上下 左右の余白*/
 color: #494949;/*文字色*/
 background: transparent;/*背景透明に*/
 border-left: solid 10px #faf0e6; /*左線*/
} 


.article h4 {
border: none;
padding: 0;
font-weight:normal;
}
.article h5 {
border: none;
padding: 0;
font-weight:normal;
}
.article h6 {
border: none;
padding: 0;
font-weight:normal;
}


/************************************
/* 記事下関連記事の抜粋の文字を太字から標準に変える
/************************************
.rect-vartical-card .related-entry-card-title {
 font-size: 14px;
 font-weight: normal;
}


/************************************
/* 目次のカスタマイズ
/************************************
/* 目次全体デザイン */
.toc{
 background:#F9F9F9; /* 目次全体の背景色を変える場合はここを変更 */
 border-top:5px solid; color:#FFC679;
 padding: 20px 15px;
}

/* 目次の文字指定 */
.toc-title {
 text-align:left;
 margin: 0 90px 20px -10px;
 padding-left: -20px;
 font-size: 21px;
 font-weight: 600;
 color: #FFC679; /* 目次の文字色を変える場合はここを変更 */
}


/* 目次のアイコン設定 */
.toc-title:before {
 top: 0;
 left: -45px;
 width: 20px;
 height: 20px;
 font-family: "Font Awesome 5 Free";
 content : "\f03a"; /* アイコンを変える場合はここを変更 */
 font-size:20px;
 margin-right:20px;  /* 円の大きさはここで調節 */
 padding:9px;
 color:#FFF; /* アイコンの色を変える場合はここを変更 */
 background-color:#FFC679; /* アイコンの背景色を変える場合はここを変更 */
 border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
}

/* 目次のデザインカスタマイズ */
.toc-content ol {
 padding: 0 0.5em;
 position: relative;
}
.toc-content ol li {
 line-height: 1.5;
 padding: 0.5em 0 0.5em 1.4em;
 border-bottom: dashed 1px silver;
}


/************************************
/* コメント欄のカスタマイズ
/************************************
/*コメントボタンココから*/

.comment-btn {
font-size:20px; /*文字の大きさ*/
font-weight:50; /*文字を太く*/
padding:10px; /*文字周り余白*/
border-radius:4px; /*ボタン角の丸み*/
color:#fff; /*文字色 */
background:#e60033; /*ボタンの背景色 */
transition:all 0.2s; /*色が変わる時間（秒）*/
}

.comment-btn:hover {
color:#e60033; /*マウスオーバー時の文字色 */
background:#F5E6E9; /*マウスオーバー時のボタンの背景色 */
}

/*コメントボタンココまで*/
 

/*送信ボタンの装飾*/

#commentform #submit{
font-size:15px; /*送信ボタン文字の大きさ*/
background-color: #fff; /* 送信ボタンの背景色 */
color: #4f463c; /*送信ボタンの文字色*/
border-radius: 5px; /*送信ボタンの角の丸さ*/
height: 50px; /*送信ボタンの縦幅*/
border-style: solid; 1px;
margin-top:15px; /*送信ボタンとコメント欄の隙間（縦幅）*/
}
/* 送信ボタンココまで */


/************************************
** サイトタイトル 非 表示
************************************/

.site-name-text{
  display: none;
}

/*ヘッダーレイアウトがトップメニューのとき*/
.header-container-in.hlt-top-menu .site-name-text{
  display: none;
}

/*ヘッダーレイアウトがトップメニュー（小）のとき*/
.header-container-in.hlt-top-menu.hlt-tm-small .site-name-text{
  display: none;
}

/*端末幅が768px以下のとき*/
@media screen and (max-width: 768px){
  #header .site-name-text{
    display: none;
  }
}

/*端末幅が480px以下のとき*/
@media screen and (max-width: 480px){
  #header .site-name-text{
    display: none;
  }
}

/************************************
 ● 問い合わせなどメッセージを送信ボタンのカスタマイズ
************************************/
.wpcf7-submit {
  border-radius: 3px!important; /*角丸コーナー*/
  font-size: 18px!important; /*フォントサイズ*/
  color: #fff!important; /*フォントカラー*/
  background-color: #e60033!important; /*背景色*/
  letter-spacing: 10px!important; /*文字間隔*/
}
.wpcf7-submit:hover{
  color: #fff!important; /*フォントカラー*/
  background-color: #EC5C50!important; /*背景色*/
  transition: all 0.8s ease!important; /*アニメーション*/
}

/************************************
 ● アピールエリアのボタンの文字を白にする
************************************/
.appeal-content .appeal-button {
	color: #fff;
}
/* ====================================
** LPフルスクリーン化の強制上書き
==================================== */

/* 1. ページ全体、コンテナ全体のマージン/パディングをゼロにする */
html,
body,
#container,         
#content,           
#main,
.article,
.entry-content,
#inner-content,
.site-content,
.site,
#content-bottom, 
.page-title,
.header-area
{
    padding: 0 !important;
    margin: 0 !important;
}

/* 2. 全てのLP不要要素と余白を作る要素を非表示 */
#header,             
.header-container,   
#navi-in,            /* グローバルナビゲーションを非表示 */
#navi .navi-in > ul li, /* ★グローバルナビの要素の高さを消す */
.breadcrumb-area,    
#content-top,        
.content-top-widget, 
.entry-date,         
#footer,
#wpadminbar         
{
    display: none !important;
    height: 0 !important; /* ★高さをゼロにする */
    padding: 0 !important;
    margin: 0 !important;
}

/* 3. カバーブロックの高さ・幅を強制的にフルスクリーンにする */
.wp-block-cover {
    height: 100vh !important;
    min-height: 100vh !important;
    width: 100vw !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw) !important;
}