@charset "UTF-8";



/*
 * ━━━━━━━━━━━━━━━━━━━━━━━━
 * 　　　　はりをきば　オリジナルCSS (PC版)　　　　
 * ━━━━━━━━━━━━━━━━━━━━━━━━
 * 【作者】　　　：はりを（http://gutyan.jp/）
 * 【テーマ名】　：とあるはりをの超空間
 * 【概要】　　　：明確な完成イメージが定まらないまま肉付けしていった結果、この通り何かよくわからんテーマに…。
 * 【コメント】　：Webkit/Blink系ブラウザは一部表示がズレる。Firefoxは特定環境下で描画がバグる。どちらも閲覧する分には支障ないがどちらもブラウザ側の問題なので何ともしようがない。
 * 　　　　　　　：旧Opera(Presto)は見限った。Blink版のみサポート。
 * 　　　　　　　：全体的に詰めが甘い。これでも一応フルスクラッチ。
 * 【最終更新日】：いちいちここに書くの面倒だから鯖が吐くLast-Modifiedヘッダ見てくれ（Last-Modifiedの確認には https://blog.gutyan.jp/entry/2014/01/21/my_bookmarklet のブックマークレットが便利だよと宣伝してみる）
 * 【著作権】　　：当CSSの一部または全部、及び使用している画像、フォント、その他一切の無断使用禁止。
 */






/*　途中まで作ったけど飽きてそのまま放置してるブログタイトル装飾アニメーション
#star-yellow,
#star-green,
#star-red,
#star-blue,
#star-purple {
	display: inline-block;
	width: 11px;
	height: 10px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	position: relative;
	text-shadow: 0.1em 0.1em 0.1em gold, -0.1em -0.1em 0.1em yellow;
	visibility: hidden;
	z-index: 3;
}

#star-yellow {
	animation: star-yellow 1s linear 0s infinite normal;
}

@keyframes star-yellow {
	0% {
		left: 22px;
		top: 87.5px;
		transform: scale(2);
		z-index: 3;
	}

	25% {
		left: -140px;
		top: 120px;
		transform: scale(1);
		z-index: 2;
	}

	50% {
		left: 22px;
		top: 87.5px;
		transform: scale(0);
		z-index: 1;
	}

	75% {
		left: 190px;
		top: 60px;
		transform: scale(1);
		z-index: 2;
	}

	100% {
		left: 22px;
		top: 87.5px;
		transform: scale(2);
		z-index: 3;
	}
}
*/






/*　はてなスターコメントボタン非表示　*/

.hatena-star-comment-container {
	display: none !important;
}



/*　はてなスターコンテナ丸み無効化（これをしないとFirefoxだけ画像が正常に描画されない）　*/

.hatena-big-star-star-container {
	border-radius: 0 !important;
}



/*　はてなスターのユーザーアイコンやスター画像の丸みを強く　*/

.hatena-star-user,
.hatena-star-star {
	border-radius: 0.25em !important;
}



/*　はてなスターのデフォルト背景色(rgba()による透過0.8)を無効化　*/

.hatena-star-star {
	background: white !important;
}



/*　引用ボタン非表示（デフォルトの出現位置が変で、今のところこちら側で上手く調整できないので一旦保留）　*/

.tooltip-quote {
	display: none !important;
	cursor: pointer;
	opacity: 0.75 !important;
	transition: 0.25s;
}

.tooltip-quote:hover {
	opacity: 1 !important;
}

.requote-button {
	display: none !important;
}



/*　はてなスター画像変更（2010年のエイプリルフールで使われた「はでなスター(http://d.hatena.ne.jp/hatenastar/20100401/1270047617)」）　*/

.hatena-star-star-image {
	background-image: url("//s.hatena.ne.jp/images/april2010/star.gif");
}

.hatena-star-green-star-image {
	background-image: url("//s.hatena.ne.jp/images/april2010/star-green.gif");
}

.hatena-star-red-star-image {
	background-image: url("//s.hatena.ne.jp/images/april2010/star-red.gif");
}

.hatena-star-blue-star-image {
	background-image: url("//s.hatena.ne.jp/images/april2010/star-blue.gif");
}

.hatena-star-purple-star-image {
	background-image: url("//s.hatena.ne.jp/images/april2010/star-purple.gif");
}



/*　記事未投稿時のツールチップ調整　*/

.welcome-tooltip-newentry {
	box-sizing: content-box;
	width: 200px;
	height: 40px;
	left: auto !important;
	right: 192px;
	top: 37px;
}



/*　リンク全般　*/

a {
	background: none;
	display: inline-block;
	outline: 0;
	text-decoration: underline;
	transition: all 0.1s, opacity 1s ease-in-out, font-size 0s;
}

a:link {
	color: #0fc;
}

a:visited {
	color: #f88;
}

a:hover {
	color: #ec1;
	text-decoration: none;
}

a:active {
	color: #80f;
	text-decoration: none;
}

a.bookmark-widget-counter {
	transform: none !important;
}

a.hatena-fotolife {
	display: inline;
}

a.http-favicon-link {
	line-height: 0;
	margin: 2px;
	padding: 0;
	width: 16px;
	height: 16px;
	text-decoration: none;
	transform: none !important;
	vertical-align: text-top;
}

a.http-favicon-link img.http-favicon {
	background: rgba(240, 240, 240, 0.9);
	border-radius: 0.25em;
	margin: 0;
	padding: 0;
	width: 16px;
	height: 16px;
	vertical-align: middle;
}

a.keyword {
	border-bottom: 1px dotted #ddd;
	color: #898989;
	text-decoration: none;
}

