/* CSS　記事用設定 */

/* 外部CSSのインポート */
@import	url(202001common.css);	/* 共通設定 */

/* ヘッダーの設定 */
HEADER.a {
	top : 0;
	left : 0;
	width : 100%;
	background-color : #fffff0;
}

@media screen and (min-width: 1050px) {
	HEADER.a {
		position : fixed;
	}
}	/* PC、印刷用の設定 */

/* 一行目の設定 */
DIV.a1-3 {
	width : 100%;
	display : table;
	height : 2.4em;
	padding-top : 0.1em;
}

	/* 左右2セルの場合 */
P.a1-2l {
	vertical-align : middle;
	text-indent : 0em;
	margin-left : 1em;
}

P.a1-3c {
	vertical-align : middle;
	text-indent : 0em;
	text-align : center;
	display : table-cell;
}

IMG.a1-2 {
	vertical-align : middle;
}

IMG.a1-3 {
	vertical-align : middle;
}

@media screen and (max-width: 1050px) {
	/* 左右2セルの場合 */
	P.a1-2l {
		float : right;
	}
	
	P.a1-2r {
		display: none;
	}
	  /* 左右中央3セルの場合 */
	P.a1-3l {
		display: none;
	}
	
	P.a1-3c {
		float: right;
	}
	
	P.a1-3r {
		display: none;
	}
}

@media print, screen and (min-width: 1050px) {
	/* 左セルの場合 */
	P.a1-3l, P.a1-2l {
		vertical-align : middle;
		width : 300px;
		text-align : left;
		display : table-cell;
		text-indent : 0em;
		padding-left : 1em;
	}
	/* 中央セルの設定 */
	P.a1-3c {
		margin : auto;
	}
	/* 右セルの設定 */
	P.a1-3r, P.a1-2r {
		vertical-align : middle;
		width : 300px;
		text-align : right;
		display : table-cell;
		text-indent : 0em;
		padding-right : 1em;
	}
}	/* PC、印刷用の設定 */

	/* 記事部分の設定 */
@media screen and (max-width: 1050px) {
	DIV.body {
		width: 100%;
		padding-left: 0.5em;
		padding-right: 0.5em;
	}	/* デフォルト(スマホ用)の設定 */
}

@media print, screen and (min-width: 1050px) {
	DIV.body {
		width : 1024px;
		margin : auto;
	}
}	/* PC用の設定 */

  /* 記事ファイルメインタイトルの設定 */
H2.a2 {
	margin-top : 0.2em;
	margin-bottom : 0.2em;
	padding-top : 0.2em;
	padding-bottom : 0.2em;
}

  /* 記事の題名部分の設定 */
IMG.a3 {
	float : left;
}

H3.a3 {
	margin-top : 0.3em;
	margin-bottom : 0.3em;
}

@media print, screen and (max-width: 1050px) {
  /* 記事内容部分用上部余白 */
	DIV.a4z {
		display: none;
	}
	
  /* 記事内容部分用上部余白(2行版) */
	DIV.a4z2 {
		display: none;
	}
}

@media screen and (min-width: 1050px) {
  /* 記事内容部分用上部余白 */
	DIV.a4z {
		padding-top : 150px;
	}
	
  /* 記事内容部分用上部余白(2行版) */
	DIV.a4z2 {
		padding-top : 190px;
	}
}

@media screen and (max-width: 1050px) {
	DIV.a6l { /* 各カテゴリーの記事リストの大枠(左側) */
		display: none;
	}

	DIV.a6r { /* 各カテゴリーの記事リストの大枠(右側) */
		display: none;
	}
}

@media print, screen and (min-width: 1050px) {
	DIV.a6l { /* 各カテゴリーの記事リストの大枠(左側) */
		width : 49.6%;
		display : inline-block;
		margin-left : 1px;
		margin-right : auto;
		vertical-align : top;
	}
	
	DIV.a6r { /* 各カテゴリーの記事リストの大枠(右側) */
		width : 49.6%;
		display : inline-block;
		margin-left : auto;
		margin-right : 0;
		vertical-align : top;
	}
}

  /* 記事の見出し(一段目)の設定 */
H4.atitle {
	margin-top : 0.2em;
	margin-bottom : 0.2em;
}

  /* 記事の見出し(二段目)の設定 */
H5.atitle {
	margin-top : 0.3em;
	margin-bottom : 0em;
}

  /* 記事の見出し(三段目)の設定 */
H6.atitle {
	margin-top : 0em;
	margin-bottom : 0em;
}

/* 写真の表示 */
@media screen and (max-width: 1050px) {
	IMG.pic-h150, IMG.pic-h180, IMG.pic-h240, IMG.pic-h320, IMG.pic-h380, IMG.pic-w320, IMG.pic-w400,	IMG.pic-w640,	IMG.pic-w800,	IMG.pic-w50pt,	IMG.pic-w100pt {
		WIDTH: 100%;
	}

	VIDEO.pic-w320 {
		WIDTH: 100%;
	}
}

