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

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



/* ===================================
   ヘッダー全体を透明にして背景タイルを見えるようにする
   =================================== */
#header-container,
#header-container-in,
#header,
#header-in {
    background: transparent !important;
    background-image: none !important;
}

/* ===================================
   ページ全体に背景タイルを敷き詰める
   =================================== */
body {
    background-image: url('https://bbs.wareko.jp/wp-content/uploads/2026/01/ba.gif');
    background-repeat: repeat;
    background-position: top left; 
    background-size: auto;
}

/* ===================================
   サイトタイトル（文字サイズ・シャドウ・色）
   - clamp()を使ってレスポンシブ対応
   - ヘッダー内のspan.site-name-textのみ対象
   =================================== */
#header-in span.site-name-text {
    font-size: clamp(24px, 5vw, 48px); /* 最小24px、最大48pxで可変 */
    color: #522684;
    text-shadow: 0px 1px 9px rgb(80 65 65 / 95%);
}

#_header-in span.site-name-text {
    font-size: clamp(24px, 5vw, 48px); /* 画面幅に応じた自動調整 */
    color: #6a3fa6;                   /* 少し柔らかめの紫色 */
    font-weight: 600;                  /* 少し太めで角ばった印象を緩和 */
    text-shadow: 
        0 0 2px rgba(0,0,0,0.2),     /* 軽い内側の影で丸み感 */
        0 1px 6px rgba(0,0,0,0.15);  /* 上方向に薄い影で立体感 */
    letter-spacing: 0.02em;           /* 文字間をわずかに広げて角ばり感を軽減 */
}


/* ===================================
   サイト説明（タグライン）
   - 背景色・文字色・左右パディング
   =================================== */
#site-description {
    display: inline;
    background-color: #dfdfdf;
    color: black;
    padding-left: 20px;
    padding-right: 20px;
}

/* ===================================
   サイドバー・メインの背景色
   =================================== */
#sidebar {
    background-color: #CCFFCC;
}

#main {
    background-color: #CCFFCC;
}

/* ===================================
   bbPressフォーラムのスタイル
   =================================== */
#bbpress-forums {
    background: transparent;
    clear: both;
    margin-bottom: 20px;
    overflow: hidden;
    font-size: 18px !important;
}

#new-post > fieldset > div > fieldset > p:nth-child(4) {
    display: none;
}




/* ===================================
   SNSボタン、Followsボタンをコンパクトにする
   =================================== */
#main .sns-share-buttons a,
#main .sns-follow-buttons a {
    font-size: 20px;  /* アイコンサイズ */
    width: 32px;      /* ボタン幅 */
    height: 32px;     /* ボタン高さ */
    padding: 0 4px;   /* ボタン間の余白を少し詰める */
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* ボタン内の文字（キャプション）を非表示 */
#main .button-caption {
    display: none;
}





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

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

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