/* General
—————————————————————————————————————————————————————————————————————— */
body {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 1.25rem;
	color: #333;
}

footer {
	border-top: 1px solid #eee;
}

/* General - Inline Factor
—————————————————————————————————————————————————————————————————————— */
h1 {	font-size: 1.4rem;	}
h2 {
	font-size: 1.3rem;
	border-left: medium solid #008cff;
	margin-top: 2.4rem;
	margin-left: 0;
	padding: 1rem 1rem;
	background-color: #eee;
}
h3 {
	font-size: 1.2rem;
	border-left: none;
	margin-top: 2.0rem;
	margin-left: 0.2rem;
	padding: 0.8rem 0.8rem;
	background-color: #eee;
}
h4 {
	font-size: 1.1rem;
	border-left: none;
	margin-top: 1.6rem;
	margin-left: 0.4rem;
	padding: 0.6rem 0.6rem;
	background-color: #eee;
}
h5 {
	font-size: 1.0rem;
	border-left: none;
	margin-top: 1.2rem;
	margin-left: 0.6rem;
	padding: 0.4rem 0.4rem;
	background-color: #eee;
}
h6 {
	font-size: 0.9rem;
	border-left: none;
	margin-top: 0.8rem;
	margin-left: 0.8rem;
	padding: 0.2rem 0.2em;
	background-color: #eee;
}

a, a:visited, a:active, a:focus {
	color: #333;
	background-color: transparent;
	-webkit-transition: color 0.2s ease;
	transition: color 0.2s ease;
}

a:focus {
	color: #666;
}

a:hover {
	color: #000;
}

a, a:link, a:visited, a:focus, a:hover, a:active {
	text-decoration: none;
}

p {
	margin-bottom: 0.5rem;
	font-size: 0.9rem;
	text-align: justify;
	line-height: 1.8;
}

p a {
	border-bottom: 1px dotted #555;
}

p a:hover {
	border-bottom: 1px solid #000;
}

blockquote {
	margin: 1rem 2rem 1rem 2rem;
	padding: 1rem 1rem 0.5rem 1rem;
	color: #111;
	background-color: #fafaff;
    border: 1px dotted #008cff;
}

blockquote p {
	text-align: center;
}

blockquote p a {
	border-bottom: none;
}

span.toc-number{
  display: none;
}

/* Toc list
—————————————————————————————————————————————————————————————————————— */
ol {
	padding-top: 0.25rem;
	padding-left: 0;
	padding-bottom: 0;
	padding-right: 0;
	position: relative;
	list-style: none;
	/*margin-bottom: 0rem;*/
}

ol li, ol a {
	font-size: 0.8rem;
	margin-left: 0.5rem;
	margin-bottom: 0rem;
	line-height: 1rem;
	padding: 0.25rem;
	list-style: none;
}

/* General - list
—————————————————————————————————————————————————————————————————————— */
ul {
	margin-top: 0rem;
	padding-top: 0.25rem;
	padding-left: 0;
	padding-bottom: 0;
	padding-right: 0;
	position: relative;
	list-style: none;
	/*margin-bottom: 0rem;*/
}

ul li, ul a {
	margin-bottom: 0rem;
	padding-top: 0.25rem;
	padding-left: 0.5rem;
	padding-bottom: 0.25rem;
	padding-right: 0.5rem;
	font-size: 0.8rem;
	line-height: 1rem;
	list-style: none;
}

ul li ul {
	margin-top: 0.25rem;
}

ul li ul li {
	margin-left: 1rem;
}

main div div ul, main div div div ul {
	margin: 1rem 2rem 1rem 2rem;
	padding: 1rem 1rem 1rem 1rem;
	color: #333;
	background-color: #fafaff;
    border: 1px dotted #008cff;
}

main div div ul li p, main div div div ul li p{
	margin: 0.2rem 0 0 0;
	padding: 0;
}

/* Table Control
—————————————————————————————————————————————————————————————————————— */
:not(figure) table {
	margin-top: 1rem;
	margin-left: auto;
	margin-bottom: 1.5rem;
	margin-right: auto;
}

:not(figure) table thead {
	font-size: 0.8rem;
	text-align: center;
}

:not(figure) table tbody {
	font-size: 0.8rem;
	text-align: center;
}

:not(figure) table thead tr {
	background: #ccc;
}

:not(figure) table tbody tr td:not(.code){
	background: #eee;
}

:not(figure) table tbody tr:nth-child(odd) td:not(.code){
	background: #fff;
}	

/* cmdline control
—————————————————————————————————————————————————————————————————————— */
figure {
	background-color: #111;
	overflow-x: scroll;
}

figure table {
	margin-left: 1.5rem;
}

figure table tbody tr .gutter {
	display: none;
}

/* figure table tbody tr .gutter pre {
	margin-bottom: 0;
	font-size: 0.8rem;
	text-align: left;
	color: #111;
} */


figure table tbody tr .code pre {
	margin-bottom: 0;
	padding-left: 1rem;
	font-size: 0.8rem;
	text-align: left;
	color: #eee;
}

/* Toc Control
—————————————————————————————————————————————————————————————————————— */

/* Style Control
—————————————————————————————————————————————————————————————————————— */
.sidebar-sticky {
  position: sticky;
  top: 10px;
}

/* Title & Header
—————————————————————————————————————————————————————————————————————— */
.title {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 1.4rem;
/*	font-weight: 300;*/
	color: #000;
/*	letter-spacing: 1px;*/
}

.nav-item {
	font-family: 'M PLUS Rounded 1c', sans-serif;
/*	font-size: 0.8rem;*/
/*	font-weight: 300;*/
/*	text-transform: uppercase;*/
/*	letter-spacing: 2px;*/
}

.nav-link {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 1.2rem;
/*	font-weight: 300;*/
	color: #555;
/*	letter-spacing: 1px;*/
}

.navbar-toggler {
	border: 0;
}

.navbar-toggler-right {
	right: 0rem;
}

/* Article
—————————————————————————————————————————————————————————————————————— */
.excerpt {
	font-size: 0.9rem;
}

.date {
	color: #666;
	font-family: 'M PLUS Rounded 1c', sans-serif;
	text-transform: uppercase;
	font-size: 0.7rem;
	font-weight: 300;
	letter-spacing: 2px;
}

.pagination {
	margin: 0 auto;
}

/* Figure - Image
—————————————————————————————————————————————————————————————————————— */
.flex {
  display: flex;
/*  justify-content: space-between;*/
}

.flex-item {
  flex-basis: 100%;
  margin-left:0;
}

.image-trim {
  position: relative;
  overflow: hidden;
  padding-top: 60%;
  background-color: white;
}

.image-trim img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 101%;
  height: 101%;
  object-fit: cover;
}

kbd {
	color: #111;
	background-color: #ddd;
}

/* SNS share
—————————————————————————————————————————————————————————————————————— */
.twitter_share_link {
    background-color: #00B0ED;
    color: #fff;
}