@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    0.0.2
*/

/*子テーマ用のスタイル*/

/* ヘッダー追跡 PC */
.site-name-text-link {
  font-weight: 500; /* ロゴ太さ */
}
.navi-in > ul li {
    margin: 0 0 0 -0.8em; /* メニュー幅 */
}
.navi-in a {
  font-size: 13px; /* ナビ文字大きさ */
  font-weight: 500;
}

/*ヘッダー追跡END*/

/*アプリーチ（中略）*/
.appreach { text-align: left; padding: 10px; border: 1px solid #7C7C7C; overflow: hidden; }
.appreach:after { content: ""; display: block; clear: both; }

/*参考・ハート・ヘッダー固定*/
.badge { margin-right: 5px; }
.fa-heart { color: #d64949; }
html { scroll-padding-top: 90px; }


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

/*1023px以下*/
@media screen and (max-width: 1023px){
  .header-container-in.hlt-top-menu { display: none; }
  #container { padding-top: 16px; } 
  html { scroll-padding-top: 25px; }
}

/* 480px以下のスマホ専用：検索窓の最終整理（虫眼鏡を消す） */
@media screen and (max-width: 480px) {
  .hs-widget-container { margin-bottom: 36px; }

  /* スマホでは虫眼鏡ボタンを完全に消す */
  .ssp-search .search-submit {
    display: none !important;
  }

  .ssp-search .form-row {
    display: flex !important;
    align-items: center !important;
    height: 48px !important; 
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
  }

  .ssp-search .search-input-container {
    flex-grow: 1 !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
  }

  .ssp-search .search-input {
    width: 100% !important;
    height: 30px !important;
    font-size: 16px !important;
    padding-left: 10px !important;
    border: none !important;
    background: transparent !important;
  }
}

/* 画像崩れ修正 */
body:not(.home) .entry-content img,
body:not(.home) .wp-block-image img,
body:not(.home) .wp-block-media-text__media img,
body:not(.home) .wp-block-gallery img {
  height: auto !important;
  width: auto !important;
  max-width: 100%;
}

body:not(.home) .entry-content .appreach__aslink img,
body:not(.home) .entry-content .appreach__gplink img {
  height: 40px !important;
  width: auto !important;
}

/* ==============================================
   Simply Static (Algolia) 検索窓・PC/共通設定
   （スマホの消去設定を邪魔しないよう、メディアクエリの外に配置）
   ============================================== */

/* 1. 外側の枠（共通） */
.ssp-search .search-form {
    display: flex !important;
    align-items: center !important;
    background-color: #ffffff !important;
    background: #ffffff !important;
    opacity: 1 !important;
    border: 1px solid #ccc !important;
    border-radius: 40px !important;
    height: 48px !important;
    padding: 0 15px !important;
    margin: 15px auto !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

/* 2. 入力欄（共通） */
.ssp-search .search-input-container {
    flex-grow: 1 !important;
    display: flex !important;
    align-items: center !important;
}

.ssp-search .search-input {
    width: 100% !important;
    border: none !important;
    background: transparent !important;
    font-size: 16px !important;
    outline: none !important;
}

/* 3. 🔍ボタン（PCなどの広い画面でのみ表示される想定） */
/* ※スマホ(480px以下)では上の display: none が優先されます */
.ssp-search .search-submit {
    flex-shrink: 0 !important;
    width: 30px !important;
    height: 30px !important;
    font-size: 0 !important;
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    position: relative !important;
}

.ssp-search .search-submit::before {
    content: "\f002" !important;
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    font-size: 18px !important;
    color: #333 !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
}

/* 4. 検索サジェスト（共通） */
.ssp-search .search-auto-complete {
    background-color: #ffffff !important;
    border: 1px solid #ccc !important;
    z-index: 9999 !important;
    width: 100% !important;
}