/* <system section="theme" selected="10328749687227408957"> */
/*------------------
  Theme: Like New
  Author: 黒音セシル
  Description:　レイアウトは大胆に、でもどこか上品に仕上げました。カスタマイズの知識が全くない方でもカスタマイズしやすいよう、すべてのカスタマイズがコピペ一回でできるようにしてあります。
  Responsive: yes
--------------------*/

/*------- Reset  --------*/
@charset "utf-8";

html, body,
ul, ol, li,
h1, h2, h3, h4, h5, h6, p,
form, input, div,aside, article,  {
  margin: 0;
  padding: 0;
}

* {
  box-sizing: border-box;
}

ul, ol {
  list-style: none;
}

a {
  color: #6495ed;
  text-decoration: none;
  transition: all .3s;
}

a.keyword {
    border: 0 !important;
    text-decoration: none !important;
    pointer-events: none !important;
}

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

body {
  font-size: 15px;
  font-family: "游ゴシック体", "Yu Gothic", "YuGothic", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
  line-height: 1.7;
  color: #000000;
}

#container {
  width: 100%;
  padding-top: 37px;
  margin: 0 auto;
}


/*-------  GlobalMenu  -------*/
#globalheader-container {
	background-color: #202020;
	color: #ffffff;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
}

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


/*-------- Header ----------*/
#blog-title {
	width: 90%;
	margin: 0 auto;
	padding-right: 25%;
}

.header-image-only #blog-title #blog-title-inner {
    background-position: left 0px !important;
}

#title {
	font-family: 'Georgia','Meiryo UI','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;
	font-size: 60px;
	font-weight: normal;
	margin: 0;
	height: 150px;
}

#title a {
	color: #000000;
}

#title a:hover {
	color: #a3b9e0;
}

#blog-description {
	font-weight: normal;
	margin: 0 0 25px 0;
}

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

}


/*-------  Navigation  -------*/
#main-nav {
	width: 100%;
	padding: 0;
	border-top: 1.5px solid #aeaeae;
	border-bottom: 1.5px solid #aeaeae;
	margin-bottom: 12px;
}

#main-nav-inner ul {
	margin: 0;
	padding-left: 30px;
}

#main-nav-inner li {
	display: inline-block;
	margin: 0;
	line-height: 30px;
    font-size: 18px;
	padding: 15px 30px;
}

#main-nav-inner li:hover {
    background-color: #f9f9f9;
}

#main-nav-inner a {
	color: #000000;
}

#main-nav-inner a:hover {
    color: #a3b9e0;
}


/*-------  Contents  -------*/
#content {
	margin-left: 5%;
}


/*-------  Articles  -------*/
#wrapper { 
	width: 70%;
	margin-top: 30px;
	margin-bottom: 40px;
	display: inline-block;
}

#main {
	padding: 20px 50px 20px 30px;
}

#top-editarea, #bottom-editarea {
	width: 65%;
	margin-left: 5%;
}

/*--- entry-header ---*/
.entry-header {
	margin-bottom: 20px;
}

.entry-title {
	width: 75%;
	color: #555;
	margin: 0;
	font-size: 30px;
	padding: 10px 0;
}

.entry-title a {
	color: #000000;
}

.entry-title a:hover {
	color: #a3b9e0 !important;
}

.date {
	width: 20%;
	float: right;
	font-weight: bold;
	text-align: right;
}

.date a {
	color: #778899;
}

.date a:hover {
	color: #a3b9e0;
}

.categories {
	width: 20%;
	font-weight: 500;
	float: right;
	margin-top: -40px;
	text-align: right;
}

.categories a {
	color: #778899;
}

.categories a:hover {
	color: #a3b9e0;
}

.entry-header-menu {
	margin-top: -50px;
	margin-left: -60px;
	margin-bottom: 50px;
}

.entry-header-menu a {
	padding: 5px 10px;
	border-radius: 5px;
	border: 2px solid #000000;
	color: #000000;
}

.entry-header-menu a:hover {
	color: #a3b9e0;
}

.page-index .social-buttons {
	display: none;
}

/*--- shr-buttons ---*/
.share-buttons1 ul {
	list-style: none;
	padding: 0;
}

