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

/* =======================================================
   ベースの微調整
   ======================================================= */

/* Contact Form 7 の「必須」ラベル */
.required-contactform7{
  padding:5px;
  background:#DE8686;
  color:#fff;
  border-radius:3px;
  margin-right:3px;
}

/* 画像キャプションのリンク・ホバー */
.caption-wrap a:hover{
  color:#ffffff !important;
  background:#0d6d79;
}

/* ホームで非表示にする要素 */
.home.page .date-tags,
.home.page .author-info,
.box-menu-icon{
  display:none;
}

/* カバーブロックを全幅表示 */
.wp-block-cover-full{
  width:100vw;
  margin:0 calc(50% - 50vw);
  padding:0 calc(50vw - 50%);
}


/* =======================================================
   見出し・ボタンデザイン
   ======================================================= */

/* ボタン風 h3（基本） */
.entry-content h3.button-style{
  cursor:pointer;
  background:none !important;
  border:none !important;
  box-shadow:none !important;
  padding:0 !important;
  text-align:left;
}
.entry-content h3.button-style a{
  display:block;
  color:#fff !important;
  text-decoration:none !important;
  border-radius:6px;
  padding:.6em 1em;
  line-height:1.4;
  font-size:1.1rem;
  font-weight:normal;
  text-align:center;
}

