@charset "Shift-JIS";

/*
	プログラミング研究室用 CSS
	Jan.26, 2015 :	初版（style_source.cssとstyle_js.cssを統合）
	Jul.11, 2015 :	li pre.source_codeを追加
	Jul.16, 2015 :	span.source_attributeを追加、span.source_tagとspan.source_keywordの色を変更
	Aug.06, 2021 :	pre.source_codeの左右marginを5%→1emに変更、上marginを1emに設定
			result_dispにmax-width:100%を追加
			highlight.jsに対応
			span.source_tag、span.source_attribute、span.source_keyword、span.source_comment、span.source_variableを廃止
	Aug.07, 2021 :	table.source内の<dl>、<dt>、<dd>のスタイルを設定
	Aug.12, 2021 :	dl.install内の<dt>の幅を11.5em→13em
	Aug.18, 2021 :	<code>内のFontにConsolas / Monaco、タブ位置を4に設定
			table.source内のFontにSegoe UI, Meiryo, Robotoを追加
	Aug.29, 2021 :	等幅フォントのMonacoをDroid Sans Monoに変更
	Oct.21, 2021 :	table.source内の<dl>、<dt>、<dd>のmarginの一律設定を削除
	Nov.07, 2021 :	<form>の枠線・マージン設定をstyle.cssに移動
	Nov.24, 2021 :	<form>のマージンを設定、ボタンとテキストボックスを調整
			dl.google_chartを追加
	Dec.16, 2021 :	<fieldset>のデザインを追加
	Dec.23, 2021 :	<fieldset>内の<hr>をstyle.cssの<form>下に移動
			.control_formのmax-widthを100%-4em → 100%-4em-4pxに変更
	Jan.09, 2022 :	<sup>、<sub>を追加
	Mar.13, 2022 :	.control_form内の<textarea>のデザインを追加
	Mar.28, 2022 :	table.eratosthenes_tableを追加
	Apl.04, 2022 :	.control_form内のTextBox、Select系フォーカス時の枠線色を設定
*/

/* 等幅フォントはConsolas (Windows)、Droid Sans Mono (Andoroid)で表示 */
pre, code, kbd, samp, tt {
	font-family: Consolas, 'Droid Sans Mono', 'MS Gothic', monospace;
	font-size: 1em;
}

/* 上付き、下付き */
sup, sub {
	line-height: 0;
}

/* ソースコード */
pre.source_code {
	margin: 1em 1em auto;	/* 上・左右・下マージン */
	line-height: 1.2;
	width: auto;
	border: 2px ridge #2efff5;	/* H:177, S:82, V:100 */
	background-color: #f5fffa;
	padding: 0.5em;
	overflow-x: auto;
	overflow-y: hidden;
	tab-size: 4;		/* IEでは無効 */
}

pre code.hljs {
/*
highlight.jsのvs_min.cssの設定をキャンセル
	クラス名は code[class*="language-"]でも可 (https://k-kaz-git.github.io/post/code-highlight/)
*/
	display: inline;	/* display:blockをキャンセル */
	background-color: transparent;		/* 背景色を無視 */
	padding: 0;
}

table.source tbody th {
	width: 4.5em;
}

/* <table>内の定数リストの設定 */
table.source dl.constant_list {
	margin: 1em 0 0;
	border-top: 1px solid #b8ccc5;		/* H:160, S:10, V:80 */
}

table.source dl.constant_list > dt {
	margin: 0;
	border-top: 1px solid white;		/* H:160, S:0, V:100 */
}

table.source dl.constant_list > dd {
	margin: 0;
	padding-left: 1em;
	border-bottom: 1px solid #b8ccc5;
}

table.source dl.constant_list > dd.last_item {
	border-bottom: 0;
}

/* <table>内の<pre>、<code>、<kbd>タグ内の表示を他のセルと同じにする */
table.source pre {
	font-family: 'Segoe UI', Arial, Meiryo, Roboto, 'MS PGothic', sans-serif;
	font-size: 1em;
	margin: 0;
	white-space: pre-wrap;
}

table.source code,
table.source kbd {
	font-family: 'Segoe UI', Arial, Meiryo, Roboto, 'MS PGothic', sans-serif;
	font-size: 1em;
}

/* My Computerページ内の<table> */
table.mypc_table tbody th,
table.mypc_table tbody th + td {
	width: 9em;
}


