@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){
  /*必要ならばここにコードを書く*/
}




/* ========== 上段(ロゴ・住所) / 下段(メニュー) の基本 ========== */
.c32-topbar { background:#fff; }
.c32-top-in { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.c32-contact { text-align:right; font-size:14px; line-height:1.6; }
.c32-address { font-style:normal; }

/* メニュー帯は全幅(背景色はお好みで) */
.c32-menubar { background:#d0c3a2; }           /* ベージュ帯 */
.c32-menu-in { display:flex; align-items:center; justify-content:center; gap:16px; }

/* Cocoon の“メニュー固定”が有効でも無効化して干渉させない */
#navi[class*="fix"], .navi[class*="fix"],
#navi[class*="fixed"], .navi[class*="fixed"]{
  position:static !important; top:auto !important; width:auto !important; box-shadow:none !important;
}

/* ========== スクロール後(固定時) ========== */
/* メニュー帯を画面上部に固定し、左右にロゴ/メニューを配置 */
.c32-menubar.is-fixed{
  position:fixed; top:0; left:0; right:0; z-index:9999;
  background:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.06);
}
.c32-menubar.is-fixed .c32-menu-in{
  justify-content:space-between; /* 左右に振り分け */
}

/* 固定時は上段(住所エリア)を隠す */
.c32-topbar.is-hidden{ display:none !important; }

/* 固定時にメニューを右に寄せる（#navi の中身はそのまま） */
.c32-menubar.is-fixed #navi { margin-left:24px; }

/* スマホ：上段は縦積み */
@media (max-width:768px){
  .c32-top-in{ flex-direction:column; align-items:flex-start; gap:8px; }
}
/* ヘッダー右側の住所・電話部分 */
.c32-contact .c32-address .tel,
.c32-contact .c32-address .tel a {
  font-size: 28px;   /* 数字を大きく（お好みで 24〜32px） */
  font-weight: bold; /* 太字で視認性を高める */
  line-height: 1.2;
  color: #000;       /* 必要なら色指定 */
  text-decoration: none;
}

/* 他の文字（郵便番号・住所）は少し小さめにしてメリハリ */
.c32-contact .c32-address {
  font-size:14px;
  line-height:1.6;
  color: #d0c5a7;
}

.c32-contact .c32-address .tel {
  display:block;          /* ブロックにして改行 */
  margin-top:8px;         /* 上に余白を追加 → 行間が空く */
  font-size:28px;         /* 電話番号は大きく */
  font-weight:bold;
  color: #d0c5a7;
  line-height:1.2;
}

.c32-menubar.is-fixed{
  position:fixed; top:0; left:0; right:0; z-index:9999;
  background:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.06);
  width:100%;               /* ← 追加：右端のズレ防止 */
  box-sizing:border-box;     /* ← 追加：幅計算のブレ防止 */
}
