@charset "utf-8";
/* =====================================================================
   高校生国際美術展　表現の決まり（2026-10-16 制定）
   どのページ・部品でも、色・文字・余白はここで決めた値だけを使う。
   最後に読み込み、古い CSS の値を上書きする。
   ---------------------------------------------------------------------
   色：紺（主色）、青緑（差し色）の2色＋無彩色。赤と黄は強調だけ。
   文字：本文はゴシック（Noto Sans JP）。明朝（Zen Old Mincho）は「雰囲気」用
         ＝トップの帯・新着情報・回のタイトル・フッターの一文だけ。
   大きさ：注記12／補助13／本文15／小見出し16／見出し帯17（px）
   行間：文章1.85／表・一覧1.6／見出し1.4
   余白：4の倍数（8・12・16・24・32）。段落の間16、見出しの下16、まとまりの間32
   ===================================================================== */
:root{
  --c-navy:#2b3996;      /* 主色：見出しの文字、ボタン、ラベル */
  --c-navy-deep:#1b2a6b; /* フッター、押したとき */
  --c-teal:#3fc3c9;      /* 差し色：帯、線、選択中 */
  --c-teal-soft:#e9f8f9;
  --c-ink:#2b2f38;       /* 本文 */
  --c-sub:#5c6474;       /* 補助の文字 */
  --c-faint:#8a91a0;     /* 注記 */
  --c-line:#dfe3ec;      /* 罫線 */
  --c-surface:#f5f6fa;   /* 面（表の見出し、囲み） */
  --c-red:#d6262c;       /* 強調（注意・YouTube）だけ */
  --f-sans:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans","Meiryo",sans-serif;
  --f-serif:"Zen Old Mincho","Hiragino Mincho ProN","Yu Mincho",serif;
}

/* ---- 文字の基本 ---- */
body{color:var(--c-ink);font-family:var(--f-sans)}
body #main{font-family:var(--f-sans);font-size:15px;line-height:1.85;color:var(--c-ink)}
#main p,#main dd,#main li{font-size:15px;line-height:1.85}
#main p + p{margin-top:16px}
#pan,#pan a{font-size:12px;color:var(--c-sub)}
#pan a{color:var(--c-navy)}

/* ---- リンク：紺。文章の中だけ青緑の下線 ---- */
a{color:var(--c-navy)}
a:hover{color:var(--c-navy-deep)}
#main p a,#main td a,#main dd a,.topics .text a{color:var(--c-navy);text-decoration:underline;text-decoration-color:var(--c-teal);text-decoration-thickness:1px;text-underline-offset:4px}
#main p a:hover,#main td a:hover,#main dd a:hover,.topics .text a:hover{text-decoration-thickness:2px}

/* ---- 見出し ---- */
body #main h2.ttl{font-family:var(--f-sans) !important;font-size:17px !important;line-height:1.4 !important;letter-spacing:.08em;margin-bottom:16px}
.arc-sec h3,#main h3.ttl-red{font-family:var(--f-sans)}
.arc-sec h3{font-size:16px;line-height:1.4;color:var(--c-navy);border-left:4px solid var(--c-teal);padding:2px 0 2px 10px;margin:0 0 8px}
.arc-sec{margin:32px 0 0}

/* ---- 表（公募規定・問い合わせ・会期など）：見出しの列は面の色＋紺の文字にそろえる ---- */
#main table.inv_table{border-color:var(--c-line)}
#main table.inv_table th{background:var(--c-surface) !important;color:var(--c-navy) !important;font-size:14px !important;font-weight:bold;line-height:1.6;border-color:var(--c-line) !important}
#main table.inv_table td{font-size:15px;line-height:1.75;color:var(--c-ink);border-color:var(--c-line) !important}
.arc-data{background:var(--c-surface);border-color:var(--c-line);font-size:15px;line-height:1.75}
.arc-data dt{color:var(--c-navy)}

/* ---- リンクの一覧 ---- */
.arc-links li{border-bottom:1px solid var(--c-line)}
.arc-links a,.list_pdf li a{font-size:15px;line-height:1.6;color:var(--c-navy)}

/* ---- 新着情報（明朝＝雰囲気。大きさと行間は本文と同じ） ---- */
.topics h2{font-family:var(--f-serif);font-size:20px;color:var(--c-navy);letter-spacing:.08em}
.topics ul{border-top-color:var(--c-line)}
.topics li{border-bottom-color:var(--c-line);padding:16px 15px}
.topics .day{font-family:var(--f-sans);font-size:13px;color:var(--c-sub);line-height:1.85;width:84px}
.topics .label{font-family:var(--f-sans);font-size:12px;background:var(--c-navy);line-height:1.8;margin:2px 16px 0}
.topics .text{font-family:var(--f-serif);font-size:15px;line-height:1.85;color:var(--c-ink)}

/* ---- トップのタイル：主色の紺にそろえる（第三の青をやめる） ---- */
.tile{background:var(--c-navy)}
.tile:hover{background:var(--c-navy-deep);filter:none}

/* ---- ダイアログ（過去の審査／学校コード）：同じ型 ---- */
.past-dialog{font-family:var(--f-sans);color:var(--c-ink);padding:24px}
.past-dialog .head{font-size:16px;line-height:1.4;color:var(--c-navy);padding:0 32px 12px 0;border-bottom:2px solid var(--c-teal);margin-bottom:16px}
.past-dialog .close{color:var(--c-sub);font-size:20px;top:-6px}
.past-dialog dt{font-size:15px;color:var(--c-navy);margin-top:16px;line-height:1.6}
.past-dialog dd{font-size:14px;line-height:1.7;margin:4px 0 0 0;color:var(--c-sub)}
.past-dialog dd a{color:var(--c-navy)}
.school-form label{font-size:13px;color:var(--c-navy)}
.school-form input{border-color:var(--c-line);color:var(--c-ink)}
.school-form input:focus{outline:2px solid var(--c-teal);border-color:var(--c-teal)}
.school-count{font-size:13px;color:var(--c-sub);margin:4px 0 8px}
.school-results{border-top-color:var(--c-line)}
.school-results th{font-size:13px;color:var(--c-navy);background:var(--c-surface);border-bottom-color:var(--c-line)}
.school-results td{font-size:15px;line-height:1.6;border-bottom-color:var(--c-line)}
.school-results .code{color:var(--c-navy);font-size:15px}
.school-results .addr{font-size:13px;color:var(--c-sub)}
.school-note{font-size:12px;color:var(--c-faint)}

/* ---- 囲み・注記 ---- */
.notice-term{background:var(--c-teal-soft)}
.notice-term .note{color:var(--c-sub)}

/* ---- 過去の美術展の右の一覧：差し色の青緑にそろえる ---- */
#a_right .a_link{border-color:var(--c-teal)}
#a_right .a_link h3{background:var(--c-teal)}
#a_right .a_link li{border-bottom-color:rgba(63,195,201,.6)}
#a_right .a_link li a{color:var(--c-navy)}

@media (max-width:819px){
  body #main h2.ttl{font-size:16px !important}
  .topics .text{font-size:15px}
}