@charset "UTF-8";

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

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

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

/* カレンダー編集 */
#calendar_wrap {
  margin-right: -4px;
  margin-left: -4px;
  line-height: normal;
}

#wp-calendar {
  border-collapse: separate;
  border-spacing: 4px;
  border-style: none;
}

#wp-calendar th {
  padding: 2px 0;
  background-color: #f6f6f6;
}

#wp-calendar td,
#wp-calendar th {
  border-style: none;
}

#wp-calendar td a,
#wp-calendar #today a {
  border: solid 1px #ddd;
  border-radius: 4px;
  background-color: transparent;
  text-decoration: none;
}

#wp-calendar td a:hover,
#wp-calendar #today a:hover {
  background-color: #eee;
  transition: .7s;
}

#wp-calendar #today {
  background-color: transparent;
  font-weight: bold;
}

/* サイドバーデザイン編集 */
.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; /*上部にボーダーを引く*/
    font-size: 16px;
}
.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:hover { /*親子共通マウスホバー時*/
    background: none;
    transition: 0.5s;
    color: #e0e0e0;
}
.widget_categories ul li a:hover .post-count { /*記事数のマウスホバー時*/
    background: #e0e0e0;
    color: #333;
    transition: 0.5s;
}
.widget_categories ul li ul { /*子カテゴリのボックス*/
    border-bottom: 1px dotted #ccc;
}
.widget_categories ul li ul li a { /*子カテゴリ用のコード*/
    color: #333;
    text-decoration: none;
    padding: 0 4px 4px 4px;
    display: block;
    border: none;
}
.widget_categories ul li ul li a::before { /*子カテゴリのアイコン*/
    font-family: FontAwesome;
    content: "・";
    padding: 0;
}

/* ウィジットデザイン編集 */
.sidebar h3 {
    background: none;
    font-size: 16px;
    color: #000000;
    letter-spacing: 2px;
    display: inline-block;
    position: relative;
    width: 100%;
    padding: 0;
    text-align: center;
}
.sidebar h3::before, .sidebar h3::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 28%; /*ラインの長さ*/
    border-top: 3px solid #444d53; /*ラインの色*/
}
.sidebar h3::before {
    left: 0;
}
.sidebar h3::after {
    right: 0;
}

/************************************
** ■ホバー時の背景色設定
************************************/
.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-footer-in a:hover,
.tagcloud 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: #e0e0e0; /*背景色*/
  transition: all 0.5s ease; /*アニメーション*/
  color: #333; /*フォントカラー*/
}

/*ナビメニュー下線*/
#navi .navi-in a{
text-decoration: none;
position: relative;
display: inline-block;
}
#navi .navi-in a:after{
position: absolute;
  bottom: -3px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #333;
  transform: scale(0, 1);
  transform-origin: center top;
  transition: transform .3s;
}
#navi .navi-in a:hover::after {
 transform: scale(1, 1);
 }
.navi-in>ul .sub-menu {
background-color: #fff;
opacity: 0.95;
padding-bottom:3px;
}
.post-title {
    font-size: 26px;
    margin: 16px 0;
    line-height: 1.3;
    padding: 0 0 10px 0;
    position: relative;
}

/* 記事タイトルやカテゴリタイトルの見た目をスタイリッシュにする(灰色)*/
.article h1, .archive-title {
	padding: 15px 10px 15px 10px;
	border-bottom: solid 4px #666666;
	background: linear-gradient(#ffffff, #e6e6e6);
	box-shadow: 0 1px 1px 0 #aaa;
}

/* ブログカード内カテゴリ見た目*/
.cat-label {
    top: 0.5em; /*上からの距離*/
    left: 0.5em; /*左からの距離*/
    border: none; /*ボーダーを消す*/
    font-size: 12px; /*文字サイズ*/
    color: #fff; /*文字色*/
    padding: 1px 10px; /*余白*/
    border-radius: 14px; /*角を丸く*/
}

/* カテゴリ表示をしない*/
.cat-label {
display: none;
}

/* インデックスフォントサイズ*/
.entry-card-title {
	font-size: 17px;
} 

/* SNSフォロー・シェアボタンを非表示*/
.page .sns-share,
.page .sns-follow {
    display: none;
}

.ad-related {
  margin-bottom: 20px;
  padding: 5px;
}

@media screen and (min-width: 768px) {
  .ad-related {
    width: 33%;
  }
}

@media screen and (min-width: 356px) and (max-width: 768px) {
  .ad-related {
    width: 49%;
  }
}

@media screen and (max-width: 356px) {
  .ad-related {
    width: 100%;
  }