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


@keyframes rainbow-header {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

#header {
  background: linear-gradient(270deg, #ff0000, #ff7700, #ffff00, #00ff00, #0000ff, #8b00ff);
  background-size: 400% 400%;
  animation: rainbow-header 8s ease infinite;
}


/* ===== かわいいヘッダーメニュー（2026-07-12） ===== */
/* 絵文字アイコン */
#navi #menu-item-18   > a .item-label::before{content:"🎓 "}
#navi #menu-item-916  > a .item-label::before{content:"🔮 "}
#navi #menu-item-906  > a .item-label::before{content:"📖 "}
#navi #menu-item-1099 > a .item-label::before{content:"⚔️ "}
#navi #menu-item-17   > a .item-label::before{content:"🌱 "}
#navi #menu-item-915  > a .item-label::before{content:"🤸 "}
#navi #menu-item-914  > a .item-label::before{content:"💆 "}
#navi #menu-item-38   > a .item-label::before{content:"🙋 "}

/* ピル型ボタン（PC・モバイル共通） */
#navi .menu-header > .menu-item > a,
#navi .menu-mobile > .menu-item > a{
  border-radius:999px;
  font-weight:700;
  color:#5a4a42;
  margin:6px 4px;
  padding:8px 18px;
  line-height:1.4;
  height:auto;
  box-shadow:0 2px 5px rgba(120,90,160,.13);
  border:2px solid rgba(255,255,255,.9);
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
/* ラベルの「…」省略を解除 */
#navi .menu-header .item-label,
#navi .menu-mobile .item-label{
  width:auto;max-width:none;overflow:visible;text-overflow:clip;
}
/* パステルカラー（項目ごと） */
#navi #menu-item-18   > a{background:#ffe3ec}
#navi #menu-item-916  > a{background:#eae2ff}
#navi #menu-item-906  > a{background:#dcf1ff}
#navi #menu-item-1099 > a{background:#e2fbe4}
#navi #menu-item-17   > a{background:#fff6d6}
#navi #menu-item-915  > a{background:#ffe9d9}
#navi #menu-item-914  > a{background:#e0f7f4}
#navi #menu-item-38   > a{background:#f3e5ff}

/* ホバーでぷにっと */
#navi .menu-header > .menu-item > a:hover,
#navi .menu-mobile > .menu-item > a:hover{
  transform:translateY(-3px) scale(1.05);
  box-shadow:0 6px 14px rgba(120,90,160,.25);
  filter:brightness(1.04);
  color:#5a4a42;
}

/* ドロップダウン（子メニュー）は白カードで丸く */
#navi .menu-header .sub-menu{
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 8px 20px rgba(120,90,160,.2);
  border:2px solid #ffe3ec;
}
#navi .menu-header .sub-menu .menu-item > a{
  background:#fff;color:#5a4a42;font-weight:600;
}
#navi .menu-header .sub-menu .menu-item > a:hover{
  background:#fff0f6;
}


/* あマ指学生メニュー（2026-07-12追加） */
#navi #menu-item-1210 > a .item-label::before{content:"🤲 "}
#navi #menu-item-1210 > a{background:#ecf6d5}