@charset "utf-8";
/* ============================================================
   CCCD-0078 「インターネットサバイバー feat.初音ミク＆重音テト」
   テーマCSS  -  base.css の後に読み込んで配色のみ上書きする追加スタイル
   （レイアウト寸法・float・box-sizing は base.css に従う）
   カラーパレット（添付印刷物より）
     初音ミクの青緑 : #3FC5D4
     重音テトの赤   : #E8243C
     アクセント黄   : #F4C743
   ============================================================ */

:root {
	--miku-teal:   #3FC5D4;
	--miku-teal-d: #2A9AA8;
	--teto-red:    #E8243C;
	--teto-red-d:  #B81528;
	--accent-yel:  #F7D873;
	--ink:         #2A2330;
	--seka-navy:   #143C8C;
	--paper:       #FFFFFF;
}

/* ---- ページ全体の地色 ------------------------------------ */
/* base.css は body に image/bg1.png を敷くので、画像を使わず
   黄色＋斜線の地色で上書きする */
body {
	background-image: none;
	background-color: var(--accent-yel);
	background-image:
		repeating-linear-gradient(
			135deg,
			rgba(255,255,255,.18) 0px,
			rgba(255,255,255,.18) 2px,
			transparent 2px,
			transparent 22px);
}

/* ---- 文字色（base.css は #017 既定） --------------------- */
body,
section p,
section ul li,
#info dl dt,
#track dt {
	color: var(--ink);
}

/* ---- ヘッダー最上部の黒帯 -------------------------------- */
header #circle {
	background: var(--miku-teal);
}

h1 {
	color: var(--paper);
	text-shadow: 0 2px 0 rgba(0,0,0,.25);
}

/* ---- 大見出し h2  ---------------------------------------- */
/* base.css の width:1000px / box-sizing / padding はそのまま、
   色だけ上書き */
h2 {
	background-color: var(--miku-teal);
	background-image: none;
	border-left: 10px solid var(--teto-red);
	color: var(--paper);
}

/* ---- リンク（base.css は黒→hover赤） -------------------- */
a:link    { color: var(--teto-red-d); }
a:visited { color: var(--teto-red-d); }
a:hover   { color: var(--miku-teal-d); }
a:active  { color: var(--teto-red-d); }

/* ---- 本文テキスト ---------------------------------------- */
section p {
	border: 2px dashed var(--miku-teal);
	background: transparent;
	padding: 1em 1.2em;
	box-sizing: border-box;
}

/* ---- 情報リスト dl --------------------------------------- */
/* base.css: dt は width:30% float:left / dd は width:70% float:left
   幅・float はそのまま、見た目だけ調整 */
#info dl dt {
	color: var(--teto-red-d);
}
#info dl dd {
	border-bottom: 1px solid var(--miku-teal);
}

/* ---- ジャケット ------------------------------------------ */
#jacket img {
	border: 4px solid var(--miku-teal);
	box-sizing: border-box;
}

/* ---- トラックリスト -------------------------------------- */
/* base.css: dt は border-bottom:1px solid #888 */
#track dt {
	border-bottom: 2px solid var(--accent-yel);
}
#track dt .credit {
	color: var(--seka-navy);
}

/* ---- スタッフリスト -------------------------------------- */
section #staff li {
	border-bottom: 1px dotted var(--teto-red);
	padding-bottom: 4px;
}

/* ---- バナー画像 ------------------------------------------ */
.big-bnr {
	max-width: 100%;
	height: auto;
	border: 3px solid var(--accent-yel);
	box-sizing: border-box;
}

/* ---- フッター（base.css は背景 #000） -------------------- */
footer {
	background-color: var(--ink);
}
footer p a:hover {
	color: var(--accent-yel);
}