@charset 'utf-8';

html {
	font-family: 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
}
body {
	background-color: #e9e7e8;
	margin: 0;
}
p {
	margin: 1em 0;
	line-height: 1.5;
}
a:link {
	color: #0033cc;
}
a:visited {
	color: #551a8b;
}
a:target {
	border: 1px red solid;
	background-color: red;
	color: white;
	border-radius: 0.25em;
	padding: 2px;
}
/* */
h1, h2, h3, h4, h5, h6 {
	color: black;
	font-weight: bold;
	margin: 2em 0 1em;
}
h1 {
	font-size: 1.6em;
	margin-top: 0.5em;
}
h2 {
	font-size: 1.2em;
	padding-left: 3px;
	border-left: 5px solid;
	padding-bottom: 1px;
	border-bottom: 1px solid;
}
h3 {
	font-size: 1.2em;
	padding-left: 3px;
	border-left: 5px solid;
}
h4 {
	font-size: 1.2em;
}
h4:before {
	content: '■';
}
h5, h6 {
	font-size: 1em;
}
h5:before {
	content: '●';
}
h1 img {
	max-width: 100%;
}
h2 img, h3 img {
	margin-right: 3px;
	vertical-align: middle;
}
h2:hover .anchor:after, h3:hover .anchor:after {
	content: '¶';
	padding-left: 0.5em;
	padding-right: 0.5em;
}
/* */
ul {
	list-style-type: disc;
}
ol {
	list-style-type: decimal;
}
ul, ol {
	margin: 1em 0;
	padding-left: 40px;
	line-height: 1.5;
}
ul + ul, ol + ol {
	margin-top: 2em;
}
ul ul, ul ol, ol ol, ol ul {
	margin-top: 0;
}
td ul, td ol {
	padding-left: 20px;
}
li {
	margin: 0.5em 0;
}
/* */
.hierarchy-list {
	list-style-position: inside;
	padding-left: 25px;
}
.hierarchy-list ul, .hierarchy-list ol {
	border-left: 1px dotted;
	padding-left: 20px;
}
/* */
dl {
	margin: 1em 0;
	padding: 0;
}
dt {
	border: 1px silver solid;
	border-top-left-radius: 0.5em;
	background-color: #f0f0f0;
	color: black;
	margin: 0;
	padding: 3px;
}
dd {
	border: 1px silver solid;
	border-top-style: none;
	margin: 0 0 0.5em;
	padding: 0.5em 3px;
}
/* */
table {
	line-height: 1.5;
}
th, td {
	padding: 3px;
}
caption {
	text-align: left;
	/* white-space: nowrap; */
}
table.standard {
	background-color: white;
	border-collapse: collapse;
	margin: 1em 0 3px;
}
table.standard caption {
	font-weight: bold;
	color: black;
}
table.standard th {
	background-color: #f0f0f0;
	color: black;
	border: 1px silver solid;
	/* white-space: nowrap; */
}
table.standard td {
	border: 1px silver solid;
}
table.standard p {
	margin: 0.5em 0;
	line-height: inherit;
}
/* */
tr.separator th, tr.separator td {
	border-top-color: gray;
	border-top-width: 2px;
}
/* */
form {
	margin: 0;
}
fieldset {
	margin: 0.5em 0;
	padding: 0 3px 0.5em;
	border-radius: 0.5em;
}
fieldset table {
	border-spacing: 0;
}
fieldset th {
	white-space: nowrap;
}
fieldset textarea {
	width: 98%;
}
legend {
	font-weight: bold;
}
/* */
textarea, input, button, option {
	font-family: inherit;
}
input[type=submit], input[type=reset], input[type=button], button {
	padding: 3px 1em;
}
input[type=range] {
	vertical-align: middle;
	margin: 0 3px;
	padding: 1px;
}
input[readonly], textarea[readonly] {
	border: 1px silver dotted;
}
input.reset {
	margin-left: 1em;
	color: red;
}
label input[type=text], label input[type=url], label input[type=number] {
	margin-left: 3px;
	margin-right: 3px;
}
select {
	font-family: inherit;
	font-size: inherit;
}
textarea {
	margin: 3px 0;
}
optgroup {
	font-family: inherit;
	font-style: normal;
	font-weight: bold;
}
/* */
img {
	font-weight: bold;
	color: gray;
}
a[href] img {
	border: 1px solid;
	border-radius: 3px;
	padding: 1px;
}
a[href] img[width="1"] {
	/* border-style: none; Not work in IE11 */
	border: none;
	padding: 0;
}
a[href] img:hover {
	border-color: red;
	opacity: 0.50;
}
/* */
code {
	font-family: Consolas, monospace;
	font-size: inherit;
	background-color: transparent;
	color: #007000;
	text-align: center;
}
kbd {
	font-family: Arial, sans-serif;
	border: 1px silver solid;
	border-radius: 0.5em;
	background-color: #f0f0f0;
	color: black;
	margin: 1px;
	padding: 0 3px;
	white-space: nowrap;
}
var {
	font-size: inherit;
	font-style: normal;
	color: brown;
}
pre {
	font-family: Consolas, monospace;
	font-size: inherit;
	margin: 0.5em 0 3px;
	padding: 0.5em;
	border: 1px silver solid;
	background-color: #fafafa;
	line-height: 1.2;
	overflow: auto;
	max-height: 300px; /* for outdated browser */
	max-height: 80vh;
}
td pre {
	margin-top: 3px;
}
/* */
pre.code {
	background-color: #f0f7fe;
}
pre.syntax {
	background-color: #f0f0ff;
	border-color: gray;
}
.samp {
	background-color: #ece9d8;
}
span.comment {
	color: green;
}
span.keyword {
	color: #8a2be2;
}
span.preprocessor-keyword {
	color: #800000;
}
/* */
pre.console {
	border-color: #333333;
	background-color: #333333;
	color: white;
}
pre.console a:link, pre.console a:visited {
	color: #99ccff;
}
pre.console var {
	color: #d85d5d;
}
pre.console span.comment {
	color: #40c040;
}
/* */
blockquote {
	background: #fffaf0 url('../images/icon/quote.png') no-repeat 2px 2px;
	color: black;
	border: 1px silver solid;
	border-radius: 0.5em;
	margin: 1em 0;
	padding: 16px 0.5em 0.5em;
}
blockquote p {
	margin: 0.5em 0;
}
blockquote cite {
	display: block;
	text-align: right;
	font-size: smaller;
	font-style: normal;
	margin: 0.5em 0;
}
/* */
small {
	line-height: 1.2;
}
sub {
	vertical-align: baseline;
}
hr {
	margin: 1em 3px;
	border-width: 1px 0 0 0;
	border-color: inherit;
	border-style: solid;
}
canvas {
	margin: 1em 0;
	border: 1px silver solid;
	vertical-align: middle;
}
/* --- */
#g-container {
	min-width: 320px;
	background-color: white;
	color: #333;
	box-shadow: 0 0 20px 0 black;
}
/* */
#g-body {
	margin: 5px;
}
#g-top, #g-nav, #g-header .breadcrumbs, #g-side {
	display: none;
}
/* */
#g-header, #g-footer {
	background-color: black;
	color: white;
	white-space: nowrap;
}
#g-header a, #g-footer a {
	text-decoration: none;
	border-radius: 0.5em;
}
#g-header a:link, #g-footer a:link {
	color: white;
}
#g-header a:visited, #g-footer a:visited {
	color: silver;
}
#g-header a:hover, #g-footer a:hover {
	background-color: #a0a0a0;
	color: white;
}
#g-header ul, #g-category div {
	overflow: hidden;
	text-overflow: ellipsis;
}
/* */
.breadcrumbs {
	padding: 0.5em 5px;
	background-color: #262626;
}
.breadcrumbs ul {
	margin: 0;
	padding-left: 0;
}
.breadcrumbs li {
	display: inline;
}
.breadcrumbs a {
	text-decoration: none;
}
.breadcrumbs a:after {
	content: '>';
	margin-left: 0.5em;
}
/* */
#g-category {
	padding: 0.5em 5px;
	background-color: #3f3f3f;
	border-bottom: 1px solid;
}
#g-category div {
	font-size: 1.6em;
	font-weight: bold;
}
#g-category a img, #header-list a img {
	/* border-style: none; Not work in IE11 */
	border: none;
	border-radius: 0;
	margin-right: 3px;
	vertical-align: middle;
	padding: 0;
}
/* */
#g-footer {
	clear: both; /* NECESSARY */
	white-space: normal;
}
#g-footer li {
	line-height: 2;
}
#g-footer address {
	color: silver;
	font-style: normal;
	text-align: right;
	padding: 0.5em 5px;
}
#g-link {
	padding: 0.5em 5px;
}
#g-link ul {
	margin: 0;
	padding-left: 0;
}
#g-link li {
	display: inline;
}
#g-link li ~ li {
	border-left: 1px silver solid;
	padding-left: 0.5em;
}
/* */
#g-cse {
	width: 80%;
	border-radius: 0.5em;
	background-color: #3f3f3f;
	color: white;
	margin: 2em 0 1em;
	padding: 0.5em;
}
#g-cse div {
	font-size: smaller;
	font-weight: bold;
}
#g-cse div:before {
	content: url('../images/icon/search.png');
}
#g-cse input[type=text] {
	width: 50%;
}
/* */
#g-ad {
	margin: 2em 0 1em;
}
#g-ad a img {
	border: none;
	padding: 0;
}
.optout {
	margin-top: 3px;
	font-size: smaller;
}
.amazon-widget {
	width: 100%;
	height: 255px;
}
/* --- */
div.reference {
	background-color: #f0f0f0;
	margin: 2em 0 1em;
	padding-bottom: 3px;
}
div.reference form {
	margin: 0.5em 20px;
}
a.reference:before {
	content: '参考：';
	font-weight: bold;
}
a.reference {
	font-size: smaller;
}
/* */
#table-of-contents {
	border-left: 1px solid;
	background-color: #f0f8ff;
	margin: 2em 0;
	padding-bottom: 3px;
}
#table-of-contents div {
	font-weight: bold;
	border-bottom: 1px solid;
	margin-left: 0.5em;
}
#table-of-contents > ul + ul {
	border-top: 1px silver solid;
	padding-top: 0.5em;
}
/* */
#header-list {
	margin: 2em 0 1em;
	padding-bottom: 1px;
}
#header-list div, #g-side > div div {
	border: 1px #3f3f3f solid; /* for high-contrast mode*/
	border-top-left-radius: 0.5em;
	background-color: #3f3f3f;
	color: white;
	font-weight: bold;
	padding: 3px 0.5em;
}
#header-list > ul {
	border-left: 1px #3f3f3f solid;
	margin: 0;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}
