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

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

/* HTML5対応のため各種文字のクラスを設定 */
.red { color: red; }
.black { color: black; }
.blue { color: blue; }
.purple { color: rgb(184, 65, 114)}

/* 太さ */
.bold { font-weight: 700; }
.normal { font-weight: normal; }

/* 文字サイズ */
.fs08 { font-size: 80%; }
.fs0 { font-size: 100%; }
.fs1 { font-size: 120%; }
.fs2 { font-size: 150%; }
.fs3 { font-size: 200%; }

/*通知エリアの文字設定*/
.notice-area {
text-align: center;
padding: 0.5em;
font-size: 1.0em;
font-weight: bold;
}

/* コメント欄前の文字サイズ */
#commentform > p.logged-in-as{
    font-size: 16px;
}

/*パンくずデザイン*/
#breadcrumb .breadcrumb-caption{
    color:rgb(17, 17, 204);
    text-decoration-line: underline;
}
#breadcrumb > div.breadcrumb-home > span.fa.fa-home.fa-fw{
    color:rgb(17, 17, 204);
}
#breadcrumb > div.breadcrumb-item > span{
    color:rgb(17, 17, 204);
}
#breadcrumb{
    font-size:120%;
    font-weight:bold;
}
/* タグデザイン */
.tag-link{
    font-size: 13px;
    color:rgb(17, 17, 204);
}

      /* 会員レベルで文字色を変える */
      .navi{/*背景は黒*/
        background-color: #222;
       }
    
       /* 一般人の文字色は白 */
       .menu-item a {
               color: #fff;
               font-size: 18px;
               font-weight: normal; 
       }
        /* 管理人の文字色は黄色 */
        body.swpm-level-2 .menu-item a {
               color: #F0FB0D;
    }
       /* お試し会員の文字色は青 */
       body.swpm-level-3 .site-name-text{
            color: #00c2ff;
       }
       body.swpm-level-3 .menu-item a {
            color: #00c2ff; 
            font-size: 20px;
       }
       /* １年会員の文字色は紫 */
       body.swpm-level-4 .site-name-text{
            color: #ff99cc;
            /*color: #ee82ee;*/
        }
       body.swpm-level-4 .menu-item a {
               color: #ff99cc;
               /*color: #ee82ee;*/
       }
              /* 半年会員の文字色も紫 */
              body.swpm-level-9 .site-name-text{
                color: #ff99cc;
                /*color: #ee82ee;*/
            }
            body.swpm-level-9 .menu-item a {
                   color: #ff99cc;
                   /*color: #ee82ee;*/
           }

        /* 期限切れ会員の文字色は茶色 */
        body.swpm-level-7 .site-name-text{
            color: #BE574B;
        }
        body.swpm-level-7 .menu-item a {
               color: #BE574B;
        }
        /* 支払い前会員は緑 */
        body.swpm-level-8 .site-name-text{
            color: #35f705;
        }
        body.swpm-level-8 .menu-item a {
            color: #35f705;
        
        }
        /* お試し会員は「会員様情報」を消す */
        /* 消さない2025.4.12 */
        /*body.swpm-level-3 #menu-item-2878{
            display: none;
        }*/
        body.swpm-level-3 #menu-item-2879{/* 会費のお支払い を消す*/
            display: none;
        }

       /* １年会員は「お試しレポ」と「お支払い」を消す */
       body.swpm-level-4 #menu-item-2874,
       body.swpm-level-4 #menu-item-2879{/* 会費のお支払い */
        display: none;
       }
              /* 半年会員は「お試しレポ」と「お支払い」を消す */
              body.swpm-level-9 #menu-item-2874,
              body.swpm-level-9 #menu-item-2879{
               display: none;
              }

        /* 期限切れ会員は「お試しレポ」と「会員様情報」を消す */
        body.swpm-level-7 #menu-item-2874,
        body.swpm-level-7 #menu-item-2878{
            display: none;
        }
        /* 支払い前会員は「お試しレポ」「会員様情報」「レポ投稿」「当サイトについて」
        　「運営からのお知らせ」「お問い合わせ」を消す */
        body.swpm-level-8 #menu-item-2874,
        body.swpm-level-8 #menu-item-2879,/* 会費のお支払い */
        
        /* body.swpm-level-8 #menu-item-2875,/* お問い合わせ */
        /* body.swpm-level-8 #menu-item-2876,/* レポ投稿 */
        /* body.swpm-level-8 #menu-item-2878,/* 会員様情報 */
        body.swpm-level-8 #menu-item-3477,
        body.swpm-level-8 #menu-item-2880{
            display: none;
        }
        /* 会費のお支払い　は太字　*/
        /*body.swpm-level-8 #menu-item-2879 > a > div > div{
            font-size: 22px;
            font-weight: bold;
        }*/