.share-buttons1 li {
	display: inline-block;
	vertical-align: top;
}

.share-buttons1 a {
	display: block;
	border: 1px solid #f5f5f5;
	width: 60px;
	height: 60px;
	line-height: 60px;
	color: #778899;
	font-size: 25px;
	text-align: center;
	margin-right: 5px;
	box-shadow: 2px 2px #eee;
}

.share-buttons1 a:hover {
	box-shadow: none;
	color: white;
	background-color: #778899;
}

/*--- パンくずリスト ---*/
#top-box {
	width: 70%;
    margin-top: 50px;
    margin-left: 5%;
    font-weight: 500;
}

.page-entry .breadcrumb {
    margin-bottom: 0;
    padding: 10px;
}

.page-entry .breadcrumb a {
	color: #000000;
}

.page-entry .breadcrumb a:hover {
	color: #a3b9e0;
}

/*--- entry-body ---*/
.page-index .entry-inner {
	padding-bottom: 60px;
	margin-bottom: 40px;
	border-bottom: 1px solid #eee;
}

.entry-inner {
	padding-bottom: 60px;
	margin-bottom: 40px;
}

.entry-content p {
	margin: 0;
}

.entry-content img {
    max-width: 100%;
    box-shadow: 3px 3px #eee;
}

.entry-content h3 {
    font-size: 140%;
	position: relative;
	padding: 0.6em;
	background-color: #dfdfdf;
}

.entry-content h3::after {
	position: absolute;
	content: '';
	top: 100%;
	left: 30px;
	border: 15px solid transparent;
	border-top: 15px solid #dfdfdf;
	width: 0;
	height: 0;
}

.entry-content h4 {
    font-size: 130%;
    border-bottom: 3px solid #778899;
}

.entry-content h5 {
	font-size: 110%;
	position: relative;
	padding-left: 1.2em;
	line-height: 1.4;
}

.entry-content h5::before{ 
	font-family: FontAwesome;
	content: "\f00c";
	position: absolute;
	font-size: 1em;
	left: 0;
	top: 0;
	color: #778899; 
}

.entry-content ul {
  list-style: disc;
}

.entry-content ol {
	list-style: decimal;
}

.entry-content a {
	color: #6495ed;
	text-decoration: underline;
}

.entry-content a:hover {
	color: #a3b9e0;
}

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

    img {
        max-width: none;
    }
}

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

.entry-content table th {
    background: @bg-light;
}

.entry-content blockquote {
    border: 1px solid #eee;
    margin: 0 0 10px;
    padding: 20px 40px;
    p {
        margin-top: 0;
        margin-bottom: 0;
    }
}

.entry-content blockquote::before {
    background-color: #fff;
    content: "\f10d";
    display: inline-block;
    font: normal 28px/1 FontAwesome;
    vertical-align: middle;
    position: absolute;
    top: -10px;
    left: 24px;
}

.entry-content pre {
    border: 1px solid #c0c0c0;
    box-shadow: 2px 2px #eee;
    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-content .table-of-contents {
	padding: 30px 20px 30px 60px;
	margin-left: 20px;
	margin-right: 20px;
	border: 1px solid #c0c0c0;
}

.entry-content .table-of-contents ul {
	padding-left: 30px;
}

.entry-content .table-of-contents li {
	list-style: decimal;
}

/*--- entry-footer  ---*/
.page-index .entry-footer {
	display: none;
}

.entry-see-more {
	color: #000000 !important;
	font-size: 18px;
	border: 2px solid #778899;
	padding: 10px 20px;
	text-decoration: none !important;
}

.entry-see-more:hover {
	background-color: #778899;
	color: white !important;
}

.leave-comment-title {
	float: right;
	color: #000000 !important;
	font-size: 18px;
	border: 2px solid #778899;
	padding: 10px 20px;
	text-decoration: none !important;
}

.leave-comment-title:hover {
	background-color: #778899;
	color: white !important;
}

.comment-box {

    ul {
        list-style: none;
        margin: 0 0 15px 0;
        padding: 0;
        font-size: 95%;
        line-height: 1.7;
    }

    li {
        padding: 10px 0 10px 60px;
        border-bottom: 1px solid #c0c0c0;
        position: relative;
        &:first-child {
            border-top: 1px solid #c0c0c0;
        }
    }

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

    .hatena-id-icon {
        position: absolute;
        top: 10px;
        left: 0;
        width: 50px !important;
        height: 50px !important;
        .border-radius(3px);
    }

}

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

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

    p {
        margin: 0 0 10px 0;
    }
}

