/* カスタム CSS をここに入力してください */
/* ヨメレバ・カエレバカスタマイズ */
.cstmreba {
margin-bottom:10px;
padding: 10px;
border-radius: 20px;
background: #eef4fb;
}
.kaerebalink-box, .booklink-box {
padding: 20px;
border: 2px dashed #FFF;
border-radius: 20px;
overflow: auto;
}
.kaerebalink-image, .booklink-image {
float: left;
margin-right: 20px;
}
.kaerebalink-name p, .booklink-name p {
margin: 0;
}
.kaerebalink-name a, .booklink-name a {
padding-bottom: 5px;
border-bottom: 1px solid #5f4339;
color: #5f4339;
text-decoration: none;
}
.booklink-name a:before {
margin-right: 5px;
color: #5f4339;
font-family: "FontAwesome";
content: '\f02d';
}
.kaerebalink-powered-date, .booklink-powered-date {
font-size: x-small;
}
.kaerebalink-powered-date a, .booklink-powered-date a {
border: none;
}
.booklink-powered-date a:before{
display:none;
}
.booklink-powered-date a {
color: #5f4339;
text-decoration: none;
}
.kaerebalink-detail, .booklink-detail {
font-size: small;
}
.shoplinkkindle, .shoplinkamazon, .shoplinkrakuten, .shoplinkyahoo {
padding: 5px 0px;
}
.kaerebalink-link1, .booklink-link2 {
float: left;
}
.kaerebalink-link1 a, .booklink-link2 a {
color: #fff;
text-decoration: none;
}
.kaerebalink-link1 a:hover,
.booklink-link2 a:hover {
color: #f0f0f0!important;
opacity:0.7;
filter: alpha(opacity=70);
}
.shoplinkkindle a {
padding: 5px 10px;
border-radius: 3px;
background: #448aff;
box-shadow: 0px 3px 6px rgba(0,0,0,0.16);
}
.shoplinkamazon a {
padding: 5px 10px;
border-radius: 3px;
background: #ffba00;
box-shadow: 0px 3px 6px rgba(0,0,0,0.16);
}
.shoplinkrakuten a {
padding: 5px 10px;
border-radius: 3px;
background: #ff445b;
box-shadow: 0px 3px 6px rgba(0,0,0,0.16);
}
.shoplinkyahoo a {
background: #445bff;
padding: 5px 10px;
border-radius: 3px;
box-shadow: 0px 3px 6px rgba(0,0,0,0.16);
}
@media screen and (max-width: 639px){
.kaerebalink-image, .booklink-image {
width: 50px;
margin-right: 10px;
}
.kaerebalink-detail, .booklink-detail {
display: none;
}
}
.tagcloud a {
	font-size: 14px !important; /* 文字のサイズ */
	line-height: 1em;
	background:  #C46780 !important; /* 背景色 */
	color: #fff; /* 文字色 */
	display: inline-block;
	white-space: nowrap;
	padding: 8px 8px; /* 文字周りの余白 */
	margin-top: 3px; /* タグ同士の余白 */
	border-radius: 4px; /* 角を少し丸く */
	text-decoration: none;
}
.tagcloud a:hover {
 	background: #E48898 !important; /* マウスホバー時の背景色 */
	color: #fff !important; /* マウスホバー時の文字色*/
}
.tagcloud a:before {
        font-family: "FontAwesome";
        content: "\f004";
	padding-right: 4px;
}
.widget_categories ul{
  font-size: 14px !important; /* 文字のサイズ */
  list-style-type:none;
  padding-left: 0;
}
.widget_categories li:not(.children) a{
	display: block;
	padding: 4px;
  margin: 1px;
	color: #fff;
	background: #E48898;
  border-radius: 4px !important; /* 角を少し丸く */
  transition: .5s;
}
.widget_categories li:not(.children) a:hover{
	background: #C46780;
}
.widget_categories .children li a{
	display: block;
	padding: 4px;
  margin: 1px;
	color: #000;
	background: #FFF;
  transition: .5s;
}
.widget_categories .children li a:hover{
	background: #E0E0E0;
}
li.cat-item-5 a:before {
    font-family: "FontAwesome";
    content: "\f182";
    padding-right: 8px !important;
  text-decoration: none !important;
}
li.cat-item-3 a:before {
    font-family: "FontAwesome";
    content: "\f0f4";
    padding-right: 8px !important;
  text-decoration: none !important;
}
li.cat-item-4 a:before {
   font-family: "FontAwesome";
    content: "\f2cd";
    padding-right: 8px !important;
  text-decoration: none !important;
}
li.cat-item-42 a:before {
    font-family: "FontAwesome";
    content: "\f004";
    padding-right: 8px !important;
  text-decoration: none !important;
}
.post h3 {
position: relative;
padding: 5px 5px 5px 42px;
background: #77c3df;
font-size: 20px;
color: white;
margin-left: -33px;
line-height: 1.3;
z-index:-1;
}
.post  h3:before {
position: absolute;
content: '';
left: -2px;
top: -2px;
border: none;
border-left: solid 40px white;
border-bottom: solid 79px transparent;
z-index:-2
} 
.post h4 {
position: relative;
padding-left: 25px;
}

.post h4:before {
position: absolute;
content: '';
bottom: -3px;
left: 0;
width: 0;
height: 0;
border: none;
border-left: solid 15px transparent;
border-bottom: solid 15px rgb(119, 195, 223);
}
.post h4:after {
position: absolute;
content: '';
bottom: -3px;
left: 10px;
width: 100%;
border-bottom: solid 3px rgb(119, 195, 223);
}