/* タイトル下にログイン状態を表示 */
.membership-rank-message {
    margin: 0;
  padding: 0;
  font-size: 1.0em;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/

/*PC:1024px以上 */
@media screen and (min-width: 1024px){
    .responsive{
        display:none;
    }
}

/*PC：1023px以下*/
@media screen and (max-width: 1023px){
  
.tagline{
    font-size:16px;
}
.site-name-text {
    font-size: 28px;
}
.item-label{
    font-size: 20px;
    font-weight: normal;
}
}

/*タブレット：834px以下*/
@media screen and (max-width: 834px){
#header-in > h1 > a > span{
    font-size: 22px;
}
.tagline{
    font-size:14px;
}
.item-label{
    font-size: 18px;
    font-weight: normal;
}
.sidebar a {
    text-decoration: none;
}
}

/*480px以下*/
@media screen and (max-width: 480px){
#header-in > h1 > a > span{
    font-size: 20px;
}
    .tagline{
        font-size:12px;
    }
    .item-label{
        font-size: 16px;
        font-weight: normal;
    }

    #mega-menu-wrap-max_mega_menu_1 #mega-menu-max_mega_menu_1{
        font-size: 18px;
    }
    .sidebar a {
        text-decoration: none;
    }
}

/*ロゴ文字の上下paddingは少なめに*/
.logo-text{
    padding: 0px 0 10px 0px;
}

/*地区メニューは常に表示*/
/*#mega-menu-wrap-max_mega_menu_1 #mega-menu-max_mega_menu_1{
	display: block;
	visibility: visible;
	text-align: center;
    padding: 10px 0px 10px 0px;
    }*/

/*地区メニューのpaddingはゼロに*/
#mega-menu-wrap-max_mega_menu_1 #mega-menu-max_mega_menu_1{
    padding: 0px 0px 0px 0px;
}
/*地区メニューと記事の間の下の間抜けなマージンを消す*/
#maxmegamenu-2{
    margin-bottom: 0px;
}
  /*メガメニューの上下マージン０に*/
  .content-top, .content-bottom {
    margin: 1em 0;
    margin-top: 0em;
    margin-right: 0px;
    margin-bottom: 0em;
    margin-left: 0px;
  }
/*/////////////////////////////*/
/***　ここからサイドバーの調整　***/
/*/////////////////////////////*/
      .sidebar{
        font-size: 14px;
        font-family: Arial, Helvetica, sans-serif;
    }
    .sidebar{
        padding-left: 1.0%;
        padding-right: 0.5%;
    }
  ul {
    box-sizing: content-box;
    padding-left: 20px;
    padding-right: 5px;
  }
  
    /* リストアイテムのスタイルをシンプルに */
   .widget_categories li {
        list-style-type: none; /* リストマーカーを消す */
    }
  
  /*階層レベルによって表示を変える*/
  .cat-item {
      font-size:14px;
  }
  
  /* 子カテゴリのマーカーを四角に */
  .cat-item .children .cat-item {
      font-size:14px;
  }
  
  /* 子カテゴリのさらに下の階層 */
  .cat-item .children .children .cat-item {
      font-size:14px;
  }
  ::marker{/*マーカーを消す（サイドバー）*/
    list-style-type:none;
    /*font-size: 0.7em;*/
  }
  ::marker{content:'';}

    /* カテゴリーリストのリンクのボックス表示を解除 */
    .widget_categories li, 
    .widget_categories li a {
        display: inline; /* インライン表示に変更 */
        background: none; /* 背景色を解除 */
        padding: 0; /* 余白を解除 */
        border: none; /* 枠線を解除 */
    }

