/* common style */

body {
	text-align: justify;
	line-height: 1.4;
	font-family: "メイリオ", Meiryo, sans-serif;
	padding: 0 0 1% 0;
	margin: 1%;
	font-size: 13pt;
}

ul {
	margin-left: 0.5em;
	padding-left: 1em;
}

ul.ThisWayList {
	list-style-type: none;
	padding-left: 0;
}

ul.ThisWayList li:before {
	content: "☛ "
}

dl.Menu dt {
	font-size: 110%;
	margin: 12pt 0 5pt 0;
}

dl.Menu dt:first-child {
	margin-top: 0
}

dd {
	margin-bottom: 5pt
}

.FootNoteList dt {
	float: left;
	clear: left;
	text-align: right;
}

.FootNoteList dt:after{
	content: ":"
}

.FootNoteList dd {
	margin-left: 0;
	padding-left: 2.5em;
}

div.Main {
	padding: 0 20pt 0 20pt;
}

div.Main h1 {
	text-align: center;
	margin: 1.5em 0 2em 0;
	font-size: 215%;
	line-height: 1.2;
}

div.Main h1.LeftAlign {
	text-align:left;
	margin-left: -20pt;
}

div.Document {
	width: 100%;
	max-width: 50rem;
	margin-left: 80pt;
	margin-right: 20pt;
	float: left;
	line-height: 1.8;
}

.Document p:lang(ja) {
	text-indent: 1em
}

.Document p.NoIndent, .NoIndent p {
	text-indent: 0
}

p.PreList {
	margin-bottom: 0
}

p.PreList + ul {
	margin-top: 0
}

.Document dl {
	margin-left: 1em
}

.Document dt {
	font-weight: bold
}

.Document blockquote {
	padding: 0.2ex 1em 0.2ex 32px;
	margin: 1em 0 1em 0;
	border-left: 3px solid #ffbb88;
	background-color: white;
	background-repeat: no-repeat;
	background-image: url("/img/dquote.png");
	color: black;
}

.Document .SelfQuote {
	font-size: larger;
	font-weight: bold;
	background-repeat: no-repeat;
	background-image: url("/img/dquote.png");
}

.QuoteLink {
	text-align: right;
}

.QuoteLink a {
	font-size: smaller;
	opacity: 0.5;
}

.BlockText {
	padding: 1em;
	background-color: white;
	border-left: 3px solid #bbff88;
}

.Blockcode {
	padding: 0.2ex 1em 0.2ex 1em;
	background-color: white;
	border-left: 3px solid #bbff88;
}

div.Sidebar {
	margin-left: 0;
	padding-left: 4pt;
	width: 18%;
	font-size: 80%;
	float: left
}

h1 {
	line-height: normal
}

h2 {
	text-align: left;
	margin-left: -12pt;
	margin-top: 2em
}

div.Delimiter {
	padding-top: 1.5em;
	padding-bottom: 1.5em;
	text-align: center
}

hr.Delimiter {
	width: 0.8em;
	height: 0.8em;
	margin-top: 2em;
	margin-bottom: 2em;
	border-width: 1px;
	border-style: solid;
}

a.Icon {
	text-decoration: none
}

main, nav, header, footer, article, aside {
	display: block;
	margin: 0;
	padding: 0;
}

nav p {
	font-size: smaller;
	text-indent: 0;
	padding: 0;
	margin: 0;
}

hr.Footer {
	clear: both
}

figure {
	-webkit-margin-before: 0;
	-webkit-margin-after: 0;
	-webkit-margin-start: 0;
	-webkit-margin-end: 0;
	margin: 1em;
}

figure.WrapCap {
	display: table
}

figure.WrapCap figcaption {
	display: table-caption;
	caption-side: bottom;
}

.RunOffPanel {
	padding: 1rem 1rem 0 1rem;
	background: #fff;
	margin: 1em;
}

.RunOffPanel > figcaption {
	padding: 0 1rem 1rem 1rem;
	background: #fff;
}

img {
	margin: 0;
}

img.InDocFigure {
	margin: 1em 0;
}

img.InDocFigureTop {
	margin-top: 0;
}

img.InDocFigure.FloatLeft {
	margin-right: 1.5em;
}

img.InDocFigure.FloatRight {
	margin-left: 1.5em;
}

.FitWidth {
	max-width: 100%;
	height: auto;
}

img.Icon {
	border-style: none;
}

img.InlineIcon {
	border-style: none;
	vertical-align: bottom;
}

img.Picture {
	padding: 2px;
	background-color: #ffffff;
	border-width: 1px;
	border-color: #888888;
	border-style: solid
}

img.LinkedPicture {
	background-color: #ffffff;
	margin: 4px;
	padding: 2px;
	border-style: solid;
	border-width: 1px
}

.PicturePanel {
	background-color: #ffffff;
	border-style: double;
	border-width: 4px;
	border-color: #888888;
	margin-bottom: 1em;
	margin-top: 1em;
	padding: 0 1em;
}

.FlexContainer {
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	justify-content: space-around;
	-webkit-justify-content: space-around;
}

.FlexWrap {
	flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
}

