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

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

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

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

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

/* --- ベーススタイル・カラー --- */
  :root {
    --primary-color: #003366; /* 信頼感を示すネイビー */
    --accent-color: #d35400; /* 行動を促すオレンジ */
    --bg-light: #f8f9fa;
    --text-main: #333333;
  }
  .fp-wrapper {
    font-family: "Noto Sans JP", sans-serif;
    color: var(--text-main);
    line-height: 1.6;
    max-width: 1000px;
    margin: 0 auto;
  }
  .fp-section {
    margin-bottom: 40px;
    padding: 20px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  }
  .fp-section-title {
    font-size: 1.4rem;
    font-weight: bold;
    border-bottom: 3px solid var(--primary-color);
    padding-bottom: 10px;
    margin-bottom: 20px;
    color: var(--primary-color);
  }

  /* --- ① EEAT（権威性）証明エリア --- */
  .eeat-badge-area {
    display: flex;
    align-items: center;
    background: var(--bg-light);
    padding: 15px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    margin-bottom: 30px;
  }
  .eeat-icon {
    font-size: 2.5rem;
    color: var(--primary-color);
    margin-right: 20px;
  }
  .eeat-text h2 {
    margin: 0 0 5px 0;
    font-size: 1.2rem;
  }
  .eeat-text p {
    margin: 0;
    font-size: 0.9rem;
    color: #666;
  }

  /* --- ② AIO特化ツール群（ファーストビュー） --- */
  .hero-tools {
    display: flex;
    flex-direction: column;
    gap: 15px;
  }
  .tool-btn {
    display: block;
    background: var(--accent-color);
    color: #fff !important;
    text-decoration: none;
    padding: 20px;
    border-radius: 8px;
    text-align: center;
    font-weight: bold;
    font-size: 1.2rem;
    transition: 0.3s;
    box-shadow: 0 4px 6px rgba(211, 84, 0, 0.3);
  }
  .tool-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 12px rgba(211, 84, 0, 0.4);
    opacity: 0.9;
  }
  .tool-btn span.badge {
    display: block;
    font-size: 0.8rem;
    background: #fff;
    color: var(--accent-color);
    width: fit-content;
    margin: 0 auto 10px;
    padding: 3px 10px;
    border-radius: 20px;
  }

  /* --- ③ ニッチペイン別のルーティング --- */
  .niche-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 15px;
  }
  .niche-card {
    border: 1px solid #ddd;
    padding: 15px;
    border-radius: 6px;
    text-decoration: none;
    color: var(--text-main);
    display: block;
    background: #fafafa;
    transition: 0.2s;
  }
  .niche-card:hover {
    background: #f0f4f8;
    border-color: var(--primary-color);
  }
  .niche-card h3 {
    margin: 0 0 5px 0;
    font-size: 1.1rem;
    color: var(--primary-color);
  }
  .niche-card p {
    margin: 0;
    font-size: 0.85rem;
    color: #555;
  }

  /* --- ④ SEO優位記事フィード --- */
  .seo-feed-list {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  .seo-feed-list li {
    border-bottom: 1px dashed #ccc;
    padding: 10px 0;
  }
  .seo-feed-list li:last-child {
    border-bottom: none;
  }
  .seo-feed-list a {
    text-decoration: none;
    color: #0056b3;
    font-weight: bold;
  }
  .seo-feed-list a:hover {
    text-decoration: underline;
  }
  .date-badge {
    font-size: 0.8rem;
    color: #888;
    margin-right: 10px;
  }

  /* --- ⑤ フッター・ボット用サイトマップ --- */
  .bot-sitemap {
    background: #e9ecef;
    padding: 15px;
    border-radius: 6px;
    text-align: center;
    font-size: 0.9rem;
  }
  .bot-sitemap a {
    color: var(--primary-color);
    text-decoration: underline;
  }




/* ===================================
 * ロゴのサイズ調整
 * =================================== */

/* ▼ 1. スマホでのサイズ（デフォルトの制限を解除して自由に設定） */
#logo {
    max-width: none !important; /* 元の300px制限を破壊 */
}
#logo a img {
    width: 250px !important; /* ★スマホでのサイズ（ここをお好みで変更） */
    height: auto !important; /* 縦横比を維持 */
}

