/* <system section="background" selected="f5f5f5"> */

body {
	background: #f5f5f5;
}
.test {
	background: #eee;
}

/* </system> */

@charset "UTF-8";

/*
  Theme: boilerplate_MOD_type0
  Responsive: yes
  */


/* 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.
 */

:root {
	--main-color: #31a1a1;
	--second-color: #247575;
	--bg-color: #fafafa;
	/*fafafa*/
}

html {
	line-height: 1.15;
	/* 1 */
	-ms-text-size-adjust: 100%;
	/* 2 */
	-webkit-text-size-adjust: 100%;
	/* 2 */
	font-size: 112.5%;
}


/* 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: 0.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 {
	-webkit-box-sizing: content-box;
	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 */
	-webkit-text-decoration: underline dotted;
	text-decoration: underline dotted;
	/* 2 */
}


/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */

b, strong {
	font-weight: inherit;
}


/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b, strong {
	font-weight: bolder;
}


/**
 * 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: -0.25em;
}

sup {
	top: -0.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.
 */

button, html [type="button"], [type="reset"], [type="submit"] {
	-webkit-appearance: button;
	/* 2 */
}


/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}


/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}


/**
 * Correct the padding in Firefox.
 */

fieldset {
	padding: 0.35em 0.75em 0.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 {
	-webkit-box-sizing: border-box;
	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"] {
	-webkit-box-sizing: border-box;
	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.
 */

template {
	display: none;
}


/* Hidden
   ========================================================================== */


/**
 * Add the correct display in IE 10-.
 */

[hidden] {
	display: none;
}

@font-face {
	font-family: 'HiraginoCustom';
	font-weight: 100;
	src: local('HiraginoSans-W1'), local('Hiragino Sans');
}

@font-face {
	font-family: 'HiraginoCustom';
	font-weight: 200;
	src: local('HiraginoSans-W2'), local('Hiragino Sans');
}

@font-face {
	font-family: 'HiraginoCustom';
	font-weight: 300;
	src: local('HiraginoSans-W3'), local('Hiragino Sans');
}

@font-face {
	font-family: 'HiraginoCustom';
	font-weight: 400;
	src: local('HiraginoSans-W3'), local('Hiragino Sans');
}

@font-face {
	font-family: 'HiraginoCustom';
	font-weight: 500;
	src: local('HiraginoSans-W5'), local('Hiragino Sans');
}

@font-face {
	font-family: 'HiraginoCustom';
	font-weight: 600;
	src: local('HiraginoSans-W6'), local('Hiragino Sans');
}

@font-face {
	font-family: 'HiraginoCustom';
	font-weight: 700;
	src: local('HiraginoSans-W6'), local('Hiragino Sans');
}

@font-face {
	font-family: 'HiraginoCustom';
	font-weight: 800;
	src: local('HiraginoSans-W7'), local('Hiragino Sans');
}

@font-face {
	font-family: 'HiraginoCustom';
	font-weight: 900;
	src: local('HiraginoSans-W8'), local('Hiragino Sans');
}

html, body {
	/*font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'Hiragino Kaku Gothic Pro', 'Meiryo', 'MS PGothic';*/
	/*font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', HiraginoCustom, 'Hiragino Kaku Gothic ProN', YuGothic, 'Yu Gothic Medium', Meiryo, sans-serif;*/
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", HiraginoCustom, Hiragino Kaku Gothic ProN, "ヒラギノ角ゴ ProN W3", Arial, "メイリオ", Meiryo, sans-serif;
		line-height: 1.9;
		word-wrap: break-word;
		overflow-wrap: break-word;
		font-feature-settings: "palt";
		letter-spacing: 0.05em;
	}
	
	a {
		color: var(--main-color);
	}
	
	a:hover {
		color: var(--second-color);
	}
	
	a.keyword {
		text-decoration: none;
		border-bottom: 1px dotted #ddd;
		color: #454545;
	}
	
	h1, h2, h3, h4, h5, h6 {
		color: #333;
		line-height: 1.3;
	}
	
	h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
		color: #333;
		text-decoration: none;
	}
	
	h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {
		color: var(--second-color);
	}
	
	
	/* ヘッダ（グローバルヘッダ）
  グローバルヘッダの中はiframeですが、
  #globalheader-container に背景色や文字色を指定することでiframeの中にも色が反映されます。
  */
	
	#globalheader-container {
		background-color: #454545;
		color: #fff;
	}
	
	
	/* container */
	
	#container, #footer {
		padding-left: 0;
		padding-right: 0;
		margin: 0 auto;
	}
	
	@media (min-width: 790px) {
		#container {
		width: 736px;
		padding-left: 20px;
		padding-right: 20px;
	}
	#footer {
		width: 736px;
	}
	}
	
	
	/* 2カラムレイアウト ---
	#content-inner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
		-ms-flex-direction: column;
			flex-direction: column;
	-webkit-box-pack: justify;
		-ms-flex-pack: justify;
			justify-content: space-between;
			}
			
			@media (min-width: 790px) {
	#content-inner {
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
			-ms-flex-direction: row;
				flex-direction: row;
	}
	}
	
	@media (min-width: 790px) {
	#wrapper {
		width: 480px;
	}
	}
	
	@media (min-width: 790px) {
	#wrapper {
		width: 600px;
	}
	}
	
	@media (min-width: 790px) {
	#box2 {
		width: 200px;
	}
	}
	
	@media (min-width: 790px) {
	#box2 {
		width: 300px;
	}
	}
	--- END 2カラムレイアウト */
	
	
	/* 1カラムレイアウト */
	
	#content-inner {
		flex-direction: column;
		align-items: center;
	}
	
	@media (min-width: 790px) {
		#wrapper {
		width: 100%;
	}
	}
	
	#box2 {
		width: 100%;
	}
	
	#box2-inner {
		/*
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		justify-content: flex-start;
		*/
	}
	/*
	@media (min-width: 790px) {
		#box2-inner {
		margin-left: -20px;
		flex-direction: row;
	}
	}
	*/
	.hatena-module {
		width: 100%;
	}
	/*
	@media (min-width: 790px) {
		.hatena-module {
		width: 336px;
	}
	}
	
	@media (min-width: 790px) {
		.hatena-module:nth-child(even) {
			margin-left: 16px
	}
	}
	*/
	
	/* END 1カラム */
	
	
	/* バック背景色 */
	
	#top-editarea, #top-box, #content, #bottom-editarea, #footer {
		background-color: var(--bg-color);
	}
	
	
	/* ヘッダ */
	
	#blog-title {
		background-color: var(--main-color);
		width: 100VW;
		position: relative;
		left: 50%;
		top: -44px;
		padding-top: 44px;
		padding-bottom: 16px;
		margin-bottom: -44px;
		transform: translateX(-50%);
		text-align: center;
	}
	
	@media (min-width: 790px) {
		#blog-title {
		margin-bottom: 0;
	}
	}
	
	#title {
		margin: 0.7em 0 0 0;
		font-size: 1.5rem;
	}
	
	@media (min-width: 790px) {
		#title {
		font-size: 1.7rem;
	}
	}
	
	#title a {
		color: #fff;
	}
	
	#blog-description {
		color: #fff;
		font-weight: normal;
		font-size: 0.95rem;
		padding-bottom: 0.2em;
		margin: 0.3em 0 0 0;
	}
	
	#globalheader-container {
		background-color: rgba(0, 0, 0, 0.1);
	}
	
	
	/* ヘッダ画像を設定したとき */
	
	.header-image-enable #blog-title {
		margin: 0;
		height: auto;
	}
	
	.header-image-enable #blog-title #blog-title-inner {
		background-repeat: repeat-x;
		height: auto !important;
		top: -44px;
		padding-top: 44px;
		margin-bottom: -103px;
		padding-bottom: 16px;
	}
	
	@media (min-width: 790px) {
		.header-image-enable #blog-title #blog-title-inner {
		margin-bottom: -60px;
	}
	}
	
	.header-image-enable #blog-title-inner {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}
	
	.header-image-enable #blog-title-content {
		margin: 0 auto;
	}
	
	#content-inner {
		padding: 0 10px;
	}
	
	@media (min-width: 790px) {
		#content-inner {
		padding: 0 24px;
	}
	}
	
	
	/* タイトル下HTML */
	
	#top-editarea {
		padding-bottom: 1em;
		margin-bottom: -1em;
	}
	
	#top-editarea p {
		margin: 0;
	}
	
	
	/* ヘッダ下HTML */
	
	.entry-header-html {
		margin: 0 -10px;
	}
	
	@media (min-width: 790px) {
		.entry-header-html {
		margin: 0 -24px;
	}
	}
	
	
	/* ブログ下HTML */
	
	#bottom-editarea p {
		margin: 0;
	}
	
	.entry-footer-html {
		margin: 0 -10px;
	}
	
	@media (min-width: 790px) {
		.entry-footer-html {
		margin: 0 -24px;
	}
	}
	
	
	/* パンくず（カテゴリー、記事ページで表示されます） */
	
	#top-box {
		margin-bottom: -1em;
		padding: 1.2em 10px 1em;
	}
	
	@media (min-width: 790px) {
		#top-box {
		padding: 1em 24px 1em;
	}
	}
	
	.breadcrumb {
		font-size: .9rem;
		margin-bottom: 0 !important;
		padding-bottom: 1em;
	}
	
	.breadcrumb a {
		color: #999;
		text-decoration: none;
	}
	
	.breadcrumb-inner span.breadcrumb-child:last-child {
		display: none;
	}
	
	
	/* hatena側のAD */
	
	.ad.ad-online-afc {
		width: 100vw;
		margin-left: -10px;
		padding-top: 1.2em;
		margin-bottom: 0;
	}
	
	@media (min-width: 790px) {
		.ad.ad-online-afc {
		width: 100%;
		margin-left: 0;
	}
	}
	
	
	/* entry */
	
	.entry-header {
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	
	.entry-title {
		-webkit-box-ordinal-group: 1;
		-ms-flex-order: 1;
		-webkit-order: 1;
		order: 1;
	}
	
	.entry-categories {
		-webkit-box-ordinal-group: 2;
		-ms-flex-order: 2;
		-webkit-order: 2;
		order: 2;
		margin-right: 3px;
	}
	
	.entry-date {
		-webkit-box-ordinal-group: 3;
		-ms-flex-order: 3;
		-webkit-order: 3;
		order: 3;
	}
	
	.customized-header {
		-webkit-box-ordinal-group: 4;
		-ms-flex-order: 4;
		-webkit-order: 4;
		order: 4;
		width: 100%
	}
	
	h2.archive-heading {
		margin-top: 0;
	}
	
	.entry {
		position: relative;
		margin-bottom: 2em;
	}
	
	.entry-header {
		position: relative;
		padding-top: 1.5em;
	}
	
	.date {
		font-size: .8rem;
	}
	
	.date a:hover {
		text-decoration: underline;
	}
	
	.entry-title {
		margin: 0.2em 0 1.0em;
		font-size: 1.5rem;
		font-weight: 600;
		line-height: 1.55em;
		width: 100%;
	}
	
	@media (min-width: 790px) {
		.entry-title {
		font-size: 1.8rem;
	}
	}
	
	.entry-title a {
		color: #444;
	}
	
	.categories {
		font-size: .8rem;
	}
	
	.categories a:hover {
		text-decoration: underline;
	}
	
	.date a, .categories a {
		display: inline-block;
		background-color: #eee;
		border-radius: 4px;
		padding: 2px 8px;
		color: #666;
		text-decoration: none;
	}
	
	.categories a {
		margin-right: 8px;
	}
	
	.entry-categories.categories a  {
		margin-bottom: 7px;
	}
	
	
	/* 「編集する」ボタン */
	
	.entry-header-menu {
		position: absolute;
		top: -1.5em;
		right: 10px;
	}
	
	
	/* 記事内の書式 */
	
	.entry-content {
		margin-top: 2.5em;
	}
	
	.entry-content img, .entry-content video {
		max-width: 100%;
		height: auto;
	}
	
	.entry-content p {
		margin-bottom: 2.4em;
	}
	
	.entry-content p + pre {
		margin-top: -1.4em;
		margin-bottom: 2em;
	}
	
	.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6 {
	margin: 1em 0 0.8em 0;
}

.entry-content h1 {
	font-size: 1.5rem;
}

@media (min-width: 790px) {
	.entry-content h1 {
	font-size: 1.7rem;
}
}

.entry-content h2 {
	font-size: 1.4rem;
}

@media (min-width: 790px) {
	.entry-content h2 {
	font-size: 1.6rem;
}
}

.entry-content h2 {
	position: relative;
	line-height: 1.4;
	padding: 0.25em 1em;
	display: inline-block;
}

.entry-content h2:before, .entry-content h2:after {
	content: '';
	width: 20px;
	height: 30px;
	position: absolute;
	display: inline-block;
}

.entry-content h2:before {
	border-left: solid 1px #999;
	border-top: solid 1px #999;
	top: 0;
	left: 0;
}

.entry-content h2:after {
	border-right: solid 1px #999;
	border-bottom: solid 1px #999;
	bottom: 0;
	right: 0;
}

.entry-content h3 {
	font-size: 1.4rem;
	padding-bottom: .5em;
	border-bottom: 1px solid #ddd;
}

@media (min-width: 790px) {
	.entry-content h3 {
	font-size: 1.6rem;
}
}

.entry-content h4 {
	font-size: 1.4rem;
}

.entry-content h5 {
	font-size: 1.25rem;
}

.entry-content h6 {
	font-size: 1.1rem;
}

.entry-content ul, .entry-content ol, .entry-content dd {
	margin: 0 0 1em 1.5em;
	padding: 0;
}

.entry-content ul li ul, .entry-content ul li ol, .entry-content ol li ul, .entry-content ol li ol, .entry-content dd li ul, .entry-content dd li ol {
margin-bottom: 0;
}

.entry-content table {
	border-collapse: collapse;
	border-spacing: 0;
	border-bottom: 1em;
	margin-bottom: 1em;
	width: 100%;
	overflow: auto;
	display: block;
	font-size: .8rem;
}

@media (min-width: 790px) {
	.entry-content table {
	font-size: .9rem;
}
}

.entry-content table th, .entry-content table td {
	border: 1px solid #ddd;
	padding: 5px 10px;
}

.entry-content table th {
	background: #f5f5f5;
}

.entry-content blockquote {
	position: relative;
	box-sizing: border-box;
	border-left: 5px solid #ddd;
	background-color: rgba(0, 0, 0, 0.02);
	margin: 0 0 10px;
	padding: 20px;
}

.entry-content blockquote:before {
	display: inline-block;
	position: absolute;
	top: 7px;
	left: 10px;
	vertical-align: middle;
	content: "\f704";
	font-family: blogicon;
	color: #ddd;
	font-size: 1.5em;
	line-height: 1;
	font-weight: 400;
}

.entry-content blockquote:after {
	display: inline-block;
	position: absolute;
	bottom: 7px;
	right: 10px;
	vertical-align: middle;
	content: "\f704";
	font-family: blogicon;
	color: #ddd;
	font-size: 1.5em;
	line-height: 1;
	font-weight: 400;
	transform: rotate(180deg);
}

.entry-content blockquote p:first-child {
	/*margin-top: 0;*/
}

.entry-content blockquote p:last-child {
	margin-bottom: 0;
}

.entry-content pre, .entry-content code {
	font-family: 'Monaco', 'Consolas', 'Courier New', Courier, monospace, sans-serif;
}

.entry-content pre {
	background: #364549;
	color: #eee;
	border: none;
	white-space: pre-wrap;
	/* text-overflow: ellipsis; */
	font-size: 100%;
	line-height: 1.3;
	font-size: .8rem;
}

.entry-content pre {
	margin: 0 -10px;
	padding: 10px 10px;
}

@media (min-width: 790px) {
	.entry-content pre {
	margin: 0 -24px;
	padding: 10px 24px;
}
}

.entry-content pre>code {
	margin: 0;
	padding: 0;
	color: #eee;
	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: 0px 5px;
	background: #ddd;
	color: #333;
	border-radius: 3px;
}

.entry-content pre {
	overflow-wrap: break-word;
	white-space: nowrap;
    overflow-x: auto;
}

pre.code {
	position: relative;
}

pre.code::before {
	content: attr(data-lang);
	position: absolute;
	top: 0;
	right: 0;
	background: #666;
	padding: 0 .8em;
}


.entry-content pre.code2 > code {
  white-space: normal; /* 折り返しを有効にする */
  overflow: visible;   /* 横スクロールバーは表示しない */
  word-break: break-all;  /* 単語の途中で折り返す */
}


.entry-content hr {
	width: 100%;
	border: 0;
	border: none;
	border-top: 1px solid #ddd;
	margin: 2em auto;
}

.entry-content .table-of-contents {
	padding: 1em 1em 1em 2em;
	margin: 1em 0;
	border: 1px solid #ddd;
}


/* 記事下 */

.entry-footer .social-buttons {
	margin-bottom: 1em;
}

.entry-footer-section {
	color: #999;
	font-size: .9rem;
}

.entry-footer-section a {
	color: #999;
}


/* コメント */

.comment-box {
	margin: 1em 0;
}

.comment-box::before {
	content: 'コメント';
	font-size: 1rem;
	font-weight: bold;
}

.comment-box .comment {
	list-style: none;
	margin: 0 0 15px 0;
	padding: 0;
	line-height: 1.7;
	font-size: .85rem;
}

@media (min-width: 790px) {
	.comment-box .comment {
	font-size: .9rem;
}
}

.comment-box .entry-comment {
	padding: 10px 0 10px 60px;
	border-bottom: 1px solid #ddd;
	position: relative;
}

.comment-box .entry-comment:first-child {
	border-top: 1px solid #ddd;
}

.comment-box .read-more-comments {
	padding: 10px 0;
}

.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 .4em 0;
	font-weight: bold;
}