del a {
	text-decoration: overline line-through underline;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
	text-decoration: none;
}

s a {
	text-decoration: line-through;
}

body:not(.page-about) .entry-content a[target="_blank"]:not(.http-favicon-link):hover::after {
	content: "ì";
	color: whitesmoke;
	font-family: icon;
	font-size: 1.25em;
	margin-left: 0.25em;
}

.entry-content a:hover,
.entry-header a:hover,
.hatena-module-body a:hover {
	transform: scale(1.05);
}

.hatena-module-body a[href="http://blog.hatena.ne.jp/guide/pro"] {
	transform: none;
}

.js-archive-module-calendar-container a {
	font-weight: bold;
}

.js-archive-module-calendar-container a:hover {
	transform: scale(1.1);
}



/*　基本要素全般　*/

* {
	box-sizing: border-box;
}

*::selection {
	background: #1a4666;
	color: white;
}

*::-moz-selection {
	background: #1a4666;
	color: white;
}

html {
	scrollbar-3dlight-color: gray;
	scrollbar-arrow-color: whitesmoke;
	scrollbar-darkshadow-color: gray;
	scrollbar-face-color: #1a4666;
	scrollbar-highlight-color: gray;
	scrollbar-shadow-color: #1c2126;
	scrollbar-track-color: #1c2126;
}

body {
/*
	background: #232323 url("/img/bg/tile.png") fixed repeat left top;
*/
	background-color: rgb(28, 33, 38);
	color: rgba(245, 245, 245, 0);
	font-size: 16px;
	line-height: 1.5;
/*
	text-shadow: 0.05em 0.05em 0.05em #123, -0.05em -0.05em 0.05em #123;
*/
	transition: color 1s ease-in-out;
}

b, code, del, i, s, u, span {
	transition: opacity 1s ease-in-out;
}



/*　ボタン周り　*/

.btn {
	background-color: white;
	background-clip: padding-box;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 2px;
	cursor: pointer;
	color: #565656;
	display: inline-block;
	font-size: 12px;
	font-weight: bold;
	line-height: 18px;
	margin-bottom: 0;
	padding: 4px 10px 4px;
	text-align: center;
	text-decoration: none !important;
	vertical-align: middle;
}

.btn:hover {
	background-color: whitesmoke;
	text-decoration: none !important;
}

.btn-small {
	font-size: 11px !important;
	padding: 2px 10px !important;
}

.btn-large {
	font-size: 17px;
	font-weight: bold;
	line-height: normal;
	padding: 13px 19px;
}



/*　ポップアップiframe周り　*/

.hatena-globalheader-window,
.hatena-iframe-container {
	background: whitesmoke;
	box-sizing: content-box;
	position: absolute;
}

.hatena-globalheader-window iframe {
	overflow: hidden;
}

.hatena-iframe-container {
	border-radius: 0.5em;
}

.hatena-iframe-container iframe {
	background: whitesmoke;
	overflow: hidden;
}

#notify-window iframe {
	overflow: auto;
}

#hatena-diary-edit-in-place {
	position: fixed;
}



/*　はてなブログ共通ヘッダ　*/

#globalheader-container {
	background: transparent;
	border: 0;
	color: lime;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 37px;
	z-index: 100;
}

.globalheader-off #container {
	padding-top: 0;
}

#sp-suggest {
	margin: 37px 0 18.5px !important;
	padding: 0 !important;
}



/*　レイアウト全般（可変2カラム(最低1000px)／記事幅：可変｜サイドバー：300px固定）　*/

#container {
	max-width: 90%;
	min-width: 1000px;
	margin: 0 auto;
}

#content {
	display: none;
}

#content::after {
	content: "";
	clear: both;
	display: block;
}

#wrapper {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
}

#box2 {
/*
	background: #11111f url("/img/bg/star_dark.png") fixed repeat left top;
*/
	background-color: rgb(17, 17, 31);
	border: 0.5em solid whitesmoke;
	border-radius: 0.25em;
	float: right;
	font-size: 0.9em;
	margin-left: -300px;
	padding: 0;
	width: 300px;
}

#box2-inner {
	background: rgba(25, 25, 25, 0.5);
	margin: 0;
	padding: 1em;
	width: 100%;
	height: 100%;
}

#main {
/*
	background: #1c293f url("/img/bg/space_b.png") fixed repeat left top;
*/
	background-color: rgb(28, 41, 63);
	border: 0.5em solid whitesmoke;
	border-radius: 0.25em;
	margin-right: 310px;
	padding: 0;
}

#main-inner {
	background: rgba(25, 25, 25, 0.75);
	margin: 0;
	padding: 0.1px 0;
	width: 100%;
	height: 100%;
}

.page-archive #main-inner {
	padding: 2em 2em;
}



/*　ヘッダー　*/

#blog-title {
	background: #565656 url("/img/bg/meteorite.png") fixed repeat left top;
	border: 0.5em solid whitesmoke;
	border-radius: 0.25em;
	margin: 37px 0 1em;
	padding: 37px 0;
	text-align: center;
	transition: 0.25s;
	z-index: 2;
}

#blog-title p {
	margin: 0;
	padding: 0;
}

#title {
	margin: 32px 0;
	padding: 0;
}

#title a {
	color: whitesmoke;
	font-size: 64px;
	font-weight: bold;
	opacity: 1;
	text-decoration: none;
	text-shadow: -0.1em -0.1em 0.1em #121212;
	transition: all 0.5s, font-size 0s;
	visibility: visible;
}