.comment-metadata {
    font-size: 80%;
    color: @text-light;
    margin: 0;
    a {
        color: @text-light;
    }
}


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


/*-------   Archive  -------*/
.archive-entry {
	padding-bottom: 25px;
	margin-bottom: 15px;
	border-bottom: 1px solid #eee;
}

.archive-entry .social-buttons {
	display: none;
}


/*-------  Sidebar  -------*/
#box2 {
	width: 25%;
	height: 100%;
	position: fixed;
	top: 0;
	right: 0;
	display: inline-block;
	padding-top: 57px;
	padding-left: 2%;
	padding-right: 2%;
	background-color: #f9f9f9;
	overflow: scroll;
	overflow-x: hidden;
}

#box2::-webkit-scrollbar {
    width: 10px;
}
 
#box2::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px #f5f5f5;
    border-radius: 5px;
}
 
#box2::-webkit-scrollbar-thumb {
    border-radius: 5px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}

.hatena-module {
	width: 100%;
	margin-top: 10px;
	margin-bottom: 25px;
	background-color: white;
	border: 1px solid #f9f9f9;
}

.hatena-module-title {
	font-family: 'Yu Gothic UI','Leelawadee UI','Arial','ヒラギノ角ゴシック','Hiragino Sans',sans-serif;
	color: #555;
	font-size: 18px;
	font-weight: bold;
	padding: 8px 0;
	border-top: 2px solid #c0c0c0;
	border-bottom: 2px solid #c0c0c0;
	text-align: center;
}

.hatena-module-title a {
	color: #555;
}

.hatena-module-title a:hover {
  	color: #a3b9e0;
}

.hatena-module-body {
    width: 100%;
	text-align: left;
	padding: 20px 10px;
}

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

.hatena-module-profile .id {
	display: block;
}

/*---  sidebar-ul  ---*/
.hatena-urllist {
	list-style: none;
	margin: 0;
	padding: 0;
}

.hatena-urllist li {
	padding: 8px 0 2px 0;
	border-bottom: 2px dotted rgba(0, 0, 0, 0.1);
}

.hatena-urllist a {
	text-decoration: none;
	color: #000000;
}

.hatena-urllist a:hover {
  	color: #a3b9e0;
}

.urllist-categories {
	display: none;
}

/*--- Search ---*/
.hatena-module-search-box .search-module-input {
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 3px;
	width: 100%;
	line-height: 18px;
	padding: 15px;
	background-color: none;
}

.hatena-module-search-box .search-module-button {
	display: none;
}

/*--- autors list ---*/
.hatena-module-body .authors-urllist .authors-user-name {
	line-height: 48px;
}


/*-------  Pager  -------*/
.pager a {
	color: #000000;
	text-decoration: underline;
}

.pager a:hover {
	color: #a3b9e0;
	text-decoration: underline;
}

.pager-prev {
	float: left;
}

.pager-next {
	float: right;
}


/*-------  Footer  -------*/
#footer {
	width: 70%;
	font-size: 14px;
	text-align: right;
	padding-left: 5%;
	padding-right: 40px;
	padding-top: 40px;
	padding-bottom: 40px;
}

#footer p {
	margin: 0;
}

#footer a {
	color: #000000;
}

#footer a:hover {
	color: #a3b9e0;
}


/*-------  aggressive link -------*/
.linkBtn {
    text-align: center;
}

.linkBtn a {
    display: block;
	width: 75%;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
    background-color: #ff6666;
    border-radius: 5px;
    box-shadow: 3px 3px #eee;
    text-decoration: none;
    font-size: 20px;
    margin: 0 auto;
}

.linkBtn a:hover {
	box-shadow: none;
	color: #000000;
	text-decoration: underline;
	background-color: white;
	border: 2px solid #ff6666;
}

