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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
body{background-color:transparent;}
a {color: #01285e;}
.header-container, .navi, .main, .sidebar, .footer, .bc-brand-color-white a {background-color:transparent;}
.page-id-2 #header{display:none;}
#post-2 > header > div.eye-catch-wrap{display:none;}
/*
.page-id-2 .content{margin-top:0;}
.page-id-2 .main{padding-top:0;}
.page-id-2 .wp-block-image{margin-bottom:0;}
*/
/*フロント固定ページのタイトルを非表示*/
.home.page .entry-title{display: none;}
/*フロント固定ページの投稿日を非表示*/
/*フロント固定ページの更新日を非表示*/
.page-id-2 .article-header .date-tags {display: none;}
/*フロント固定ページの投稿者名を非表示*/
.home.page .author-info{display: none;}
/*  */
.navi-in a:hover {background-color: #cfcfcf;}
/* 固定ページ日付消去 */
.date-tags {display: none;}
/* h1 */
.article h1.entry-title {position: relative;padding-top: 25px;border-bottom: 1px solid rgba(5,62,98,1);}
.article h1:before {content:"OrinasuKaori";position: absolute;top: 0px;left: -8px;color: rgba(197,196,255,0.15);font-size: 35px;z-index: -1;}
/* h2 */
.article h2 {font-size:1.4em;margin: 10px 1px;color: #555;background-color:transparent;padding: 10px 10px 10px 45px;position: relative;}
.article h2:before {content: '＊*';letter-spacing:-.2em;color: #fff;display: inline-block;font-size: 1.2em;font-weight: bold;position: absolute;top: 0px;left: 0px;transform: rotate(20deg);-moz-transform: rotate(20deg);-webkit-transform: rotate(20deg);-o-transform: rotate(20deg);text-shadow: 0px 0px 6px #a0a0a0, 0px 0px 4px #a0a0a0, 0 0 0.5px #a0a0a0;}
.article h2:after {border-bottom: 2px dotted #888;content: '';position: absolute;bottom: 0px;left: 0px;width: 100%;}
/* h3 */
.article h3 {color:#555;position: relative;margin: 10px 1px;padding: 8px 25px 8px 10px;background: transparent;font-size: 1.2em;font-weight: bold;border: 2px solid #888;border-radius: 3em .5em 2em .5em/.4em 2em .5em 3em;}
.article h3:before, .article h3::after {border-radius: 4px;content: "";height: 100%;position: absolute;width: 100%;}
.article h3::before {left: 0;top: 4px;z-index: -1;}
.article h3::after {top: 5px;left: 5px;z-index: -2;}
/* h4 */
.article h4 {margin: 10px 1px;padding: 10px;background-color: #fff;border-left: 3px dotted rgba(0,0,0,0.2);border-right: 3px dotted rgba(0,0,0,0.2);box-shadow: 0 0 5px rgba(0,0,0,0.3);}
/* h5 */
.article h5 {border:none;margin: 10px 1px;padding:10px 10px;background: -webkit-linear-gradient(left, #555, #ccc);background: -moz-linear-gradient(left, #555, #ccc);background: linear-gradient(left, #555, #ccc);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.article h5:before, .article h5:after {
background: -webkit-gradient(linear, left top, right bottom, from(#555), to(#ccc));background: -moz-linear-gradient(left, #555, #ccc);background: linear-gradient(left, #555, #ccc);content: '';margin: 10px 0px;display: block;height: 1px;width: 100%;}
/* サイドバー */
.sidebar h2, .sidebar h3 {background:transparent;padding: 8px 0px;border-bottom: 2px #999 dotted;letter-spacing: 0.2em;color:#666;}
.sidebar h2:before, .sidebar h3:before {font-family:"Font Awesome 5 Free";content:"\f4d8  ";font-weight: 900;}
/* 新着記事 */
.new-entry-card-date.widget-entry-card-date.display-none {display: block;position: absolute; right: 0;}
.widget-entry-cards.card-large-image .a-wrap {
width:32%;  /*PCで3列*/
display: inline-flex;
text-align: left; /*タイトルを左寄せ*/
}
@media screen and (max-width: 834px) {
.widget-entry-cards.card-large-image .a-wrap {
width:49%;  /*タブレットで2列*/
display: inline-flex;
}
}
@media screen and (max-width: 480px) {
.widget-entry-cards.card-large-image .a-wrap {
width:100%;  /*スマホで1列*/
}
}
/*  */
/*  */
/*  */
/*  */
/*  */
/*  */
/*  */
/*  */
/*  */
/*  */
/*  */
/* SNS */
.sns-buttons a {color: #888;border: 1px solid #aaa;background-color: transparent;}
/* fotter */
.footer-bottom-logo img {height: auto;width: auto;}
/*  */
/*  */
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

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

}

/*712px以下*/
@media screen and (max-width: 712px){
  /*必要ならばここにコードを書く*/
.logo img {
max-width: 60% !important;
}
}

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