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

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

@media screen and (max-width: 480px) {
  /* Atlas（ロゴ）下の余白を詰める */
  .header-in {
    padding-bottom: 8px !important;
  }
  
  /* メニュー全体の上下の隙間を詰める */
  #navi {
    margin-top: 0 !important;
    margin-bottom: 12px !important;
  }

  /* メニュー文字のサイズと左右・上下の余白を最適化 */
  .navi-in a {
    padding: 6px 5px !important;
    font-size: 12px !important;
  }
}

/* ===================================================
   以下、AI作成の追加CSS
   =================================================== */

/* 【全画面共通】固定ページの投稿日・更新日を完全に非表示 */
.page .date-tags,
.page .post-date,
.page .post-update {
  display: none !important;
}

/* スマホ表示時の最適化 */
@media screen and (max-width: 480px) {
  /* PC用メニューの重複表示を防止 */
  .navi-in > ul.menu-header {
    display: none !important;
  }
  
  /* Atlas（ロゴ）の上下余白をスリムに */
  .header-in,
  #header-in {
    padding-top: 14px !important;
    padding-bottom: 2px !important;
  }
  
  .logo-header {
    margin: 0 !important;
    padding: 0 !important;
  }

  /* メニューブロック全体の上下の隙間 */
  #navi {
    margin-top: 0 !important;
    margin-bottom: 8px !important;
  }

  /* メニュー項目の文字サイズと左右パディング */
  .navi-in a {
    padding: 6px 3px !important;
    font-size: 13px !important;
    letter-spacing: -0.01em !important;
    white-space: nowrap !important;
  }
}
/* ===================================================
   以上、AI作成の追加CSSここまで
   =================================================== */

/* ===================================================
   以下、AI作成の追加CSS
   =================================================== */

/* 【全画面共通】固定ページの投稿日・更新日を完全に非表示 */
.page .date-tags,
.page .post-date,
.page .post-update {
  display: none !important;
}

/* 【全画面共通】投稿者名（minori-ad）をサイト全体で非表示 */
.author-info,
.post-author,
.vcard,
.byline,
.author {
  display: none !important;
}

/* ---------------------------------------------------
   お問い合わせフォームの洗練化デザイン
   --------------------------------------------------- */
/* 入力欄（テキスト・メール・本文）の上品な装飾 */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea {
  width: 100% !important;
  border: 1px solid #ddd7d0 !important;
  background-color: #faf9f7 !important;
  border-radius: 4px !important;
  padding: 10px 12px !important;
  font-size: 14px !important;
  color: #444 !important;
  box-sizing: border-box !important;
  transition: all 0.2s ease !important;
}

/* 入力欄をタップ・選択した時の枠線カラー */
.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 textarea:focus {
  border-color: #b06b52 !important;
  background-color: #ffffff !important;
  outline: none !important;
}

/* 項目ラベル（氏名、メールアドレス等）のフォントと余白 */
.wpcf7 p {
  font-size: 13px !important;
  color: #555 !important;
  font-weight: 500 !important;
  margin-bottom: 16px !important;
}

/* 送信ボタン（原色の青から上品なブランドカラーへ変更） */
.wpcf7 input[type="submit"] {
  display: block !important;
  width: 80% !important;
  max-width: 240px !important;
  margin: 24px auto 10px !important;
  background-color: #8c7e75 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 25px !important;
  padding: 12px 0 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.08) !important;
  cursor: pointer !important;
  transition: opacity 0.2s ease !important;
}

.wpcf7 input[type="submit"]:hover {
  opacity: 0.85 !important;
}

/* ---------------------------------------------------
   スマホ表示時の最適化
   --------------------------------------------------- */
@media screen and (max-width: 480px) {
  /* PC用メニューの重複表示を防止 */
  .navi-in > ul.menu-header {
    display: none !important;
  }
  
  /* Atlas（ロゴ）の上下余白をスリムに */
  .header-in,
  #header-in {
    padding-top: 14px !important;
    padding-bottom: 2px !important;
  }
  
  .logo-header {
    margin: 0 !important;
    padding: 0 !important;
  }

  /* メニューブロック全体の上下の隙間 */
  #navi {
    margin-top: 0 !important;
    margin-bottom: 8px !important;
  }

  /* メニュー項目の文字サイズと左右パディング */
  .navi-in a {
    padding: 6px 3px !important;
    font-size: 13px !important;
    letter-spacing: -0.01em !important;
    white-space: nowrap !important;
  }
}
/* ===================================================
   以上、AI作成の追加CSSここまで
   =================================================== */

/* ===================================================
   以下、AI作成の追加CSS
   =================================================== */

/* 【全画面共通】固定ページの投稿日・更新日を完全に非表示 */
.page .date-tags,
.page .post-date,
.page .post-update {
  display: none !important;
}

/* 【全画面共通】固定ページの見出し（タイトル）下の余白を確保 */
.page .entry-title {
  margin-bottom: 36px !important;
}

/* 【全画面共通】投稿者名（minori-ad）をサイト全体で非表示 */
.author-info,
.post-author,
.vcard,
.byline,
.author {
  display: none !important;
}

/* ---------------------------------------------------
   お問い合わせフォームの洗練化デザイン
   --------------------------------------------------- */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea {
  width: 100% !important;
  border: 1px solid #ddd7d0 !important;
  background-color: #faf9f7 !important;
  border-radius: 4px !important;
  padding: 10px 12px !important;
  font-size: 14px !important;
  color: #444 !important;
  box-sizing: border-box !important;
  transition: all 0.2s ease !important;
}

.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 textarea:focus {
  border-color: #b06b52 !important;
  background-color: #ffffff !important;
  outline: none !important;
}

.wpcf7 p {
  font-size: 13px !important;
  color: #555 !important;
  font-weight: 500 !important;
  margin-bottom: 16px !important;
}

.wpcf7 input[type="submit"] {
  display: block !important;
  width: 80% !important;
  max-width: 240px !important;
  margin: 24px auto 10px !important;
  background-color: #8c7e75 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 25px !important;
  padding: 12px 0 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.08) !important;
  cursor: pointer !important;
  transition: opacity 0.2s ease !important;
}

.wpcf7 input[type="submit"]:hover {
  opacity: 0.85 !important;
}

/* ---------------------------------------------------
   スマホ表示時の最適化
   --------------------------------------------------- */
@media screen and (max-width: 480px) {
  /* PC用メニューの重複表示を防止 */
  .navi-in > ul.menu-header {
    display: none !important;
  }
  
  /* スマホでのタイトル下余白は少しスリムに調整 */
  .page .entry-title {
    margin-bottom: 24px !important;
  }
  
  /* Atlas（ロゴ）の上下余白をスリムに */
  .header-in,
  #header-in {
    padding-top: 14px !important;
    padding-bottom: 2px !important;
  }
  
  .logo-header {
    margin: 0 !important;
    padding: 0 !important;
  }

  /* メニューブロック全体の上下の隙間 */
  #navi {
    margin-top: 0 !important;
    margin-bottom: 8px !important;
  }

  /* メニュー項目の文字サイズと左右パディング */
  .navi-in a {
    padding: 6px 3px !important;
    font-size: 13px !important;
    letter-spacing: -0.01em !important;
    white-space: nowrap !important;
  }
}
/* ===================================================
   以上、AI作成の追加CSSここまで
   =================================================== */