@charset "UTF-8";
/* ============================================================
  KINJO HALLOWEEN 2026 ― mrkinjo.jp 用 ハロウィン配色（上書き用CSS）
  ・style.css / common.css / slider.css の「色」だけを上書きします
    （レイアウト・余白・文字サイズは変更しません）
  ・style-xmas.css と同じく、期間中だけ header.php から読み込みます
  ・kinjo-halloween.css（リボン・クモの巣などの飾り）とは別ファイルです

  配色
    夜の紫（濃）  #1b0d2e   … トップページ背景・フッター
    紫（基本色）  #3b1a5c   … ナビ・見出し・ボタン（元の茶色 #63381b の置き換え）
    薄い紫        #7b5aa6   … 表の見出し
    かぼちゃ色    #ff8a1f   … 差し色（濃い背景の上で使用）
    濃いオレンジ  #c24a00   … リンク・赤ボタン（元の赤 #cc0033 の置き換え）
    クリーム      #fff6ea   … ヘッダー背景
    薄いラベンダー #efe9f5  … 下層ページ背景
============================================================ */


/* ------------------------------------------------------------
  1. 元の茶色・赤を、同じセレクタのまま紫・オレンジに置き換え
     （style.css から機械的に抜き出したもの）
------------------------------------------------------------ */
a { color:#c24a00; }
nav { background-color:#3b1a5c; }
nav .navigation>li.current>a { color:#3b1a5c; }
nav .navigation>li ul li { background-color:#3b1a5c; }
nav .navigation>li ul li.current>a { color:#3b1a5c; }
.members_button a { background-color:#3b1a5c; }
.subpage .topicpath li { color:#3b1a5c; }
.subpage .topicpath li a { color:#3b1a5c; }
.subpage aside .ttl { color:#c24a00; }
.subpage aside .box_side_recommend .li_side_recommend li { border-bottom-color:#3b1a5c; }
.subpage aside .box_side_recommend .li_side_recommend li .ttl { color:#3b1a5c; }
.subpage aside .box_side_recommend .li_side_recommend li .ttl a { color:#3b1a5c; }
footer { background-color:#3b1a5c; }
.ttl_skin01 { color:#3b1a5c; }
.ttl_skin04 { border-left-color:#3b1a5c; color:#3b1a5c; }
.subpage h1,
.subpage .ttl_skin05 { color:#3b1a5c; }
.btn_skin01,
.btn_skin02 { background-color:#3b1a5c; }
.btn_skin01:hover,
.btn_skin02:hover { background-color:rgba(59,26,92,0.9); }
.btn_skin02 { background-color:#c24a00; }
.btn_skin02:hover { background-color:#a83f00; }
button { background-color:#c24a00; }
button:hover { background-color:#a83f00; }
.box_visual .box_search_form .ttl { color:#c24a00; }
.tabmenu li a:hover { background-color:rgba(59,26,92,0.1); }
.tabmenu li.current a { background-color:#3b1a5c; }
.box_tab_search>.tabmenu li.current a:after { border-left-color:#3b1a5c; }
.box_tab_search .box_plan h3 { border-left-color:#3b1a5c; color:#3b1a5c; }
.box_tab_search .box_plan th { background-color:#7b5aa6; }
.box_tab_search .li_room li a .ttl { background-color:rgba(59,26,92,0.9); }
.box_tab_search .li_room li a:hover .ttl { background-color:rgba(59,26,92,0.7); }
.box_tab_search #infoWindow { color:#3b1a5c; }
.box_tab_news .tabmenu li.current a:after { border-top-color:#3b1a5c; }
.box_tab_news .li_news li a .ph .figcaption { background-color:#3b1a5c; }
.box_tab_news .li_news li a .ttl { color:#3b1a5c; }
.tel { color:#3b1a5c; }
.li_sitemap li a { color:#3b1a5c; }
.li_hotel_list li .txt_hotel_name { color:#3b1a5c; }
.li_hotel_list li .txt_hotel_name_kana { color:#3b1a5c; }
.slider_hotel_nav .active img { border-color:#c24a00; }
.box_btn_inquiry a { background-color:#3b1a5c; }
.box_btn_inquiry a:hover { background-color:#3b1a5c; }
.table_hotel_info .btn_map { background-color:#3b1a5c; }
.table_hotel_info a { color:#3b1a5c; }
.li_near_walk li .ttl { color:#3b1a5c; }
.box_tab_newslist .tabmenu li.current a:after { border-top-color:#3b1a5c; }
.box_tab_newslist .li_news a .ph .figcaption { background-color:#3b1a5c; }
.box_tab_newslist .li_news a .ttl { color:#3b1a5c; }
.box_event_first .ttl { color:#3b1a5c; }
.box_event_second .li_event_min a { color:#3b1a5c; }
.box_event_second .li_event_min li { border-bottom-color:#3b1a5c; }
.li_event .ttl a { color:#3b1a5c; }
.post h1 { border-bottom-color:#3b1a5c; }
.post h2 { border-left-color:#3b1a5c; color:#3b1a5c; }
.post .li_event_detail a { color:#3b1a5c; }
.post .btn_map { background-color:#3b1a5c; }
.box_walk_first .ttl { color:#3b1a5c; }
.li_walk_list li { border-bottom-color:#3b1a5c; }
.li_walk_list .ttl a { color:#3b1a5c; }
.box_pager .li_page li a { background-color:#3b1a5c; }
.box_pager .li_page li.current a,
.box_pager .li_page li.prev a,
.box_pager .li_page li.next a { color:#3b1a5c; }
.ttl_faq { background-color:#3b1a5c; }
.li_faq { border-bottom-color:#3b1a5c; }
.li_faq dt { color:#3b1a5c; }
.li_faq dt:before { color:#3b1a5c; }
.li_faq dt .btn_faq { background-color:#3b1a5c; }
.li_faq dt .btn_faq:hover { background-color:rgba(59,26,92,0.9); }
.subpage table.post_table th { background-color:#3b1a5c; }
.hotel_list .figure .region { background-color:rgba(59,26,92,0.8); }
.hotel_list .hotel_data .name { color:#3b1a5c; }
.section_vr .heading_vr { border-left-color:#3b1a5c; }

@media (max-width: 768px) {
  #button { color:#3b1a5c; }
  #slide_menu { border-left-color:#3b1a5c; }
  #slide_menu .navigation li { border-color:#3b1a5c; }
  #slide_menu .navigation li a { background-color:#3b1a5c; }
  #slide_menu .navigation li.current a { background-color:#3b1a5c; }
  #slide_menu .navigation li ul li.current a { background-color:#3b1a5c; }
  #slide_menu .nav_sp li { border-bottom-color:#3b1a5c; }
  #slide_menu .nav_sp li:first-child { border-top-color:#3b1a5c; }
  #slide_menu .nav_sp li a { color:#3b1a5c; }
  #slide_menu .btn_close span { color:#3b1a5c; }
  .btn_top { border-color:#3b1a5c; }
  .box_tab_search>.tabmenu li.current a:after { border-left-color:transparent; border-top-color:#3b1a5c; }
  .box_tab_search .box_map .ttl { color:#3b1a5c; }
  .box_tab_search .box_plan { border-bottom-color:#3b1a5c; }
  .box_fixed { background-color:#3b1a5c; }
}

/* ------------------------------------------------------------
  2. ヘッダー・ナビ
     ロゴが黒なので、ヘッダーは明るいクリーム色のままにしています
------------------------------------------------------------ */
header { background-color:rgba(255,246,234,0.92); }
.subpage header { background-color:#fff6ea; }

nav .navigation>li a:hover { background-color:rgba(255,138,31,0.28); }
nav .navigation>li.current>a,
nav .navigation>li ul li.current>a { background-color:#ff8a1f; color:#1b0d2e; }

@media (min-width: 769px) {
  nav { box-shadow:0 3px 0 #ff8a1f; }
}


/* ------------------------------------------------------------
  3. スライダー（slider.css）
------------------------------------------------------------ */
.sliderWrapper { background-color:#fff6ea; }
.slider { background-color:#1b0d2e; }
.slide .cap { background-color:rgba(27,13,46,0.85); }
.arrow { color:#3b1a5c; }
.arrow:hover { background-color:#ff8a1f; color:#1b0d2e; }
.dots button.on { background-color:#ff8a1f; }


/* ------------------------------------------------------------
  4. 背景
     トップページ … 夜空の紫（白いパネルが浮かぶ形）
     下層ページ   … 文字が背景に直接乗る箇所があるため、薄いラベンダー
------------------------------------------------------------ */
.main { background-color:#efe9f5; }

.top .main {
  background:
    radial-gradient(ellipse at 85% 0%, rgba(255,138,31,0.22), rgba(255,138,31,0) 55%),
    radial-gradient(ellipse at 10% 100%, rgba(123,90,166,0.35), rgba(123,90,166,0) 60%),
    linear-gradient(180deg, #1b0d2e 0%, #2c1447 100%);
}
.top .content section {
  border-top:4px solid #ff8a1f;
  background-color:rgba(255,255,255,0.96);
}
.ttl_skin01 span { color:#c24a00; }


/* ------------------------------------------------------------
  5. フッター
------------------------------------------------------------ */
footer { background-color:#1b0d2e; border-top:4px solid #ff8a1f; }
footer a:hover { color:#ff8a1f; }


/* ------------------------------------------------------------
  6. スマホ（768px以下）
------------------------------------------------------------ */
@media (max-width: 768px) {
  header { background-color:#fff6ea; }
  .container { background-color:#efe9f5; }
  .top .container { background-color:#1b0d2e; }
  .sliderWrapper { background-color:#1b0d2e; }

  /* スマホのトップは、元のデザイン通り白い1枚のパネルにします */
  .top .main { background:#fff; }
  .top .content section { border-top-width:3px; background-color:transparent; }
  .subpage .main { background:none; }
}


/* ------------------------------------------------------------
  7. 印刷時は元の配色に近づける
------------------------------------------------------------ */
@media print {
  .main, .top .main, .container, .top .container { background:none !important; }
}