/* */
#bottom-nav {
	margin: 2em 0 1em;
	border-top: 1px solid;
}
#bottom-nav ul {
	padding-left: 0;
}
#bottom-nav li {
	display: inline;
	margin-right: 0.5em;
}
#bottom-nav a:before {
	content: '≫';
	display: inline-block;
}
/* */
#related-page {
	margin-bottom: 1em;
}
#related-page h2 {
	border: 1px #3f3f3f solid; /* for high-contrast mode*/
	border-top-left-radius: 0.5em;
	background-color: #3f3f3f;
	color: white;
	margin-bottom: 0;
	padding: 3px 0.5em;
}
#related-page ul {
	margin-top: 0;
	padding-left: 30px;
}
/* */
#beta {
	background: url('../images/beta.png') repeat-y right top;
}
#beta h1:after {
	content: '(Beta版)';
	color: red;
	margin-left: 0.5em;
}
.beta {
	font-size: smaller;
	font-weight: bold;
	color: gray;
}
/* */
.image-catalogue {
	list-style-type: none;
	padding-left: 0;
}
.image-catalogue li {
	overflow: hidden;
	margin-bottom: 1em;
}
.image-catalogue img {
	float: left;
	margin-right: 5px;
}
.image-catalogue li > div {
	margin-left: 157px;
	margin-right: 5px;
}
/* */
p.emphasis {
	padding: 0.5em;
	border-left: 5px orange solid;
	background-color: #ffffdd;
}
div.emphasis {
	margin: 1em 0;
	padding: 1px 0.5em;
	border-left: 5px orange solid;
	background-color: #ffffdd;
}
div.emphasis p {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}
.path {
	font-family: Consolas, monospace;
	margin: 0 3px;
	padding: 0 3px;
	border: 1px silver solid;
	border-radius: 0.5em;
	background-color: #f0f0ff;
}
/* */
.expression {
	font-family: 'Times New Roman';
	white-space: nowrap;
	margin: 3px 1em;
}
.expression sup {
	vertical-align: top;
}
.expression sub {
	vertical-align: bottom;
}
table.expression {
	border-left: 1px solid;
	border-right: 1px solid;
}
table .expression {
	margin-left: 0.5em;
}
/* */
.example-box {
	/* never use overflow: */
	border: 2px green solid;
	border-radius: 0.5em;
	background: url('../images/icon/sample.png') no-repeat right top;
	background-color: #fafffa;
	margin: 1em 0;
	padding: 0.5em;
}
/* */
.textual {
	font-size: smaller;
	color: #050;
}
.gray-text {
	color: gray;
}
.key-text {
	border-radius: 0.5em;
}
/* */
.accept-message {
	color: green;
}
.warning-message, .error-message {
	color: red;
}
.accept-message:before {
	content: url('../images/icon/accept.png');
}
.warning-message:before {
	content: url('../images/icon/warning.png');
}
.error-message:before {
	content: url('../images/icon/error.png');
}
/* */
span.image-snippet {
	font-size: smaller;
	font-weight: bold;
}
a.where {
	font-size: smaller;
	opacity: 0.50;
}
/* */
.icon-link a img {
	/* border-style: none; Not work in IE11 */
	border: none;
	border-radius: 0;
	margin-right: 3px;
	vertical-align: middle;
	padding: 0;
}
ul.icon-link {
	padding-left: 20px;
}
ul.icon-link > li {
	list-style-type: none;
}
/* */
.loading {
	font-size: 14px;
	font-weight: bold;
}
.loading:before {
	content: url('../images/icon/throbber.gif');
}
a.copy:before {
	content: url('../images/icon/copy.png');
}
a.download:before {
	content: url('../images/icon/download.png');
}
a.feed-link:before {
	content: url('../images/icon/feed.png');
}
a[href$='.pdf']:before {
	content: url('../images/icon/pdf.png');
}
a[href$='.ppt']:before {
	content: url('../images/icon/ppt.png');
}
a[href$='.zip']:before {
	content: url('../images/icon/zip.png');
}
form[target=_blank] button span:after {
	content: url('../images/icon/external-link.png');
	margin-left: 3px;
}
@media screen and (min-width: 480px) {
	#g-top {
		display: block;
		float: right;
		padding: 5px;
	}
	#g-nav {
		display: block;
		padding: 0.5em 5px;
	}
	#g-nav ul {
		margin: 0;
		padding-left: 0;
	}
	#g-nav li {
		display: inline;
	}
	#g-nav li ~ li {
		border-left: 1px silver solid;
		padding-left: 0.5em;
	}
	/* */
	#g-header .breadcrumbs {
		display: block;
	}
	#g-cse input[type=text] {
		width: 70%;
	}
}
@media screen and (min-width: 640px) {
	#g-container {
		max-width: 960px;
		margin: 0 auto;
	}
	#g-contents {
		float: right;
		width: 80%;
	}
	#g-side {
		display: block;
		width: 19.5%;
	}
	#g-side > ul {
		font-weight: bold;
	}
	#g-side ul {
		list-style-type: none;
		margin: 0;
		padding-left: 0;
	}
	#g-side ul ul {
		font-weight: normal;
		border-left: 1px solid;
		padding-left: 3px;
	}
	#g-side li {
		color: #696969;
		margin: 0 0 1em;
	}
	#g-side ul ul ul, #g-side li li {
		margin-bottom: 0.5em;
	}
	#g-side a, #g-side span {
		text-decoration: none;
		border-radius: 0.5em;
		padding: 3px 0;
		display: block;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	#g-side a:hover {
		background-color: silver;
	}
	/* */
	#g-side > div {
		margin: 2em 0 0;
	}
	#g-side > div ul {
		border-left: 1px #3f3f3f solid;
		padding-left: 3px;
	}
	#g-side > div li {
		margin-bottom: 0.5em;
	}
	#g-product li {
		text-align: center;
	}
	#g-product a img {
		/* border-style: none; Not work in IE11 */
		border: none;
	}
	/* */
	.image-catalogue {
		overflow: hidden;
	}
	.image-catalogue li {
		float: left;
		width: 50%;
		height: 100px;
		position: relative;
	}
	.image-catalogue li:before {
		content: '';
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 30%;
		background: linear-gradient( rgba( 255, 255, 255, 0 ), white );
	}
}