.comment-content {
	margin: 0 0 .4em 0;
	word-wrap: break-word;
	color: #454545;
	font-size: .85rem;
}

.comment-content p {
	margin: 0 0 .6em 0;
}

.comment-metadata {
	color: #999;
	margin: 0;
	font-size: .8rem;
}

.comment-metadata a {
	color: #999;
}

.leave-comment-title {
	padding: .6em 1em;
	font-size: .85rem;
	border: 1px solid #ddd;
}


/* Pager */

.pager {
	font-size: .9rem;
	margin: 2em 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.pager-prev a, .pager-next a {
	font-size: .85rem;
	display: block;
	border: 1px solid #ddd;
	padding: 0.5em;
}

.pager-next a:before {
	content: "古い記事へ／";
}

.pager-prev a:before {
	content: "新しい記事へ／";
}

.pager-arrow{
display: none;
}

.pager-next {
	padding-left: 12px;
}

/* サイドバーモジュール */

.hatena-module {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	margin-bottom: 3em;
	font-size: .85rem;
}

@media (min-width: 790px) {
	.hatena-module {
	font-size: .9rem;
}
}

.hatena-module-title {
	margin-bottom: .6em;
	padding-bottom: .2em;
	border-bottom: 1px solid #ddd;
	font-size: 1rem;
	font-weight: bold;
}

.hatena-module-title a {
	color: #454545;
	text-decoration: none;
}

.hatena-module-title a:hover {
	text-decoration: underline;
}


/* Profile module */

.hatena-module-profile .profile-icon {
	float: left;
	margin: 0 10px 10px 0;
}

.hatena-module-profile .id {
	display: block;
	font-weight: bold;
	margin-bottom: .5em;
}

.hatena-module-profile .profile-description p {
	margin-top: 0;
}


/* urllist module */

.hatena-urllist {
	list-style: none;
	margin: 0;
	padding: 0;
}

.hatena-urllist li {
	padding: .5em 0;
}

.hatena-urllist li:last-child {
	padding-bottom: 0;
}

.hatena-urllist li a {
	text-decoration: none;
}

.hatena-urllist li a:hover {
	text-decoration: underline;
}

.hatena-module.hatena-module-profile {
	
}

.hatena-module-profile div.hatena-module-body {
	display: grid;
	grid-gap: 0;
	grid-template-columns: 74px minmax(min-content, max-content) minmax(336px, 1fr);
	grid-template-rows: auto 20px auto auto auto;
}
.profile-icon-link {
	order: 1;
	grid-row: 1 / 4;
	grid-column: 1 / 2;
	padding-: 10px 10px 0 0;
	margin: 0;
}
.hatena-module-profile .id {
	order: 2;
	grid-row: 1 / 2;
	grid-column: 2 / 3;
	padding: 0 10px 4px 0;
	margin: 0;
	font-size: 0.9em;
	letter-spacing: 0;
	word-break: break-all;
}
.profile-activities {
	order: 5;
	grid-row: 4 / 5;
	grid-column: 1 / 3;
	padding: 10px 10px 0 0;
	margin: 0;
	font-size: 0.8em;
	letter-spacing: 0;
}
.hatena-follow-button-box.btn-subscribe {
	order: 4;
	grid-row: 2 / 4;
	grid-column: 2 / 3;
	padding-bottom: 5px;
	margin: 0;
	font-size: 0.8em;
	letter-spacing: 0;
}
.profile-description {
	order: 3;
	grid-row: 1 / 7;
	grid-column: 3 / 4;
	border-left: 1px solid #ddd;
	padding-left: 10px;
	margin: 0;
}
.hatena-module-profile .profile-description p:last-child {
	margin-bottom: 0;
}
@media (max-width: 600px){
	.hatena-module-profile div.hatena-module-body {
	grid-template-columns: 74px auto;
	grid-template-rows: auto 20px auto auto auto auto auto;
}
.profile-description {
	border: none;
	grid-row: 4 / 5;
	grid-column: 1 / 3;
}
.profile-activities {
	grid-row: 5 / 6;
	grid-column: 1 / 3;
}
}



.hatena-urllist .urllist-category-link {
	font-size: .7rem;
	padding: .1em .3em;
}

.hatena-urllist .urllist-date-link a {
	color: #999;
}

.hatena-urllist .urllist-entry-body {
	margin-top: .3em;
}

.recent-entries.hatena-urllist.urllist-with-thumbnails {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	justify-content: space-between;
}

.urllist-item.recent-entries-item {
	padding: 0;
	width: 334px;
	background-color: #fff;
	border: 1px #ddd solid;
	margin-bottom: 1em;
}

.urllist-item-inner.recent-entries-item-inner {
	margin: 0.5em;
}

.urllist-title-link.recent-entries-title-link {
	line-height: 0.8em;
}

@media (max-width: 789px) {
	.urllist-item.recent-entries-item {
	width: 49%;
}
}
@media (max-width: 499px) {
	.urllist-item.recent-entries-item {
	width: 100%;
}
}
/* Search module */

.hatena-module-search-box .search-form {
	border: 1px solid #ddd;
	border-radius: 3px;
	width: 100%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.hatena-module-search-box .search-module-input {
	-webkit-box-flex: 1;
	-ms-flex: 1 0;
	flex: 1 0;
	padding: 5px;
	color: #454545;
	background: none;
	border: none;
	outline: none;
	height: 20px;
}

.hatena-module-search-box .search-module-button {
	width: 24px;
	height: 24px;
	margin-right: 5px;
	background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3Esearch%3C/title%3E%3Cpath d='M16.7,15l-3.4-3.3h-.1a5.4,5.4,0,0,0,.9-3.1,5.6,5.6,0,1,0-5.6,5.6,5.4,5.4,0,0,0,3.1-.9.1.1,0,0,0,.1.1L15,16.7a1.1,1.1,0,0,0,.8.3,1.6,1.6,0,0,0,.9-.3,1.4,1.4,0,0,0,0-1.7M8.5,12.3A3.8,3.8,0,0,1,4.8,8.5,3.8,3.8,0,0,1,8.5,4.7a3.9,3.9,0,0,1,3.8,3.8,3.8,3.8,0,0,1-3.8,3.8'/%3E%3Crect class='a' width='20' height='20'/%3E%3C/svg%3E") no-repeat center;
		background-size: 20px 20px;
		border: none;
		outline: none;
		color: transparent;
		overflow: hidden;
		opacity: .5;
		cursor: pointer;
	}
	
	.hatena-module-search-box .search-module-button:hover {
		opacity: .85;
	}
	
	
	/* About ページ */
	
	.page-about .entry-content dt {
		font-weight: bold;
		border-bottom: 1px solid #ddd;
		margin-bottom: .5em;
	}
	
	.page-about .entry-content dd {
		margin-left: 0;
		margin-bottom: 2em;
	}
	
	
	/* Archive */
	
	.archive-header-category {
		text-align: center;
	}
	
	
	/*
		.page-archive .archive-entry {
			margin-bottom: 3em;
			margin-left: auto;
			margin-right: auto;
			line-height: 1.3;
		}
		.page-archive .entry-title {
			margin: .3em auto;
		}
		*/
	
	.page-archive .entry-thumb {
		width: 80px;
		height: 80px;
		background-size: cover;
	}
	
	@media (min-width: 790px) {
		.page-archive .entry-thumb {
		width: 120px;
		height: 120px;
	}
	}
	
	.page-archive .entry-description {
		margin: 0;
		font-size: .85rem;
	}
	
	@media (min-width: 790px) {
		.page-archive .entry-description {
		font-size: .9rem;
	}
	}
	
	.page-archive .social-buttons {
		display: block;
		margin-top: .3em;
	}
	
	.page-archive .archive-entry {
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		margin: 0 0 3em;
		position: relative;
		top: 3em;
	}
	
	.archive-entry .categories {
		-webkit-box-ordinal-group: 1;
		-ms-flex-order: 1;
		-webkit-order: 1;
		order: 1;
		width: 100%;
		margin-left: 120px;
		text-align: right;
		z-index: 10;
	}
	
	.archive-category-link {
		margin-bottom: 5px;
	}
	
	.archive-entry-header {
		-webkit-box-ordinal-group: 2;
		-ms-flex-order: 2;
		-webkit-order: 2;
		order: 2;
		width: 100%;
		top: -36px;
		position: relative;
	}
	
	.date.archive-date {
		position: absolute;
		left: 0;
	}
	
	.archive-entry-header h1 {
		margin-top: 1.4em;
		margin-bottom: -36px;
		font-size: 1.6rem;
	}
	
	.entry-thumb-link {
		-webkit-box-ordinal-group: 3;
		-ms-flex-order: 3;
		-webkit-order: 3;
		order: 3;
		display: none;
	}
	
	.archive-entry-body {
		-webkit-box-ordinal-group: 4;
		-ms-flex-order: 4;
		-webkit-order: 4;
		order: 4;
		width: 100%
	}
	
	.archive-entry-header h1 a {
		font-size: 1.5rem;
		color: var(--main-color);
	}
	
	@media (min-width: 790px) {
		.archive-entry-header h1 a {
		font-size: 1.6rem;
	}
	}
	
	
	/* JQuery TOP画像用 */
	img[alt*="top-image"]{
		width: 100%;
		margin-bottom: -2em;
	}
	
	.figure-image {
		position: relative;
	}
	
	.entry-inner figcaption {
		position: absolute;
		bottom: 10px;
		right: 10px;
		margin: 0;
		font-size: 80%;
		opacity: .5;
		font-style: italic;
	}
	
	.entry-content figcaption {
		position: relative;
		margin: 0;
		font-size: 80%;
		opacity: .5;
		font-style: italic;
	}
	
	.entry-inner figure {
		margin-bottom: 2.5em;
	}
	
	/* 下段広告バック地 */
	.adx-responsive-mode {
		margin: 0;
		background-color: var(--bg-color);
	}
	
	
	/* footer */
	
	#footer {
		margin-top: -48px;
		padding-bottom: 2rem;
		text-align: center;
		font-size: .8rem;
		color: #999;
	}
	
	#footer a {
		color: #999;
	}
	
	#footer p {
		margin: .5em auto;
	}
	