/*-------  UnderLine  -------*/
._line {
	background: linear-gradient(transparent 80%, #FFF176 0%);
}



/*-------  FollowBtn  -------*/
.followBtn1 {
	text-align: center;
}

.followBtn1 p {
	font-size: 14px;
	color: #555;
}

.followBtn1 ul {
	list-style: none;
	padding: 0;
}

.followBtn1 li {
	display: inline-block;
	vertical-align: top;
}

.followBtn1 a {
	display: block;
	border: 1px solid #778899;
	width: 60px;
	height: 60px;
	line-height: 60px;
	color: #ffffff;
	background-color: #778899;
	font-size: 25px;
	text-align: center;
	margin-right: 5px;
	box-shadow: 2px 2px #eee;
}

.followBtn1 a:hover {
	box-shadow: none;
	color: #778899;
	background-color: white;
}

.followBtn2 {
	text-align: center;
	margin: 0 auto;
	max-width: 600px;
}

.followBtn2 p {
	font-size: 14px;
	color: #555;
}

.followBtn2 ul {
	list-style: none;
	padding: 0;
}

.followBtn2 li {
	display: inline-block;
	vertical-align: top;
}

.followBtn2 a {
	display: block;
	border: 1px solid #778899;
	width: 150px;
	height: 60px;
	line-height: 60px;
	color: #ffffff;
	background-color: #778899;
	font-size: 25px;
	text-align: center;
	margin-right: 5px;
	margin-bottom: 5px;
	box-shadow: 2px 2px #eee;
}

.followBtn2 a:hover {
	box-shadow: none;
	color: #778899;
	background-color: white;
}

/*-------  Related articles Box  -------*/
.box1 {
	background-color: #778899; 
	border: 1px solid #778899; 
	padding-left: 10px; 
	font-size: 1.16em;
}

.box1-title {
	line-height: 18px; 
	font-weight: bold;
	color: white;
	padding: 10px;
}

.box1-content {
	border: 1px solid #778899; 
	padding: 10px; 
	font-size: 1em;
}



/*-------  Responsive  -------*/
.adx-responsive-mode {
	max-width: 100%;
}

@media (max-width: 1000px) {
	#blog-title {
		width: 85%;
		padding-right: 0;
	}

	#main-nav {
		width: 100%;
		margin-bottom: 10px;
	}

	#content {
		margin-left: 5%;
		margin-right: 5%;
	}

	#wrapper {
		width: 100%;
	}

	#top-editarea, #bottom-editarea {
		width: 90%;
		margin-left: 5%;
		margin-right: 5%;
	}

	#box2 {
		width: 100%;
		height: 100%;
		position: relative;
		display: block;
		padding: 30px 2%;
	}

	#box2-inner {
		padding-left: 8%;
	}

	.hatena-module {
		display: inline-block;
		float: left;
		width: 45%;
		margin: 15px 10px 15px 0;
		vertical-align: top;
	}

	#footer {
		width: 100%;
		text-align: center;
		padding: 40px 0;
	}

	.link-btn a {
		width: 100%;
	}

	.leave-comment-title {
		float: left;
	}


}