.cat-item a::before {/*ビフォアを消す（サイドバー）*/
  content: '';
}
  
.cat-item .children a::before {/*子カテゴリのビフォアを消す（サイドバー）*/
  content: '';
}

#sidebar > ul > li > a {
    text-decoration: none; /* 下線を無効化 */
}
#sidebar > ul > li.cat-item{
    text-decoration: none;
}
#sidebar > ul > li.cat-item > ul > li.cat-item > ul > li > a > span{
    text-decoration: none;
}
#sidebar a {/* サイドバーの表示は下線無し */
    text-decoration: none;
    }

/* iphoneの「・」を消す*/
.sidebar ul,
.sidebar ol {
    list-style: none; /* デフォルトの箇条書きを消す */
    margin: 0;
    padding: 0;
    text-decoration: none;
}
/* サイドバーのリスト階層のインデントを復元 */
.sidebar ul {
    list-style: none; /* リストの記号を非表示（変更済み） */
    padding-left: 0px; /* 階層ごとのインデント */
    text-decoration: none;
}

.sidebar ul ul { /* 階層レベル2 */
    padding-left: 30px; /* レベル1のインデントに追加 */
    text-decoration: none;
}

.sidebar ul ul ul { /* 階層レベル3 */
    padding-left: 30px; /* レベル2のインデントに追加 */
    text-decoration: none;
}

/* サイドバーのリスト項目カスタマイズ（必要に応じて） */
.sidebar ul li::before {
    content: ""; /* カスタム記号や番号を追加したい場合 */
    display: inline-block;
    margin-right: 5px;
}

/***以上サイドバー***/

