/*
Theme: Media-v2
Author: Hatena Blog Team
Description: はてなブログMediaのデフォルトテーマです
Responsive: yes
*/

/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */

html {
	line-height: 1.15;
	/* 1 */
	-ms-text-size-adjust: 100%;
	/* 2 */
	-webkit-text-size-adjust: 100%
	/* 2 */
}
/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers (opinionated).
 */

body {
	margin: 0
}
/**
 * Add the correct display in IE 9-.
 */

article,
aside,
footer,
header,
nav,
section {
	display: block
}
/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
	font-size: 2em;
	margin: .67em 0;
}
/* Grouping content
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in IE.
 */

figcaption,
figure,
main {
	/* 1 */
	display: block
}
/**
 * Add the correct margin in IE 8.
 */

figure {
	margin: 1em 40px
}
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
	box-sizing: content-box;
	/* 1 */
	height: 0;
	/* 1 */
	overflow: visible
	/* 2 */
}
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
	font-family: monospace, monospace;
	/* 1 */
	font-size: 1em
	/* 2 */
}
/* Text-level semantics
   ========================================================================== */

/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */

a {
	background-color: transparent;
	/* 1 */
	-webkit-text-decoration-skip: objects
	/* 2 */
}
/**
 * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
	border-bottom: none;
	/* 1 */
	text-decoration: underline;
	/* 2 */
	text-decoration: underline dotted
	/* 2 */
}
/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */

b,
strong {
	font-weight: inherit;
	font-weight: bolder
}
/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
	font-family: monospace, monospace;
	/* 1 */
	font-size: 1em
	/* 2 */
}
/**
 * Add the correct font style in Android 4.3-.
 */

dfn {
	font-style: italic
}
/**
 * Add the correct background and color in IE 9-.
 */

mark {
	background-color: #ff0;
	color: #000
}
/**
 * Add the correct font size in all browsers.
 */

small {
	font-size: 80%
}
/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline
}
sub {
	bottom: -.25em
}
sup {
	top: -.5em
}
/* Embedded content
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 */

audio,
video {
	display: inline-block
}
/**
 * Add the correct display in iOS 4-7.
 */

audio:not([controls]) {
	display: none;
	height: 0
}
/**
 * Remove the border on images inside links in IE 10-.
 */

img {
	border-style: none
}
/**
 * Hide the overflow in IE.
 */

svg:not(:root) {
	overflow: hidden
}
/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
	font-family: sans-serif;
	/* 1 */
	font-size: 100%;
	/* 1 */
	line-height: 1.15;
	/* 1 */
	margin: 0
	/* 2 */
}
/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input {
	/* 1 */
	overflow: visible
}
/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select {
	/* 1 */
	text-transform: none
}
/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */

[type=reset],
[type=submit],
button,
html[type=button] {
	-webkit-appearance: button
	/* 2 */
}
/**
 * Remove the inner border and padding in Firefox.
 */

[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner,
button::-moz-focus-inner {
	border-style: none;
	padding: 0
}
/**
 * Restore the focus styles unset by the previous rule.
 */

[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring,
button:-moz-focusring {
	outline: 1px dotted ButtonText
}
/**
 * Correct the padding in Firefox.
 */

fieldset {
	padding: .35em .75em .625em
}
/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
	box-sizing: border-box;
	/* 1 */
	color: inherit;
	/* 2 */
	display: table;
	/* 1 */
	max-width: 100%;
	/* 1 */
	padding: 0;
	/* 3 */
	white-space: normal
	/* 1 */
}
/**
 * 1. Add the correct display in IE 9-.
 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
	display: inline-block;
	/* 1 */
	vertical-align: baseline
	/* 2 */
}
/**
 * Remove the default vertical scrollbar in IE.
 */

textarea {
	overflow: auto
}
/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */

[type=checkbox],
[type=radio] {
	box-sizing: border-box;
	/* 1 */
	padding: 0
	/* 2 */
}
/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
	height: auto
}
/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type=search] {
	-webkit-appearance: textfield;
	/* 1 */
	outline-offset: -2px
	/* 2 */
}
/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
 */