#title a:hover {
/*
	background: linear-gradient(90deg, rgba(195, 17, 52, 0.9), rgba(233, 207, 86, 0.9), rgba(25, 25, 115, 0.9), rgba(233, 207, 86, 0.9), rgba(195, 17, 52, 0.9));
*/
	color: rgba(25, 25, 125, 0.9);
	text-shadow: 0.1em 0.1em 0.1em #efefef;
}

#blog-description {
	color: darkorange;
	font-size: 0.9em;
	font-weight: bold;
	margin: 0;
	padding: 0;
	text-shadow: 0.5px 0.5px 0.5px #454545;
}

#blog-description span {
	opacity: 1;
	visibility: visible;
}

/*
@keyframes nuclear-L {
	from {transform: rotate(360deg);}
	to   {transform: rotate(0deg);}
}

#nuclear-L {
	animation: nuclear-L 1s linear 0s infinite normal;
	-webkit-animation: nuclear-L 1s linear 0s infinite normal;
	color: gold;
	display: inline-block;
}

@keyframes nuclear-R {
	from {transform: rotate(0deg);}
	to   {transform: rotate(360deg);}
}

#nuclear-R {
	animation: nuclear-R 1s linear 0s infinite normal;
	-webkit-animation: nuclear-R 1s linear 0s infinite normal;
	color: gold;
	display: inline-block;
}
*/



/*　ヘッダーHTMLエリア　*/

#top-editarea {
	margin: 0 0 1em;
}

.attention {
	background: #343434;
	border: 0.5em solid gray;
	border-radius: 0.25em;
	text-align: center;
}

#caution {
	background: #343434;
	border: 0.5em solid black;
	border-radius: 0.25em;
	font-size: 0.9em;
	margin: 0 0 2em;
	text-align: center;
}



/*　独自設定メニュー　*/

#config {
	display: none; /* とりあえず非公開 */
}

#config-button {
	background: #232323;
	border-right: 0.5em solid whitesmoke;
	border-top: 0.5em solid whitesmoke;
	border-top-right-radius: 0.5em;
	cursor: pointer;
	margin: 0;
	padding: 0.5em;
	position: fixed;
	left: 0;
	bottom: 0;
	transition: 0.25s;
	z-index: 9999;
}

#config-button:hover {
	background: navy;
}

#config-button b {
	display: inline-block;
	font-family: CustomSymbol;
	font-size: 2em;
	line-height: 1;
	margin: 0;
	padding: 0;
	text-align: center;
	width: 2em;
	height: 2em;
	transition: 0.25s linear;
	vertical-align: middle;
}

#config-button:hover b {
	transform: rotate(180deg);
}

#config-modal {
	background: #232323;
	border: 0.5em solid whitesmoke;
	border-radius: 0.5em;
	display: none;
	margin: auto;
	padding: 1em;
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	width: 640px;
	height: 480px;
	z-index: 12345;
}

#config-modal td,
#config-modal th {
	line-height: 1;
	padding: 0.25em;
}

#config-modal td span {
	display: none;
}

#config-modal p {
	position: absolute;
	right: 0;
	bottom: 0;
}

#config-close::before {
	content: "×";
}

#config-close {
	background: #0f0f0f;
	border: 5px solid whitesmoke;
	border-radius: 20px;
	cursor: pointer;
	font-size: 20px;
	font-weight: bold;
	line-height: 1.25;
	margin: 0;
	padding: 0;
	position: absolute;
	right: -20px;
	top: -20px;
	text-align: center;
	vertical-align: middle;
	width: 40px;
	height: 40px;
}

#config-ok {
	background: navy;
	border-radius: 0.25em;
	cursor: pointer;
	font-size: 1.1em;
	font-weight: bold;
	margin: 0 1em;
}

#config-cancel {
	background: gray;
	border-radius: 0.25em;
	cursor: pointer;
	font-size: 0.9em;
	margin: 0 1em;
}



/*　やっつけドロップメニュー　*/

#dropmenu,
#dropmenu-container {
	height: 44px;
}

#dropmenu-container,
#dropmenu-container * {
	margin: 0;
	padding: 0;
	user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-webkit-user-select: none;
}

#dropmenu {
	background: rgb(23, 27, 31);
	border-radius: 0.25em;
	list-style: none;
	margin: 2em 0 0;
	width: 100%;
	position: static;
	z-index: 1000;
}

#dropmenu li {
	float: left;
	position: relative;
	text-align: center;
	width: 100%;
}

#dropmenu li a,
#dropmenu li span {
	color: whitesmoke;
	display: block;
	font-size: 1em;
	font-weight: bold;
	line-height: 1;
	text-decoration: none;
	width: 100%;
}

#dropmenu li ul {
	list-style: none;
	position: absolute;
	left: 0;
	top: 100%;
	z-index: 500;
}

#dropmenu li ul li:first-child {
	border-top: 0;
}

#dropmenu li ul li:last-child {
	border-bottom: 0;
}

#dropmenu li ul li a {
	background: rgb(37, 44, 51);
	font-size: 0.9em;
	font-weight: normal;
	line-height: 0.9;
	padding: 0.9em 0.8em;
	text-align: left;
	white-space: nowrap;
}

#dropmenu li ul li a:hover,
#dropmenu > li > ul > li:hover > a {
	background: rgb(26, 70, 102);
}

#dropmenu li ul li:last-child > a {
	border-radius: 0 0 0.2em 0.2em;
}

#dropmenu li ul li ul {
	left: 100%;
	top: 0;
	overflow: hidden;
	width: 0;
	height: 0;
	transition: 0.5s;
}

#dropmenu li ul li ul a {
	opacity: 0;
	transition: 0.5s;
}