@media (max-width: 450px) {
	body {
		font-size: 14px;
	}

	#blog-title {
		width: 90%;
		padding-right: 0;
		text-align: center;
	}

	#title {
		font-size: 40px;
		height: 70px;
	}

	#blog-description {
		font-size: 18px;
		margin-bottom: 15px;
		text-align: center;
	}

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

	#main-nav {
		width: 100%;
		margin-left: 0;
		margin-bottom: 7px;
	}	

	#main-nav-inner ul {
		padding-left: 0;
		text-align: center;
	}

	#main-nav-inner li {
		line-height: 22px;
		font-size: 16px;
		width: 40%;
		padding: 7px 5px;
	}

	#content {
		margin-left: 15px;
		margin-right: 15px;
	}

	#wrapper {
		width: 100%;
		margin-top: 20px;
		display: block;
	}

	#top-editarea, #bottom-editarea {
		width: 90%;
		margin-left: 15px;
		margin-right: 15px;
	}

	#main {
		padding: 20px;
	}

	.entry-title {
		width: 100%;
		font-size: 18px;
		padding: 3px 0;
	}

	.date {
		width: 100%;
		float: none;
		text-align: left;
	}

	.categories {
		width: 100%;
		float: none;
		text-align: left;
		margin-top: 0;
	}

	.entry-header-menu {
		float: right;
		margin: -20px 0 20px 0;
	}

	.entry-header-menu a {
		padding: 3px 6px;
	}

	.share-buttons a {
		width: 35px;
		height: 35px;
		line-height: 35px;
		font-size: 20px;
		margin: 0 auto;
	}

	#top-box {
		width: 100%;
		margin-top: 20px;
		margin-left: 20px;
	}

	.page-entry .breadcrumb {
		padding: 7px;
	}

	.page-index .entry-inner {
		padding-bottom: 15px ;
		margin-bottom: 10px;
	}

	.entry-inner {
		padding-bottom: 15px;
		margin-bottom: 10px;
	}

	.entry-content p {
		font-size: 14px;
  		line-height: 1.5;
	}

	.entry-content blockquote {
	    padding: 20px 14px 7px 14px;
	}

	.entry-content blockquote::before {
	    position: absolute;
	    top: -10px;
	    left: 14px;
	}

	.entry-content .table-of-contents {
		padding: 14px 10px 14px 35px;
		margin-left: 7px;
		margin-right: 7px;
	}

	.entry-content .table-of-contents ul {
		padding-left: 10px;
	}

	.entry-see-more {
		font-size: 15px;
		border: 1px solid #778899;
		padding: 5px 10px;
	}

	.leave-comment-title {
		font-size: 15px;
		border: 1px solid #778899;
		padding: 5px 10px;
		margin-bottom: 30px;
		float: left;
	}

	.archive-entry {
		padding-bottom: 15px;
		margin-bottom: 10px;
	}

	#box2 {
		width: 100%;
		height: 100%;
		position: relative;
		display: block;
		padding-top: 30px;
		padding-bottom: 10px;
		padding-left: 2%;
		padding-right: 2%;
		background-color: #f9f9f9;
	}

	#box2-inner {
		padding-left: 3%;
	}

	.hatena-module {
		width: 100%;
		margin-top: 5px;
		margin-bottom: 15px;
	}

	.hatena-module-title {
		font-size: 17px;
		font-weight: bold;
		padding: 5px 0;
	}

	.hatena-module-body {
		padding: 10px 5px;
	}

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

	.hatena-module-search-box .search-module-input {
		line-height: 16px;
		padding: 7px 10px;
	}

	.hatena-module-body .authors-urllist .authors-user-name {
		line-height: 20px;
	}


	#footer {
		width: 100%;
		font-size: 10px;
		text-align: center;
		padding: 20px 0;
	}

	.link-btn a {
		width: 100%;
	    padding-top: 7px;
	    padding-bottom: 7px;
	    border-radius: 3px;
	    box-shadow: 2px 2px #eee;
	    font-size: 15px;
	}

}
/* </system> */

/*タイトルの文字サイズ変更*/
#title{
    font-size: 7.2em;
}

/* ブログ説明文の文字サイズ */
#blog-description {
     color:#808080;
     font-size:90%;
}

/*自作行間設定*/
/* entry-content ブロック中の段落 */
.entry-content 
p{
 margin:2em;;/* ★段落間のマージン */
 line-height:1.8em;/* ★の高さ(BRのとき) */
}

/* 箇条書きの設定-枠はなし */
ul, ol {
  background: #fcfcfc;/*背景色*/
  padding: 0.5em 0.5em 0.5em 2em;/*ボックス内の余白*/
}

ul li, ol li {
  line-height: 1.5; /*文の行高*/
  padding: 0.5em 0; /*前後の文との余白*/
}

/*シェアボタン*/
.share-flat{
    margin-bottom: 10px;
    text-align: center;
}
.share-flat-inner a {
    position: relative;
    display: inline-block;
    width: 18%;
    height: 40px;
    line-height: 20px;
    border-radius: 5px;
    font-size: 16px;
    text-align: center;
    color: #ffffff;
    text-decoration: none;
}
.share-flat .small-text{
    font-size: 10px;
}
.share-flat .hatena-bookmark-button{
    background: #00A4DE;
}
.share-flat .twitter-button{
    background: #55ACEE;
}
.share-flat .googleplus-button{
    background: #C53727;
}
.share-flat .facebook-button{
    background: #405BA7;
}
.share-flat .pocket-button{
    background: #EE4256;
}
.share-flat a:hover{
    opacity: 0.6;
}


 /* footer調整 */
