/*
Theme Name: MONAD child
Theme URI: https://tcd-theme.com/tcd110
Description: WordPressテーマ「MONAD」の子テーマ ─ るみっく蒼空カスタム版
Template: monad_tcd110
Author: TCD
Author URI: https://tcd-theme.com/
Version: 9.8.0
*/

/* ============================================================
   るみっく蒼空 カスタムCSS
   ─ 子テーマ style.css
   ─ 親テーマ（monad_tcd110）は直接編集しない
   ─ 主要スタイルは assets/css/ に分割
============================================================ */

/* ----------------------------------------------------------
   CSS カスタムプロパティ（カラー変数）
---------------------------------------------------------- */
:root {
  --color-main:        #6EC6E8;
  --color-main-dark:   #4AAED0;
  --color-sub:         #EAF8FF;
  --color-accent:      #7BC67B;
  --color-accent-dark: #5BAB5B;
  --color-bg:          #FFFFFF;
  --color-bg-soft:     #F8FCFF;
  --color-text:        #333333;
  --color-text-sub:    #666666;
  --color-border:      #D6EEF8;
  --color-white:       #FFFFFF;
  --radius-card:       12px;
  --shadow-card:       0 4px 20px rgba(110, 198, 232, 0.15);
  --shadow-hover:      0 8px 32px rgba(110, 198, 232, 0.28);
  --transition:        0.28s ease;
  --font-jp:           "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
}

/* ----------------------------------------------------------
   ベース調整
---------------------------------------------------------- */
body {
  color: var(--color-text);
  background-color: var(--color-bg);
  font-family: var(--font-jp);
  -webkit-font-smoothing: antialiased;
}

a {
  color: var(--color-main-dark);
  transition: color var(--transition);
}
a:hover {
  color: var(--color-main);
}

/* ----------------------------------------------------------
   アクセシビリティ
---------------------------------------------------------- */
:focus-visible {
  outline: 3px solid var(--color-main);
  outline-offset: 2px;
}

/* ----------------------------------------------------------
   写真なしでも成立する背景パターン
---------------------------------------------------------- */
.img-placeholder-sky {
  background: linear-gradient(180deg, #C8E8F8 0%, #EAF8FF 50%, #F0FBF0 100%);
  min-height: 240px;
  border-radius: var(--radius-card);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-main);
  font-size: 48px;
  opacity: 0.7;
}

/* ==========================================================
   ヘッダーのサブメニュー表示位置の修正 (v9.8)
   ─ 親テーマは編集せず、子テーマで上書き
   ─ ページ最上部（非sticky）でサブメニューが上方向に出て
     文字が見切れる問題を修正し、常に下方向に表示する
   ========================================================== */
body:not(.header_sticky_active) #global_menu > ul > li > ul {
  top: 0 !important;
  bottom: auto !important;
  transform: translate3d(0, 110px, 0) !important;
}
body:not(.header_sticky_active) #global_menu > ul > li.active > ul {
  transform: translate3d(0, 92px, 0) !important;
}