#dropmenu li ul li:hover > ul {
	overflow: visible;
	width: auto;
	height: auto;
}

#dropmenu li ul li:hover > ul a {
	opacity: 1;
}

#dropmenu li ul li {
	height: 0;
	overflow: hidden;
	transition: height 0.5s;
}

#dropmenu li:hover ul li {
	height: 38px;
	overflow: visible;
}

#dropmenu > li {
	max-width: 300px;
}

#dropmenu > li > a::before {
	font-size: 1.5em;
	font-weight: normal;
	line-height: 0;
	margin-right: 0.25em;
	vertical-align: middle;
}

#dropmenu li > a.sub::after {
	content: "＞";
	background: rgba(0, 0, 0, 0.5);
	border-radius: 0.8em;
	display: inline-block;
	font-family: CustomSymbol;
	font-size: 0.8em;
	font-weight: normal;
	line-height: 1.3;
	padding: 0.1em 0 0 0.2em;
	position: absolute;
	right: 1em;
	width: 1.2em;
	height: 1.2em;
	vertical-align: middle;
}

#dropmenu > li > a,
#dropmenu > li > span {
	border-bottom: 0.3em solid rgb(0, 0, 128);
	height: 44px;
	padding: 12px 0;
	overflow: hidden;
	text-shadow: -0.25px -0.25px 0.25px #444;
	vertical-align: middle;
}

#dropmenu > li > a:hover,
#dropmenu > li > span:hover {
	background: rgb(0, 0, 128);
	border-bottom: 0.3em solid rgb(245, 245, 245);
	border-radius: 0.2em;
	color: whitesmoke;
}


#dropmenu li#home {
	width: 75px;
}

#dropmenu li#home > a::before {
	content: "⌂";
	font-family: CustomSymbol;
	font-size: 2em;
	line-height: 0.5;
}

#dropmenu li#home > a {
	padding: 11px 0;
}

#dropmenu li#home > a:hover {
	background: #aa0;
	border-bottom: 0.3em solid whitesmoke;
}


#dropmenu li#dsb {
	width: 125px;
}

#dropmenu li#dsb > a::before {
	content: "\f000";
	font-family: sbx;
}

#dropmenu li#dsb > li:hover ul {
	min-width: 125px;
}

#dropmenu #dsb-for:hover > ul {
	width: 75px;
}

#dropmenu li[id^="dsb-"] ul li a::before {
	font-size: 1.1em;
	margin-right: 0.3em;
	vertical-align: middle;
}

#dropmenu li[id^="dsb-"] ul li a[href*="%EF%BC%9A%E6%94%B9"]::before {
	content: "\e9ff";
	font-family: CustomSymbol;
}

#dropmenu li[id^="dsb-"] ul li a[href*="%EF%BC%9A%E3%82%B9"]::before {
	content: "j";
	font-family: icon;
}

#dropmenu li[id^="dsb-"] ul li a[href*="%EF%BC%9A%E3%81%9D"]::before {
	content: "G";
	font-family: icon;
}

#dropmenu li[id^="dsb-"] ul li a {
	color: #343434;
	transition: color 0.5s;
}

#dropmenu li[id^="dsb-"]:hover ul li a {
	color: whitesmoke;
}


#dropmenu li#hack {
	width: 130px;
}

#dropmenu li#hack > a::before {
	content: "\e9e9";
	font-family: CustomSymbol;
}


#dropmenu li#text {
	width: 120px;
}

#dropmenu li#text > a::before {
	content: "C";
	font-family: icon;
	font-size: 1.25em;
}

#dropmenu li#text li#text-fox a::before {
	content: "\f802";
	font-family: CustomSymbol;
	font-size: 1.25em;
	margin-right: 0.25em;
	vertical-align: middle;
}

#dropmenu li#text li#text-fox a:hover {
	background: darkorange;
}

#dropmenu li#text li#text-review a::before {
	content: "0";
	font-family: icon;
	font-size: 1.25em;
	margin-right: 0.25em;
}

#dropmenu li#text li#text-app a::before {
	font-family: CustomSymbol;
	font-size: 1.1em;
	margin-right: 0.3em;
	vertical-align: middle;
}

#dropmenu li#text li#text-app li#text-app-cli a::before {
	content: "\e9f1";
}

#dropmenu li#text li#text-app li#text-app-gui a::before {
	content: "\e9f2";
}


#dropmenu li#about {
	width: 200px;
}

#dropmenu li#about > a::before {
	content: "˘";
	font-family: icon;
	font-size: 1.25em;
}


#dropmenu li#feed {
	width: 75px;
}

#dropmenu li#feed > span::before {
	content: "˛";
	font-family: icon;
	font-size: 2em;
	font-weight: normal;
	line-height: 0;
	vertical-align: middle;
}

#dropmenu li#feed > span {
	cursor: pointer;
	padding: 10px 0;
	transition: opacity 1s ease-in-out;
}

#dropmenu li#feed > span:hover {
	background: darkorange;
	border-bottom: 0.3em solid whitesmoke;
}

#dropmenu li#feed ul li a {
	padding: 1em 0.5em;
}

#dropmenu li#feed ul li a:hover {
	background: orangered;
}



/*　検索フォーム（手動設置）　*/

#search {
	background: whitesmoke url("//blog.hatena.ne.jp/images/theme/search.png") scroll no-repeat right center;
	border: 0.25em solid whitesmoke;
	border-radius: 0.25em;
	box-shadow: 0 2px 2px transparent, 0 -2px 2px transparent;
	color: gray;
	float: right;
	margin: 12px 0.5em;
	outline: 0;
	padding: 0 20px 0 0;
	transition: 0.25s;
	width: 185px;
	height: 20px;
}