/* CF7チェックボックスとラジオボタンを縦並びに */
/*span.wpcf7-list-item {
    margin-top:5px;
    display: block;
}*/

    /*reCAPTCHAバッジを消す*/
    .grecaptcha-badge { visibility: hidden; }
    
    /* 会員様情報の無駄を消す　*/
    .swpm-lastname-row{
    display:none;
    }
    .swpm-phone-row{
    display:none;
    }
    .swpm-street-row{
    display:none;
    }
    .swpm-city-row{
    display:none;
    }
    .swpm-state-row{
    display:none;
    }
    .swpm-zipcode-row{
    display:none;
    }
    .swpm-country-row{
    display:none;
    }
    .swpm-company-row{
    display:none;
    }

    /* CF7アンケートの必須入力の表示 */
    .required-label {
    color: blue;
    margin-left: 5px;
    }

    /* CF7の「入力してください」を赤太字に　*/
    .wpcf7-not-valid-tip{
        color: red;
        font-weight: bold;
    }
    
    /* myCredの改行をなくす　*/
    p {
        white-space: nowrap;
    }
    
    /* カスタムボタン　*/
    form input[type="submit"].custom-button{
        /* ボタンの背景色 */
        background-color: #4CAF50;
        /* ボタンの文字色 */
        color: white; 
        /* ボタンの内側余白 */
        padding: 10px 20px;
        /* ボタンの境界線を無し */
        border: none; 
        /* 角を丸くする */
        border-radius: 15px; 
        /* ポインタを指カーソルに */
        cursor: pointer;
        /* フォントサイズ */
        font-size: 16px; 
        /* 文字を中央に */
        text-align: center;
        /* インラインブロックに */
        display: inline-block; 
        /* 上の余白 */
        margin-top: 10px; 
        /* 横幅を150pxに設定 */
        width: 150px;
    }
    
    p {
        word-break: break-word; /* 単語が長すぎる場合は自然に折り返す */
        white-space: normal;    /* 通常のスペース処理（必要に応じて改行） */
    }
    
    /*　送信ボタンのスタイル */
    .join-button .wpcf7-previous{
      display       : inline-block;
      border-radius : 15px;          /* 角丸       */
      font-size     : 16pt;        /* 文字サイズ */
      text-align    : center;      /* 文字位置   */
      cursor        : pointer;     /* カーソル   */
      padding       : 12px 12px;   /* 余白       */
      background    : #000066;     /* 背景色     */
      color         : #ffffff;     /* 文字色     */
      line-height   : 1em;         /* 1行の高さ  */
      transition    : .3s;         /* なめらか変化 */
      box-shadow    : 6px 6px 3px #666666;  /* 影の設定 */
      border        : 2px solid #000066;    /* 枠の指定 */
    }
    .join-button:hover {
      box-shadow    : none;        /* カーソル時の影消去 */
      color         : #000066;     /* 背景色     */
      background    : #ffffff;     /* 文字色     */
    }
    /*　送信ボタンのスタイル */
    input[type="submit"] {
      display       : inline-block;
      border-radius: 100vh;          /* 丸く       */
      width: 340px;
      font-size     : 18pt;        /* 文字サイズ */
      text-align    : center;      /* 文字位置   */
      cursor        : pointer;     /* カーソル   */
      padding       : 12px 12px;   /* 余白       */
      background    : #000066;     /* 背景色     */
      color         : #ffffff;     /* 文字色     */
      line-height   : 1em;         /* 1行の高さ  */
      transition    : .3s;         /* なめらか変化 */
      box-shadow    : 6px 6px 3px #666666;  /* 影の設定 */
      border        : 2px solid #000066;    /* 枠の指定 */
    }
    input[type="submit"]:hover {
      box-shadow    : none;        /* カーソル時の影消去 */
      color         : #000066;     /* 背景色     */
      background    : #ffffff;     /* 文字色     */
    }

    input.payment_button{/* 「〇〇で***円を支払う」ボタンは幅広に */
        width: 100%;          /* 親要素の幅いっぱいにする */
        max-width: 480px;     /* ボタンの最大幅を設定（適宜調整） */
        white-space: normal;  /* テキストが長い場合は折り返す */
        word-wrap: break-word; /* 必要に応じて改行 */
    }
        input[type="submit"] {
      display       : inline-block;
      border-radius: 100vh;          /* 丸く       */
      width: 340px;
      font-size     : 18pt;        /* 文字サイズ */
      text-align    : center;      /* 文字位置   */
      cursor        : pointer;     /* カーソル   */
      padding       : 12px 12px;   /* 余白       */
      background    : #000066;     /* 背景色     */
      color         : #ffffff;     /* 文字色     */
      line-height   : 1em;         /* 1行の高さ  */
      transition    : .3s;         /* なめらか変化 */
      box-shadow    : 6px 6px 3px #666666;  /* 影の設定 */
      border        : 2px solid #000066;    /* 枠の指定 */
    }
    input[type="submit"]:hover {
      box-shadow    : none;        /* カーソル時の影消去 */
      color         : #000066;     /* 背景色     */
      background    : #ffffff;     /* 文字色     */
    }

    input.payment_button{/* 「〇〇で***円を支払う」ボタンは幅広に */
        width: 100%;          /* 親要素の幅いっぱいにする */
        max-width: 480px;     /* ボタンの最大幅を設定（適宜調整） */
        white-space: normal;  /* テキストが長い場合は折り返す */
        word-wrap: break-word; /* 必要に応じて改行 */
    }
    button.payment_button { 
        display       : inline-block;
        border-radius : 100vh;          /* 丸く       */
        width         : 340px;
        font-size     : 18pt;        /* 文字サイズ */
        text-align    : center;      /* 文字位置   */
        cursor        : pointer;     /* カーソル   */
        padding       : 12px 12px;   /* 余白       */
        background    : #000066;     /* 背景色     */
        color         : #ffffff;     /* 文字色     */
        line-height   : 1em;         /* 1行の高さ  */
        transition    : .3s;         /* なめらか変化 */
        box-shadow    : 6px 6px 3px #666666;  /* 影の設定 */
        border        : 2px solid #000066;    /* 枠の指定 */
        white-space   : normal;  /* テキストが長い場合は折り返す */
        word-wrap     : break-word; /* 必要に応じて改行 */
        max-width     : 480px;     /* ボタンの最大幅を設定（適宜調整） */
  }
  
  button.payment_button:hover {
        box-shadow    : none;        /* カーソル時の影消去 */
        color         : #000066;     /* 文字色     */
        background    : #ffffff;     /* 背景色     */
  }
  

    .cf7-button{
        display       : inline-block;
        border-radius: 100vh;          /* 角丸       */
        width: 200px;
        font-size     : 14pt;        /* 文字サイズ */
        text-align    : center;      /* 文字位置   */
        cursor        : pointer;     /* カーソル   */
        padding       : 12px 12px;   /* 余白       */
        background    : #ffffff;     /* 背景色     */
        color         : #000066;     /* 文字色     */
        line-height   : 0.8em;         /* 1行の高さ  */
        transition    : .3s;         /* なめらか変化 */
        /*box-shadow    : 6px 6px 3px #666666;  影の設定 */
        border        : 2px solid #000066;    /* 枠の指定 */
        margin-top: 10px; /* ボタンの上に10ピクセルに指定 */
        margin-bottom: 10px; /* ボタンの下に10ピクセルに指定 */
      }

    /*CF7の「入力してください」表示*/
    .required::after {
        content: "必須";
        color: #ffffff;
        background: #cc0000;
        font-size: 0.8em;
        padding: 0.3em;
        border-radius: 0.5em;
        margin-left:0.3em;
    }
    /*CF7フォームの調整*/
    text{
        width:100%;
    }
    
    .wpcf7 text{/* これでは効いてない　*/
        width: 85%;
    }

    /*selectの幅*/
    select{
        width:50%;
      }
      /*numberの幅*/
    number{
        width:30%;
      }

    .entry-content .cf{
        font-size: 16px;
        font-family: apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    }

        /* 目次のタイトルのスタイル */