[type=search]::-webkit-search-cancel-button,
[type=search]::-webkit-search-decoration {
	-webkit-appearance: none
}
/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
	-webkit-appearance: button;
	/* 1 */
	font: inherit
	/* 2 */
}
/* Interactive
   ========================================================================== */

/*
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 */

details,
menu {
	display: block
}
/*
 * Add the correct display in all browsers.
 */

summary {
	display: list-item
}
/* Scripting
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 */

canvas {
	display: inline-block
}
/**
 * Add the correct display in IE.
 */

/* Hidden
   ========================================================================== */

/**
 * Add the correct display in IE 10-.
 */

[hidden],
template {
	display: none
}
/* Common */

* {
	box-sizing: border-box
}
body,
html {
	font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif;
	color: #3d3f44;
	background-color: #fff;
	line-height: 1.5;
	word-wrap: break-word
}
a {
	color: #1D865D;
	text-decoration: none
}
a:hover {
	text-decoration: underline
}
h1,
h2,
h3,
h4,
h5,
h6 {
	color: #3d3f44;
	line-height: 1.3
}
h1 a,
h1 a:hover,
h2 a,
h2 a:hover,
h3 a,
h3 a:hover,
h4 a,
h4 a:hover,
h5 a,
h5 a:hover,
h6 a,
h6 a:hover {
	color: #3d3f44
}
/* ヘッダ */

.blog-header:not(.is-touch) .blog-header-inner {
	margin-left: 10px;
	margin-right: 10px
}
@media (min-width: 768px) {
	.blog-header:not(.is-touch) .blog-header-inner {
		width: 720px;
		margin: auto;
		padding-left: 0;
		padding-right: 0
	}
}
@media (min-width: 992px) {
	.blog-header:not(.is-touch) .blog-header-inner {
		width: 940px
	}
}

.blog-header-inner {
	padding: 1.2rem 0;
	text-align: center
}
@media (min-width: 768px) {
	.blog-header-inner {
		padding: 1.5rem 0
	}
}
.blog-header-fullwidth .blog-header-inner {
	margin: 0;
	width: auto;
	padding: 0
}
.blog-title-heading {
	margin: 0 auto;
	font-size: 1.5rem
}
@media (min-width: 576px) {
	.blog-title-heading {
		font-size: 1.8rem
	}
}
.blog-title-heading img {
	vertical-align: middle;
	max-width: 100%
}
.blog-description {
	color: #9aa5ab;
	line-height: 1.3;
	margin: .5rem 0 0;
	font-size: .8rem;
	display: none
}
@media (min-width: 576px) {
	.blog-description {
		display: block
	}
}
/* ナビゲーションバー */

@media (min-width: 576px) {
	.navbar:not(.is-touch) {
		margin-bottom: 2rem
	}
}
@media (min-width: 576px) {
	.navbar:not(.is-touch) .navbar-inner {
		margin-left: 10px;
		margin-right: 10px
	}
}
@media (min-width: 576px) and (min-width: 768px) {
	.navbar:not(.is-touch) .navbar-inner {
		width: 720px;
		margin: auto;
		padding-left: 0;
		padding-right: 0
	}
}
@media (min-width: 576px) and (min-width: 992px) {
	.navbar:not(.is-touch) .navbar-inner {
		width: 940px
	}
}

.navbar {
	background-color: #f7f8f9;
	margin-bottom: 1.5rem;
	border-bottom: 4px solid #1D865D
}
.navbar .navbar-inner {
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between
}
.navbar-list,
.navbar .navbar-inner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex
}
.navbar-list {
	position: relative;
	margin: 0 auto;
	padding: 0;
	-webkit-box-align: left;
	-ms-flex-align: left;
	align-items: left;
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	white-space: nowrap;
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap
}
@media (min-width: 576px) {
	.navbar-list {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		white-space: normal
	}
}
.navbar.is-open .navbar-list {
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	white-space: normal;
	overflow: visible
}
.navbar.is-open .navbar-list:after {
	display: none
}
.navbar-list li {
	list-style: none;
	max-width: 15rem
}
.navbar-list a {
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	text-align: center;
	height: 44px;
	padding: 0 .6rem;
	font-size: .8rem;
	line-height: 1.3;
	font-weight: 700;
	color: #1D865D
}
.navbar-list a:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background-color: transparent;
	transition: background-color .2s
}
.navbar-list a:hover {
	text-decoration: none
}
.navbar-list a:hover:after {
	background-color: rgba(0, 0, 0, .08)
}
@media (min-width: 768px) {
	.navbar-list a {
		font-size: .95rem;
		padding: 0 1rem;
		height: 3.5rem
	}
}
/* トグルボタン */

