@charset "utf-8";

/*  import normalize */
/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
img,
legend {
	border: 0
}

legend,
td,
th {
	padding: 0
}

html {
	font-family: sans-serif;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%
}

body {
	margin: 0
}

.clearfix,
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
	display: block
}

audio,
canvas,
progress,
video {
	display: inline-block;
	vertical-align: baseline
}

audio:not([controls]) {
	display: none;
	height: 0
}

[hidden],
template {
	display: none
}

a {
	background: 0 0
}

a:active,
a:hover {
	outline: 0
}

abbr[title] {
	border-bottom: 1px dotted
}

b,
optgroup,
strong {
	font-weight: 700
}

dfn {
	font-style: italic
}

h1 {
	font-size: 2em;
	margin: .67em 0
}

mark {
	background: #ff0;
	color: #000
}

small {
	font-size: 80%
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline
}

sup {
	top: -.5em
}

sub {
	bottom: -.25em
}

svg:not(:root) {
	overflow: hidden
}

figure {
	margin: 1em 40px
}

hr {
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	height: 0
}

pre,
textarea {
	overflow: auto
}

code,
kbd,
pre,
samp {
	font-family: monospace, monospace;
	font-size: 1em
}

button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0
}

button {
	overflow: visible
}

button,
select {
	text-transform: none
}

button,
html input[type=button],
input[type=reset],
input[type=submit] {
	-webkit-appearance: button;
	cursor: pointer
}

button[disabled],
html input[disabled] {
	cursor: default
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0
}

input {
	line-height: normal
}

input[type=checkbox],
input[type=radio] {
	box-sizing: border-box;
	padding: 0
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
	height: auto
}

input[type=search] {
	-webkit-appearance: textfield;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
	-webkit-appearance: none
}

fieldset {
	border: 1px solid silver;
	margin: 0 2px;
	padding: .35em .625em .75em
}

table {
	border-collapse: collapse;
	border-spacing: 0
}

.clearfix:after {
	display: block;
	visibility: hidden;
	font-size: 0;
	height: 0;
	clear: both;
	content: "."
}

.inline-block {
	display: inline-block
}

.ellipsis {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden
}

/*  import variable */
/* Common */
html,
body {
	font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'Hiragino Kaku Gothic Pro', 'Meiryo', 'MS PGothic', sans-serif;
	color: #454545;
	background-color: #ffffff;
}

a {
	color: #132b6e;
	-webkit-transition: all .3s;
	transition: all .3s;
}

a:visited {
	color: #132b6e;
}

a:hover {
	color: #0f5373;
	-webkit-transition: all .3s;
	transition: all .3s;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a,
h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover,
h1 a:visited,
h2 a:visited,
h3 a:visited,
h4 a:visited,
h5 a:visited,
h6 a:visited {
	color: #333333;
	text-decoration: none;
}

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

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

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

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

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

/* ヘッダ（グローバルヘッダ）
  グローバルヘッダの中はiframeですが、
  #globalheader-container に背景色や文字色を指定することでiframeの中にも色が反映されます。
*/
#globalheader-container {
	background-color: #333;
	color: #fff;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
}

/* container */
#container {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 30px;
	padding-top: 37px;
}

#container #content {
	width: 1020px;
	margin: 0 auto;
	display: block;
	*zoom: 1;
}

#container #content:after {
	display: block;
	visibility: hidden;
	font-size: 0;
	height: 0;
	clear: both;
	content: ".";
}

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

/* 2カラムレイアウト */
#main {
	width: 680px;
	float: left;
}

#box2 {
	width: 320px;
	float: right;
}

/* header */
#blog-title {
	margin: 4px 0 0;
	padding: 20px 0 16px;
	/*padding: 40px 0 30px;*/
	text-align: center;
}

#title {
	margin: 0;
}

#title a {
	color: #132b6e;
	font-size: 130%;
}

#blog-description {
	font-weight: normal;
	font-size: 80%;
	margin: 5px 0 0 0;
	color: #132b6e;
}

/* ヘッダ画像を設定したとき */
.header-image-enable #title {
	padding-top: 70px;
}

.header-image-enable #title,
.header-image-enable #blog-description {
	padding-left: 20px;
}

/* パンくず（カテゴリーページで表示されます） */
#top-box {
	margin: 10px auto 20px;
	font-size: 90%;
}

#top-box .breadcrumb {
	border: 1px solid #dddddd;
	padding: 10px;
}

/* entry */
.entry {
	position: relative;
	margin-bottom: 100px;
}

.entry-header {
	padding: 0 0 10px 0;
	margin-bottom: 20px;
	border-bottom: 1px solid #dddddd;
	position: relative;
}

.entry-title {
	margin: 0;
	line-height: 1.3;
	font-size: 160%;
}