.entry-content h1.entry-content-about {
margin-top: -2.0em;
padding-top: 1em;
font-weight: 600;
}


.badge-type-npo, .badge-type-pro {
    display: none;
}
span.id::after {
    content: "おっさん";
    display: inline-block;
    font-size: 11px;
    font-weight: normal;
    line-height: 1;
    border: solid 1px;
    border-radius: 4px;
    padding: 2px 5px;
    margin-left: 0.25em;
}


/* 2024 */

span.author.vcard {
display: none;
}


/* Pager */
.Pagination {
	font-family: Arial,Helvetica,sans-serif;
	text-align: center;
	line-height: 1.2;
	margin: 30px 0px 30px;
}
.Pagination strong,.Pagination a {
	margin: 0px 2px;
}
.Pagination strong {
    padding: 9px 11px;
    color: #000;
}
.Pagination a:link,.Pagination a:visited {
    border: 1px solid #EBEBEB;
    color: #999;
    text-decoration: none;
    padding: 8px 11px;
}
.Pagination a:hover,.Pagination a:active,.Pagination a:focus{
    cursor:pointer;
    background-color:#f0f0f0;
    color:#000;
    text-decoration:none;
}

.breadcrumb-link span {
    font-size:0;
}

.breadcrumb-link span:before {
    font-size: .9rem;
	content: "Home";
}


/* アーカイブ 子カテゴリ 目隠し */
.hidden-prefix {
  display: none;
}