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

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

/*目次*/
.toc-title {
   font-weight: bolder;
}

.toc {
   width: 70%;
   box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2);
   border-top: 10px solid #cccccc;
   border-color: #cccccc !important;
   margin-bottom: 3em !important;
   background-color: #fff;
}

.toc-list>li a {
   font-weight: bold;
   display: block;
   margin-top: 10px;
   margin-left: 10px;
}

.toc-list>li a::before {
   font-family: "Font Awesome 5 Free";
   content: "\f0da";
   margin-right: 7px;
}

.toc-list>li li a {
   font-weight: normal;
   margin-top: 0;
   margin-left: 2em;
}

.toc-list>li li a::before {
   content: "";
   width: 7px;
   height: 7px;
   left: -2px;
   display: inline-block;
   border-radius: 50%;
   background: #00bf63;
   position: relative;
   margin-bottom: 2px;
}

.toc-list>li li li a::before {
   content: "";
   width: 7px;
   height: 7px;
   left: -2px;
   display: inline-block;
   border-radius: 50%;
   background: #cccccc;
   position: relative;
   margin-bottom: 2px;
}

/*見出し*/
.article h2 {
   padding: 0.5em;
   background: #d0f2d7;
   border-bottom: solid 3px #00bf63;
   margin-top: 2.5em;
}

.article h3 {
   margin-top: 2.5em;
   background-color: #fff;
}

.article h4 {
   font-size: 20px !important;
   color: #00bf63;
   border-bottom: 1px solid #00bf63;
   margin-top: .5em;
   padding-bottom: .5em;
   margin-bottom: 15px;
   border-top: none;
}

.article h5 {
   font-size: 20px !important;
   color: #00bf63;
   border-bottom: 1px solid #00bf63;
   padding-bottom: .5em;
   margin-bottom: 15px;
   border-top: none;
}

.article h6 {
   font-size: 20px !important;
   border-left: 3px solid #00bf63;
   padding: .5em .7em;
   margin-bottom: 15px;
   border-top: none;
   border-bottom: none;
}

/*問い合わせ*/
.wpcf7-form input[type="submit"] {
   border: 2px solid #00bf63;
   background-color: #d0f2d7;
   font-weight: bold;
}

.wpcf7-form input[type="submit"]:hover {
   color: white;
}

/*グローバルメニュー 文字の大きさを変更*/
#navi .navi-in>.menu-header .item-label {
   font-size: 14px;
}

/*マウスオーバー時のメニューの色を変更*/
#navi .navi-in a:hover {
   color: #000000 !important;
   background: #eaf6ee;
   transition: all 0.5s ease;
}

/*メインカラム背景色*/
.main {
   background-color: #F6F8F5;
}

/*サイドバー*/
#sidebar {
   border-radius: 16px;
   border: 1px solid #e9eee9;
   font-size: 15px;
}

.sidebar h3 {
   font-size: 14.5px;
   font-weight: 700;
   color: #1c2b24;
   border-bottom: 1px solid #eef2ee;
   align-items: center;
   background-color: #fff;
   border-left: 3px solid #00bf63;
}

/* カテゴリラベル */
.cat-label {
   font-size: 11px;
   line-height: 1.8;
   padding: 3px 10px;
	border-radius: 30px;
   border: 0;
}

/*フォント*/
.font-bold {
   font-weight: bold;
}

.font-large {
   font-size: larger;
}

.font-small {
   font-size: smaller;
}

@media (min-width: 769px) {
   .mb-only {
      display: none;
   }
}

@media screen and (max-width: 768px) {
   .pc-only {
      display: none;
   }

   .toc {
      width: 100%;
   }
}

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

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

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