/* ▼ 2. PC（画面幅900px以上）でのサイズ */
@media screen and (min-width: 900px) {
    #logo a img {
        width: 550px !important; /* ★PCでのサイズ（ここをお好みで変更） */
    }
}



















/* ===================================================
   【最終修正版】すべてを上書きする絶対的CSS
=================================================== */

/* 1. スマホ版メイン画像：絶対に縦幅を確保する */
@media screen and (max-width: 800px) {
    body #mainimg-box {
        padding-top: 0 !important; 
        height: 60vh !important; /* 画面の高さの60%を強制確保 */
        min-height: 350px !important; /* 最低でも350pxは確保 */
    }
    body .vegas-slide-inner {
        background-size: cover !important;
        background-position: center top !important;
        width: 100% !important;
        height: 100% !important;
    }
}

/* 2. スマホ版メニュー：閉じないバグを直し、黒背景・全開にする */
@media screen and (max-width: 800px) {
    /* JSの開閉処理を邪魔しないように display 指定を排除 */
    html body #menubar {
        background: rgba(0,0,0,0.95) !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        overflow-y: auto !important;
        padding-top: 80px !important;
        z-index: 1000 !important;
    }
    html body #menubar ul li ul {
        display: block !important;
        position: static !important;
        background: transparent !important;
    }
    html body #menubar ul li:hover > a, 
    html body #menubar ul li a:hover {
        background: transparent !important;
        color: #fff !important;
    }
    html body #menubar ul li a {
        border-bottom: 1px solid rgba(255,255,255,0.1) !important;
        color: #fff !important;
        padding: 15px 20px !important;
        text-align: left !important;
    }
    html body #menubar ul li ul li a {
        padding-left: 45px !important;
    }
}

/* 3. F078 文字化け解消 */
body a.ddmenu::before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f078" !important;
    font-weight: 900 !important;
    display: inline-block !important;
}

/* 4. メインブロックが半分になるバグを粉砕（完全1カラム化） */
body main.c2, 
body main.c2 .main {
    display: block !important;
    width: 100% !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
    float: none !important;
    box-sizing: border-box !important;
}
body main.c2 {
    padding: 40px 20px !important;
}
/* 余計なサイドバーの枠を完全に消滅させる */
body main.c2 .sub {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* --- 横幅バグ・右側の余白を物理的に抹殺する --- */

/* 1. サイト全体の「器」を画面幅に固定 */
html, body {
    overflow-x: hidden !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
}

/* 2. 全要素のサイズ計算を「内側」に固定（はみ出し防止） */
*, *::before, *::after {
    box-sizing: border-box !important;
    max-width: 100% !important; /* ←これが重要：全要素を画面内に封じ込める */
    overflow-wrap: break-word;   /* 長い英数字の改行を強制 */
}

/* 3. コンテナとメインブロックの幅をリセット */
#container, #mainimg-box, main, main.c2, .main, .wp-editor-content {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    float: none !important;
}

/* 4. プロフィールやセクションの過剰なパディングをスマホ用に絞る */
@media screen and (max-width: 800px) {
    /* 左右の余白を「15px」に統一 */
    section, 
    .profile-card, 
    .wp-editor-content > *,
    div[style*="padding"] {
        padding-left: 15px !important;
        padding-right: 15px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }

    /* 代表プロフィール内のmission部分などもはみ出さないように */
    .profile-mission, 
    div[style*="border-left"] {
        margin: 1rem 0 !important;
        padding: 1rem !important;
    }
    
    /* マップや動画の横幅固定を解除 */
    iframe, video, table {
        width: 100% !important;
    }
}

/* --- 横幅オーバーフロー（横揺れ・白い余白）を物理的に停止 --- */

/* 1. サイトの「一番外側」を画面幅に強制固定 */
html, body {
    overflow-x: hidden !important; /* 横スクロールを禁止 */
    width: 100vw !important;       /* パーセントではなくViewport幅で固定 */
    margin: 0 !important;
    padding: 0 !important;
}

