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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/*カスタム見出し*/
.subtitle {
  font-size: 15px;
  font-weight: bold;
  padding: 0.5em;/*文字周りの余白*/
  color: #010101;/*文字色*/
  background: #eaf3ff;/*背景色*/
  border-top: solid 2px #516ab6;/*下線*/
}
.myname {
  font-size: 20px;
  font-weight: bold;
  padding: 1px;/*文字周りの余白*/
  color: #010101;/*文字色*/
  background: #ffebff;/*背景色*/
}
/*吹き出しの文字色*/
.speech-wrap {
  --cocoon-custom-text-color: #fff;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
/* --- 検索ボタンの上下ズレ・浮き上がり修正（テキストボックス幅は変更せずそのまま） --- */

/* フォーム全体をフレックスボックス化して基準を作る */
.sidebar .widget_search form,
.sidebar .search-box,
.main .search-box,
.search-page .search-box,
.search-box {
    display: flex !important;
    align-items: center !important;
    position: relative !important;
}

/* Cocoon最新仕様とアリススキンに対応した検索ボタンの完全位置修正 */
/* --- アリススキン・検索ボタンの位置ズレ/上切れ最終調整 --- */
/* 検索ボックスとボタンの高さ・位置の完全同期 */
/* --- 検索フォーム：必要最小限の修正コード --- */
.search-box.input-box {
    position: relative !important;
    height: 40px !important;
    min-height: 0 !important;
}

.search-box.input-box .search-edit {
    height: 40px !important;
    min-height: 0 !important;
    padding-right: 45px !important; /* ボタンと文字が重ならないための余白 */
}

.search-box.input-box .search-submit {
    position: absolute !important;
    top: 50% !important;
    right: 0 !important;
    transform: translateY(-50%) !important;
    height: 40px !important;
    min-height: 0 !important;
    width: 45px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}