@media print, screen and (min-width: 1050px) {
	IMG.pic-h150 {
		HEIGHT: 150px;
	}
	
	IMG.pic-h180 {
		HEIGHT: 180px;
	}
	
	IMG.pic-h240 {
		HEIGHT: 240px;
	}

	IMG.pic-h320 {
		HEIGHT: 320px;
	}

	IMG.pic-h380 {
		HEIGHT: 380px;
	}
	
	IMG.pic-w320 {
		WIDTH: 320px;
	}
	
	IMG.pic-w400 {
		WIDTH: 400px;
	}
	
	IMG.pic-w640 {
		WIDTH: 640px;
	}
	
	IMG.pic-w800 {
		WIDTH: 800px;
	}
	
	IMG.pic-w50pt {
		WIDTH: 50%;
	}

	IMG.pic-w100pt {
		WIDTH: 100%;
	}

	VIDEO.pic-w320 {
		WIDTH: 320px;
	}
	
}

/* スマホでは表示させないもの */
@media screen and (max-width: 1050px) {
	.nomob {
		display: none;
	}
}

/* PCでは表示させないもの */
@media print, screen and (min-width: 1050px) {
	.nopc {
		display: none;
	}
}

	/* 固定ヘッダ用のマージン */ 
@media screen and (min-width: 1050px) {
	html {
		scroll-padding-top: 160px;
	}
}

  /* 目次リンクの設定 */
H4.acont {
	margin-top : 0em;
	margin-bottom : 0em;
}

/* BSDインストール記事用の設定 */
DIV.termhere {
	padding-top : 0.2em;
	padding-bottom : 0.2em;
	color : #ffffff;
	background-color : #000000;
}

@media screen and (max-width: 1050px) {
	.disphere .disphere2 {
		display: block;
		width: 90%;
	}
	DIV.termhere {
		width : 90%;
	}
}

@media print, screen and (min-width: 1050px) {
	DIV.pbox {
		height: 230px;
	}

	DIV.pboxb1 {
		height: 280px;
	}

	.disphere {
		width : 40%;
		float:right;
		margin : 2px;
	}

	.disphere2 {
		width : 80%;
		float:right;
		margin : 2px;
	}
	
	DIV.termhere {
		width : 50%;
	}
}

  /* アルバム記事での曲へのリンクの設定 */
A.album:link {
	color : #002222;
}

A.album:visited {
	color : #004444;
}

  /* 訳詞記事での余白設定 */
@media screen and (max-width: 1050px) {
	DIV.lyricsjp, DIV.lyricsen {
		width: 100%;
	}
}

@media print, screen and (min-width: 1050px) {
	DIV.lyricsjp, DIV.lyricsen {
		width: 510px;
		float: left;
	}
}

DIV.lyricsjp, DIV.lyricsen {
	margin: 0;
	vertical-align: top;
}

P.lyrics {
	text-indent: 0em;
	padding-left: 1em;
	padding-bottom: 0.5em;
	vertical-align: top;
}

P.lyricssp {
	font-weight:bold;
	text-decoration-line: underline;
}

  /* 記事最後の日付の余白設定 */
P.date {
	margin-top : 1em;
	margin-bottom : 1em;
	text-indent : 0em;
}


H6.headline { /* 補足説明のタイトルの設定 */
	margin : 0em;
	padding-left : 1em;
}

DIV.expl { /* 補足説明の設定 */
	margin-left : 1em;
}

  /* 記事中の表の標準設定 */
TABLE.a { /* テーブル全体の標準設定 */
	background-color : #ffffff; /* 背景色は白 */
	border : 1px solid #003333;
}

THEAD TH.a, THEAD TD.a{ /* 表のタイトルは、THEADに書く。 */
	color : #ffffff; /* 文字色は白 */
	background-color : #555550; /* 背景色は焦げ茶色 */
}

TH.a { /* 表本体のタイトル部分(表示:左上詰) */
	background-color : #ccccc0; /* 背景色は、濃いアイボリー */
	border : 1px solid #003333;
}

TH.am { /* 表本体のタイトル部分(表示:左詰上下中央) */
	background-color : #ccccc0; /* 背景色は、濃いアイボリー */
	border : 1px solid #003333;
	vertical-align : middle;
}

TH.ac { /* 表本体のタイトル部分(表示:左右中央上詰) */
	background-color : #ccccc0; /* 背景色は、濃いアイボリー */
	border : 1px solid #003333;
	text-align : center;
}

TH.acm { /* 表本体のタイトル部分(表示:中央配置) */
	background-color : #ccccc0; /* 背景色は、濃いアイボリー */
	border : 1px solid #003333;
	text-align : center;
	vertical-align : middle;
}

TD.a {
	border : 1px solid #003333;
}

TD.am {
	border:1px solid #003333;
	vertical-align:middle;
}

TD.acm {
	text-align:center;
	vertical-align:middle;
	border:1px solid #003333;
}

TD.arm {
	border:1px solid #003333;
	text-align:center;
	vertical-align:middle;
}

/* 端末風表示の設定 */
DIV.term, TABLE.terminal {
	width : 90%;
	padding-top : 0.2em;
	padding-bottom : 0.2em;
}	/* 端末風表示の枠の設定 */

.terminal, .term {
	color : #ffffff;
	background-color : #000000;
	font-family : monospace;
} /* 端末風表示の表示領域の設定

/* 記事ページ内リンクの設定 */ 
TH.alink {
	visibility : hidden;
}

A.alink {
	padding-top : 0px;
	
}

DIV.alink { /* 固定部分用のスペース */
	padding-top : 0px;
	margin-top : 0px;
}