@charset "utf-8";
/**
 * ============================================================================
 * com-sections-misc.css
 * ============================================================================
 * 
 * 【目的】
 * その他のセクション別スタイルを提供。
 * リンク、社報、写真室、巫女募集、神道ページなど。
 * 
 * 【使用ページ】
 * - /link/index.php (body_class: link) - リンク
 * - /syahou/* - 社報
 * - /miyanomae/kaisyoku.php - 写真室
 * - /miko.php - 巫女募集
 * - /sintou/* (body_class: sintou*) - 神道とは
 * 
 * 【依存関係】
 * - 必須: com-core-reset.css, com-core-base.css, com-core-layout.css
 * - 必須: com-pages-nottop.css
 * 
 * 【読み込み順序】
 * 9番目以降
 * 
 * 【主要な機能】
 * 1. #link table - リンクテーブル
 * 2. #body ul#syahoulist - 社報リスト
 * 3. div.list, div#lifep - 写真室
 * 4. table.mikot - 巫女募集要項テーブル
 * 5. section.sintoumenu - 神道メニュー
 * 
 * 【レスポンシブブレークポイント】
 * - 1000px: table.mikot マージン調整
 * - 1062px: #link table サイズ調整
 * 
 * 【注意事項】
 * - ミニファイ後は sections-misc.css にリネームされます
 * 
 * 【変更履歴】
 * 2025-10-20: perso.css セクション6-11 から統合作成
 * 
 * ============================================================================
 */


/* ============================================================================
   #link table - リンクテーブル
   ----------------------------------------------------------------------------
   【用途】
   リンクページのリンク一覧テーブル。
   
   【デザイン】
   - 幅: 620px
   - th: 背景色 #F0EEDF（ベージュ）、左寄せ
   - td: 左寄せ、下線
   - リンク色: #33c（青）
   
   【レスポンシブ】
   1062px以下: 幅 inherit、max-width calc(100vw - 14px)
   ============================================================================ */

#link table{
 margin-bottom: 5px;
 padding-bottom: 5px;
 margin-right:80px;
 margin-left:80px;
 width:620px;word-break: break-all
}
#link table th {
  padding: 10px 8px 10px 23px;
  text-align: left;
  background-color: #F0EEDF;
  border-bottom: 1px solid #ccc;
}
#link table td {
  text-align: left;
  border-bottom: 1px solid #ccc;
  padding: 10px 8px 10px 27px;
}
#link table td a{
 color:#33c;
}
@media only screen and (max-width: 1062px) {
#link table{
 margin-bottom: 5px;
 padding-bottom: 5px;
  margin-right:5px;
 margin-left:5px;
 width:inherit;
 max-width: calc(100vw - 14px);
}
}


/* ============================================================================
   #body ul#syahoulist - 社報リスト
   ----------------------------------------------------------------------------
   【用途】
   社報一覧ページのリスト。
   ============================================================================ */

#body ul#syahoulist{
 margin-left:3em;
}


/* ============================================================================
   div.list - 写真室リスト
   ----------------------------------------------------------------------------
   【用途】
   写真室ページの各写真ブロック。
   
   【デザイン】
   - 背景色: #ffffcc（淡い黄色）
   - 背景画像: /miyanomae/wasi2.jpg
   - 角丸: 5px
   ============================================================================ */

div.list{
 background-color:#ffffcc;
 background-image:url('/miyanomae/wasi2.jpg');
 margin:0 3em 0.5em 1em;
 color:#222;
 border-radius:5px;
}

#bodymain div.list img.fr{margin-left:3em}
#bodymain div.list img.fl{margin-right:3em}


/* ============================================================================
   div#lifep - ライフプラン
   ----------------------------------------------------------------------------
   【用途】
   写真室ページのライフプランセクション。
   
   【デザイン】
   - 背景色: #f785dc（ピンク）
   - 背景画像: /miyanomae/wasi.jpg
   ============================================================================ */

div#lifep{
 background-color:#f785dc;
 background-image:url('/miyanomae/wasi.jpg');
 color:#222;
}
div#lifep h4{
 color:#222;
 background-color:#fff;
}


/* ============================================================================
   table#photochtable - 写真料金テーブル
   ----------------------------------------------------------------------------
   【用途】
   写真室の料金表。
   
   【デザイン】
   - 幅: 572px
   - 枠線: #777 1px ridge（立体的）
   - th: 背景色 #fbe9e9（淡いピンク）
   ============================================================================ */

table#photochtable{
 border:solid #777 1px;
 width:572px;
 margin-left:3em;
 border-style:ridge;
}
table#photochtable td{
 border:solid #000 1px;
 padding:3px;
 text-align:right;
}
table#photochtable th{
 border:solid #600 1px;
 padding:1px;
 vertical-align:middle;
 background-color:#fbe9e9;
}
table#photochtable p{
 margin:0;
 padding:0;
}


/* ============================================================================
   table.mikot - 巫女募集要項テーブル
   ----------------------------------------------------------------------------
   【用途】
   巫女募集要項のテーブル。
   
   【デザイン】
   - 枠線: #999 thin solid
   - line-height: 1.1
   
   【レスポンシブ】
   1000px以下: マージン 1em
   ============================================================================ */

table.mikot{
  line-height:1.1;
  }
@media(max-width:1000px) {table.mikot{margin: 1em}}
table.mikot th{  vertical-align:middle;
}
table.mikot,table.mikot td,table.mikot th{border:thin #999 solid}
.mikot td{padding:3px}


/* ============================================================================
   section.sintoumenu - 神道メニュー
   ----------------------------------------------------------------------------
   【用途】
   神道とはページのメニューセクション。
   
   【デザイン】
   - ul: リストスタイルなし
   - h3: 枠線なし、背景なし、テキストシャドウ、下線
   
   【com-pages-nottop.css との関係】
   com-pages-nottop.css の h3 スタイルを上書き。
   ============================================================================ */

section.sintoumenu ul{
  margin:0;
  margin-left: 2em;
  list-style: none;
}
#bodymain section.sintoumenu h3{
  border: none;
  background: none;
  text-shadow: 3px 3px 4px #111;
  border-bottom:thin solid #aaa;
}