:root > * {
  --md-primary-fg-color:        #0072ce;
  --md-primary-fg-color--light: #71c5e8;
  --md-primary-fg-color--dark:  #003da5;
}

h1{
	font-weight: bold !important;
}

h2{
	font-weight: bold !important;
	border-bottom: solid 2px #333;
	padding: 5px;
}

h3{
    position: relative;
	background: rgba(0,114,206,0.7) !important;
	color: #fff;
	padding: 0.3em 1em;
	margin-bottom: 1.5em !important;
}

h3::after {
  position: absolute;
  content: '';
  top: 100%;
  left: 0;
  border: none;
  border-bottom: solid 15px transparent;
  border-right: solid 20px rgb(149, 158, 155);
}

h4{
	font-size: 120% !important;
	border-bottom: dotted 3px #666;
	padding: 0.3em 0.5em;
}

h5{
	font-size: 110% !important;
	color: #0072ce !important;
	padding: 0.2em 1em;
	border-left: 3px dotted #999;
}

h6{
	font-size: 100% !important;
	color: #000 !important;
}

h6::after{
	color: #000;
	content: "…………";
	font-weight: bold;
	padding-left: 10px;
}

a.md-top:hover{
	background: #0072ce !important;
}

.tag-gray{
	font-size: 80%;
	font-weight: bold;
	color: #fff;
	background: #999;
	padding: 2px 10px;
	border-radius: 3px;
}

.code{
	color: #333;
	background: #eee;
	padding: 15px;
	border-radius: 5px;
}

.option::before{
	font-size: 90%;
	content: "P/C";
	font-weight: bold;
	color: #fff;
	padding: 0.1em 0.6em;
	margin-right: 10px;
	border-radius: 3px;
	background: rgba(206,114,0,0.7);
}


.instance::before{
	font-size: 90%;
	content: "IM";
	font-weight: bold;
	color: #fff;
	padding: 0.1em 0.6em;
	margin-right: 10px;
	border-radius: 3px;
	background: rgba(114,206,0,0.7);
}

.command::before{
	font-size: 90%;
	content: "コマンド";
	font-weight: bold;
	color: #fff;
	padding: 0.1em 0.6em;
	margin-right: 10px;
	border-radius: 3px;
	background: rgba(114,206,0,0.7);
}

.recommend::before{
	font-size: 90%;
	content: "推奨";
	font-weight: bold;
	color: #fff;
	padding: 0.1em 0.6em;
	margin-right: 10px;
	border-radius: 3px;
	background: rgba(206,0,114,0.7);
}

.shortcut::before{
	font-size: 90%;
	content: "ショートカット";
	font-weight: bold;
	color: #fff;
	padding: 0.1em 0.6em;
	margin-right: 10px;
	border-radius: 3px;
	background: rgba(153,153,153,0.7);
}

.mouse::before{
	font-size: 90%;
	content: "マウス操作";
	font-weight: bold;
	color: #fff;
	padding: 0.1em 0.6em;
	margin-right: 10px;
	border-radius: 3px;
	background: rgba(153,153,153,0.7);
}

td:not(first-child){
	border-left: 1px solid #eee !important;
}

img{
	margin-top: 10px;
	margin-bottom: 15px;
}

.embed-responsive {
  position: relative;
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden;
}
.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  border: 0;
}
.embed-responsive-16by9 {
  padding-bottom: 56.25%;
}
.embed-responsive-4by3 {
  padding-bottom: 75%;
}

.tag-black {
	position: relative;
	display: inline-block;
	height: 28px;
	margin-left: 12px;
	font-size: 90%;
	padding: 0.1em 1em 0.1em 1.4em;
	color: #fff;
	background: #000;
}

.tag-black::before{
	position: absolute;
	top: 0;
	left: -12px;
	content: ' ';
	border-width: 14px 12px 14px 0;
	border-style: solid;
	border-color: transparent #000 transparent transparent;
}

.tag-black::after {
	position: absolute;
	top: calc(50% - 5px);
	left: -4px;
	width: 10px;
	height: 10px;
	content: '';
	border-radius: 50%;
	background: #fff;
}

.icons{
	width: 20px;
	text-align: center;
	margin-right: 1em;
	}