.navbar-toggle-nav {
	position: relative;
	text-align: center
}
@media (min-width: 576px) {
	.navbar-toggle-nav {
		display: none
	}
}
.navbar-toggle-nav:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: -30px;
	width: 30px;
	height: 44px;
	background: linear-gradient(90deg, rgba(247, 248, 249, 0), #f7f8f9)
}
@media (min-width: 576px) {
	.navbar-toggle-nav:after {
		display: none
	}
}
.navbar-toggle-btn {
	position: relative;
	background-size: 16px 12px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	cursor: pointer
}
.navbar-toggle-btn:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background-color: transparent;
	transition: background-color .2s
}
.navbar-toggle-btn:hover {
	color: transparent;
	text-decoration: none
}
.navbar-toggle-btn:hover:after {
	background-color: rgba(0, 0, 0, .08)
}
.navbar-toggle-btn .navbar-toggle-btn-close,
.navbar.is-open .navbar-toggle-btn .navbar-toggle-btn-open {
	display: none
}
.navbar.is-open .navbar-toggle-btn .navbar-toggle-btn-close {
	display: inline
}
.navbar-toggle-btn-icon line {
	stroke: #1D865D
}
/* 記事内の書式 */

.entry-content {
	line-height: 1.7;
	font-size: .9rem
}
@media (min-width: 576px) {
	.entry-content {
		font-size: 1rem
	}
}
.entry-content a.keyword {
	text-decoration: none;
	border-bottom: 1px dotted #dfe5e7;
	color: #3d3f44
}
.entry-content p {
	margin: 1rem 0
}
.entry-content img,
.entry-content video {
	max-width: 100%;
	height: auto
}
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
	margin: 1em 0 .8em;
	line-height: 1.3
}
.entry-content h2 {
	padding-bottom: .1em;
	border-bottom: 1px solid #B9E2B0;
}
.entry-content h1 {
	font-size: 150%
}
@media (min-width: 768px) {
	.entry-content h1 {
		font-size: 160%
	}
}
.entry-content h2 {
	font-size: 140%
}
@media (min-width: 768px) {
	.entry-content h2 {
		font-size: 150%
	}
}
.entry-content h3 {
	font-size: 120%
}
@media (min-width: 768px) {
	.entry-content h3 {
		font-size: 130%
	}
}
.entry-content h4 {
  font-weight: bold;
}
@media (min-width: 768px) {
	.entry-content h4 {
  font-size: 110%;
  font-weight: bold;
	}
}
.entry-content h5 {
	font-size: 110%
}
@media (min-width: 768px) {
	.entry-content h5 {
		font-size: 110%
	}
}
.entry-content h6 {
	font-size: 100%
}
.entry-content dd,
.entry-content ol,
.entry-content ul {
	margin: 0 0 1em 1.5em;
	padding: 0
}
.entry-content dd li ol,
.entry-content dd li ul,
.entry-content ol li ol,
.entry-content ol li ul,
.entry-content ul li ol,
.entry-content ul li ul {
	margin-bottom: 0
}
.entry-content table {
	border-collapse: collapse;
	border-spacing: 0;
	border-bottom: 1rem;
	margin-bottom: 1rem;
	width: 100%;
	overflow: auto;
	display: block;
	font-size: .8rem
}
@media (min-width: 576px) {
	.entry-content table {
		font-size: .9rem
	}
}
.entry-content table td,
.entry-content table th {
	border: 1px solid #dfe5e7;
	padding: 5px 10px
}
.entry-content table th {
	background: #f7f8f9
}
.entry-content .hatena-asin-detail li {
	line-height: 1.4
}
.entry-content blockquote {
	margin: 1rem 0;
	padding: 5px 5px 5px 15px;
	border-left: 3px solid #dfe5e7
}
@media (min-width: 768px) {
	.entry-content blockquote {
		margin: 1.5rem 2rem;
		padding: 5px 20px
	}
}
.entry-content blockquote p:first-child {
	margin-top: 0
}
.entry-content blockquote p:last-child {
	margin-bottom: 0
}
.entry-content code,
.entry-content pre {
	font-family: Monaco, Consolas, Courier New, Courier, monospace, sans-serif
}
.entry-content pre {
	background: #f7f8f9;
	border: none;
	white-space: pre-wrap;
	text-overflow: ellipsis ellipsis;
	font-size: 100%;
	line-height: 1.3;
	font-size: .8rem;
	padding: 10px
}
@media (min-width: 768px) {
	.entry-content pre {
		font-size: .85rem;
		padding: 15px
	}
}
.entry-content pre>code {
	margin: 0;
	padding: 0;
	white-space: pre;
	border: none;
	background-color: transparent;
	font-family: Monaco, Consolas, Courier New, Courier, monospace, sans-serif
}
.entry-content code {
	font-size: 90%;
	margin: 0 2px;
	padding: 0 5px;
	background-color: #f7f8f9;
	border-radius: 3px
}
.entry-content hr {
	width: 50%;
	border: 0;
	border: none;
	border-top: 1px solid #dfe5e7;
	margin: 2em auto
}
.entry-content .hatena-asin-detail,
.entry-content .itunes-embed {
	background-color: #f7f8f9;
	border-color: #dfe5e7
}
.entry-content .entry-see-more {
	width: 100%;
	box-sizing: border-box;
	text-decoration: none
}
.entry-content .table-of-contents {
	padding: 1em 1em 1em 2em;
	margin: 1em 0;
	border: 1px solid #dfe5e7
}
/* モジュール: モジュールタイトル */