/* 日付 */
.date {
	font-weight: bold;
	margin-bottom: 10px;
}

.date a {
	padding: 2px 6px;
	background-color: #132b6e;
	color: #fff;
	text-decoration: none;
	font-size: 90%;
}

/* カテゴリ */
.categories {
	margin: 20px 0;
	font-size: 80%;
}

.categories a {
	padding: 2px 6px;
	text-decoration: none;
	color: #333;
	background-color: #dfe5f8;
}

.categories.no-categories {
	margin: 0;
}

/* 「編集する」ボタン */
.entry-header-menu {
	position: absolute;
	bottom: 0px;
	left: -60px;
}

.entry-header-menu a {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	padding: 4px 10px 4px;
	margin-bottom: 0;
	line-height: 18px;
	color: #454545;
	background-color: #ffffff;
	text-align: center;
	vertical-align: middle;
	border-top-right-radius: 2px;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	border-top-left-radius: 0;
	border-radius: 2px;
	background-clip: padding-box;
	cursor: pointer;
	font-size: 12px;
	text-decoration: none;
	font-weight: bold;
	border: 1px solid rgba(0, 0, 0, 0.2);
	text-decoration: none !important;
}

.entry-header-menu a:hover {
	background-color: #f5f5f5;
	text-decoration: none !important;
}

/* entry-content の中の書式 */
.entry-content {
	font-size: 95%;
	line-height: 1.7;
	padding-bottom: 10px;
	border-bottom: 1px solid #dddddd;
}

.entry-content p {
	margin: 0 0 1em 0;
}

.entry-content img {
	max-width: 100%;
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
	margin: 1.3em 0 0.8em 0;
	line-height: 1.5;
}

.entry-content h1 {
	font-size: 160%;
}

.entry-content h2 {
	padding: 4px 10px;
	font-size: 150%;
	background-color: #132b6e;
	color: #fff;
}

.entry-content h3 {
	padding: 8px 10px;
	position: relative;
	font-size: 140%;
	line-height: 1.3;
	color: #132b6e;
	z-index: 1;
	border: 2px solid #132b6e;
	border-radius: 2px;
}

.entry-content h3::before,
.entry-content h3::after {
	content: "";
	position: absolute;
	top: 100%;
}

.entry-content h3::before {
	border: 11px solid transparent;
	border-top: 11px solid #132b6e;
	left: 27px;
}

.entry-content h3::after {
	border: 8px solid transparent;
	border-top: 8px solid #fff;
	left: 30px;
}

.entry-content h4 {
	padding: 4px 10px;
	font-size: 130%;
	border-top: 1px solid #132b6e;
	border-bottom: 1px solid #132b6e;
}

.entry-content h5 {
	font-size: 110%;
}

.entry-content h6 {
	font-size: 100%;
}

.entry-content table {
	border-collapse: collapse;
	border-spacing: 0;
	margin-bottom: 1em;
}

.entry-content table img {
	max-width: none;
}

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

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

.entry-content blockquote {
	border: 1px solid #dddddd;
	margin: 0 0 10px;
	padding: 20px;
}

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

.entry-content pre {
	border: 1px solid #dddddd;
	margin: 0 0 10px;
	padding: 20px;
	white-space: pre;
}

.entry-content pre > code {
	margin: 0;
	padding: 0;
	white-space: pre;
	border: 0;
	background: transparent;
	font-family: 'Monaco', 'Consolas', 'Courier New', Courier, monospace, sans-serif;
}

.entry-content code {
	font-size: 90%;
	margin: 0 2px;
	padding: 0 5px;
	border: 1px solid #eaeaea;
	background-color: #f8f8f8;
	border-radius: 3px;
	font-family: 'Monaco', 'Consolas', 'Courier New', Courier, monospace, sans-serif;
}

.entry-content .hatena-asin-detail li {
	line-height: 1.4;
}

/* entry-footer */
.entry-footer {
	margin-top: 10px;
}

.entry-footer-section {
	font-size: 80%;
	color: #999999;
}

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

.social-buttons,
.entry-footer-html {
	margin: 10px 0;
}

/* コメント */
.comment-box ul {
	list-style: none;
	margin: 0 0 15px 0;
	padding: 0;
	font-size: 95%;
	line-height: 1.7;
}

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

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

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

.comment-box .hatena-id-icon {
	position: absolute;
	top: 10px;
	left: 0;
	width: 50px !important;
	height: 50px !important;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	border-top-left-radius: 0;
	border-radius: 3px;
	background-clip: padding-box;
}

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

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

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

.comment-metadata {
	font-size: 80%;
	color: #999999;
	margin: 0;
}

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