.toc-title {  /* 目次タイトルのクラスがある場合 */
    font-size: 20px;  /* 文字サイズ */
    font-weight: bold;
}
/* 目次のタイトルのスタイル */
.toc-content {  /* 目次タイトルのクラスがある場合 */
    font-size: 18px;  /* 文字サイズ */
    font-weight: bold;
}

/* 目次リストの番号付けをリセット */
.toc-title, .toc-title li {
    list-style: none; /* デフォルトのリストスタイルをリセット */
    counter-reset: section; /* カウンタをリセット */
}

/* 目次の各項目にカウンタを適用 */
.toc-list li::before {
    counter-increment: section; /* カウンタをインクリメント */
    content: counter(section) ". "; /* カウンタの内容を表示 */
    font-weight: bold; /* 太字に設定（任意） */
}

/* iphone向けに調整　　*/
/* TOCリストの番号付けをリセット */
.toc-list li::marker {
    content: none;
}

/* 目次の番号付けをカスタムで表示（必要なら） */
.toc-list {
    list-style-type: none;
    counter-reset: toc-counter;
}

.toc-list li {
    counter-increment: toc-counter;
}

.toc-list li::before {
    content: counter(toc-counter) ". ";
    margin-right: 5px;
}

/*//////////////////////*/
/*これ以降検索フォーム表示*/

/*body.swpm-level-2{
    display: none;
}おぞましい間違い　管理人がログインしたら画面真っ白*/

/*
.search-filter-form {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.search-filter-form .sf-field {
    flex: 0 0 calc(33.33% - 10px); /* 3列 *
    margin-bottom: 20px;
}
*/

/* チェックボックスの親要素を中央揃え */
.textwidget.custom-html-widget{
    display: flex;
    flex-direction: column;   /* 子要素を縦並びにする */
    /*justify-content: center;*/
    align-items: center; /* 子要素を左右中央寄せ */
    margin: 0;
}
/* チェックボックスのスタイル */
.toggle-search {
    position: relative; /* ラベルに対するスタイルを独立させる */
    display: block; /* ブロックとして扱う */
    text-align: center; /* テキスト中央揃え */
    cursor: pointer; /* マウスカーソルを指マークに */
}

/* 初期状態で検索フィールドは非表示 */
.search-fields {
    display: none;
}