.hatena-module-title {
	font-weight: 700;
	margin-bottom: 1rem;
	padding-top: 0;
	padding-bottom: 5px;
	font-size: 1.2rem;
	border-top: 0;
	border-bottom: 1px solid #B9E2B0;
	color: #1D865D;
	position: relative
}
.hatena-module-title a {
	color: #1D865D;
	text-decoration: none
}
.hatena-module-title a:hover {
	text-decoration: underline
}
.hatena-module-title:after {
	content: "";
	position: absolute;
	display: block;
	bottom: -1px;
	left: 0;
	z-index: 1;
	width: 70px;
	border-bottom: 4px solid #1D865D
}
/* モジュール: 汎用 */

.hatena-module {
	margin-bottom: 2rem
}
.hatena-urllist {
	margin: 0;
	padding: 0
}
.hatena-urllist li {
	list-style: none;
	padding-bottom: .8rem;
	margin-bottom: .8rem;
	border-bottom: 1px solid #dfe5e7
}
.hatena-urllist li:last-child {
	border: none;
	margin-bottom: 0;
	padding-bottom: 0
}
.hatena-urllist .urllist-title-link {
	font-weight: 700;
	color: #3d3f44;
	font-size: .9rem;
	line-height: 1.5
}
@media (min-width: 576px) {
	.hatena-urllist .urllist-title-link {
		font-size: 1rem
	}
}
@media (min-width: 768px) {
	.hatena-urllist .urllist-title-link {
		font-size: 1.1rem
	}
}
.urllist-date-link {
	font-size: .8rem
}
.urllist-date-link a {
	color: #9aa5ab
}
.urllist-entry-body {
	font-size: .85rem;
	color: #55585f;
	margin-top: .3rem
}
.urllist-categories {
	margin-top: .3rem
}
.urllist-image {
	max-width: 100%
}
/* 最新記事モジュール内「もっと読む」ボタン */