.leave-comment-title {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	padding: 4px 10px 4px;
	margin-bottom: 0;
	line-height: 18px;
	color: #454545;
	background-color: #ffffff;
	text-align: center;
	vertical-align: middle;
	border-top-right-radius: 2px;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	border-top-left-radius: 0;
	border-radius: 2px;
	background-clip: padding-box;
	cursor: pointer;
	font-size: 12px;
	text-decoration: none;
	font-weight: bold;
	border: 1px solid rgba(0, 0, 0, 0.2);
	text-decoration: none !important;
}

.leave-comment-title:hover {
	background-color: #f5f5f5;
	text-decoration: none !important;
}

/* sidebar */
#box2 {
	font-size: 85%;
	line-height: 1.5;
}

.hatena-module {
	margin-bottom: 60px;
}

.hatena-module-title {
	font-weight: bold;
	margin-bottom: 15px;
	padding: 4px 0;
	font-size: 120%;
	text-align: center;
	border-bottom: 2px solid #132b6e;
}

.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;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	border-top-left-radius: 0;
	border-radius: 5px;
	background-clip: padding-box;
}

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

.hatena-module-profile .profile-description {
	font-size: 90%;
}

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

/* urllist module
    リンク・最新記事・最近のコメント・月別アーカイブ・カテゴリモジュールは .hatena-urllist という共通の class が振られます
*/
.hatena-urllist {
	list-style: none;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

.hatena-urllist li {
	padding: 8px 0;
	border-bottom: 1px solid #dddddd;
	line-height: 1.5;
}

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

.hatena-module-category .hatena-urllist {
	font-size: 0;
}

.hatena-module-category .hatena-urllist li {
	display: inline-block;
	padding: 0;
	margin: 0 6px 6px 0;
	border: none;
}

.hatena-module-category .hatena-urllist li a {
	background-color: #e4eafb;
	display: block;
	color: #132b6e;
	padding: 4px 10px;
	font-size: 13px;
}

/* Search module */
.hatena-module-search-box .search-form {
	border: 1px solid #dddddd;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	border-top-left-radius: 0;
	border-radius: 3px;
	background-clip: padding-box;
	width: 100%;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	position: relative;
}

.hatena-module-search-box .search-module-input {
	padding: 5px;
	color: #454545;
	background: none;
	border: none;
	outline: none;
	height: 20px;
	width: 90%;
}

.hatena-module-search-box .search-module-button {
	width: 20px;
	height: 20px;
	background: transparent url(https://cdn.blog.st-hatena.com/images/theme/search.png?version=d521df40822702b2798181e2322e97) no-repeat right center;
	border: none;
	outline: none;
	text-indent: -9999px;
	position: absolute;
	top: 5px;
	right: 5px;
	opacity: 0.5;
}

.hatena-module-search-box .search-module-button:hover {
	opacity: 0.85;
}

/* Pager */
.pager {
	margin: 1em 0;
	display: block;
	*zoom: 1;
}

.pager:after {
	display: block;
	visibility: hidden;
	font-size: 0;
	height: 0;
	clear: both;
	content: ".";
}

.pager .pager-prev {
	float: left;
	text-align: left;
	width: 45%;
}

.pager .pager-next {
	float: right;
	text-align: right;
	width: 45%;
}

/* Footer */
#footer {
	padding: 40px 0;
	text-align: center;
	background-color: #132b6e;
	color: #fff;
	line-height: 1.5;
	font-size: 80%;
}

#footer p {
	margin: 0;
}

#footer a {
	color: #fff;
}

/* About ページ */
.page-about dt {
	font-size: 16px;
	font-weight: bold;
	border-bottom: 1px solid #dfdfdf;
	margin-bottom: 5px;
}

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

/* archive ページ */
.page-archive .archive-entries .archive-entry {
	margin-bottom: 3em;
}

.page-archive .archive-entries .entry-title {
	font-size: 130%;
	margin: 0 0 .5em;
}

.page-archive .archive-entries .categories {
	margin: 0 0 .5em;
}

.page-archive .archive-entries .entry-description {
	margin: 0 0 1em;
	line-height: 1.7em;
	font-size: 95%;
}

.page-archive .categories a {
	color: #fff;
	font-size: 70%;
	background: #aaa;
	padding: 3px 5px;
	border-radius: 3px;
	text-decoration: none;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	margin-right: 2px;
}

/*=========================
  recommend-entries
==========================*/
#recommend-entries {
	display: block;
	margin: 0 0 40px 0;
	background-color: #d8dbe5;
	padding: 20px 0;
}

#recommend-entries .hatena-module {
	margin-bottom: 0;
}

#recommend-entries .entries-access-ranking {
	width: 1200px;
	margin: 0 auto;
	font-size: 0;
}

@media screen and (max-width: 1200px) {
	#recommend-entries .entries-access-ranking {
		width: 1020px;
	}
}