/* ボタン色バリエーション */
.entry-content h3.button-style.laparo a{ background:#0c7963; }
.entry-content h3.button-style.laparo a:hover{ background:#095d4b; }
.entry-content h3.button-style.open a{ background:#0d6d79; }
.entry-content h3.button-style.open a:hover{ background:#0a515a; }
.entry-content h3.button-style.robot a{ background:#313130; }
.entry-content h3.button-style.robot a:hover{ background:#1e1e1d; }

/* フォーカスリング */
.entry-content h3.button-style a:focus-visible{
  outline:3px solid #fff;
  outline-offset:2px;
  box-shadow:0 0 0 3px rgba(13,109,121,.45);
}

/* ボタン内テキストの折返し最適化（和文向け） */
.entry-content h3.button-style a{
  word-break:break-word;
  overflow-wrap:anywhere;
}

/* 本文風のシンプル見出し（中央揃え） */
.entry-content h3.textlike,
.entry-content h3.wp-block-heading.textlike{
  all:unset;
  display:block !important;
  font-size:1.3em !important;
  font-weight:normal !important;
  color:#000 !important;
  text-align:center !important;
  line-height:1.6 !important;
  letter-spacing:.15em !important;
  margin:1.8em 0 1em !important;
  background:none !important;
  border:none !important;
  box-shadow:none !important;
}
/* Cocoonの疑似装飾を無効化 */
.entry-content h3.textlike::before,
.entry-content h3.textlike::after,
.entry-content h3.wp-block-heading.textlike::before,
.entry-content h3.wp-block-heading.textlike::after{
  content:none !important;
  display:none !important;
}

/* ボタンレイアウト：PC 2列 / SP 1列 */
.entry-content .btn-grid-2{
  display:grid;
  grid-template-columns:repeat(2, minmax(260px,1fr));
  gap:18px 24px;
  align-items:stretch;
}
.entry-content .btn-grid-2 h3.button-style{ width:100%; margin:0; }
.entry-content .btn-grid-2 h3.button-style a{ height:100%; }
.entry-content .btn-grid-2 > *:only-child{ justify-self:start; }

@media (max-width:767px){
  .entry-content .btn-grid-2{
    grid-template-columns:1fr;
    gap:14px 0;
  }
  .entry-content .btn-grid-2 > *:only-child{ justify-self:center; }
}

/* ボタン縦並び：PC左寄せ / SP中央 */
.entry-content .btn-stack-1{
  display:grid;
  grid-template-columns:1fr;
  row-gap:14px;
  justify-items:start;
  text-align:left;
}
.entry-content .btn-stack-1 h3.button-style{ justify-self:start; }

@media (max-width:767px){
  .entry-content .btn-stack-1{
    justify-items:center;
    text-align:center;
  }
  .entry-content .btn-stack-1 h3.button-style{ justify-self:center; }
}

/* h2のサイズを統一 */
.entry-content h2,
.entry-content h2.wp-block-heading{
  font-size:1.6em !important;
  font-weight:700;
}


/* =======================================================
   プロフィール・見出し
   ======================================================= */

.page-id-31 .entry-content h2.wp-block-heading:not(.greeting){
  display:block;
  width:100%;
  padding:.5em 1.2em;
  font-family:"Hiragino Mincho ProN","游明朝","Yu Mincho",serif;
  font-size:1.4em;
  font-weight:700;
  line-height:1.4;
  background:#0d6d79;
  color:#fff;
  text-align:left;
  border-radius:4px;
  border:none !important;
  margin:2em 0 1.2em;
}
.page-id-31 h2.greeting{
  font-family:"Hiragino Mincho ProN","游明朝","Yu Mincho",serif;
  font-size:2em;
  font-weight:bold;
  color:#000;
  background:none !important;
  border:none !important;
  padding:.4em 0 .4em 1.2em;
  margin:1.5em 0 1em;
  text-align:left;
}
.page-id-31 .entry-content h2.greeting::before,
.page-id-31 .entry-content h2.greeting::after{
  content:none !important;
  display:none !important;
}


/* =======================================================
   監修者ボックス
   ======================================================= */

.supervisor-box{
  border:1px solid #ccc;
  padding:1em 1.2em;
  margin:2em 0;
  background:#f9f9f9;
  border-radius:6px;
  font-size:.95rem;
  line-height:1.6;
}
.supervisor-box strong{ color:#0d6d79; }
.supervisor-box .supervisor-link{
  display:inline-block;
  margin-top:.5em;
  font-size:.9rem;
  color:#0d6d79;
  text-decoration:underline;
}
.supervisor-box .supervisor-link:hover{
  color:#095d4b;
  text-decoration:none;
}


/* =======================================================
   フッターを薄く（Cocoon）
   ======================================================= */

#footer,
#footer-in,
#footer .footer-in,
#footer .footer-bottom,
#footer .footer-bottom-content,
#footer .footer-container,
#footer .footer-widget-area{
  padding-top:8px !important;
  padding-bottom:8px !important;
  min-height:0 !important;
  height:auto !important;
  line-height:1.35 !important;
}
#footer *{ margin-top:0 !important; margin-bottom:0 !important; }
#footer ul,#footer li,#footer nav{ padding-top:0 !important; padding-bottom:0 !important; }
#footer .footer-widget-area{ margin:0 !important; border:0 !important; }

#footer{ position:relative; }
#footer .pagetop,
#footer .to-top,
#footer .back-to-top{
  position:absolute !important;
  right:12px;
  bottom:12px;
}

@media (max-width:599px){
  #footer{ font-size:12px !important; }
}


/* =======================================================
   最終形：自動タイトル（.entry-title）を
   視覚的にだけ非表示（SEO/支援技術には残す）
   ======================================================= */

.home .entry-title,
.page .entry-title,
.single .entry-title{
  position:absolute !important;
  width:1px; height:1px;
  margin:-1px; padding:0;
  border:0; overflow:hidden;
  clip:rect(0 0 0 0);
  clip-path:inset(50%);
  white-space:nowrap;
}
/* 投稿だけ：H3.textlike を“見た目だけ H2風”に統一 */
.single-post .entry-content h3.textlike,
.single-post .entry-content h3.wp-block-heading.textlike{
  all: unset;
  display: block !important;
  font-family: "Hiragino Mincho ProN","游明朝","Yu Mincho",serif;
  font-size: 1.7em !important;
  font-weight: 700 !important;
  text-align: center !important;
  line-height: 1.6 !important;
  margin: 1.5em 0 1em !important;
  color: #000 !important; /* 必要なら残す。不要なら削除可 */
}
/* Cocoonの擬似装飾を念のため無効化（統一） */
.single-post .entry-content h3.textlike::before,
.single-post .entry-content h3.textlike::after,
.single-post .entry-content h3.wp-block-heading.textlike::before,
.single-post .entry-content h3.wp-block-heading.textlike::after{
  content: none !important;
  display: none !important;
}
/* =======================================================
   Header Search（PC/SP統一・最終版）
   - PC：右側に固定（45%・最大760px）
   - SP：ロゴ下に全幅（92%・最大520px）
   ======================================================= */
#header{ position:relative; }

/* PC：右側固定。!importantで古い指定を上書き */
#header .add-header-contents{
  position:absolute !important;
  right: clamp(16px, 4vw, 32px) !important;
  top:50% !important;
  transform: translateY(-50%) !important;
  width: min(45%, 760px) !important;
  display:flex !important;
  align-items:center !important;
  box-sizing:border-box;
}

/* 中身はフォーム100%でフィット */
#header .add-header-contents form,
#header .add-header-contents .search-form{
  width:100% !important;
  display:flex;
  align-items:center;
  gap:.4em;
}

/* 入力欄：幅いっぱい＆高さ揃え */
#header .add-header-contents input[type="search"],
#header .add-header-contents input[type="text"]{
  width:100% !important;
  flex:1 1 auto;
  height:44px;
  font-size:16px;
  box-sizing:border-box;
}

/* --- スマホ：ロゴ下に自前フォーム .sp-header-search を出す --- */
.sp-header-search{ display:none; }

@media (max-width: 782px){
  /* PC用ウィジェットはSPでは隠す（自前フォームを使う） */
  #header .add-header-contents{ display:none !important; }

  .sp-header-search{
    display:block !important;
    width:100%;
    padding:8px 0 0;
    z-index:10;
  }
  .sp-header-search .search-form{
    width:92%;
    max-width:520px;
    margin:0 auto;
    display:flex;
    gap:8px;
    box-sizing:border-box;
  }
  .sp-header-search .search-field{
    flex:1 1 auto;
    height:40px;
    font-size:16px;
    padding:.5em .75em;
  }
  .sp-header-search .search-submit{
    height:40px;
    padding:0 12px;
    font-size:14px;
    line-height:38px;
  }
}
② トグル内リンク群を“ナビ”と明示（見た目は変えない）
css
コードをコピーする
/* =======================================================
   トグル内リンク群 “buttons-as-nav” のアクセシビリティ補助
   ======================================================= */
.buttons-as-nav::before{ content:""; } /* 意味付けのフック。見た目変化なし */
.buttons-as-nav a:focus-visible{
  outline:2px solid #0d6d79;
  outline-offset:2px;
  border-radius:4px;
}
.buttons-as-nav .wp-block-buttons{
  gap:12px;
  flex-wrap:wrap;
}
/* ===== ヘッダー検索：PC配置を復旧（右寄せ・縦中央） ===== */
#header{ position: relative; }

#header .add-header-contents{
  position: absolute;
  right: clamp(16px, 4vw, 32px);
  top: 50%;
  transform: translateY(-50%);
  width: min(45%, 900px);   /* ← 好みで 40〜60% に調整OK */
  display: flex;
  align-items: center;
  box-sizing: border-box;
}

/* 中身は横幅いっぱい */
#header .add-header-contents form,
#header .add-header-contents .search-form,
#header .add-header-contents .searchform{
  width: 100% !important;
}