/* 2. PC版の1000px設定をスマホで完全に無効化 */
@media screen and (max-width: 800px) {
    #container, 
    header, 
    #menubar, 
    #mainimg-box, 
    main, 
    main.c2, 
    main.c2 .main, 
    footer, 
    #footermenu {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;   /* ←意外とこれが悪さをする */
        margin-left: 0 !important;
        margin-right: 0 !important;
        float: none !important;
    }

    /* 3. プロフィールカード（flex）を縦一列に強制 */
    .profile-card {
        display: block !important; /* 横並びを強制解除 */
        width: 100% !important;
        padding: 20px 15px !important;
        margin: 0 0 3rem 0 !important;
    }
    .profile-img-wrap, 
    .profile-text-wrap {
        width: 100% !important;
        border: none !important;
        padding: 10px 0 !important;
    }

    /* 4. 診断ツールやボタンの「横幅固定」を破壊 */
    section, div, a, p, span {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 5. 表（table）のスマホ対応（はみ出し防止） */
    table {
        display: block !important;
        width: 100% !important;
        overflow-x: auto !important; /* テーブルだけははみ出したら横スクロールさせる */
        white-space: nowrap;
    }
}

/* 6. 画像が枠を突き抜けるのを防ぐ（全デバイス共通） */
img {
    max-width: 100% !important;
    height: auto !important;
}




/* ===================================================
   LP用カスタマイズCSS（エラー修正版）
=================================================== */

/* 1. LP用1カラム強制中央揃え */
main.c2 {
    display: block !important;
    max-width: 1000px !important;
    margin: 40px auto !important; /* 左右中央寄せ */
    padding: 0 20px !important;
    box-sizing: border-box !important;
}
main.c2 .main {
    width: 100% !important;
    float: none !important;
}
main.c2 .sub {
    display: none !important; /* 幽霊サイドバー完全消去 */
}

/* 2. スマホ版メイン画像の高さ確保 */
#mainimg-box {
    width: 100% !important;
    height: 0 !important;
    padding-top: 36% !important; /* PC用比率 */
    position: relative !important;
    z-index: -1 !important;
}
.vegas-slide-inner {
    background-size: cover !important;
    background-position: center center !important;
}
@media screen and (max-width: 800px) {
    #mainimg-box {
        padding-top: 70% !important; /* スマホ用に縦幅を確保 */
    }
}

/* 3. メニューのF078文字化け解消 */
a.ddmenu::before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f078" !important;
    font-weight: 900 !important;
}

/* 4. スマホ版メニューの表示バグ修正（緑色排除） */
@media screen and (max-width: 800px) {
    #menubar.display-block {
        background: rgba(0,0,0,0.95) !important;
    }
    #menubar ul li ul {
        display: block !important;
        position: static !important;
        background: transparent !important;
        box-shadow: none !important;
    }
    #menubar ul li:hover > a, 
    #menubar ul li a:hover {
        background: transparent !important;
        color: #fff !important;
    }
    #menubar ul li a {
        text-align: left !important;
        border-bottom: 1px solid rgba(255,255,255,0.1) !important;
    }
}

/* 5. はみ出し（スマホの横揺れ）防止 */
html, body {
    overflow-x: hidden !important;
    width: 100% !important;
}
img, iframe, video {
    max-width: 100% !important;
}
/* 固定ページ内の「padding: 3rem」等がスマホ画面をぶち破るのを防ぐ */
@media screen and (max-width: 800px) {
    section, div[style*="padding"] {
        padding-left: 15px !important;
        padding-right: 15px !important;
        box-sizing: border-box !important;
    }
}















/* スマホ版：左右の余白を完全消滅させ、限界ギリギリまで広げる */
@media screen and (max-width: 800px) {
    body,
    body #container,
    body main.c2,
    body main.c2 .main,
    body .wp-editor-content {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        /* ↓左右の余白を「0」にしてスマホのベゼル（枠）に完全密着させる */
        padding-left: 0.5px !important; 
        padding-right: 0.5px !important;
        box-sizing: border-box !important;
        float: none !important;
    }
}






