#recommend-entries .entries-access-ranking li {
	display: inline-block;
	position: relative;
	width: 19.4%;
	height: 160px;
	margin: 0 0.6% 0 0;
	padding: 0;
	font-size: 14px;
	overflow: hidden;
}

#recommend-entries .entries-access-ranking li a {
	font-size: 14px;
}

#recommend-entries .entries-access-ranking li .urllist-title-link {
	position: absolute;
	display: block;
	top: 50%;
	left: 0;
	padding: 0 12px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	color: #fff;
	z-index: 10;
	overflow: hidden;
}

#recommend-entries .urllist-with-thumbnails li .urllist-image-link {
	position: relative;
	display: block;
	z-index: 1;
	width: 100%;
	text-align: center;
}

#recommend-entries .urllist-with-thumbnails li .urllist-image {
	width: auto;
	height: 100%;
	float: none;
}

#recommend-entries .urllist-with-thumbnails li .bookmark-widget-counter {
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 10;
}

#recommend-entries .urllist-with-thumbnails li .urllist-image-link::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #091947;
	opacity: .7;
	-webkit-transition: all .3s;
	transition: all .3s;
	z-index: 2;
}

#recommend-entries .entries-access-ranking li:hover .urllist-image-link::before {
	-webkit-transition: all .3s;
	transition: all .3s;
	opacity: .5;
}

#recommend-entries .urllist-with-thumbnails li .urllist-image-link:hover {}

/* Media Queries - Tablet */
@media screen and (max-width: 1024px) {
	#recommend-entries .entries-access-ranking {
		width: 100%;
	}

	#recommend-entries .entries-access-ranking li {
		width: 20%;
		margin: 0;
	}

	#recommend-entries .entries-access-ranking li a {
		font-size: 12px;
	}
}

@media screen and (max-width: 980px) {
	#recommend-entries .entries-access-ranking li:last-child {
		display: none;
	}

	#recommend-entries .entries-access-ranking li {
		width: 25%;
	}
}

@media screen and (max-width: 780px) {
	#recommend-entries .entries-access-ranking li:nth-child(4) {
		display: none;
	}

	#recommend-entries .entries-access-ranking li {
		width: 33.3333%;
	}
}

@media screen and (max-width: 480px) {
	#recommend-entries .entries-access-ranking li:nth-child(3) {
		display: none;
	}

	#recommend-entries .entries-access-ranking li {
		width: 50%;
	}
}

/*=========================
  global-nav
==========================*/
#global-nav {
	width: 100%;
	background-color: #132b6e;
	height: 40px;
}

.global-nav-list {
	width: 1020px;
	height: 40px;
	margin: 0 auto;
	padding: 0;
	background-color: #132b6e;
	list-style: none;
	text-align: center;
	font-size: 0;
}

.global-nav-list li {
	display: inline-block;
	height: 40px;
	font-size: 14px;
}

.global-nav-list li a {
	position: relative;
	display: block;
	min-width: 80px;
	padding: 0 20px;
	color: #fff;
	text-decoration: none;
	line-height: 40px;
}

.global-nav-list li a:hover {
	background-color: #fff;
	color: #132b6e;
}

.global-nav-list li a:after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 0;
	height: 4px;
	z-index: 2;
	background-color: #132b6e;
	-webkit-transition: all .3s;
	transition: all .3s;
}

.global-nav-list li a:hover:after {
	width: 80%;
	left: 10%;
	-webkit-transition: all .3s;
	transition: all .3s;
}

#global-nav.fixed {
	top: 0;
	left: 0;
	z-index: 100;
}

@media screen and (max-width: 780px) {
	.global-nav-list li a {
		min-width: 60px;
		padding: 0 14px;
	}
}

@media screen and (max-width: 480px) {
	.global-nav-list li a {
		min-width: 0px;
		padding: 0 12px;
	}
}

/*=========================
  share-button
==========================*/
.share-area {
	margin: 20px 0;
}

.share-button {
	font-size: 0;
}