.urllist-see-more-link {
	display: inline-block;
	text-align: center;
	padding: .6rem 1rem;
	cursor: pointer;
	line-height: 1.5;
	font-size: .8rem;
	overflow: hidden;
	background-color: #79878f;
	color: #fff;
	font-weight: 700;
	border-radius: .2rem;
	text-decoration: none!important;
	transition: all .2s
}
.urllist-see-more-link:hover {
	background-color: #616d74;
	color: #fff;
	text-decoration: none
}
.urllist-see-more-link img,
.urllist-see-more-link svg {
	vertical-align: top;
	margin-right: .3em
}
/* モジュール: トップページヘッダ
`#top-page-header-modules` はスマホ用

@media (min-width: 576px) {
	#header-modules .hatena-urllist,
	#top-page-header-modules .hatena-urllist {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		margin: 0 -.7rem;
		padding: 0
	}
}
@media (min-width: 992px) {
	#header-modules .hatena-urllist,
	#top-page-header-modules .hatena-urllist {
		margin: 0 -1rem
	}
}
#header-modules .urllist-item,
#top-page-header-modules .urllist-item {
	margin-bottom: 2rem;
	padding-bottom: 0;
	border-bottom: none;
	box-sizing: border-box
}
#header-modules .urllist-item:last-child,
#top-page-header-modules .urllist-item:last-child {
	margin-bottom: 0
}
@media (min-width: 576px) {
	#header-modules .urllist-item,
	#top-page-header-modules .urllist-item {
		margin-bottom: 0;
		width: 33.3333%;
		padding: 0 .7rem
	}
}
@media (min-width: 992px) {
	#header-modules .urllist-item,
	#top-page-header-modules .urllist-item {
		padding: 0 1rem
	}
}
#header-modules .urllist-image-link,
#top-page-header-modules .urllist-image-link {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	margin: 0 0 .5rem
}
#header-modules .urllist-image,
#top-page-header-modules .urllist-image {
	max-width: 100%;
	float: none;
	display: block;
	margin-right: 0;
	margin-bottom: 0
}
#header-modules .urllist-title-link,
#top-page-header-modules .urllist-title-link {
	font-size: 1rem
}
@media (min-width: 768px) {
	#header-modules .urllist-title-link,
	#top-page-header-modules .urllist-title-link {
		font-size: 1.1rem
	}
}
*/
/* フッタ */

.footer:not(.is-touch) .footer-inner {
	margin-left: 10px;
	margin-right: 10px
}
@media (min-width: 768px) {
	.footer:not(.is-touch) .footer-inner {
		width: 720px;
		margin: auto;
		padding-left: 0;
		padding-right: 0
	}
}

.footer {
	padding: 2rem 0;
	font-size: .85rem;
	text-align: center;
	background: transparent
}
.footer .footer-nav ul {
	list-style: none;
	margin: 0 0 1rem;
	padding: 0
}
.footer .footer-nav ul li {
	display: inline-block;
	margin: .6rem .6rem 0 0;
	padding-right: .6rem;
	border-right: 1px solid #dfe5e7
}
.footer .footer-nav ul li:last-child {
	border-right: 0;
	margin-right: 0;
	padding-right: 0
}
.footer address {
	font-style: normal;
	color: #9aa5ab
}
.footer a {
	color: #9aa5ab;
	text-decoration: none
}
.footer a:hover {
	text-decoration: underline
}
/* レイアウト */

#content {
	margin-left: 10px;
	margin-right: 10px
}
@media (min-width: 768px) {
	#content {
		width: 720px;
		margin: auto;
		padding-left: 0;
		padding-right: 0
	}
}
@media (min-width: 992px) {
	#content {
		width: 940px
	}
}

@media (min-width: 768px) {
	#content-inner {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		margin: 0 -.7rem
	}
}
@media (min-width: 992px) {
	#content-inner {
		margin: 0 -1rem
	}
}
@media (min-width: 768px) {
	#wrapper {
		width: 66.6666%;
		padding: 0 .7rem
	}
}
@media (min-width: 992px) {
	#wrapper {
		padding: 0 1rem
	}
}
@media (min-width: 768px) {
	#box2 {
		width: 33.3333%;
		padding: 0 .7rem
	}
}
@media (min-width: 992px) {
	#box2 {
		padding: 0 1rem
	}
}
@media (min-width: 768px) {
	.static-page-layout-header-footer #content-inner {
		display: block;
		margin: 0
	}
}
@media (min-width: 992px) {
	.static-page-layout-header-footer #content-inner {
		margin: 0
	}
}
@media (min-width: 768px) {
	.static-page-layout-header-footer #wrapper {
		width: auto;
		padding: 0
	}
}
@media (min-width: 992px) {
	.static-page-layout-header-footer #wrapper {
		padding: 0
	}
}
/* 記事 */

