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

/************************************
** 全体設定
************************************/
body {
  font-size: 16px;
  line-height: 1.8;
  color: #333;
}

/************************************
** タイトル・キャッチコピーの左寄せ
************************************/
.site-branding {
  display: block !important;
  text-align: left !important;
}
.site-title {
  text-align: left !important;
  margin-left: 40px;
}
.site-description {
  text-align: left !important;
  margin-left: 40px;
  color: #4d4d70 !important;
  opacity: 1 !important;
  font-size: 1.1em;
  font-style: italic;
  margin-top: 8px;
}

/************************************
** ナビゲーションバー
************************************/
#navi {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  gap: 130px;
  padding: 15px 30px;
  padding-right: 80px;
  overflow-x: auto;
  white-space: nowrap;
  background-color: #d1c2e9;
  box-sizing: border-box;
  width: 100%;
  min-width: calc(100vw + 100px);
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}
#navi li {
  list-style: none;
  font-weight: bold;
  font-size: 16px;
  white-space: nowrap;
}
#navi li a {
  display: inline-block;
  padding: 5px 10px;
  text-decoration: none;
  color: inherit;
}

/************************************
** カテゴリボタン
************************************/
.category-button-box {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 20px;
}
.category-button {
  padding: 10px 20px;
  border: 2px solid #4b4b6f;
  border-radius: 10px;
  background-color: #f2f2f8;
  color: #2c2c2c !important;
  font-weight: bold;
  text-decoration: none;
  display: inline-block;
  transition: 0.3s;
}
.category-button:hover {
  background-color: #e2e2f2;
  color: #000 !important;
}

/************************************
** 背景画像
************************************/
html {
  background-image: url('https://yoribou.com/wp-content/uploads/2025/06/shika-bg.jpg');
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-position: center top !important;
  background-attachment: fixed !important;
}


/************************************
** プルダウンメニュー
************************************/
.menu-item-has-children {
  position: relative;
}
.sub-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background-color: #ffffff;
  min-width: 180px;
  padding: 10px 0;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  z-index: 9999;
}
.menu-item-has-children:hover > .sub-menu {
  display: block !important;
}
.sub-menu li a {
  display: block;
  padding: 8px 16px;
  color: #333;
  text-decoration: none;
}
.sub-menu li a:hover {
  background-color: #eee;
  color: #000;
}

/************************************
** レスポンシブ対応（必要なら後で追記）
************************************/
@media screen and (max-width: 1023px) {
  /* スマホ・タブレット向けの調整 */
}
/* 背景画像：鹿（1枚のみ、中央固定） */
html {
  background-image: url('https://yoribou.com/wp-content/uploads/2025/06/deer-8963719_960_720.jpg');
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-position: center top !important;
  background-attachment: fixed !important;
  /* background-color: #000 !important; ← 黒くしたくないなら削除またはコメントアウト */
}

body {
  background: transparent !important;
}


body {
  background: transparent !important;
}