/* デフォルトではトグルボタンを非表示にする */
/*label[for="toggle-search"] {*/
/*****2024.12.11 非会員にも公開 *****
.textwidget.custom-html-widget{
    display: none;
}
************************************/

/* 管理人（レベル2）と有料会員（レベル4と9）にはトグルボタンを表示 */
body.swpm-level-2 .textwidget.custom-html-widget,
body.swpm-level-9 .textwidget.custom-html-widget,
body.swpm-level-4 .textwidget.custom-html-widget {
    /*display: inline-block;*/
    display: block;
}

/* チェックボックスがチェックされたときに検索フィールドを表示 */
#toggle-search:checked + .search-fields{
    display: block;
}

/* 検索フィールドを非表示にしたときの余白をなくす */
#toggle-search + .search-fields {
    margin-top: 0;
}

/* ラベルをボタン風にスタイリング */
label[for="toggle-search"] {
    margin-top: 0;
    width: 100%;
    border: 1px solid #333;
    font-weight:bolder;
    font-size: 18px;
    text-align:center;
    display: inline-block;
    background-color: #FFD7E9;
    color: rgb(3, 3, 3);
    padding: 5px 20px;
    border-radius: 10px;
    cursor: pointer;
}
label[for="toggle-search"]:hover {
    font-weight: bold;
}

/* 絞り込みスライダーの設定 */
.search-fields{
    width: 95%;      /* スライダーの幅を全体の95%に設定 */
    margin: 0 auto;     /* 中央寄せ */
}

.search-filter-component-range-slider__range-text{
    font-size: 15px;
    font-weight: bold;
}

.hime-submit{/*「この条件でを絞り込む」ボタン*/
    font-weight:bold;
}

/***ここまでS&F Pro絞り込み検索***/
/*/////////////////////////////*/

/*プロフール編集ページで「表示名」を表示しない（変更させない）→2025.3.29　表示させる*/
/*.page-id-871 .swpm-profile-form-row label[for="first_name"] {
    display: none;
}
*/

/* 「アカウントを削除する」を表示しない　*/
#swpm-profile-form > div.swpm-profile-account-delete-section > a > div{
    display: none;
}

/*ログインページの「会員について」を消す*/
#register{
    display: none;
}
/* CF7 Multi-Step Formの確認ページでちゃんと改行する */
.page-id-1533 p {
  white-space: pre-wrap;
}

/* ヘッダー検索ウィジェットをタイトル右に配置 */
.header-in{
    position: relative;
}

.header-in .search-box{
    position: absolute;
    top: 50%;
    right: 16px;
    margin: 0;
    width: 200px;
    transform: translateY(-10%);
}

.header-in input[type="text"]{
    padding: 6px 8px 6px 20px;
    font-size: 14px;
    background: #edf6f9;
    border: 1px solid #9fcde1;
    border-radius: 30px;
}

/* 検索窓のplaceholder文字色 */
#header-in > div.header-widget-area > div > form > button > span{
    color: rgb(100,100,100);
}
/* モバイルでは検索窓（ヘッダーのウィジェットエリア）を非表示に */
@media screen and (max-width: 1023px){
    .header-widget-area{
        display: none;
    }
}
#post-600 > div > figure > img{
    width: 50%;
    object-fit: contain;
}
#ichiran > div > p.has-text-align-left > img,
#post-739 > div > figure > div > table > tbody > tr:nth-child(4) > td:nth-child(2) > img{
    vertical-align:bottom;
}

/*モバイルフッターのアイコン*/
#sidebar-menu-open > span.sidebar-menu-icon.menu-icon{
    color: #ff99cc;
}
/*モバイルフッターの文字*/
#sidebar-menu-open > span.sidebar-menu-caption.menu-caption{
    color: #ff99cc;
    font-weight: bold;
    font-size: 14px;
}