.entry {
	margin-bottom: 3rem
}
.entry-header {
	position: relative;
	margin-bottom: 1.5rem
}
.date {
	font-size: .8rem
}
.date a {
	color: #9aa5ab
}
.entry-header-menu {
	position: absolute;
	top: 0;
	right: 0
}
.entry-header-menu a {
	display: inline-block;
	text-align: center;
	padding: .6rem 1rem;
	cursor: pointer;
	line-height: 1.5;
	font-size: .8rem;
	overflow: hidden;
	background-color: #79878f;
	color: #fff;
	font-weight: 700;
	border-radius: .2rem;
	text-decoration: none!important;
	transition: all .2s;
	padding: .3em .7em;
	font-size: .75rem
}
.entry-header-menu a:hover {
	background-color: #616d74;
	color: #fff;
	text-decoration: none
}
.entry-header-menu a img,
.entry-header-menu a svg {
	vertical-align: top;
	margin-right: .3em
}
.entry-title {
	font-size: 1.5rem;
	margin: .5rem 0
}
@media (min-width: 576px) {
	.entry-title {
		font-size: 1.7rem
	}
}
.entry-title a {
	text-decoration: none
}
.entry-title a:hover {
	text-decoration: underline
}
/* 記事下 */

.entry-footer {
	margin-top: 1rem
}
.entry-footer-section {
	font-size: .8rem;
	color: #9aa5ab
}
.entry-footer-section a {
	color: #9aa5ab
}
.entry-footer-section a:hover {
	text-decoration: underline
}
/* コメント */

.comment-box ul {
	list-style: none;
	margin: 0 0 15px;
	padding: 0;
	font-size: .9rem
}
.comment-box li {
	padding: 10px 0 10px 60px;
	border-bottom: 1px solid #dfe5e7;
	position: relative
}
.comment-box li:first-child {
	border-top: 1px solid #dfe5e7
}
.comment-box .hatena-id-icon {
	position: absolute;
	top: 10px;
	left: 0;
	width: 50px!important;
	height: 50px!important;
	border-radius: 3px
}
.comment-user-name {
	margin: 0 0 10px;
	font-weight: 700
}
.comment-content {
	font-size: .85rem;
	margin: 0 0 10px;
	word-wrap: break-word
}
.comment-content p {
	margin: 0 0 10px
}
.comment-metadata {
	font-size: .8rem;
	color: #9aa5ab;
	margin: 0
}
.comment-metadata a {
	color: #9aa5ab
}
.leave-comment-title {
	display: inline-block;
	text-align: center;
	padding: .6rem 1rem;
	cursor: pointer;
	line-height: 1.5;
	font-size: .8rem;
	overflow: hidden;
	background-color: #79878f;
	color: #fff;
	font-weight: 700;
	border-radius: .2rem;
	text-decoration: none!important;
	transition: all .2s
}
.leave-comment-title:hover {
	background-color: #616d74;
	color: #fff;
	text-decoration: none
}
.leave-comment-title img,
.leave-comment-title svg {
	vertical-align: top;
	margin-right: .3em
}
/* ページャ */

.pager {
	font-size: .9rem;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	width: 100%;
	line-height: 1.5;
	border-top: 1px solid #dfe5e7;
	border-bottom: 1px solid #dfe5e7;
	text-align: center;
	margin: 1.5em auto
}
.pager a {
	color: #3d3f44;
	font-weight: 700;
	text-decoration: none
}
.pager a:hover {
	text-decoration: underline
}
.pager .pager-next,
.pager .pager-prev {
	position: relative;
	width: 50%
}
.pager .pager-next a,
.pager .pager-prev a {
	display: block;
	padding: 1rem
}
@media (min-width: 768px) {
	.pager .pager-next a,
	.pager .pager-prev a {
		padding: .5rem
	}
}
.pager .pager-next .pager-arrow,
.pager .pager-prev .pager-arrow {
	font-size: 20px;
	height: 20px;
	line-height: .7;
	position: absolute;
	display: block;
	top: 0;
	bottom: 0;
	margin: auto;
	color: #dfe5e7
}
@media (min-width: 768px) {
	.pager .pager-next .pager-arrow,
	.pager .pager-prev .pager-arrow {
		font-size: 30px;
		height: 30px
	}
}
.pager.permalink .pager-next {
	text-align: right
}
.pager.permalink .pager-next a {
	padding-right: 20px
}
@media (min-width: 768px) {
	.pager.permalink .pager-next a {
		padding-right: 40px
	}
}
.pager.permalink .pager-next .pager-arrow {
	right: 0
}
.pager.permalink .pager-prev {
	text-align: left
}
.pager.permalink .pager-prev a {
	padding-left: 20px
}
@media (min-width: 768px) {
	.pager.permalink .pager-prev a {
		padding-left: 40px
	}
}
.pager.permalink .pager-prev .pager-arrow {
	left: 0
}
/* モジュール: トップページメインカラム */