.share-button a {
	position: relative;
	display: inline-block;
	font-size: 14px;
	width: 19.5%;
	margin-right: 0.5%;
	padding-left: 36px;
	height: 36px;
	background-color: #888;
	color: #fff;
	text-decoration: none;
	text-align: center;
	vertical-align: bottom;
	line-height: 36px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.share-button a:hover {
	opacity: 0.8;
}

.share-button i:not(.fa-spin) {
	position: absolute;
	left: 0;
	top: 0;
	width: 36px;
	height: 36px;
	line-height: 36px;
	font-size: 20px;
	background-color: #333;
}

.share-button .share-text {
	font-size: 12px;
	margin-left: 4px;
}

.share-button .hatena-bookmark-button {
	background-color: #429dd1;
}

.share-button .hatena-bookmark-button i:not(.fa-spin) {
	background-color: #2e85b7;
}

.share-button .facebook-button {
	background-color: #485ecc;
}

.share-button .facebook-button i:not(.fa-spin) {
	background-color: #354ab0;
}

.share-button .twitter-button {
	background-color: #68aaee;
}

.share-button .twitter-button i:not(.fa-spin) {
	background-color: #4c91d8;
}

.share-button .googleplus-button {
	background-color: #c6242b;
}

.share-button .googleplus-button i:not(.fa-spin) {
	background-color: #ab1d24;
}

.share-button .pocket-button {
	background-color: #ee4256;
}

.share-button .pocket-button i:not(.fa-spin) {
	background-color: #d5384a;
}

@media screen and (max-width:580px) {

	.share-button .googleplus-button,
	.share-button .pocket-button {
		width: 36px;
		overflow: hidden;
	}

	.share-button .hatena-bookmark-button,
	.share-button .twitter-button,
	.share-button .facebook-button {
		width: 24%;
	}
}

/*=========================
  記事上リンク
==========================*/
.emphasize-link-top {
	position: relative;
	margin: 36px 0 16px;
	padding: 8px 10px 16px;
	border: 2px solid #333;
	background-color: #fafafa;
}

.emphasize-link-top p:last-child {
	margin-bottom: 0;
}

.emphasize-link-top::before {
	position: absolute;
	bottom: 100%;
	left: -2px;
	padding: 4px 10px;
	content: "Pick Up!!";
	font-size: 14px;
	background-color: #333;
	color: #fff;
	font-weight: bold;
}

/*=========================
  share-button
==========================*/
.follow-btn {
	width: 100%;
}

.follow-btn a {
	position: relative;
	display: block;
	width: 100%;
	height: 40px;
	line-height: 40px;
	margin-bottom: 2px;
	font-size: 16px;
	font-weight: bold;
	text-decoration: none;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.follow-btn a i {
	position: absolute;
	left: 50px;
	top: 50%;
	line-height: 20px;
	margin-top: -8px;
}

.follow-btn a .lg {
	font-size: 22px;
}

.follow-btn a .blogicon-hatenablog,
.follow-btn a .blogicon-twitter {
	font-size: 26px;
	margin-top: -10px;
}

.follow-btn a::before {
	font-family: "blogicon";
	content: "\f001";
	position: absolute;
	font-size: 10px;
	left: 12px;
	top: 0px;
}

.follow-btn .hatena {
	color: #3D3F44;
	border: 1px solid #3D3F44;
	background: #ffffff;
}

.follow-btn .twitter {
	color: #00ACEE;
	border: 1px solid #00ACEE;
	background: #ffffff;
}

.follow-btn .feedly {
	color: #70CA3B;
	border: 1px solid #70CA3B;
	background: #ffffff;
}

.follow-btn .hatena:hover {
	color: #ffffff;
	background: #3D3F44;
	transition: all .3s;
}

.follow-btn .twitter:hover {
	color: #ffffff;
	background: #00ACEE;
	transition: all .3s;
}

.follow-btn .feedly:hover {
	color: #ffffff;
	background: #70CA3B;
	transition: all .3s;
}

.follow-btn .text-small {
	margin-left: 120px;
}

/*  import media queries */
/* Media Queries - Retina Display */
@media (-webkit-min-device-pixel-ratio: 2) {
	.hatena-module-search-box .search-module-button {
		background: transparent url(https://cdn.blog.st-hatena.com/images/theme/search@2x.png?version=d521df40822702b2798181e2322e97) no-repeat right center;
		background-size: 20px 20px;
	}
}

/* Media Queries - Tablet */
@media screen and (max-width: 1024px) {
	#container #content {
		width: 93.75%;
		word-wrap: break-word;
		overflow: hidden;
		padding-top: 0;
	}

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

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

	#box2-inner {
		width: 100%;
	}

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

	.global-nav-list {
		width: 93.75%;
	}
}

/* Media Queries - Small Tablet & Smartphone */
@media (max-width: 767px) {
	#globalheader-container {
		position: static;
	}

	#container #content {
		width: 98%;
	}

	.global-nav-list {
		width: 98%;
	}

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

/* Media Queries - Smartphone */
/* =============================================

ここまで shiroma

=============================================== */

.entry-content .emphasize-link {
	position: relative;
	margin: 36px 0 16px;
	padding: 16px 10px;
	border: 2px solid #b63737;
	background-color: #fffbf5;
}

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

.entry-content .emphasize-link::before {
	position: absolute;
	bottom: 100%;
	left: -2px;
	padding: 2px 6px;
	content: "あわせて読みたい";
	background-color: #b63737;
	color: #fff;
	font-weight: bold;
}

#manubar {
	width: 100%;
}

#menubar ul {
	display: table;
	width: 100%;
	margin: 0;
	padding: 0;
	background-color: #FFFFFF;
}