#header .add-header-contents input[type="search"],
#header .add-header-contents input[type="text"]{
  width: 100% !important;
  height: 44px;
  font-size: 16px;
}

/* ロゴは左寄せのまま */
#header .logo{ text-align:left !important; margin:0 !important; }
#header .logo img{ display:block; margin:0; }

/* ===== スマホ：PC用は隠して自前フォームを表示 ===== */
@media (max-width: 782px){
  #header .add-header-contents{ display:none !important; }

  .sp-header-search{
    display:block !important;
    width:100%;
    padding:8px 0 0;
    z-index:10;
  }
  .sp-header-search form{
    width:92%;
    margin:0 auto;
    display:flex;
    gap:8px;
    box-sizing:border-box;
  }
  .sp-header-search .search-field{
    flex:1 1 auto;
    height:40px;
    font-size:16px;
    padding:.5em .75em;
  }
  .sp-header-search .search-submit{
    height:40px;
    padding:0 12px;
    font-size:14px;
    line-height:38px;
  }
}
/* トグル内ボタンの文字色を白に固定（hover/focus/active/visited含む） */
.toggle-wrap .toggle-content .wp-block-button__link,
.toggle-wrap .toggle-content .wp-block-button__link:hover,
.toggle-wrap .toggle-content .wp-block-button__link:focus,
.toggle-wrap .toggle-content .wp-block-button__link:active,
.toggle-wrap .toggle-content .wp-block-button__link:visited {
  color: #ffffff !important;
  text-decoration: none !important; /* iOSで稀に出る下線の保険 */
}
/* ===== スマホ専用：プロフィールの細かい調整 ===== */
@media (max-width: 782px){

  /* ① 写真と名前の間に余白を追加 */
  /* 名前ブロックに .doctor-name が付いている想定 */
  .profile-center .doctor-name{
    margin-top: 18px;     /* 好みで 8〜20px 程度に調整OK */
  }

  /* もし .doctor-name を付けていない場合の保険：
     プロフィールの画像直後の見出しにも余白を付与 */
  .profile-center .wp-block-image + h1,
  .profile-center .wp-block-image + h2,
  .profile-center .wp-block-image + h3{
    margin-top: 12px;
  }

  /* ② 箇条書きを左寄せに（親が text-align:center でも上書き） */
  .profile-center ul,
  .profile-center li{
    text-align: left !important;
  }

  /* 左インデントを適度に確保（好みで微調整） */
  .profile-center ul{
    margin-left: 1.2em;
    padding-left: 0.8em;
    list-style-position: outside;
  }
}