#footer {
 height:50px; /* フッターの高さ */
 background-color: #5d5d5d; /* 背景色 */
 padding: initial;
}
#footer address,
#footer p {
  display: none;
}

/* グレーの蛍光ペン・アンダーライン(細) */

.underline {
background: linear-gradient(transparent 60%, #c0c0c0 0%);
}

/* 見出しh5の下に小さく線をつける */

h5 {
  /*線の種類（点線）2px 線色*/
  border-bottom: dashed 2px #c0c0c0;
}


/*--------------------------------------
  目次のカスタマイズ開始
--------------------------------------*/

.table-of-contents:before{
  content: "[もくじ]"; /* 目次のタイトル文字 */
  text-align:center; /* 文字の中央寄せ */
  font-size: 100%;
  line-height: 12px;
}

ul.table-of-contents a{
text-decoration: none; /* リンク下線なし */
} 

/*--------------------------------------
  目次のカスタマイズ終了
--------------------------------------*/




/*--------------------------------------
  ヨメレバ・カエレバ・デザイン・カスタム（レスポンシブ）　amazonlet風-2推奨・開始
--------------------------------------*/
.booklink-box, .kaerebalink-box{
    padding:25px;
    margin-bottom: 10px;
    border:double #CCC;
    overflow: hidden;
    font-size:small;
}
.booklink-image, .kaerebalink-image{
    margin:0 15px 0 0;
    float:left;
    min-width: 160px;
    text-align: center;
}
.booklink-image img, .kaerebalink-image img{
    margin:0 auto;
    text-align:center;
}
.booklink-info, .kaerebalink-info{
    margin:0;
    line-height:120%;
    overflow: hidden;
}
.booklink-name, .kaerebalink-name{
    margin-bottom:24px;
    line-height:1.5em;
}
.booklink-powered-date, .kaerebalink-powered-date{
     font-size:8px;
     margin-top:10px;
     font-family:verdana;
     line-height:120%;
}
.booklink-detail, .kaerebalink-detail{font-size: 12px;}
.booklink-powered-date, .kaerebalink-detail{margin-bottom:15px;}
.booklink-link2, .kaerebalink-link1{margin-top:10px;}
.booklink-link2 a,
.kaerebalink-link1 a{
    width:30%;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    display:inline-block;
    margin:5px 2px 0 0;
    padding:10px 1px;
    text-align:center;
    float:left;
    text-decoration:none;
    font-weight:800;
    text-shadow:1px 1px 1px #dcdcdc;
    font-size:12px;
    color: #fff !important;
}
.booklink-link2 a:hover,
.kaerebalink-link1 a:hover{opacity: 0.6;}
.booklink-link2 a:active
.kaerebalink-link1 a:active{
    position:relative;
    top:1px;
}
/*ボタンを変えるときはここから*/
.shoplinkamazon a{color:#FF9901 !important;border: 1px solid #FF9901 !important;}
.shoplinkrakuten a{color:#c20004 !important;border: 1px solid #c20004 !important;}
.shoplinkkindle a{color:#007dcd !important;border: 1px solid #007dcd !important;}
.shoplinkkakakucom a{color:#314995 !important;border: 1px solid #314995;}
.shoplinkyahoo a{color:#7b0099 !important;border: 1px solid #7b0099 !important;}
/*ここまでを変更*/
.shoplinkyahoo img{display:none;}
.shoplinkyahoo a{font-size:10px;}
.booklink-footer{display: none;}

@media screen and (max-width: 680px) {
.booklink-box, .kaerebalink-box{padding:15px;}
.booklink-image, .kaerebalink-image{
    width: 100px !important;
    min-width: initial;
}
.booklink-name > a, .kaerebalink-name > a{
    font-size: 15px;
    font-weight: bold;
}
.booklink-name, .kaerebalink-name{margin-bottom:12px;}
.booklink-powered-date, .kaerebalink-powered-date{margin-top:5px;}
.booklink-link2 a,
.kaerebalink-link1 a{
    width:calc(100% - 4px);
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    margin: 2px 0px;
    padding:10px 0px;
}
}

/*--------------------------------------
  ヨメレバ・カエレバ（レスポンシブ）終了
--------------------------------------*/

/*--------------------------------------
  カッテネ・開始
--------------------------------------*/

.kattene {
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 3px;
  padding: 10px;
  padding-bottom: 5px;
  margin-bottom: 1em;
  box-sizing: border-box; }

.kattene div{
  margin: 0;
}

.kattene__imgpart {
  text-align: center; }

  .kattene__imgpart img {
    -webkit-box-shadow: 0px 5px 15px -5px rgba(0, 0, 0, 0.8);
    -moz-box-shadow: 0px 5px 15px -5px rgba(0, 0, 0, 0.8);
    box-shadow: 0px 5px 15px -5px rgba(0, 0, 0, 0.8);
    -o-box-shadow: 0px 5px 15px -5px rgba(0, 0, 0, 0.8);
    -ms-box-shadow: 0px 5px 15px -5px rgba(0, 0, 0, 0.8);
    margin: 0;}

.kattene__description {
  font-size: 0.8em; }

.kattene .kattene__btns {
  width: 100%;
  margin-top: 0.5em; }

  .kattene__btns:after {
    display: block;
    clear: both;
    height: 0px;
    visibility: hidden;
    content: "."; }

  .kattene__btns > div {
    float: left;
    margin-bottom: 5px; }

  .kattene__btns .kattene__btn {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
   }

  .kattene__btns.__three > div {
    width: 32.66667%; }

    .kattene__btns.__three > div:not(:last-child) {
      margin-right: 1%; }

  .kattene__btns.__two > div {
    width: 49.5%; }

    .kattene__btns.__two > div:nth-child(odd) {
      margin-right: 1%; }

@media screen and (max-width: 900px) {
  .kattene__imgpart {
    padding-bottom: 1em; }
  .kattene .kattene__btns {
    margin-top: 0.5em; }
  .kattene__btns.__five > div {
  width: 49.5%; }
  .kattene__btns.__five > div:nth-child(odd) {
    margin-right: 1%; }
  .kattene__btns.__five > div:last-child {
    margin-right: 0;
    float: right; }

  .kattene__btns.__four > div {
    width: 49.5%; }

    .kattene__btns.__four > div:nth-child(odd) {
      margin-right: 1%; }

  .kattene__btns.__one > div {
    width: 50%;
    margin-left: 25%; } }
@media screen and (min-width: 901px) {

  .kattene {
    display: table;
    width: 100%; }

  .kattene__imgpart {
    display: table-cell;
    width: 20%;
    padding-bottom: 5px;
  }

  .kattene__infopart {
    display: table-cell;
    vertical-align: top;
    position: relative;
    padding-left: 10px;
    width: 80%; }

  .kattene .kattene__description {
    margin-bottom: 4em;
  }

  .kattene__btns {
    position: absolute;
    bottom: 0;
    box-sizing: border-box;
    padding-right: 10px; }

  .kattene__btns.__five > div {
    width: 19.2%; }

    .kattene__btns.__five > div:not(:last-child) {
      margin-right: 1%; }

    .kattene__btns.__four > div {
      width: 24.25%; }

      .kattene__btns.__four > div:not(:last-child) {
        margin-right: 1%; }

    .kattene__btns.__two > div {
      width: 49.5%; }

      .kattene__btns.__two > div:not(:last-child) {
        margin-right: 1%; }

    .kattene__btns.__one > div {
      width: 49.5%;
      float: right; } }

.kattene .kattene__btn {
  appearance: none;
  background-color: #54c0d1;
  border: 0;
  border-radius: 0;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  font-size: 1em;
  -webkit-font-smoothing: antialiased;
  font-weight: 600;
  line-height: 1;
  padding: 0.75em 0;
  text-decoration: none;
  transition: background-color 150ms ease;
  user-select: none;
  vertical-align: middle;
  white-space: nowrap; }

  .kattene__btn:hover, .kattene__btn:focus {
    background-color: #439aa7;
    color: #fff !important; }

  .kattene__btn:disabled {
    cursor: not-allowed;
    opacity: 0.5; }

    .kattene__btn:disabled:hover {
      background-color: #54c0d1; }

.kattene__btn.__small {
  padding: 0.55em;
  font-size: 0.9em; }

.kattene__btn.__orange {
  background-color: #FF9901;
  -webkit-box-shadow: 0 5px 0 #cc7a01;
  -moz-box-shadow: 0 5px 0 #cc7a01;
  box-shadow: 0 5px 0 #cc7a01;
  -o-box-shadow: 0 5px 0 #cc7a01;
  -ms-box-shadow: 0 5px 0 #cc7a01;
  margin-bottom: 5px;
  border-radius: 3px;
  text-align: center; }

  .kattene__btn.__orange:hover {
    background-color: #cc7a01; }

  .kattene__btn.__orange i {
    font-weight: bold; }

    .kattene__btn.__orange i:before {
      vertical-align: middle;
      font-size: 1.2em;
      margin-right: 0.2em; }

.kattene__btn.__blue {
  background-color: #007dcd;
  -webkit-box-shadow: 0 5px 0 #0064a4;
  -moz-box-shadow: 0 5px 0 #0064a4;
  box-shadow: 0 5px 0 #0064a4;
  -o-box-shadow: 0 5px 0 #0064a4;
  -ms-box-shadow: 0 5px 0 #0064a4;
  margin-bottom: 5px;
  border-radius: 3px;
  text-align: center; }

  .kattene__btn.__blue:hover {
    background-color: #0064a4; }

  .kattene__btn.__blue i {
    font-weight: bold; }

    .kattene__btn.__blue i:before {
      vertical-align: middle;
      font-size: 1.2em;
      margin-right: 0.2em; }

.kattene__btn.__red {
  background-color: #c20004;
  -webkit-box-shadow: 0 5px 0 #9b0003;
  -moz-box-shadow: 0 5px 0 #9b0003;
  box-shadow: 0 5px 0 #9b0003;
  -o-box-shadow: 0 5px 0 #9b0003;
  -ms-box-shadow: 0 5px 0 #9b0003;
  margin-bottom: 5px;
  border-radius: 3px;
  text-align: center; }

  .kattene__btn.__red:hover {
    background-color: #9b0003; }

  .kattene__btn.__red i {
    font-weight: bold; }

    .kattene__btn.__red i:before {
      vertical-align: middle;
      font-size: 1.2em;
      margin-right: 0.2em; }

.kattene__btn.__green {
  background-color: #0BBD80;
  -webkit-box-shadow: 0 5px 0 #099766;
  -moz-box-shadow: 0 5px 0 #099766;
  box-shadow: 0 5px 0 #099766;
  -o-box-shadow: 0 5px 0 #099766;
  -ms-box-shadow: 0 5px 0 #099766;
  margin-bottom: 5px;
  border-radius: 3px;
  text-align: center; }

  .kattene__btn.__green:hover {
    background-color: #099766; }

  .kattene__btn.__green i {
    font-weight: bold; }

    .kattene__btn.__green i:before {
      vertical-align: middle;
      font-size: 1.2em;
      margin-right: 0.2em; }

.kattene__btn.__pink {
  background-color: #e1325b;
  -webkit-box-shadow: 0 5px 0 #b42849;
  -moz-box-shadow: 0 5px 0 #b42849;
  box-shadow: 0 5px 0 #b42849;
  -o-box-shadow: 0 5px 0 #b42849;
  -ms-box-shadow: 0 5px 0 #b42849;
  margin-bottom: 5px;
  border-radius: 3px;
  text-align: center; }

  .kattene__btn.__pink:hover {
    background-color: #b42849; }

  .kattene__btn.__pink i {
    font-weight: bold; }

    .kattene__btn.__pink i:before {
      vertical-align: middle;
      font-size: 1.2em;
      margin-right: 0.2em; }

/*--------------------------------------
  カッテネ・終了
--------------------------------------*/