/* モバイルフッターの文字を膨らむ・縮むアニメーション */
@keyframes pulse {
    0% {
      transform: scale(1);   /* 通常の大きさ */
    }
    50% {
      transform: scale(1.2); /* 1.2倍に膨らむ */
    }
    100% {
      transform: scale(1);   /* 元の大きさに戻る */
    }
  }

  /* 支払い前の「会費お支払い」をブリンク */
  /*
  body.swpm-level-8 #menu-item-2879 > a > div > div{
    display: inline-block;
    animation: pulse 2s infinite;
    font-size: 20px;
  }*/
  
  /* アニメーションを適用する要素 */
  /* レポリストに適用したがちょとウザいので一旦ヤメ 1秒ごとに膨らんだり縮んだり */
  #sidebar-menu-open > span.sidebar-menu-caption.menu-caption{
    display: inline-block;
    animation: pulse 1.5s infinite;
  }

  /* 通知エリアを少しだけ膨張アニメーション */
  @keyframes small-pulse {
    0% {
      transform: scale(1);   /* 通常の大きさ */
    }
    50% {
      transform: scale(1.02); /* 1.02倍に膨らむ */
    }
    100% {
      transform: scale(1);   /* 元の大きさに戻る */
    }
  }
  /*通知エリアに適用したがウザいので一旦ヤメ）3秒ごとに無限ループ） */

  #notice-area > span{
    display: inline-block;
    /* animation: small-pulse 2s infinite; 文字数が多いとウザいのでアニメーション一旦ヤメ*/
    font-size: 20px;
  }


  /* ★お試しレポ★　をブリンクさせる */
  #menu-item-2874 > a > div > div{
    display: inline-block;
    animation: small-pulse 1s infinite;
    font-size: 22px;
    font-weight: bold;
  }

    /* 横並びのボタン */
    .yoko{

      border-radius: 100vh;          /* 丸く       */
      font-size     : 14pt;        /* 文字サイズ */
      text-align    : center;      /* 文字位置   */
      cursor        : pointer;     /* カーソル   */
      padding       : 8px 8px;   /* 余白       */
      background    : #000066;     /* 背景色     */
      color         : #ffffff;     /* 文字色     */
      line-height   : 1em;         /* 1行の高さ  */
      transition    : .3s;         /* なめらか変化 */
      box-shadow    : 6px 6px 3px #666666;  /* 影の設定 */
      border        : 2px solid #000066;    /* 枠の指定 */  
      margin-right: 10px; 
    }
    .yoko:hover {
        box-shadow    : none;        /* カーソル時の影消去 */
        color         : #000066;     /* 背景色     */
        background    : #ffffff;     /* 文字色     */
      }

      .yoko-auto{
            border-radius: 100vh; /* 丸い形状 */
            width: auto; /* テキストの長さに応じた幅 */
            max-width: 100%; /* 画面幅を超えない */
            font-size: 14pt; /* 文字サイズ */
            text-align: center; /* 文字位置 */
            cursor: pointer; /* カーソル */
            padding: 8px 16px; /* 余白 */
            background: #000066; /* 背景色 */
            color: #ffffff; /* 文字色 */
            line-height: 1.4em; /* 行の高さ */
            transition: .3s; /* なめらか変化 */
            box-shadow: 6px 6px 3px #666666; /* 影 */
            border: 2px solid #000066; /* 枠 */
            margin-right: 10px;
            word-wrap: break-word; /* 長い単語を折り返し */
            white-space: normal; /* テキストの改行を許可 */
            display: inline-block; /* インラインブロック */
            text-align: center; /* テキスト中央揃え */       
      }
      .yoko-auto:hover {
          box-shadow    : none;        /* カーソル時の影消去 */
          color         : #000066;     /* 背景色     */
          background    : #ffffff;     /* 文字色     */
        }

  /* ボタンの親コンテナ */
  .button-container {
    display: flex;        /* 横並びに配置 */
    gap: 30px;            /* ボタン間のスペースを10pxに設定 */
  }

  /*.button-container input {
    word-break: break-word; /* テキストが長い場合の改行 */
  /*}*/
/* PCサイズ（1023px以下）の場合 */
@media screen and (min-width: 834px) {
    .yoko {
    width: 280px;
      font-size: 20px; /* フォントサイズを18pxに変更 */
      white-space: nowrap;  /* <br>を改行させないようにする */
      margin-right: 20px;
    }
  }

  .yoko:last-child {
    margin-right: 0;  /* 最後のボタンにはマージンを設定しない */
  }