#search:hover,
#search:focus {
	color: #232323;
	width: 285px;
}

#search:focus {
	box-shadow: 0 2px 2px aquamarine, 0 -2px 2px aquamarine;
}

#search::after {
	content: "";
	clear: both;
	display: block;
}

#search::-moz-placeholder {
	color: navy;
	font-size: 0.9em;
	opacity: 0.9;
}

#search:focus::-moz-placeholder {
	opacity: 0.5;
}

#search:-ms-input-placeholder {
	color: navy;
	font-size: 0.9em;
	opacity: 0.9;
}

#search::-webkit-input-placeholder {
	color: navy;
	font-size: 0.9em;
	opacity: 0.9;
}

#search:focus::-webkit-input-placeholder {
	opacity: 0.5;
}



/*　ヘッダメニュー画面固定　*/

#dropmenu.fixedmenu {
	background: rgba(23, 27, 31, 0.9);
	border-radius: 0;
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: auto;
	margin: 0 auto;
	max-width: 90%;
	min-width: 1000px;
}

#dropmenu.fixedmenu > li > a {
	border-bottom: 0.3em solid rgba(0, 0, 128, 0.9);
}

#dropmenu.fixedmenu > li:hover > a {
	border-bottom: 0.3em solid rgba(245, 245, 245, 0.9);
}



/*　スマブラアイコンバー　*/

#sbx-bar {
	background: rgba(25, 25, 25, 0.9);
	color: whitesmoke;
	cursor: pointer;
	font-family: sbx;
	font-size: 1.25em;
	line-height: 1;
	text-align: center;
	position: fixed;
	left: 0;
	right: 0;
	top: auto;
	bottom: 0;
	margin: 0 auto;
	padding: 0.25em 0;
	height: 30px;
	width: 100%;
	max-width: 90%;
	min-width: 1000px;
	z-index: 1000;
	user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-webkit-user-select: none;
}



/*　フッターHTMLエリア　*/

#bottom-editarea {
	/* 未定 */
}



/*　パンくずリスト　*/

#top-box {
/*
	background: #707070 url("/img/bg/mist_s.png") fixed repeat left top;
*/
	background-color: rgb(111, 111, 111);
	border: 0.25em solid #ddd;
	border-radius: 0.25em;
	margin: 1em 0 2em;
	font-size: 0.9em;
}

#top-box .breadcrumb {
	background: rgba(35, 35, 35, 0.5);
	margin: 0;
	padding: 0.5em 2em;
}



/*　記事上　*/

#notice1Y, #noticeMC {
	background: rgba(34, 45, 56, 0.9);
	border: 0.25em solid whitesmoke;
	border-radius: 0.5em;
	margin-top: 0.5em;
}

#notice1Y .icon, #noticeMC .icon {
	margin-right: 0.5em;
}



/*　日付周り　*/

.date::before {
	content: "!";
	font-family: icon;
	font-weight: bold;
	margin-right: 0.1em;
	text-shadow: -1px -1px 1px #343434;
}

.date {
	font-weight: bold;
	margin-bottom: 10px;
}

.date a {
	color: #1487bd;
	font-size: 1.1em;
	text-decoration: none;
}

.date .date-year {
	color: red;
}

.date .date-month {
	color: yellow;
}

.date .date-day {
	color: lime;
}



/*　カテゴリ　*/

.categories::before {
	content: "a";
	font-family: icon;
	font-weight: italic;
	margin-right: 0.1em;
}

.categories {
	margin-top: 0.5em;
	font-size: 0.8em;
}

.categories a {
	text-decoration: none;
}

.categories a:not(:only-of-type):not(:last-of-type)::after {
	color: whitesmoke !important;
	margin-right: 0.25em;
}

.no-categories {
	display: none;
}



/*　記事エリア全般　*/

.entry {
	position: relative;
	margin: 0 0 15em;
	padding: 2em 2em 0;
}

.entry-header {
	border-bottom: 0.25em solid #ddd;
	margin-bottom: 3em;
	padding: 0 0 1em 0;
	position: relative;
}

.entry-title::before {
	content: "b";
	font-family: icon;
}

.entry-title {
	margin: 0;
	line-height: 1;
	font-size: 1.5em;
}



/*　編集ボタン　*/

.entry-header-menu {
/*
	visibility: hidden;
*/
	position: absolute;
	top: 0;
	right: 0;
}

.entry-header-menu a {
	background: whitesmoke;
	border: 0.1em solid rgba(0, 0, 0, 0.25);
	border-radius: 0.25em;
	color: #565656;
	cursor: pointer;
	display: block;
	font-family: icon;
	font-size: 1em;
	line-height: 1;
	margin: 0;
	padding: 5px;
	text-align: center;
	text-decoration: none;
	text-shadow: none;
	transition: 0.25s;
	vertical-align: middle;
}

.entry-header-menu a:hover {
	background: darkorange;
	color: whitesmoke;
	transform: scale(1.5);
}



/*　記事の中身　*/

.entry-content {
	border-bottom: 0.25em solid #ddd;
	padding-bottom: 1em;
}

.entry-content a.entry-see-more::before {
	content: "ë ";
	font-family: icon;
}

.entry-content a.entry-see-more {
	margin-top: 1em;
}

.entry-content a[name]:not(.footnote-number) {
	font-size: 0.75em;
}

.entry-content a[href^="magnet:"]::before {
	content: "\e9ab";
}

/*
.entry-content blockquote::before {
	content: "“";
	font-size: 2em;
	position: absolute;
	left: 0;
	top: 0;
}
*/

