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

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

/*----------------------------------*/
/* 投稿日付を非表示                 */
/*----------------------------------*/
.post-date {
    display:none;
}

/*----------------------------------*/
/* ヘッダー文字大きさ変更           */
/*----------------------------------*/
.tagline {
font-size: 20px;
color:#fff!important;
}
@media screen and (max-width: 768px){
.tagline {
font-size: 18px;
}
}

/*----------------------------------*/
/* ヘッダー行間         */
/*----------------------------------*/
.logo-text {
	padding: 0px 0 0;
}
.tagline {
	margin: 0 0 .0em
}

/*----------------------------------*/
/* ヘッダー　フォントスタイル       */
/*----------------------------------*/
.logo-header a span{
font-family: 'Arvo', serif;
font-size:48px;
color:#fff!important;
}

/*----------------------------------*/
/* ホームボタンを非表示   　　　    */
/*----------------------------------*/
#breadcrumb {
  display: none
}

/*----------------------------------*/
/* マテリアル風                     */
/*----------------------------------*/

nav#navi, .menu-header .sub-menu{
    box-shadow: 0 5px 15px -5px rgba(0,0,0,0.2);
}

.menu-header .sub-menu .item-label{
    font-size: 80%;
}
.menu-header .item-label{
    color: #b5b5b5 !important;
}
.menu-header .current-menu-item,
.menu-header .current-post-item,
.menu-header .current-menu-ancestor,
.menu-header .current-post-ancestor,
.menu-header .menu-item:hover {
    color: #333 !important;
    border-bottom: 3px solid #b5b5b5;
    transition: all .2s ease;
}

.menu-header .sub-menu .menu-item,
.menu-header .sub-menu .menu-item:hover{
    border-bottom: none;
}
.menu-header .current-menu-item>a .item-label,
.menu-header .current-post-item>a .item-label,
.menu-header .current-menu-ancestor>a .item-label,
.menu-header .current-post-ancestor>a .item-label,
.menu-header .item-label:hover{
    color: #333 !important;
    transition: all .2s ease;
}

/*----------------------------------*/
/*特定ページのシェア・フォローボタン非表示*/
/*----------------------------------*/
.page-id-428 .sns-share,
.page-id-515 .sns-share,
.page-id-810 .sns-share,
.page-id-428 .sns-follow,
.page-id-515 .sns-follow,
.page-id-810 .sns-follow {
    display: none;
}

/*----------------------------------*/
/* メニュー 文字の大きさ            */
/*----------------------------------*/
#navi .navi-in > .menu-header .item-label{
	font-size: 15px;
}

/*----------------------------------*/
/* 文字　両揃え　　　　             */
/*----------------------------------*/
p {
  text-align: justify;
  text-justify: inter-ideograph;
}

/*----------------------------------*/
フェードインデザイン　　　          */
/*----------------------------------*/
#main{
    animation: fadeIn 1s ease-out 0s 1 normal;
}

@keyframes Down {
    from {transform: translateY(10%); opacity: 0;}
    100% {transform: translateY(0%); opacity: 1;}
}
#header-container {
    animation: Down 1s ease-out 0s 1 normal;
}

@keyframes Down {
    from {transform: translateY(-10%); opacity: 0;}
    100% {transform: translateY(0%); opacity: 1;}
}

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

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

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