/* ソフトウェアダウンロードの表 */
td.icon_cell {
	width: 48px;
	text-align: center;
}

td.icon_cell img {
	vertical-align: bottom;
}


/* ソフトウェアバージョンとインストールの表記 */
/* version_infoとinstallはstyle.cssで定義しているdl.compactとともに使用 */
dl.version_info dt {
	width: 8em;
}

dl.version_info dd {
	padding-left: 8em;
}

dl.install dt {
	width: 13em;
}

dl.install dd {
	padding-left: 13em;
}


/* 「Javascript計算室」用 */

/* 制御form */
.control_form {
	width: 568px;			/* 600px-32px : padding分2emを引く */
	max-width: calc(100% - 4em - 4px);	/* margin + padding + borderを引く */
	margin: 1em auto;
	text-align: center;
}

.control_form input,
.control_form textarea,
.control_form button,
.control_form select {
	margin: 0.5em;
	font-family: inherit;
	font-size: inherit;
}

.control_form input:not([type='radio']):not([type='checkbox']) {
/* TextBox系に適用 */
	height: 1.5em;
	line-height: 1.5;
}

.control_form input[type='number'],
.control_form input[inputmode='decimal'],
.control_form input[inputmode='numeric'] {
/* 数値入力用TextBox */
	width: 4em;
}

.control_form textarea {
	resize: vertical;
	width: 11em;
	height: 15em;
	min-height: 15em;
	line-height: 1.5;
	padding-right: 0.5em;	/* 縦scrollbarとの間隔 */
	overflow-y: auto;
}

.control_form textarea[readonly] {
	background-color: transparent;
	border-top: 1px solid white;		/* H:160, S:0, V:100 */
	border-left: 1px solid white;
	border-right: 1px solid #b8ccc5;	/* H:160, S:10, V:80 */
	border-bottom: 1px solid #b8ccc5;	
	box-shadow: 1px 1px white, -1px -1px #b8ccc5;
	overflow-y: scroll;
}

.control_form textarea[readonly]:focus {
	outline: none;	/* フォーカス時の枠線表示なし */
}

.control_form input:not([type='radio']):not([type='checkbox']):focus,
.control_form select:focus,
.control_form textarea:not([readonly]):focus {
	outline: ridge 2px #2efff5;	/* TextBox、Select系フォーカス時の枠線 */
}

.control_form button {
	width: 5em;
	height: 2em;
}

.control_form select {
	height: 2em;
}

fieldset {
	margin: 1em;
	padding: 0.35em 0 0.5em;
	border: 2px white groove;
}

fieldset legend {
	margin-left: 1em;
	margin-right: auto;	/* Edgeで強制的に左寄せにする */
}

#base_date button,
#difference button {
	width: auto;
}

/* 番号表示部 ・ javascript内でIDを参照 */
#result_disp {
	border: 2px ridge #2efff5;	/* H:177, S:82, V:100 */
	background-color: #f5fffa;	/* mintcream */
	margin: 0 auto;
	width: 600px;
	max-width: calc(100% - 36px);	/* 両サイドに16px + 2px(border)ずつ残す */
}

#result_disp.webfont {
	height: 450px;
	font-size: 20em;
	text-align: center;
}

#result_disp table thead th:first-child {
	width: 5em;
	min-width: 5em;
}

#result_disp table thead th:nth-child(2) {
	width: 15em;
	min-width: 15em;
}

/* DateTime!内の日時書式指定子の<table> */
table#specifier thead th:nth-child(2) {
	width: 19em;
	min-width: 19em;
}

table#specifier thead th:nth-child(3) {
	width: 6em;
	min-width: 6em;
}

/* Primality!内のエラトステネスの篩の<table> */
table.eratosthenes_table th {
	text-align: center;
	width: 2em;
}

table.eratosthenes_table td:not(.text_center) {
	text-align: right;
}

/* GoogleChartを使用した数式表示 */
dl.google_chart {
	line-height: 2.4;	
}

dl.google_chart dt {
	width: 7.5em;
}

dl.google_chart dd {
	padding-left: 7.5em;
}

dl.google_chart img {
	vertical-align: middle;
}

/* IE10〜11用 */
@media (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.control_form input[type='date'],
	.control_form input[type='time'] {
		width: 7em;
	}
}