/* ===================================
 * 1. ヘッダーの余白調整
 * =================================== */
header {
    /* 上の余白は詰めたまま */
    padding-top: 0px !important; 
    
    /* ★下の余白を増やしました（好みに合わせて数値を変更してください） */
    padding-bottom: 35px !important; 
}


/****************** * 
 * ロゴのリンク(aタグ)のみをピンポイントで無効化 
 * **************************/
h1#logo > a {
    text-decoration: none !important;
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    outline: none !important;
    display: block !important; 
}

/* ロゴリンクの擬似要素だけを確実に封殺 */
h1#logo > a::before,
h1#logo > a::after {
    display: none !important;
    content: none !important;
}

/* ロゴ画像のみ */
h1#logo > a > img {
    display: block;
    vertical-align: bottom;
}






/* サムネイルが潰れるバグを強制ブロック */
.custom-category-grid .cat-thumb img {
    height: 100% !important;
    object-fit: cover !important;
}









/* ===================================================
   古家診断.com 記事専用フルセットCSS（ツール対応版）
=================================================== */
.furuya-article {
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Meiryo", sans-serif;
  color: #333;
  line-height: 1.8;
  letter-spacing: 0.05em;
  padding: 20px 0;
}

.furuya-article p {
  margin-bottom: 2rem;
  font-family: inherit;
  color: #444;
  font-size: 1.05rem;
}

.furuya-article .lead-text {
  font-size: 1.1rem;
  color: #555;
  margin-bottom: 3rem;
  padding: 0 1rem;
  border-left: 1px solid #ccc;
}