.entry blockquote {
	background: rgba(19, 19, 19, 0.9);
	border: 0.25em solid #dedede;
	border-radius: 0.25em;
	margin: 1em 0;
	padding: 1em;
	position: relative;
	word-break: break-word;
}

/*
.entry blockquote::after {
	content: "”";
	font-size: 2em;
	position: absolute;
	right: 0;
	bottom: 0;
}
*/

.entry blockquote cite {
	font-size: 0.75em;
}

.entry blockquote p {
	margin: 0;
	padding: 0;
}

.entry code {
	background: #454545;
	border: 0.1em solid whitesmoke;
	border-radius: 0.1em;
	color: whitesmoke;
	font-size: 0.9em;
	margin: 0 0.25em;
	padding: 0 0.25em;
	transition: color 1s ease-in-out;
}

.entry code.important {
	border: 0.25em solid #c31134;
	border-radius: 0.25em;
	color: #e9cf56;
	font-weight: bold;
}

.entry h1,
.entry h2,
.entry h3,
.entry h4,
.entry h5,
.entry h6 {
	margin: 0;
}

.entry-content h1,
.entry-content h2,
.entry-content h6 {
	display: none;
}

.entry h3 {
	border-left: 1.25em solid #c31134;
	border-bottom: 0.25em solid #6c1126;
	font-size: 1.3em;
	margin-top: 3em;
	margin-bottom: 1.5em;
	padding-left: 0.6em;
}

.entry h4 {
	border-left: 1em solid #e9cf56;
	border-bottom: 0.25em solid #cdb64e;
	font-size: 1.2em;
	margin-top: 2em;
	margin-bottom: 1em;
	padding-left: 0.4em;
}

.entry h5 {
	border-left: 0.75em solid #4dac26;
	border-bottom: 0.25em solid #238b23;
	font-size: 1.1em;
	margin-top: 1em;
	margin-bottom: 0.5em;
	padding-left: 0.2em;
}

.entry img.hatena-fotolife {
	display: inline-block;
	opacity: 0.9;
	transition: 0.25s;
}

.entry img.hatena-fotolife:hover {
	opacity: 1;
}

.entry ul li ul li {
	font-size: 0.9em;
}

.entry p {
	margin: 0;
	padding: 0;
}

.entry pre {
	background: #232323;
	border: 0.25em solid #ababab;
	border-radius: 0.25em;
	margin: 1em 0;
	padding: 1em;
	transition: 0.25s;
	white-space: pre;
}

.entry pre:hover {
	background: #343434;
	border: 0.25em solid whitesmoke;
}

.entry pre > code {
	background: whitesmoke;
	border: 0.1em solid #565656;
	margin: 0;
	padding: 0;
	white-space: pre;
}

.entry del,
.entry s {
	opacity: 0.7;
	transition: 0.1s;
}

.entry del:hover,
.entry s:hover {
	opacity: 0.9;
}

.entry table {
	border: 0.25em solid whitesmoke;
	border-collapse: collapse;
	border-radius: 0.25em;
	border-spacing: 0;
	margin-bottom: 1em;
	line-height: 1.25;
}

.entry table th,
.entry table td {
	border: 0.1em solid #ddd;
	padding: 0.5em;
	text-align: center;
}

.entry table th {
	background: rgba(255, 255, 255, 0.9);
	color: #232323;
}

.entry table td {
	background: rgba(35, 35, 35, 0.5);
}

.entry-content .hatena-asin-detail {
	background: rgba(35, 35, 35, 0.5);
	border: 0.25em solid whitesmoke;
	border-radius: 0.25em;
}



/*　脚注　*/

div.footnote {
	border-bottom: 0.1em solid whitesmoke;
	border-top: 0.1em solid whitesmoke;
	font-size: 0.9em;
	margin-top: 10em;
}

@keyframes footnote {
	from {border: 0.1em solid transparent;}
	to   {border: 0.1em solid gold;}
}

p.footnote.selected {
	animation: footnote 1s linear 0s infinite reverse;
}

.entry-content a[href^="#f-"][name^="fn-"]:hover::before {
	content: "";
	border-bottom: 0.75em solid gold;
	border-left: 0.75em solid transparent;
	border-right: 0.75em solid transparent;
	position: absolute;
	left: 50%;
	margin-left: -0.75em;
	margin-top: 1.25em;
	width: 0;
	height: 0;
	z-index: 130;
}

.entry-content a[href^="#f-"][name^="fn-"]:hover::after {
	content: attr(data-title);
	background: rgba(35, 35, 35, 0.9);
	border: 0.25em solid gold;
	border-radius: 0.25em;
	padding: 0.25em;
	position: absolute;
	left: -10em;
	margin-left: -0.25em;
	margin-top: 2.01em;
	width: 20em;
	z-index: 120;
}



/*　ライトボックス　*/

#cboxClose {
	display: none !important;
}

#cboxContent {
	width: auto !important;
	height: auto !important;
}

#cboxLoadedContent {
	background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAA0SURBVDhPY/wPBAx4wMmTJ6Es7IAJSpMNRg0YDAYwnjhxAm86MDc3h7Kwg9FAHAYGMDAAAKWlCnLYB+woAAAAAElFTkSuQmCC") scroll repeat left top !important;
	padding: 0 !important;
}

#cboxOverlay {
	opacity: 0.5 !important;
}



/*　記事下　*/

.entry-footer {
	margin-top: 1em;
}

.entry-footer-html {
	margin: 1em 0;
}

.entry-footer-html iframe {
	border-radius: 0;
}

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



/*　コメント周り　*/