#main .urllist-item {
	padding-bottom: 1rem;
	margin-bottom: 1rem
}
#main .urllist-image {
	max-width: 50%;
	margin-right: 1rem;
	margin-bottom: 0
}
@media (min-width: 992px) {
	#main .urllist-image {
		max-width: 100%
	}
}
/* トップページヘッダ「もっと読む」ボタン */

#header-modules .urllist-see-more {
	text-align: right
}
/* メインカラム「もっと読む」ボタン */

#main .urllist-see-more-link {
	display: block;
	width: 100%
}
/* HTMLモジュール: トップページ「もっと読む」ボタン */

.urllist-read-more-btn {
	display: inline-block;
	text-align: center;
	padding: .6rem 1rem;
	cursor: pointer;
	line-height: 1.5;
	font-size: .8rem;
	overflow: hidden;
	background-color: #79878f;
	color: #fff;
	font-weight: 700;
	border-radius: .2rem;
	text-decoration: none!important;
	transition: all .2s;
	display: block;
	width: 100%
}
.urllist-read-more-btn:hover {
	background-color: #616d74;
	color: #fff;
	text-decoration: none
}
.urllist-read-more-btn img,
.urllist-read-more-btn svg {
	vertical-align: top;
	margin-right: .3em
}
/* モジュール: 記事下 */

#entry-footer-secondary-modules .hatena-module:first-child {
	margin-top: 1.5rem
}
.entry-footer-modules .urllist-title-link {
	font-size: .9rem
}
@media (min-width: 992px) {
	.entry-footer-modules .urllist-title-link {
		font-size: 1rem
	}
}
/* モジュール: サイドバー */

#box2 {
	font-size: .85rem
}
#box2 .hatena-module {
	background-color: #f7f8f9;
	padding: 1rem
}
#box2 .hatena-module-title {
	font-size: 1rem
}
#box2 .urllist-title-link {
	font-size: .9rem
}
#box2 .urllist-category-link {
	background-color: #fff
}
#box2 .urllist-entry-body {
	font-size: .8rem
}
#box2 .hatena-module-html {
	background-color: transparent;
	padding: 0
}
/* モジュール: プロフィール */

.hatena-module-profile .hatena-module-body:after {
	content: " ";
	display: block;
	clear: both
}
.hatena-module-profile .profile-icon {
	float: left;
	margin: 0 10px 10px 0;
	border-radius: 5px
}
.hatena-module-profile .id {
	display: block;
	font-weight: 700;
	font-size: 1rem;
	margin-bottom: .5rem
}
.hatena-module-profile .profile-description p {
	margin-top: 0
}
/* モジュール: 月別アーカイブ */

.hatena-urllist .archive-module-year {
	padding-bottom: 0;
	border-bottom: 0
}
/* モジュール: 検索 */

.search-form {
	position: relative
}
.search-form .search-module-input {
	width: 80%;
	border: 2px solid #dfe5e7;
	padding: .5rem .5rem .5rem 30px;
	color: #3d3f44;
	outline: none;
	font-size: 1rem;
	background: #fff url('https://cdn.blog.st-hatena.com/css/theme/media-v2/images/search.svg?version=d9044e5989403d899a5bea608134fca2d3518475&env=production') no-repeat 5px;
	background-size: 20px 20px
}
.search-form .search-module-input:hover {
	border-color: #bdccd4
}
.search-form .search-module-input:focus {
	border-color: #9aa5ab
}
.search-form .search-module-button {
	height: 0;
	width: 0;
	border: 0;
	padding: 0;
	position: absolute;
	border: none;
	outline: none;
	opacity: 0
}
/* モジュール: カテゴリー */