#menubar li {
	display: table-cell;
	width: 25%;
	padding: 0;
	background-color: #87cefa;
}

#menubar li a {
	display: block;
	margin: 0 auto;
	padding: 5px;
	border: 1px solid #FFFFFF;
	text-decoration: none;
	color: #FFFFFF;
	text-align: center;
	font-size: 18px;
}

#menubar li a:hover {
	background-color: #87cefa;
}

/*--------------------------------------
  ヨメレバ・カエレバ・トマレバ（PC版CSS）
--------------------------------------*/

	{
	width: 98%;
	height: auto;
	margin: 36px 0;
	font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', Helvetica, Meiryo, sans-serif;
	line-height: 1.5;
	word-wrap: break-word;
	box-sizing: border-box;
	display: block;
}

a {
	transition: 0.8s;
	color: #285EFF;
	/* テキストリンクカラー */
}

a:hover {
	color: #FFCA28;
	/* テキストリンクカラー(マウスオーバー時) */
}

.booklink-box,
.kaerebalink-box,
.tomarebalink-box {
	width: 100%;
	background-color: #fff;
	/* 全体の背景カラー */
	overflow: hidden;
	border: double #d2d7e6;
	border-radius: 5px;
	box-sizing: border-box;
	padding: 12px 8px;
}

/* サムネイル画像ボックス */
.booklink-image,
.kaerebalink-image,
.tomarebalink-image {
	width: 150px;
	float: left;
	margin: 0 14px 0 0;
	text-align: center;
}

.booklink-image a,
.kaerebalink-image a,
.tomarebalink-image a {
	width: 100%;
	display: block;
}

/* サムネイル画像 */
.booklink-image a img,
.kaerebalink-image a img,
.tomarebalink-image a img {
	margin: 0;
	padding: 0;
	text-align: center;
}

.booklink-info,
.kaerebalink-info,
.tomarebalink-info {
	overflow: hidden;
	line-height: 170%;
	color: #333;
}

/* infoボックス内リンク下線非表示 */
.booklink-info a,
.kaerebalink-info a,
.tomarebalink-info a {
	text-decoration: none;
}

/* 作品・商品・ホテル名 リンク */
.booklink-name > a,
.kaerebalink-name > a,
.tomarebalink-name > a {
	border-bottom: 1px dotted;
	font-size: 16px;
}

/* タイトル下にPタグ自動挿入された際の余白を小さく */
.kaerebalink-name p,
.booklink-name p,
.tomarebalink-name p {
	margin: 0;
}

/* powered by */
.booklink-powered-date,
.kaerebalink-powered-date,
.tomarebalink-powered-date {
	font-size: 10px;
	line-height: 150%;
}

.booklink-powered-date a,
.kaerebalink-powered-date a,
.tomarebalink-powered-date a {
	border-bottom: 1px dotted;
	color: #333;
}

.booklink-powered-date a:hover,
.kaerebalink-powered-date a:hover,
.tomarebalink-powered-date a:hover {
	color: #333;
}

/* 著者・住所 */
.booklink-detail,
.kaerebalink-detail,
.tomarebalink-address {
	font-size: 12px;
}

.kaerebalink-link1 img,
.booklink-link2 img,
.tomarebalink-link1 img {
	display: none !important;
}

.kaerebalink-link1,
.booklink-link2,
.tomarebalink-link1 {
	display: inline-block;
	width: 100%;
	margin-top: 5px;
}

.booklink-link2 > div,
.kaerebalink-link1 > div,
.tomarebalink-link1 > div {
	float: left;
	width: 31%;
	min-width: 125px;
	margin: 0.5% 1%;
}

