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

/* ============================================================
   1. 最優先：タグライン（キャッチフレーズ）の背景透過と▼消去
   ============================================================ */
#header .tagline,
.header-in .tagline,
.tagline {
    background-color: rgba(0, 0, 0, 0.2) !important; /* 20%の薄さ */
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: none !important;
    box-shadow: none !important;
    border-radius: 50px;
    background-image: none !important;
    position: relative;
    color: #c5a059 !important; /* 文字をゴールドに */
    font-family: 'Noto Serif JP', serif;
    letter-spacing: 0.15em;
    font-size: 1.1rem;
    text-align: left;
    padding-left: 18px;
    margin: 0 0 .6em;
}

/* 吹き出しの三角形（▼）を徹底排除 */
.tagline::before, 
.tagline::after, 
.header-container-in::before, 
.header-container-in::after,
#header .header-container-in::after,
.tagline-arrow {
    display: none !important;
    content: none !important;
    border: none !important;
    width: 0 !important;
    height: 0 !important;
}

/* ============================================================
   2. ヘッダー・ロゴ周りの調整
   ============================================================ */
.header { background-color: #1a1a1a !important; }
.header-in .logo { text-align: left; padding-left: 0px; }
.site-name-text-link { 
    font-size: 18px; 
    text-align: left; 
    font-family: 'Noto Serif JP', serif; 
    letter-spacing: 0.2em; 
}
.logo-text { padding: 10px 0 0; }

/* ============================================================
   3. 目次（TOC）とアニメーション修正（閉じ括弧ミスを修正済）
   ============================================================ */
@keyframes slide {
    100% { opacity: 1; padding-left: 1.2%; }
}

.toc ul li:before {
    font-family: "Font Awesome 5 Free"!important;
    content: "\f138";
    position: absolute!important;
    left: -0.3em!important;
    color: #f8c678;
    font-weight: 900;
    opacity: .4;
    animation: slide 1.5s infinite;
}

.toc {
    background: #f9f9f9!important; border: 0!important; display: block!important;
    border-top: 5px solid #f8c678 !important; box-shadow: 0 2px 2px rgba(0,0,0,.2)!important;
    padding: 20px 32px 7px 32px!important; margin-bottom: 5%!important; width:95%; border-radius:10px;
}
@media screen and (min-width:600px){ .toc { padding: 20px 35px 15px 35px!important; width:70%; } }

/* ============================================================
   4. プロフィール・トップページ非表示設定
   ============================================================ */
.home.page .entry-eye-catch, 
.home.page .entry-title,
.home.page .post-update,
.home.page .post-date,
.home.page .author-info {
    display: none !important;
}

.author-description, .author-content { color: #111111 !important; line-height: 1.8; font-weight: 500; }
.author-name { color: #000000 !important; border-bottom: 1px solid #bfa16e; }

/* ============================================================
   5. その他調整（SNS・スマホ用設定）
   ============================================================ */
.sns-follow-buttons { justify-content: center; }
.sns-follow-buttons a { width: 45px; height: 1.2em; margin: 0px 20px 10px 0px; font-size: 24px; }

@media screen and (max-width: 480px) {
    .tagline {
        font-size: 10px !important;
        padding: 10px 15px !important;
        width: 90% !important;
        margin: 10px auto !important;
    }
}
/* モバイル環境でも全ての吹き出し装飾を完全に消す */
@media screen and (max-width: 480px) {
    .tagline::before, 
    .tagline::after, 
    .header-container-in::before, 
    .header-container-in::after,
    #header .header-container-in::after,
    .tagline-arrow {
        display: none !important;
        content: none !important;
        border: none !important;
        width: 0 !important;
        height: 0 !important;
    }
}