.comment-box ul {
	list-style: none;
	margin: 0 0 15px 0;
	padding: 0;
	font-size: 0.9em;
}

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

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

.comment-box .read-more-comments {
	padding: 0.5em 0;
}

.comment-box .read-more-comments a {
	color: gold;
	font-weight: bold;
}

.comment-box .hatena-id-icon {
	background-clip: padding-box;
	border-radius: 0.25em;
	position: absolute;
	top: 10px;
	left: 0;
	width: 48px !important;
	height: 48px !important;
	transition: 0.5s;
}

.comment-box .hatena-id-icon:hover {
	transform: rotate(360deg);
}

.comment-user-name {
	margin: 0 0 10px 0;
	font-weight: bold;
}

.comment-content {
	font-size: 0.9em;
	margin: 0 0 10px 0;
	word-wrap: break-word;
}

.comment-content p {
	margin: 0 0 10px 0;
}

.comment-metadata {
	font-size: 0.8em;
	color: #999;
	margin: 0;
}

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

.leave-comment-title::before {
	content: "B";
	font-family: icon;
	font-size: 1.1em;
	font-weight: normal;
	margin-right: 0.25em;
}

.leave-comment-title {
	background: whitesmoke;
	border: 0.1em solid rgba(0, 0, 0, 0.25);
	border-radius: 0.25em;
	color: #565656;
	display: none;
	font-size: 0.9em;
	font-weight: bold;
	line-height: 1;
	margin: 0;
	padding: 5px 10px;
	text-align: center;
	text-decoration: none;
	text-shadow: none;
	transition: 0.25s;
	vertical-align: middle;
}

.leave-comment-title:hover {
	background: darkorange;
	color: whitesmoke;
}



/*　＜前｜次＞　*/

.pager {
	margin: -30.1px 0 0;
	padding: 0;
	width: 100%;
	height: 30px;
}

.pager .pager-prev,
.pager .pager-next {
	display: inline-block;
	margin: 0;
	padding: 0;
	width: 50%;
}

.pager .pager-prev {
	float: left;
}

.pager .pager-next {
	float: right;
}

.pager .pager-next::after {
	content: "";
	clear: both;
	display: block;
}

.pager .pager-prev a,
.pager .pager-next a {
	background: whitesmoke;
	color: #232323;
	display: block;
	font-size: 0.9em;
	font-weight: bold;
	line-height: 0;
	margin: 0;
	padding: 15px 0;
	text-align: center;
	text-decoration: none;
	text-shadow: none;
	transition: 0.25s;
	width: 100%;
	height: 100%;
}

.pager .pager-prev a:hover,
.pager .pager-next a:hover {
	background: midnightblue;
	color: whitesmoke;
}

.pager .pager-prev:only-of-type a {
	border-top-right-radius: 0.25em;
}

.pager .pager-next:only-of-type a {
	border-top-left-radius: 0.25em;
}

/*
.pager .pager-prev a::before {
	content: "ù";
	font-family: icon;
	margin-right: 0.25em;
}

.pager .pager-next a::after {
	content: "ú";
	font-family: icon;
	margin-left: 0.25em;
}
*/



/*　サイドバー　*/

.hatena-module {
	margin-bottom: 5em;
}

.hatena-module-title::before {
	font-family: CustomSymbol, sbx, icon;
	font-size: 1.25em;
	font-weight: normal;
	margin-right: 0.1em;
}

.hatena-module-title {
	font-size: 1.25em;
	font-weight: bold;
	margin-bottom: 1em;
}

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

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



/*　プロフィール　*/

#haricha_status {
	background: whitesmoke;
	border-radius: 0.5em;
	line-height: 1;
}

.hatena-module-profile .hatena-follow-button-box {
	text-shadow: none;
}

.hatena-module-profile .hatena-follow-button-box .subscription-count-box .subscription-count {
	font-family: Verdana;
	font-weight: bold;
}

.hatena-module-profile .hatena-module-title {
	text-align: center;
}

.hatena-module-profile .hatena-module-title::before {
	content: "↙";
	font-size: 1em;
	margin-right: 0.25em;
}

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

.hatena-module-profile .id a {
	color: gold;
}

.hatena-module-profile .profile-icon {
	float: left;
	margin: 0 10px 10px 0;
	border-radius: 5px;
	background-clip: padding-box;
}

.hatena-module-profile .profile-description {
	font-size: 0.9em;
}

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



/*　最新記事　*/

.hatena-module-recent-entries a {
	text-decoration: none;
}

.hatena-module-recent-entries .hatena-module-title::before {
	content: "I";
}

.hatena-module-recent-entries .recent-entries-category-link:not(:only-of-type):not(:last-of-type) {
	margin-right: 0.25em;
}

.hatena-module-recent-entries .recent-entries-category-link:not(:only-of-type):not(:last-of-type)::after {
	content: ",";
	color: whitesmoke;
	font-weight: bold;
	text-decoration: none;
}

.hatena-module-recent-entries .recent-entries-date-link::before {
	content: "【";
}

.hatena-module-recent-entries .recent-entries-date-link::after {
	content: "】";
}

.hatena-module-recent-entries .recent-entries-image-link {
	display: inline-block;
}

.hatena-module-recent-entries .recent-entries-image-link img {
	border-radius: 0.5em;
	margin: 0;
}

.hatena-module-recent-entries .recent-entries-title-link::before {
	content: "";
	display: block;
}



/*　URLリスト（リンク・最新記事・最近のコメント・月別アーカイブ・カテゴリ）　*/

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

.hatena-urllist li {
	border-bottom: 0.25em solid #ddd;
	padding: 0.5em 0;
}