/***** ボタンデザインここから ******/
.booklink-link2 a,
.kaerebalink-link1 a,
.tomarebalink-link1 a {
	width: 100%;
	display: inline-block;
	text-align: center;
	box-sizing: border-box;
	font-size: 13px;
	font-weight: bold;
	line-height: 180%;
	padding: 3% 1%;
	margin: 1px 0;
	border-radius: 4px;
	box-shadow: 0 2px 0 #ccc;
	background: -moz-linear-gradient(top, #fafafa, #EEE);
	background: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#eee));
}

.booklink-link2 a:hover,
.kaerebalink-link1 a:hover,
.tomarebalink-link1 a:hover {
	text-decoration: underline;
}

/* トマレバ */
.tomarebalink-link1 .shoplinkrakuten a {
	color: #76ae25;
}

/* 楽天トラベル */
.tomarebalink-link1 .shoplinkjalan a {
	color: #ff7a15;
}

/* じゃらん */
.tomarebalink-link1 .shoplinkjtb a {
	color: #c81528;
}

/* JTB */
.tomarebalink-link1 .shoplinkknt a {
	color: #0b499d;
}

/* KNT */
.tomarebalink-link1 .shoplinkikyu a {
	color: #bf9500;
}

/* 一休 */
.tomarebalink-link1 .shoplinkrurubu a {
	color: #000066;
}

/* るるぶ */
.tomarebalink-link1 .shoplinkyahoo a {
	color: #ff0033;
}

/* Yahoo!トラベル */
/* カエレバ */
.kaerebalink-link1 .shoplinkyahoo a {
	color: #ff0033;
	letter-spacing: normal;
}

/* Yahoo!ショッピング */
.kaerebalink-link1 .shoplinkbellemaison a {
	color: #84be24;
}

/* ベルメゾン */
.kaerebalink-link1 .shoplinkcecile a {
	color: #8d124b;
}

/* セシール */
.kaerebalink-link1 .shoplinkkakakucom a {
	color: #314995;
}

/* 価格コム */
/* ヨメレバ */
.booklink-link2 .shoplinkkindle a {
	color: #007dcd;
}

/* Kindle */
.booklink-link2 .shoplinkrakukobo a {
	color: #d50000;
}

/* 楽天kobo */
.booklink-link2 .shoplinkbk1 a {
	color: #0085cd;
}

/* honto */
.booklink-link2 .shoplinkehon a {
	color: #2a2c6d;
}

/* ehon */
.booklink-link2 .shoplinkkino a {
	color: #003e92;
}

/* 紀伊國屋書店 */
.booklink-link2 .shoplinkebj a {
	color: #333333;
}

/* 図書館 */
/* カエレバ・ヨメレバ共通 */
.kaerebalink-link1 .shoplinkamazon a,
.booklink-link2 .shoplinkamazon a {
	color: #FF9901;
}

/* Amazon */
.kaerebalink-link1 .shoplinkrakuten a,
.booklink-link2 .shoplinkrakuten a {
	color: #c20004;
}

/* 楽天 */
.kaerebalink-link1 .shoplinkseven a,
.booklink-link2 .shoplinkseven a {
	color: #225496;
}

/* 7net */
/***** ボタンデザインここまで ******/
.booklink-footer {
	clear: both;
}


/*目次カスタマイズ*/
.table-of-contents {
	border: 1px solid #e4e4e4;
	padding: 20px 10px 20px 40px;
	list-style-type: decimal;
	border-radius: 5px;
	font-size: 90%;
}

.table-of-contents:before {
	content: "目次";
	font-size: 120%;
}

.table-of-contents li,
.table-of-contents ul {
	list-style-type: decimal;
}

.table-of-contents {
	display: none;
}

.show-area {
	display: inline-block;
	padding: 10px;
	border-radius: 5px;
	cursor: pointer;
	margin-bottom: 0;
	color: blue;
}

div#appreach-box {
	max-width: 500px;
	border: 1px solid #CCC;
	border-radius: 3px;
	margin: 10px;
	font-size: 14px;
}

#appreach-box br {
	display: none;
}


/*--------------------------------------
  ヨメレバ・カエレバ・トマレバ（amazlet風-1(改)）
--------------------------------------*/

.booklink-box {
	width: 98%;
	height: auto;
	margin: 36px 0;
	font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', Helvetica, Meiryo, sans-serif;
	line-height: 1.5;
	word-wrap: break-word;
	box-sizing: border-box;
	display: block;
}

.booklink-box a {
	transition: 0.8s;
	color: #285EFF;
	/* テキストリンクカラー */
}

.booklink-box a:hover {
	color: #FFCA28;
	/* テキストリンクカラー(マウスオーバー時) */
}

.booklink-box,
.kaerebalink-box,
.tomarebalink-box {
	width: 100%;
	background-color: #fff;
	/* 全体の背景カラー */
	overflow: hidden;
	border: double #d2d7e6;
	border-radius: 5px;
	box-sizing: border-box;
	padding: 12px 8px !important;
}

/* サムネイル画像ボックス */
.booklink-image,
.kaerebalink-image,
.tomarebalink-image {
	width: 150px;
	float: left;
	margin: 0 14px 0 0 !important;
	text-align: center;
}

.booklink-image a,
.kaerebalink-image a,
.tomarebalink-image a {
	width: 100%;
	display: block;
}

/* サムネイル画像 */
.booklink-image a img,
.kaerebalink-image a img,
.tomarebalink-image a img {
	margin: 0;
	padding: 0;
	text-align: center;
}

.booklink-info,
.kaerebalink-info,
.tomarebalink-info {
	overflow: hidden;
	line-height: 170% !important;
	color: #333;
}

/* infoボックス内リンク下線非表示 */
.booklink-info a,
.kaerebalink-info a,
.tomarebalink-info a {
	text-decoration: none;
}