.FloatLeft {
	float: left
}

.FloatRight {
	float: right
}

.FloatLeftCorrection {
	float: left;
	margin-right: 1.5em
}

.FloatRightCorrection {
	float: right;
	margin-left: 1.5em
}

.Center {
	text-align: center
}

.CenterBlock {
	margin-left: auto;
	margin-right: auto
}

.Clear {
	clear: both
}

pre.AsciiArt {
	line-height: 1
}

.Note {
	font-size: smaller
}

.FootNote {
	font-size: smaller
}

a.NoteAnchor {
	font-size: smaller;
	vertical-align: super;
	text-decoration: none;
}

.Caption, figcaption p {
	font-size: smaller;
	line-height: normal;
	text-indent: 0 !important;
}

p.Caption, figcaption p {
	margin-top: 0.2em;
	margin-bottom: 0.2em;
}

.Big {
	font-size: larger
}

.Huge {
	font-size: 180%
}

.Small {
	font-size: smaller
}

.Tiny {
	font-size: 50%
}

.Warning {
	color: #ff0000
}

.Red {
	color: #ff0000
}

.Green {
	color: #00ff00
}

.Kenten {
	text-emphasis-style: dot filled;
	-webkit-text-emphasis-style: dot filled;
}

span#mailaddresslink {
	font-size: smaller
}

span.URI, span.Terminal {
	font-family: monospace
}

.PageLink {
	display: none
}

div.AdSkyScraper {
	padding-left: 5pt
}

div.AdBigBanner {
	padding-top: 8pt
}

figure.AmazonItem {
	min-width: 10em;
	text-align: center;
}

.SlideText p + div.Slide {
	margin-top: 5ex;
}

.Invisible {
	display: none;
}

.YouTubeWrapper {
	text-align: center
}

kbd.Keycap {
	background-color: #eee;
	border-radius: 3px;
	border: 1px solid #b4b4b4;
	box-shadow: 0 1px 1px rgba(0, 0, 0, .2), 0 2px 0 0 rgba(255, 255, 255, .7) inset;
	color: #333;
	display: inline-block;
	font-size: .85em;
	font-weight: 700;
	line-height: 1;
	padding: 2px 4px;
	white-space: nowrap;
	text-indent: 0;
}



@media print {
	body {
		background-image: none;
		font-size: 11pt;
		margin-left: 0;
		margin-right: 0
	}
	div.Header, nav {
		display: none
	}
	div.Document {
		max-width: none;
		width: auto;
		margin-left: 2rem;
	}
	div.Sidebar {
		display: none
	}
	span#mailaddresslink {
		display: none
	}
	div.PageLink {
		display: block
	}
	span.FileLink {
		display: none
	}
	.Document blockquote {
		border-top: 1px solid #aaa;
	}

	.Document .SelfQuote {
		border-top: 1px solid #aaa;
	}
}

@media only screen and (min-width: 70rem) {
	.RunOffRight {
		margin-right: -12rem;
	}
	.RunOffShortRight {
		margin-right: -2rem;
	}
	.RunOffPanel {
		border-left: 3px solid #aaa;
	}
	.RunOffPanel > figcaption {
		border-left: 3px solid #aaa;
	}
}

@media only screen and (max-width: 1024px) {
	div.Document {
		width: auto;
		margin-left: 10pt;
		margin-right: 10pt;
		float: none;
	}
	div.Sidebar {
		width: auto;
		float: none;
	}
	iframe.FitWidth {
		width: 100%;
		height: auto;
	}
	.YouTubeWrapper {
		width: 100%;
		padding-top: 56.25%;
		position: relative;
	}
	.YouTubeWrapper > .YouTubePlayer {
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}
}

@media only screen and (max-width: 560px) {
	body {
		font-size: 14px;
		-webkit-text-size-adjust: none;
	}
	div.Main h1 {
		font-size: 180%
	}
	div.Main h1.LeftAlign {
		margin-left: -6pt;
	}
	h2 {
		margin-left: -6pt;
	}
	div.Main {
		padding: 0 5pt 0 5pt;
	}
	div.Document {
		min-width: 90%;
		width: auto;
		margin-left: 6pt;
		margin-right: 6pt;
		float: none;
		line-height: 1.7;
	}
	div.Sidebar {
		float: none;
		width: auto;
	}
	div.PicturePanel {
		margin-bottom: 10px;
		margin-top: 10px;
		padding: 2px;
	}
	.Document dl {
		margin-left: 0;
	}
	.Document dl dd {
		margin-left: 2em;
	}
	.PortraitFix {
		margin: 0 5px;
	}
	.FloatLeft, .FloatRight, .FloatLeftCorrection, .FloatRightCorrection {
		float: none;
		display: block;
	}
	.BoxContainer {
		display: block;
	}
	.LargePicture {
		width: 100%;
		height: auto;
	}
	iframe.FitWidth {
		width: 100%;
		height: auto;
	}
	.YouTubeWrapper {
		width: 100%;
		padding-top: 56.25%;
		position: relative;
	}
	.YouTubeWrapper > .YouTubePlayer {
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}
	h1 br {
		display: none
	}
}