/* 検索結果ページでは適用しない */
.search .entry-card-title::after {
    content: none;
}

/* 固定ページには適用しない */
.page .entry-card-title::after {
    content: none;
}

/* スマホの時でもブログカードに抜粋を表示 */
@media screen and (max-width: 768px) {
    .entry-card-snippet {
      display: block !important; /* 強制的に表示 */
      max-height: 3.6em; /* 3行まで表示 */
      overflow: hidden; /* 長すぎる場合は省略 */
    }
  }
  div > div.entry-card-snippet.card-snippet.e-card-snippet{
    position: relative; /* 相対位置を指定 */
}

div > div.entry-card-snippet.card-snippet.e-card-snippet::after {
    content: "この体験レポを読む 👆"; /* 表示するテキスト */
    color: rgb(216, 24, 82); /* 赤字にする */
    font-weight: bold; /* 太字にする */
    font-size: 14px; /* 適切なサイズ */
    background: rgba(255, 255, 255, 0.7); /* 背景を薄い白にして読みやすく */
    padding: 5px 0px; /* 文字周りの余白 */
    border-radius: 5px; /* 角を少し丸く */
    display: block; /* ブロック要素として表示 */
    margin-top: 0px; /* 余白を増やして下げる */
}

/* ブログカードの更新日とカテゴリーを非表示に（2重表示になる） */
div > div.entry-card-meta.card-meta.e-card-meta {
    display: none;
}

.button-like {
    display: inline-block;
    padding: 10px 20px;
    background-color: #007bff;
    color: white;
    text-decoration: none;
    border-radius: 5px;
}
.button-like:hover {
    background-color: #0056b3;
}

/* 料金テーブルのデザイン */

.wp-block-table table {
    border-collapse: collapse;
    width: 100%;
}

.wp-block-table table,
.wp-block-table th,
.wp-block-table td {
    border: 2px solid black; /* 枠線を黒で太く */
}

.wp-block-table th, 
.wp-block-table td {
    padding: 10px; /* 余白を追加 */
    text-align: center;
}

/* 料金テーブルの下線を消す */
.wp-block-table a {
    display: inline-block;
    text-decoration: none; /* 下線を削除 */
}

.wp-block-table a:hover {
    display: inline-block;
    text-decoration: none; /* ホバー時も下線なし */
}

    /* 購入ボタン */
    .buy-button{
        width: 100%; /* 表の左右いっぱいまで広げる */
        border-radius: 20px;          /* 丸く       */
        font-size     : 14pt;        /* 文字サイズ */
        font-weight: bold;          /* 太字で */
        text-align    : center;      /* 文字位置   */
        cursor        : pointer;     /* カーソル   */
        padding       : 6px 6px;   /* 余白       */
        background    :  rgb(216, 24, 82);     /* 背景色     */
        color         : #ffffff;     /* 文字色     */
        line-height   : 1em;         /* 1行の高さ  */
        transition    : .3s;         /* なめらか変化 */
        box-shadow    : 4px 4px 2px #666666;  /* 影の設定 */
        border        : 2px solid rgb(216, 24, 82);    /* 枠の指定 */  
        margin-right: 10px; 
      }
      .buy-button:hover {
          box-shadow    : none;        /* カーソル時の影消去 */
          color         :  rgb(216, 24, 82);     /* 背景色     */
          background    : #ffffff;     /* 文字色     */
        }

    /* 無効状態のスタイル */
    .buy-button.disabled {
        opacity: 0.5;  /* 透明度を下げる */
        filter: grayscale(100%);  /* グレースケール */
        cursor: not-allowed;  /* カーソルを禁止マークに */
        pointer-events: none;  /* クリック無効 */
        box-shadow: none;  /* 影をなくす */
    }

    /* 黄色バック */
.yellow-back {
  background-color: yellow;
}
.pink-back {
  background-color: pink;
}
.blue-back {
    background-color: lightblue;
}

    /*　元のスタイルに戻すとき　*/
    .reset {
        all: revert;
    }