/* 作品・商品・ホテル名 リンク */
.booklink-name > a,
.kaerebalink-name > a,
.tomarebalink-name > a {
	border-bottom: 1px dotted;
	font-size: 16px;
}

/* タイトル下にPタグ自動挿入された際の余白を小さく */
.kaerebalink-name p,
.booklink-name p,
.tomarebalink-name p {
	margin: 0 !important;
}

/* powered by */
.booklink-powered-date,
.kaerebalink-powered-date,
.tomarebalink-powered-date {
	font-size: 10px;
	line-height: 150%;
}

.booklink-powered-date a,
.kaerebalink-powered-date a,
.tomarebalink-powered-date a {
	border-bottom: 1px dotted;
	color: #333;
}

.booklink-powered-date a:hover,
.kaerebalink-powered-date a:hover,
.tomarebalink-powered-date a:hover {
	color: #333;
}

/* 著者・住所 */
.booklink-detail,
.kaerebalink-detail,
.tomarebalink-address {
	font-size: 12px;
}

.kaerebalink-link1 img,
.booklink-link2 img,
.tomarebalink-link1 img {
	display: none !important;
}

.kaerebalink-link1,
.booklink-link2,
.tomarebalink-link1 {
	display: inline-block;
	width: 100%;
	margin-top: 5px !important;
}

.booklink-link2 > div,
.kaerebalink-link1 > div,
.tomarebalink-link1 > div {
	float: left;
	width: 31%;
	min-width: 125px !important;
	margin: 0.5% 1% !important;
}

/***** ボタンデザインここから ******/
.booklink-link2 a,
.kaerebalink-link1 a,
.tomarebalink-link1 a {
	width: 100%;
	display: inline-block;
	text-align: center;
	box-sizing: border-box;
	font-size: 13px;
	font-weight: bold;
	line-height: 180%;
	padding: 3% 1%;
	margin: 1px 0;
	border-radius: 4px;
	box-shadow: 0 2px 0 #ccc;
	background: -moz-linear-gradient(top, #fafafa, #EEE);
	background: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#eee));
}

.booklink-link2 a:hover,
.kaerebalink-link1 a:hover,
.tomarebalink-link1 a:hover {
	text-decoration: underline;
}

/* トマレバ */
.tomarebalink-link1 .shoplinkrakuten a {
	color: #76ae25;
}

/* 楽天トラベル */
.tomarebalink-link1 .shoplinkjalan a {
	color: #ff7a15;
}

/* じゃらん */
.tomarebalink-link1 .shoplinkjtb a {
	color: #c81528;
}

/* JTB */
.tomarebalink-link1 .shoplinkknt a {
	color: #0b499d;
}

/* KNT */
.tomarebalink-link1 .shoplinkikyu a {
	color: #bf9500;
}

/* 一休 */
.tomarebalink-link1 .shoplinkrurubu a {
	color: #000066;
}

/* るるぶ */
.tomarebalink-link1 .shoplinkyahoo a {
	color: #ff0033;
}

/* Yahoo!トラベル */
/* カエレバ */
.kaerebalink-link1 .shoplinkyahoo a {
	color: #ff0033;
	letter-spacing: normal;
}

/* Yahoo!ショッピング */
.kaerebalink-link1 .shoplinkbellemaison a {
	color: #84be24;
}

/* ベルメゾン */
.kaerebalink-link1 .shoplinkcecile a {
	color: #8d124b;
}

/* セシール */
.kaerebalink-link1 .shoplinkkakakucom a {
	color: #314995;
}

/* 価格コム */
/* ヨメレバ */
.booklink-link2 .shoplinkkindle a {
	color: #007dcd;
}

/* Kindle */
.booklink-link2 .shoplinkrakukobo a {
	color: #d50000;
}

/* 楽天kobo */
.booklink-link2 .shoplinkbk1 a {
	color: #0085cd;
}

/* honto */
.booklink-link2 .shoplinkehon a {
	color: #2a2c6d;
}

/* ehon */
.booklink-link2 .shoplinkkino a {
	color: #003e92;
}

/* 紀伊國屋書店 */
.booklink-link2 .shoplinkebj a {
	color: #333333;
}

/* 図書館 */
/* カエレバ・ヨメレバ共通 */
.kaerebalink-link1 .shoplinkamazon a,
.booklink-link2 .shoplinkamazon a {
	color: #FF9901;
}

/* Amazon */
.kaerebalink-link1 .shoplinkrakuten a,
.booklink-link2 .shoplinkrakuten a {
	color: #c20004;
}

/* 楽天 */
.kaerebalink-link1 .shoplinkseven a,
.booklink-link2 .shoplinkseven a {
	color: #225496;
}

/* 7net */
/***** ボタンデザインここまで ******/
.booklink-footer {
	clear: both;
}