@charset "utf-8";
/**
 * ============================================================================
 * com-sections-event-list.css
 * ============================================================================
 * 
 * 【目的】
 * 年間祭事一覧ページのスタイルを提供。
 * ul#nen（祭事リスト）とサイドメニューの特殊スタイル。
 * 
 * 【使用ページ】
 * - /event/index.php (body_class: event)
 * 
 * 【依存関係】
 * - 必須: com-core-reset.css, com-core-base.css, com-core-layout.css
 * - 必須: com-pages-nottop.css
 * 
 * 【読み込み順序】
 * 6番目以降（com-components-common.css の後）
 * 
 * 【主要な機能】
 * 1. ul#nen - 年間祭事一覧リスト
 *    - 背景画像アイコン付き
 *    - 点線下線
 *    - 内側の影
 *    - span で日付を右側に表示
 * 
 * 2. #nenkan サイドメニュー
 *    - h3 背景色を navy に
 *    - .mainevent リンクを太字に
 * 
 * 【レスポンシブブレークポイント】
 * - 1062px以下: 
 *   - li の line-height 縮小
 *   - span の margin 調整
 * 
 * 【注意事項】
 * - ul#nen は /event/index.php でのみ使用
 * - #nenkan body_class は個別祭事ページでも使用される
 * - ミニファイ後は sections-event-list.css にリネームされます
 * 
 * 【変更履歴】
 * 2025-10-20: perso.css セクション2から分割作成
 * 
 * ============================================================================
 */


/* ============================================================================
   ul#nen - 年間祭事一覧リスト
   ----------------------------------------------------------------------------
   【用途】
   年間祭事一覧ページ（/event/index.php）で、1年間の祭事を月ごとに表示。
   
   【構造】
   <ul id="nen">
     <li>1月1日 <span>歳旦祭</span></li>
     <li>2月3日 <span>節分祭</span></li>
     ...
   </ul>
   
   【デザイン】
   - 幅: 80%
   - 枠線: #aaa 1px solid
   - 内側の影: inset
   - リストアイコン: /i/list2.gif
   - 下線: #99c 1px dashed
   
   【span の配置】
   - display: block（ブロック化）
   - margin: -2em 0 0 13em（日付の右側に配置）
   
   【レスポンシブ】
   1062px以下: span の margin を 0 0 0 2em に変更（縦並びに近くなる）
   ============================================================================ */

ul#nen{
 border:1px solid #aaa;
 margin:2.5em auto 1em auto;
 padding:0.2em 0.5em 1em;
 width:80%;
box-shadow:inset 0px 0px 20px -5px #f55;
}
ul#nen li {
 background-image: url('/i/list2.gif');
 background-position: 0px 0.6em;
 background-repeat: no-repeat;
 text-indent: 2em;
 line-height: 2;
 list-style-type:none;
 border-bottom:1px dashed #99c;
 margin-top:0.2em;
 color:#111;
}
#nen span {
 display: block;
 width: 330px;
 margin: -2em 0 0 13em;
 text-indent: 0;
}
@media only screen and (max-width: 1062px) {
ul#nen li{
line-height: 1.1}
#nen span {
 margin: 0 0 0 2em;
}
}


/* ============================================================================
   #nenkan サイドメニュー特殊スタイル
   ----------------------------------------------------------------------------
   【対象ページ】
   body_class が "nenkan" のページ:
   - /event/reisai.php（例大祭）
   - /event/nakisumo.php（泣き相撲）
   - /event/nagosi.php（夏越祭）
   - /event/setubun.php（節分祭）
   - /event/yasaka.php（八坂祭）
   - /event/sinnen.php（新年祭）
   
   【スタイル】
   - ul: line-height 1.1（詰める）
   - h3: 背景色 navy、文字色 white
   - .mainevent リンク: 太字、色 #115（濃い青）
   
   【理由】
   年間祭事ページは項目が多いため、サイドメニューを詰めて表示。
   主要な祭事（.mainevent）は太字で強調。
   ============================================================================ */

#nenkan #bodymenu ul{
 line-height:1.1;
}
#nenkan #bodymenu h3{ background-color:navy;
 color:white;
}
#nenkan #bodymenu .mainevent a:link{
 font-weight:bold;
 color:#115;
}