/* -----------------------------
   見出しスタイル
----------------------------- */
.furuya-article h2 {
  font-family: inherit;
  font-size: 1.6rem;
  font-weight: bold;
  color: #333;
  background-color: #e4eef4 !important;
  margin: 4.5rem 0 2.5rem;
  padding: 20px 20px;
  border-bottom: 3px solid var(--primary-color, #58859a);
  border-radius: 4px 4px 0 0;
  text-align: center;
  box-shadow: 0 2px 5px rgba(0,0,0,0.03);
}

.furuya-article h3 {
  font-family: inherit;
  font-size: 1.3rem;
  font-weight: bold;
  color: #333;
  background-color: #edf4f8 !important;
  padding: 15px 20px;
  margin: 3rem 0 1.5rem;
  border-left: 4px solid var(--primary-color, #58859a);
}

.furuya-article h4 {
  font-family: "Hiragino Kaku Gothic Pro", sans-serif;
  font-size: 1.1rem;
  font-weight: bold;
  color: #fff;
  background-color: var(--primary-color, #58859a);
  padding: 10px 20px;
  margin: 2.5rem 0 1.5rem;
  border-radius: 2px;
}

/* -----------------------------
   各種ボックス（囲み枠）
----------------------------- */
.furuya-article .box-fill {
  background-color: #f0f4f7;
  padding: 25px;
  margin: 2rem 0;
  border-radius: 4px;
  font-family: "Hiragino Kaku Gothic Pro", sans-serif;
}
.furuya-article .box-fill p { margin: 0; }
.furuya-article .box-fill strong { color: var(--primary-color, #58859a); font-size: 1.1rem;}

.furuya-article .box-alert {
  background-color: #fffaf9;
  border: 1px solid #e5a8a8;
  padding: 25px;
  margin: 2rem 0;
  border-radius: 4px;
  font-family: "Hiragino Kaku Gothic Pro", sans-serif;
}
.furuya-article .box-alert strong {
  color: #c94a4a;
  display: block;
  margin-bottom: 10px;
  font-size: 1.1rem;
}
.furuya-article .box-alert p { margin: 0; }

.furuya-article .furuya-quote {
  margin: 3rem 0;
  padding: 20px 30px;
  font-style: italic;
  color: #666;
  border-left: 3px solid #ccc;
  background: #fdfdfd;
}
.furuya-article .furuya-quote cite {
  display: block;
  text-align: right;
  margin-top: 15px;
  font-size: 0.85rem;
  color: #999;
}

/* -----------------------------
   テーブル（表）
----------------------------- */
.furuya-article .furuya-table {
  width: 100%;
  border-collapse: collapse;
  margin: 2.5rem 0;
  font-family: "Hiragino Kaku Gothic Pro", sans-serif;
  font-size: 0.95rem;
}
.furuya-article .furuya-table th {
  background-color: var(--primary-color, #58859a);
  color: #fff;
  font-weight: normal;
  padding: 15px;
  border: 1px solid var(--primary-color, #58859a);
  text-align: center;
}
.furuya-article .furuya-table td {
  padding: 15px;
  border: 1px solid #e0e0e0;
  color: #444;
}
.furuya-article .furuya-table tr:nth-child(even) {
  background-color: #fafafa;
}

/* -----------------------------
   ステップ（手順）リスト
----------------------------- */
.furuya-article .furuya-step {
  list-style: none;
  padding: 0;
  margin: 2.5rem 0;
  counter-reset: step-counter;
}
.furuya-article .furuya-step li {
  position: relative;
  padding-left: 60px;
  margin-bottom: 30px;
  font-family: "Hiragino Kaku Gothic Pro", sans-serif;
}
.furuya-article .furuya-step li::before {
  counter-increment: step-counter;
  content: counter(step-counter);
  position: absolute;
  left: 0;
  top: 0;
  width: 40px;
  height: 40px;
  background-color: var(--primary-color, #58859a);
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-family: "Lato", sans-serif;
  font-size: 1.2rem;
}
.furuya-article .step-title {
  font-size: 1.1rem;
  font-weight: bold;
  color: var(--primary-color, #58859a);
  margin-bottom: 8px;
  padding-top: 5px;
}
.furuya-article .furuya-step p { margin: 0; font-size: 0.95rem; }

/* -----------------------------
   Q&A（よくある質問）
----------------------------- */
.furuya-article .furuya-qa {
  margin: 2.5rem 0;
  font-family: "Hiragino Kaku Gothic Pro", sans-serif;
}
.furuya-article .furuya-qa dt {
  position: relative;
  padding: 15px 20px 15px 50px;
  background-color: #f4f4f4;
  font-weight: bold;
  color: #333;
  margin-bottom: 10px;
  border-radius: 4px;
}
.furuya-article .furuya-qa dt::before {
  content: "Q.";
  position: absolute;
  left: 15px;
  color: var(--primary-color, #58859a);
  font-size: 1.2rem;
}
.furuya-article .furuya-qa dd {
  position: relative;
  padding: 0 20px 20px 50px;
  margin: 0 0 20px 0;
  color: #555;
  border-bottom: 1px dashed #ccc;
}
.furuya-article .furuya-qa dd::before {
  content: "A.";
  position: absolute;
  left: 15px;
  color: #c94a4a;
  font-weight: bold;
  font-size: 1.2rem;
}

/* =========================================
   ツール埋め込みコンテナ（汎用デザイン）
========================================= */
.furuya-article .furuya-tool-container {
  margin: 4rem 0;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  background-color: #fff;
  overflow: hidden;
  box-shadow: 0 4px 15px rgba(0,0,0,0.03);
  font-family: "Hiragino Kaku Gothic Pro", sans-serif;
}
.furuya-article .furuya-tool-container .tool-header {
  background-color: #f7f9fa;
  padding: 20px 25px;
  border-bottom: 1px solid #e0e0e0;
  text-align: center;
}
.furuya-article .furuya-tool-container .tool-title {
  font-family: "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: 1.3rem;
  color: var(--primary-color, #58859a);
  margin: 0 0 5px 0;
  border: none;
  padding: 0;
}
.furuya-article .furuya-tool-container .tool-desc {
  font-size: 0.85rem;
  color: #666;
  margin: 0;
}
.furuya-article .furuya-tool-container .tool-body {
  padding: 30px 25px;
}
.furuya-article .furuya-tool-container .tool-field {
  margin-bottom: 20px;
}
.furuya-article .furuya-tool-container label {
  display: block;
  font-size: 0.9rem;
  color: #333;
  margin-bottom: 8px;
  font-weight: bold;
}
.furuya-article .furuya-tool-container .tool-input-group {
  display: flex;
  align-items: center;
}
.furuya-article .furuya-tool-container .tool-input,
.furuya-article .furuya-tool-container .tool-select {
  width: 100%;
  padding: 12px 15px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 1rem;
  background-color: #fafafa;
  transition: border-color 0.3s;
  box-sizing: border-box;
}
.furuya-article .furuya-tool-container .tool-input:focus,
.furuya-article .furuya-tool-container .tool-select:focus {
  outline: none;
  border-color: var(--primary-color, #58859a);
  background-color: #fff;
}
.furuya-article .furuya-tool-container .tool-unit {
  margin-left: 10px;
  color: #555;
  font-size: 0.95rem;
  white-space: nowrap;
}
.furuya-article .furuya-tool-container .tool-calc-btn {
  display: block;
  width: 100%;
  padding: 15px;
  background-color: var(--primary-color, #58859a);
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 1rem;
  font-weight: bold;
  letter-spacing: 0.05em;
  cursor: pointer;
  transition: background-color 0.3s;
  margin-top: 10px;
}
.furuya-article .furuya-tool-container .tool-calc-btn:hover {
  background-color: #3c5b69;
}
.furuya-article .furuya-tool-container .tool-result {
  margin-top: 25px;
  padding: 20px;
  background-color: #fdfdfd;
  border: 1px dashed #ccc;
  border-radius: 4px;
  text-align: center;
}
.furuya-article .furuya-tool-container .result-label {
  display: block;
  font-size: 0.9rem;
  color: #666;
  margin-bottom: 5px;
}
.furuya-article .furuya-tool-container .result-value {
  display: block;
  font-size: 1.6rem;
  font-weight: bold;
  color: #C0583D;
  font-family: "Lato", sans-serif;
}
#diagnosis-result {
  transition: opacity 0.5s ease;
}

/* -----------------------------
   CTA（アクション誘導）
----------------------------- */
.furuya-article .cta-minimal {
  margin: 4rem 0 2rem;
  padding: 3px;
  border: 1px solid #e0e0e0;
}
.furuya-article .cta-inner {
  padding: 4rem 2rem;
  background-color: #fafafa;
  text-align: center;
}
.furuya-article .cta-title {
  font-family: "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: 1.4rem;
  color: #333;
  margin-bottom: 1rem;
}
.furuya-article .cta-desc {
  font-size: 0.95rem;
  color: #666;
  margin-bottom: 2rem;
  font-family: "Hiragino Kaku Gothic Pro", sans-serif;
}
.furuya-article .btn-elegant {
  display: inline-block;
  padding: 18px 50px;
  background-color: #C0583D; 
  color: #fff !important;
  text-decoration: none;
  letter-spacing: 0.15em;
  font-size: 1rem;
  font-weight: bold;
  border-radius: 50px; 
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  box-shadow: 0 8px 20px rgba(192, 88, 61, 0.3);
  position: relative;
  overflow: hidden;
}
.furuya-article .btn-elegant:hover {
  background-color: #a84931;
  transform: translateY(-3px);
  box-shadow: 0 12px 25px rgba(192, 88, 61, 0.4);
}
.furuya-article .btn-elegant::after {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 50%;
  height: 100%;
  background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.4) 50%, rgba(255,255,255,0) 100%);
  transform: skewX(-20deg);
  animation: btn-shine 4s infinite;
}
@keyframes btn-shine {
  0% { left: -100%; }
  20% { left: 200%; }
  100% { left: 200%; }
}

/* -----------------------------
   監修者・自己紹介チップ
----------------------------- */
.furuya-author-chip {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  margin-bottom: -15px;    
  position: relative;
  z-index: 2;
  padding: 25px;           
  background-color: #fff;  
  border: 1px solid #e0e0e0; 
  border-radius: 8px;      
  box-shadow: 0 4px 10px rgba(0,0,0,0.03); 
}
.author-thumb-wrap {
  flex-shrink: 0;
  width: 100px;           
  height: 100px;          
  margin-right: 25px;     
  margin-top: 5px;
}
.author-thumb {
  width: 100px !important; 
  height: 100px !important; 
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid #e0e0e0;
  background: #fff;
  display: block;
}
.author-info {
  text-align: left;
  max-width: 320px; 
}
.author-label {
  display: block;
  font-size: 0.65rem;
  color: #999;
  letter-spacing: 0.05em;
  margin-bottom: 2px;
  font-family: "Hiragino Kaku Gothic Pro", sans-serif;
}
.author-name {
  font-size: 0.95rem;
  font-weight: bold;
  color: #444;
  margin: 0 0 4px 0 !important;
  font-family: "Hiragino Kaku Gothic Pro", sans-serif;
}
.author-bio {
  font-size: 0.75rem;
  color: #666;
  line-height: 1.5;
  margin: 0 !important;
  font-family: "Hiragino Kaku Gothic Pro", sans-serif;
}

@media screen and (max-width: 800px) {
  .furuya-author-chip {
    display: block; 
    text-align: center; 
    padding: 25px 20px; 
    width: calc(100% - 10px); 
    margin-left: auto;
    margin-right: auto;
  }
  .author-thumb-wrap {
    margin: 0 auto 15px auto; 
    width: 120px; 
    height: 120px; 
  }
  .author-thumb {
    width: 120px !important; 
    height: 120px !important; 
  }
  .author-info {
    text-align: center; 
    max-width: 100%; 
    width: 100%;
  }
  .author-bio {
    overflow-wrap: break-word; 
    word-break: break-all;
  }
}

/* =========================================
   究極の1カラム・縦型アコーディオン（details版）
========================================= */
.furuya-faq-v3 {
  margin: 3rem 0;
  width: 100% !important;
  display: block !important;
}
.furuya-faq-v3 details {
  margin-bottom: 12px;
  border: 1px solid #eee;
  border-radius: 6px;
  background-color: #fff;
  width: 100% !important;
  display: block !important;
  overflow: hidden;
  transition: all 0.3s ease;
}
.furuya-faq-v3 details:hover {
  border-color: #58859a;
}
.furuya-faq-v3 summary {
  display: flex !important;
  align-items: center;
  padding: 20px 25px;
  cursor: pointer;
  font-weight: bold;
  color: #333;
  list-style: none; 
  width: 100% !important;
  box-sizing: border-box;
}
.furuya-faq-v3 summary::-webkit-details-marker { display: none; }
.furuya-faq-v3 summary::before {
  content: "Q";
  color: #58859a;
  margin-right: 15px;
  font-size: 1.3rem;
  font-weight: 900;
  flex-shrink: 0;
}
.furuya-faq-v3 summary .arrow {
  margin-left: auto;
  width: 10px;
  height: 10px;
  border-right: 2px solid #ccc;
  border-bottom: 2px solid #ccc;
  transform: rotate(45deg);
  transition: transform 0.3s;
  flex-shrink: 0;
}
.furuya-faq-v3 details[open] summary .arrow {
  transform: rotate(-135deg);
  border-color: #58859a;
}
.furuya-faq-v3 .answer-inner {
  padding: 20px 25px 25px 60px; 
  background-color: #fcfdfe;
  border-top: 1px solid #f0f0f0;
  color: #555;
  line-height: 1.8;
  font-size: 1rem;
}
.furuya-faq-v3 .answer-inner p {
  margin: 0 !important;
  padding: 0 !important;
}


/* ===================================================
   ここまで記事本文用
=================================================== */
/* ===================================
 * ロゴ部分のレイアウト修正（div化対応版）
 * =================================== */

/* ロゴ全体のコンテナ */
#logo {
    max-width: 300px; /* デフォルトサイズ */
}

/* 以前 h1#logo > a と書いていた部分の修正 */
#logo > a {
    text-decoration: none !important;
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    outline: none !important;
    display: block !important; 
}

/* リンクの擬似要素をクリア */
#logo > a::before,
#logo > a::after {
    display: none !important;
    content: none !important;
}

/* ロゴ画像の設定 */
#logo img {
    display: block;
    max-width: 100%;
    height: auto;
    vertical-align: bottom;
}

/* ▼ スマホでのサイズ調整（以前の指定を継承） */
@media screen and (max-width: 800px) {
    #logo {
        max-width: none !important;
        margin-bottom: 0 !important;
    }
    #logo a img {
        width: 250px !important; 
    }
}

/* ▼ PCでのサイズ調整（以前の指定を継承） */
@media screen and (min-width: 900px) {
    #logo a img {
        width: 550px !important; 
    }
}

header {
    /* ★ここを 0px からお好みの数値（40px〜60px程度）に変更してください */
    padding-top: 45px !important; 
    
    /* 下の余白（以前設定した35pxを維持） */
    padding-bottom: 35px !important;
}

/* スマホで余白が広すぎると感じる場合の微調整（任意） */
@media screen and (max-width: 800px) {
    header {
        padding-top: 30px !important; /* スマホは少し狭める */
        padding-bottom: 25px !important;
    }
}


.breadcrumb-container {
    margin-bottom: 20px;
    font-size: 0.85rem;
}
.breadcrumb-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    color: #666;
}
.breadcrumb-list li:after {
    content: ">";
    margin: 0 10px;
    color: #ccc;
}
.breadcrumb-list li:last-child:after {
    display: none;
}
.breadcrumb-list a {
    color: #58859a; /* リンク色 */
    text-decoration: none;
}
.breadcrumb-list a:hover {
    text-decoration: underline;
}

/* トップページだけで、余計なタイトル表示を抹殺する */
.home h1, 
.home .entry-title, 
.home .page-title {
    display: none !important;
}




/* スマホでのパンくずを横一行・スクロール型に整形 */
@media screen and (max-width: 767px) {
    .breadcrumb-container {
        overflow-x: auto; /* 横スクロールを許可 */
        white-space: nowrap; /* 折り返しを禁止 */
        -webkit-overflow-scrolling: touch; /* iOSのスクロールを滑らかに */
        padding: 12px 0;
        border-bottom: 1px solid #f0f0f0; /* 下に薄い線を入れて区切る */
        margin-bottom: 20px;
    }

    .breadcrumb-list {
        display: flex;
        align-items: center;
        padding-left: 15px; /* 最初の項目の余白 */
    }

    /* 現在の「箱（ボーダー）」を完全に抹殺する */
    .breadcrumb-list li {
        border: none !important; 
        background: none !important;
        padding: 0 !important;
        margin: 0 !important;
        font-size: 13px;
        color: #888;
        display: flex;
        align-items: center;
    }

    /* リンクの色を少し濃くして、読みやすく */
    .breadcrumb-list a {
        color: #58859a;
        text-decoration: none;
    }

    /* 区切り文字（ > ）をシュッとさせる */
    .breadcrumb-list li:after {
        content: "\f105" !important; /* FontAwesomeなどのアイコンがあればそれ、なければ > */
        font-family: serif; /* 飾り気のないセリフ体で上品に */
        margin: 0 12px;
        color: #ccc;
        font-weight: normal;
    }

    /* 最後の項目（記事タイトル）は少し薄くして「今ここ」感を出す */
    .breadcrumb-list li:last-child {
        padding-right: 15px !important;
        color: #aaa;
    }

    /* スクロールバーを隠してスッキリさせる（任意） */
    .breadcrumb-container::-webkit-scrollbar {
        display: none;
    }
}

/* 記号化けを直して、シュッとしたデザインにする */
@media screen and (max-width: 767px) {
    .breadcrumb-list li:after {
        /* 特殊なアイコンフォントをやめて、標準的な記号に変更 */
        content: ">" !important; 
        font-family: 'Hiragino Kaku Gothic Pro', 'メイリオ', sans-serif !important;
        margin: 0 10px;
        color: #ccc;
        font-size: 10px;
        vertical-align: middle;
    }
}