.hatena-urllist li[data-year="2011"] {
	display: none;
}



/*　最近のコメント　*/

.hatena-module-recent-comments .hatena-module-title::before {
	content: "g";
}



/*　カテゴリ　*/

.hatena-module-category .hatena-module-title::before {
	content: "a";
}



/*　アーカイブ　*/

.hatena-module-archive .archive-module-button {
	opacity: 0.9 !important;
}

.hatena-module-archive .archive-module-show-button {
	color: white;
}

.hatena-module-archive .archive-module-hide-button {
	color: lime;
}

.hatena-module-archive[data-archive-type="calendar"] .hatena-module-title::before {
	content: "d";
}

.hatena-module-archive[data-archive-type="default"] .hatena-module-title::before {
	content: "M";
}

.js-archive-module-calendar-container table {
	background: rgba(35, 35, 35, 0.5);
}

.js-archive-module-calendar-container table th {
	background: rgba(255, 255, 255, 0.5);
}

.js-archive-module-calendar-container table th:first-of-type,
.js-archive-module-calendar-container table td:first-of-type {
	background: rgba(255, 102, 51, 0.25);
}

.js-archive-module-calendar-container table td.skeleton-td:first-of-type {
	background: rgba(255, 102, 51, 0.1);
}

.js-archive-module-calendar-container table th:last-of-type,
.js-archive-module-calendar-container table td:last-of-type:not(:only-of-type) {
	background: rgba(153, 204, 255, 0.25);
}

.js-archive-module-calendar-container table td.skeleton-td:last-of-type:not(:only-of-type) {
	background: rgba(153, 204, 255, 0.1);
}



/*　リンク　*/

.hatena-module-links .hatena-module-title::before {
	content: "Z";
}

.hatena-module-links a {
	vertical-align: middle;
}



/*　検索　*/

.hatena-module-search-box .search-form {
	margin: 0;
	padding: 0;
	width: 100%;
	position: relative;
}

.hatena-module-search-box .search-module-input {
	background: transparent;
	border: 0.25em solid whitesmoke;
	border-radius: 0.25em;
	color: whitesmoke;
	transition: 0.25s;
	width: 260px;
	height: 20px;
}

.hatena-module-search-box .search-module-input:hover {
	background: whitesmoke;
	color: #232323;
}

.hatena-module-search-box .search-module-button {
	background: url("//blog.hatena.ne.jp/images/theme/search.png") no-repeat right center;
	background-color: whitesmoke;
	border: 0;
	cursor: pointer;
	margin: 0;
	opacity: 1;
	outline: none;
	overflow: hidden;
	padding: 0;
	text-indent: -9999px;
	transition: 0.25s;
	position: absolute;
	right: -1px;
	top: 1px;
	width: 20px;
	height: 20px;
}

/*
.hatena-module-search-box .search-module-button:hover {
	background-color: orange;
	opacity: 1;
}
*/



/*　フッター　*/

#footer {
	color: #888;
	display: none;
	font-size: 0.8em;
	padding: 30px 0;
	text-align: center;
}

#footer p {
	margin: 0;
}

#footer a {
	color: #888;
}



/*　Aboutページ　*/

.page-about dt {
	font-size: 1em;
	font-weight: bold;
	border-bottom: 1px solid #dfdfdf;
	margin-bottom: 5px;
}

.page-about dd {
	margin-left: 0;
	margin-bottom: 30px;
}

.page-about .info a:hover {
	transform: scale(1.25);
}



/*　Archiveページ　*/

.page-archive .archive-entry {
	margin-bottom: 5em;
}

.page-archive .archive-entry .highlight {
	text-shadow: none;
}

.page-archive .archive-entry .entry-description {
	margin: 0 0 0.5em 1.5em;
}

.page-archive .archive-entry .entry-title {
	font-size: 1.25em;
	margin-bottom: 0;
}

.page-archive .archive-entry .entry-thumb {
	border-radius: 0.5em;
	margin: 0.5em 0 0.5em 1.5em;
	transition: 0.1s;
}

.page-archive .archive-entry .entry-thumb:hover {
	transform: scale(1.1);
}

.page-archive .search-result-form {
	background: whitesmoke;
	border-radius: 0.25em;
	box-shadow: 0 2px 2px aquamarine, 0 -2px 2px aquamarine;
	max-width: 285px;
}

.page-archive .search-result-form .search-result-button {
	cursor: pointer;
	top: 0.25em;
	right: 0.25em;
}

.page-archive .search-result-form .search-result-input {
	padding: 0.25em 20px 0.25em 0.25em;
	width: 100%;
}



/*　Retinaディスプレイ用　*/

@media (-webkit-min-device-pixel-ratio: 2) {
	.hatena-module-search-box .search-module-button {
		background: whitesmoke url("//blog.hatena.ne.jp/images/theme/search@2x.png") scroll no-repeat right center;
		background-size: 20px;
	}
}

/*
@media (min-width: 768px) and (max-width: 1024px) {
	#container {
		width: 724px;
	}

	#main {
		width: 460px;
	}

	#box2 {
		width: 245px;
	}
}


@media (max-width: 767px) {
	#globalheader-container {
		position: static;
	}

	#container {
		width: 93.75%;
		word-wrap: break-word;
		overflow: hidden;
	}

	#main {
		width: 100%;
		float: none;
	}

	#box2 {
		width: 100%;
		float: none;
	}

	#box2-inner {
		width: 100%;
	}

	.hatena-module {
		width: 100%;
		float: none;
	}

	.entry-header-menu {
		top: -30px;
		left: 0px;
	}
}
*/

@media (max-width: 480px) {
	/* 未定 */
}