.hatena-module-category .hatena-urllist li {
	padding-bottom: 0;
	border-bottom: 0
}
/* カテゴリー */

.entry-category-link,
.urllist-category-link {
	color: #7e8c94;
	background-color: #f7f8f9;
	padding: .1rem .2rem;
	line-height: 1.2em;
	font-size: .8rem;
	text-decoration: none;
	display: inline-block;
	margin: 0 .4rem .3rem 0
}
.entry-category-link:hover,
.urllist-category-link:hover {
	color: #718088;
	text-decoration: none;
	background-color: #e0e4e8
}
.categories {
	margin: .3rem 0
}
/* パンくず */

#top-box {
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 1rem!important
}
@media (min-width: 768px) {
	#top-box {
		width: 720px;
		margin: auto;
		padding-left: 0;
		padding-right: 0
	}
}
@media (min-width: 992px) {
	#top-box {
		width: 940px
	}
}

#top-box .breadcrumb {
	font-size: .9rem;
	color: #9aa5ab
}
.page-about dt {
	font-size: 16px;
	font-weight: 700;
	border-bottom: 1px solid #dfe5e7;
	margin-bottom: 5px
}
.page-about dd {
	margin-left: 0;
	margin-bottom: 30px
}
.page-archive .archive-entry {
	margin-bottom: 1.5rem
}
@media (min-width: 768px) {
	.page-archive .archive-entry {
		margin-bottom: 3rem
	}
}
.page-archive .entry-title {
	margin: 0 0 .5rem;
	font-size: 1rem
}
@media (min-width: 768px) {
	.page-archive .entry-title {
		font-size: 1.1rem
	}
}
.page-archive .entry-thumb {
	width: 80px;
	height: 80px;
	background-size: cover
}
@media (min-width: 576px) {
	.page-archive .entry-thumb {
		width: 100px;
		height: 100px
	}
}
.page-archive .categories a {
	color: #7e8c94;
	background-color: #f7f8f9;
	padding: .1rem .2rem;
	line-height: 1.2em;
	font-size: .8rem;
	text-decoration: none;
	display: inline-block;
	margin: 0 .4rem .3rem 0
}
.page-archive .categories a:hover {
	color: #718088;
	text-decoration: none;
	background-color: #e0e4e8
}
.page-archive .entry-description {
	margin: .5rem 0;
	font-size: .85rem
}
@media (min-width: 576px) {
	.page-archive .entry-description {
		font-size: .9rem
	}
}
.archive-heading {
	font-weight: 700;
	margin-bottom: 1rem;
	padding-top: 0;
	padding-bottom: 5px;
	font-size: 1.2rem;
	border-top: 0;
	border-bottom: 1px solid #bdccd4;
	color: #1D865D;
	position: relative
}
.archive-heading a {
	color: #1D865D;
	text-decoration: none
}
.archive-heading a:hover {
	text-decoration: underline
}
.archive-heading:after {
	content: "";
	position: absolute;
	display: block;
	bottom: -1px;
	left: 0;
	z-index: 1;
	width: 70px;
	border-bottom: 4px solid #1D865D
}
.archive-description {
	font-size: .85rem
}
@media (min-width: 576px) {
	.archive-description {
		font-size: .9rem
	}
}

/* JADE-specific homepage changes */

#header-modules {
	max-width: 940px;
	text-align: center;
	margin: auto;
}

#header-modules .urllist-item {
	text-align: left;
}

.static-page-layout-header-footer h1 {
	text-align: center;
}

.page-index .hatena-module-recent-entries {
	width: 350px;
	margin: 0 35px 20px 0;
	float: left;
}
.home-main {
	max-width: 80%;
	margin: 0 auto;
}
.home-logo {
	text-align: center;
	float: none;
}
.home-greeting {
	line-height: 150%;
	text-align: center;
}
.home-fix {
	clear: both;
	margin-bottom: 50px;
}
