@charset "utf-8";

/* ■UTF-8 */

/* ▼ ページそのものの基本設定 */
*
{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

html, body
{
	display: block;
	width: 100%;
	min-height: 100vh;
	padding: 0;
	margin: 0;
	position: relative;
	font-size: 0;
	line-height: 0;
}
body > header,
body > div,
body > footer
{
	display: block;
	width: 100%;
}
div
{
	padding: 0;
}

/* ▲ ページそのものの基本設定 */

/* ▼ footerを画面一番下に固定 */
body > footer
{
	position: absolute;
	top: auto;
	bottom: 0%;
}
/* ▲ footerを画面一番下に固定 */

/* ▼ 内容物基本の幅設定 */
body > header > div,
header h1 > div,
header h2 > div,
body > div,
body > footer > div > div
{
	max-width: 700px;
	margin-left: auto;
	margin-right: auto;
}
/* ▲ 内容物基本の幅設定 */

/* ▼ 色設定 */
body
{
	font-family: sans-serif;
	background: #F5F5F5;
	color: #000;
}
header, footer > div:first-child, body > div
{
	font-size: 10.5pt;
}
a
{
	color : #4444DD;
}
a:visited
{
	color : #4444DD;
}
a:active
{
	color : #FF3300;
}
a:hover
{
	color : #FF3300;
}
html, body, body > div
{
	line-height: 0%;
}
body > div > *
{
	line-height: 100%;
}
.notice
{
	color: #A00;
	font-weight: bold;
}
/* ▲ 色設定 */

/* ▼ 会社ロゴの背景色 */
body > header,
body > footer
{
	background: #FFF;
}
/* ▲ 会社ロゴの背景色 */

/* ▼ 汎用 .indent */
.indent
{
	display: block;
	padding-left: 1.2em;
	text-indent: -1.2em;
}
/* ▲ 汎用 .indent */

/* ▼ 外部フォント使用箇所・指定 (UD新ゴ B) */
/*
article > div > .update::before,
article > div > .q::before,
article > div > .a::before,
article > div > .update > div:last-child > .date::before,
article > div > .update > div:last-child > .info::before,
*/
h1, h2, h3, h4
{
	font-family: /*"UD Shin Go DemiBold",*/ sans-serif;
	font-weight: bold;
}
/* ▲ 外部フォント使用箇所・指定 (UD新ゴ B) */

/* ▼ header, footer内容の設定 */
header h1, header h2
{
	display: block;
	width: 100%;
	margin: 0;
	font-size: 100%;
	line-height: 100%;
}
header h1,
footer::before
{
	background: #E5E5E5;
}
footer > div:last-of-type::before
{
	content: ' ';
	display: block;
	width: 100%;
	height: 1px;
}
header h1
{
	font-size: 120%;
}
header h2,
footer > div:last-of-type::before
{
	background: #988;
}
header h2
{
	color: #FFF;
	font-size: 140%;
}
footer::before
{
	content: ' ';
	font-size: 0%;
	display: block;
	width: 100%;
	height: 1px;
}
header h1 > div,
header h2 > div
{
	padding: 0.3em 2%;
}
body > div:first-of-type
{
	padding-top: 2em;
}
body > div:last-of-type
{
	padding-bottom: 3em;
	padding-bottom: calc(36px + 6em);
}
body > header > div:first-of-type,
body > footer > div > div:last-of-type
{
	line-height: 0;
	padding: 0;
}
body > footer > div:last-of-type > div
{
	text-align: right;
	margin: 0 auto;
}
body > header > div:first-of-type img,
body > footer > div > div:first-of-type img
{
	height: auto;
	border: 0 none transparent;
}
body > header > div:first-of-type img
{
	width: 120px;
	max-width: 30%;
	margin-right: auto;
	margin: 8px 10px;
}
body > footer > div > div:last-of-type img
{
	width: 100px;
	max-width: 25%;
	margin-left: auto;
	margin: 6px 10px;
}

/* 　▼ .line1 1行に納めてはみ出るものは「…」で省略する設定 */
.line1
{
	display: box;
	box-orient: vertical;
	line-clamp: 1;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	overflow: hidden;
	line-height: 100%;
}
header .line1,
body > footer > div:first-child > div
{
	font-size: 85%;
	padding: 0 2%;
	line-height: 100%;
}
header .line1 > span > a,
body > footer > div:first-child > div > a
{
	display: inline-block;
	margin: 0;
}
header .line1 > span > a
{
	padding: 0.5em 0;
}
body > footer > div:first-child > div > a
{
	padding: 0.5em 1em;
}
header .line1 > span:not(:last-child)::after
{
	content: '＞';
	display: inline-block;
	width: auto;
	margin: 0 0.3em;
}
/* 　▲ .line1 1行に納めてはみ出るものは「…」で省略する設定 */
/* ▲ header, footer内容の設定 */

/* ▼ article…アップデートやQ&Aのタブ基本設定 */
article
{
	display: block;
	width: 94%;
	margin-left: auto;
	margin-right: auto;
}
/* 　▼ タブの下にくっつける「▲ページの一番上に戻る」リンク設定 */
body > div > a
{
	display: inline-block;
	font-size: 80%;
	padding: 0.2em 0 0.7em 0;
	margin: 0 3% 0 auto;
	float: right;
}
body > div > a::after
{
	font-size: 0%;
	content: ' ';
	display: block;
	clear: both;
}
/* 　▲ タブの下にくっつける「▲ページの一番上に戻る」リンク設定 */
/* 　▼ 2番目以降のタブ上部に挟む余白設定 */
article:not(:first-of-type)
{
	margin-top: 4em;
}
/* 　▲ 2番目以降のタブ上部に挟む余白設定 */

article > h3
{
	display: inline-block;
	line-height: 100%;
	font-size: 100%;
	width: auto;
	min-width: 25%;
	padding: 0.2em 1em 0.2em 1.8em;
	margin: 0 auto 1px 0;
	background: #A99;
	color: #FFF;
	border-radius: 1em 0.2em 0 0;
}
article > div
{
	border-style: solid;
	border-color: #A99;
	border-width: 2px 1px;
	line-height: 120%;
	background: #FFF;
}
article > div::before,
article > div::after
{
	content: ' ';
	display: block;
	font-size: 0%;
	line-height: 0%;
	width: 100%;
	height: 1px;
	border-color: #000;
	border-width: 1px;
}
article > div::before
{
	border-style: none none dotted none;
}
article > div::after
{
	border-style: dotted none none none;
}

article > div > *:first-child
{
	margin-top: 0.7em;
}
article > div > *:last-child
{
	margin-bottom: 1.5em;
}
/* ▲ article…アップデートやQ&Aのタブ基本設定 */

/* ▼ .dlLink, .centerLink, .center 文章を中央に配置する */
.dlLink, .centerLink, .center
{
	text-align: center;
}
/* ▲ .dlLink, .centerLink, .center 文章を中央に配置する */

/* ▼ .dlLink, .centerLink 強調するリンクの設定 */
.dlLink, .centerLink
{
	display: inline-block;
	line-height: 100%;
	font-size: 120%;
	font-weight: bold;
	padding: 0.5em 0;
	margin: 0.5em auto;
}
/* 　▼ .dlLinkは『』をつける */
.dlLink::before
{
	content: '『 ';

}
.dlLink::after
{
	content: ' 』';
}
/* 　▲ .dlLinkは『』をつける */
/* 　▼ .centerLinkは【】をつける */
.centerLink::before
{
	content: '【 ';

}
.centerLink::after
{
	content: ' 】';
}
/* 　▲ .centerLinkは【】をつける */

/* ▲ .dlLink, .centerLink 強調するリンクの設定 */

/* ▼ 内容物の幅 (max-width内の96%) */
article > div > div,
article > div > .update,
article > div > .q,
article > div > .a,
.preComment:not(:empty)
{
	width: 96%;
	margin-left: auto;
	margin-right: auto;
}

.preComment:not(:empty)
{
	padding-top: 0.5em;
	padding-left: 1em;
	padding-right: 1em;
}

/* ▲ 内容物の幅 (max-width内の96%) */
/* ▼article > div > .updateとqとa gridを使いたかったがIE9非対応なのでtable */
/* 　▼ .update, .q, .aの基本設定 */
article > div > .update,
article > div > .q,
article > div > .a
{
	display: table;

/*
	display: grid;
	grid-template-columns: 3.5em 1fr;
	display: -ms-grid;
	-ms-grid-columns: 3.5em 1fr;
	-ms-grid-rows: auto;
*/
}
article > div > .update > *,
article > div > .q > *,
article > div > .a > *
{
	display: table-cell;
	padding: 0.2em 0;
/*
	grid-column: 2;
	-ms-grid-column: 2;
	grid-row: 1;
	-ms-grid-row: 1;
	display: block;
*/
}
article > div > .update::before,
article > div > .q::before,
article > div > .a::before
{
	display: table-cell;
	padding: 0.2em 0;
	font-weight: bold;
/*
	grid-column: 1;
	-ms-grid-column: 1;
	grid-row: 1;
	-ms-grid-row: 1;
	display: block;
	padding: 0.2em 0;
*/
}
article > div > .update::before
{
	width: 3.5em;
	content: 'UP!!';
	color: #0A0;
	text-align: center;
}

article > div > .q::before
{
	width: 2.6em;
	content: 'Q：';
	color: #FF5500;
	text-align: right;
}
article > div > .a::before
{
	width: 2.6em;
	content: 'A：';
	color: #0055FF;
	text-align: right;
}
/* 　▲ .update, .q, .aの基本設定 */

/* 　▼ article > div > .update > div:last-child > .name『「製品名」アップデートプログラム』部分 */
article > div > .update > div:last-child > .name
{
	font-weight: bold;
	text-indent: -0.5em;
	margin-bottom: 0.7em;
}
/* 　▲ article > div > .update > div:last-child > .name『「製品名」アップデートプログラム』部分 */
/* 　▼ article > div > .update > div:last-child > .date,info 「掲載日」「アップデート内容」部分の設定 */
article > div > .update > div:last-child > .date,
article > div > .update > div:last-child > .info
{
	display: table;
	width: 100%;
/*
	display: grid;
	grid-template-columns: 10em 1fr;
	display: -ms-grid;
	-ms-grid-columns: 10em 1fr;
	-ms-grid-rows: auto;
*/
}
article > div > .update > div:last-child > .date > *,
article > div > .update > div:last-child > .info > *,
article > div > .update > div:last-child > .date::before,
article > div > .update > div:last-child > .info::before
{
	display: table-cell;
	padding: 0.2em 0;
/*
	grid-row: 1;
	-ms-grid-row: 1;
	display: block;
*/
}
/*
article > div > .update > div:last-child > .date > *,
article > div > .update > div:last-child > .info > *
{
	grid-column: 2;
	-ms-grid-column: 2;
}
*/
article > div > .update > div:last-child > .date::before,
article > div > .update > div:last-child > .info::before
{
	display: table-cell;
	padding: 0.2em 0;
	width: 10em;
/*
	grid-column: 1;
	-ms-grid-column: 1;
*/
}
/* 　▲ article > div > .update > div:last-child > .date,info 「掲載日」「アップデート内容」部分の設定 */

/* 　▼ .update, .date, .info のスマホ対応(max-width: 500px) */
@media (max-width: 500px)
{
	article > div > .update > div:last-child > .info
	{
		margin-top: 0.4em;
	}
	article > div > .update > div:last-child > .date,
	article > div > .update > div:last-child > .info
	{
		display: block;
	}
	article > div > .update > div:last-child > .date > *,
	article > div > .update > div:last-child > .info > *,
	article > div > .update > div:last-child > .date::before,
	article > div > .update > div:last-child > .info::before
	{
		display: block;
		padding: 0;
	}
	article > div > .update > div:last-child > .date > *,
	article > div > .update > div:last-child > .info > *
	{
		padding-left: 1em;
	}
}
/* 　▲ .update, .date, .info のスマホ対応(max-width: 500px) */
/* 　▼ .date, .infoの「掲載日：」「アップデート内容：」文字指定 */
article > div > .update > div:last-child > .date::before,
article > div > .update > div:last-child > .info::before
{
	font-weight: bold;
}
article > div > .update > div:last-child > .date::before
{
	content: '掲載日：';
}
article > div > .update > div:last-child > .info::before
{
	content: 'アップデート内容：';
}
/* 　▲ .date, .infoの「掲載日：」「アップデート内容：」文字指定 */
/* ▲ article > div > .updateとqとa gridを使いたかったがIE9非対応なのでtable */

/* ▼ hr:not(.triangle)　点線区切り設定 */
hr:not(.triangle)
{
	width: 100%;
	height: 0;
	border-color: #000;
	border-width: 1px;
	border-style: dotted none none none;
	margin: 1em auto;
}
/* ▲ hr:not(.triangle)　点線区切り設定 */

/* ▼ hr.triangle「▼」設定 */
hr.triangle
{
	width: 0;
	height: 0;
	border-width: 0.8em 0.5em 0 0.5em;
	border-color: #A99 transparent transparent transparent;
	border-style: solid;
	margin: 1em auto;
}
/* ▲ hr.triangle「▼」設定 */

/* ▼ .box…ダウンロード説明など用箱 */
.box
{
	width: 90%;
	max-width: 540px;
	margin-left: auto;
	margin-right: auto;
}
.box > h4
{
	background: #BAA;
	color: #FFF;
	font-size: 100%;
	line-height: 100%;
	padding: 0.3em 0;
	text-align: center;
	margin: 0 0 1px 0;
}
.box > div
{
	border: 1px dotted #BAA;
}
/* ▲ .box…ダウンロード説明など用箱 */

/* ▼ ol.numList「1)」箇条書き設定 / class="numList b"で1)が太字になる */
ol.numList
{
	list-style: none;
	counter-reset: num-ordered-list;
	margin: 0;
	padding: 0 0 0 1em;
}
ol.numList > li
{
	counter-increment: num-ordered-list;
	text-indent: -1em;
}
ol.numList:not(.b) > li
{
	padding: 0 0.5em 0 1.5em;
}
ol.numList.b > li
{
	padding: 0.3em 0.5em 0.3em 1.5em;
}
ol.numList > li::before
{
	content: counter(num-ordered-list) "\FF09";
	display: inline-block;
}
ol.numList.b > li::before
{
	font-weight: bold;
}
/* ▲ ol.numList「1)」箇条書き設定 / class="numList b"で1)が太字になる */

/* ▼ .dlLastComment…ダウンロード説明箱の下に注釈入れる時の余白設定 */
.dlLastComment
{
	padding: 0.7em 0.5em 0 0.5em;
}
/* ▲ .dlLastComment…ダウンロード説明箱の下に注釈入れる時の余白設定 */