@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    0.0.5
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/*
@media screen and (max-width: 480px) {
.menu-content {
max-width: 100%;
}}
.ad-area {
overflow: visible;
margin: 80px 0;
}
.entry-content {
margin-bottom: 0;
}
.entry-content .ad-area {
margin: 3em 0;
}
.google-auto-placed {
overflow: clip;
}
*/

@media screen and (max-width: 480px) {
.google-auto-placed {
margin-left: -10px;
margin-right: -10px;
}}

.ama {
font-size: 15px;
}
.ama2 {
font-size: 15px;
padding-top: 15px;
}

.ad-margin {
margin: 50px 0;
}
.textwidget {
margin: 30px 0;
}

@media screen and (max-width: 374px) {
main.main, div.sidebar {
padding: 16px 10px;
}}
.ad-label {
padding: 5px 0 5px 10px;
background: #f4f3f2;
font-weight:bold;
text-align: left;
color: #4c473f;
font-size: 15px;
}
.invalid {
font-style: italic;
color: #888;
}
@media screen and (max-width: 480px) {
.ad-label {
margin: 0 -16px;
padding-left: 16px;
}}
@media screen and (max-width: 374px) {
.ad-label {
margin: 0 -10px;
padding-left: 10px;
}}

.article-footer, .entry-footer {
margin-top:0;
padding-top:0;
border-top: none;
}


.shoplinkamazon a {
background: linear-gradient(0deg,#e6af47,#e4af44);
    border-bottom: 2px solid #af7b18;
    border-top: 2px solid #f2d6a1;
    border-right: 2px solid #c68b1b;
    border-left: 2px solid #efcc8a;
    box-shadow: 1px 1px 4px #ccc;
}
.shoplinkrakuten a {
    background: #c2272f;
    border-bottom: 2px solid #6d161a;
    border-top: 2px solid #e26d73;
    border-right: 2px solid #821a20;
    border-left: 2px solid #dd585f;
    box-shadow: 1px 1px 4px #ccc;
}
.shoplinkyahoo a {
    border-bottom: 2px solid #ba2636;
    border-top: 2px solid #ee827c;
    border-right: 2px solid #b7282e;
    border-left: 2px solid #f0908d;
    box-shadow: 1px 1px 4px #ccc;
}
.iwe-border-bold img, .iwe-border-bold amp-img {
border: 4px solid #e60033;
}

.kaerebalink-link1 a, .booklink-link2 a, .tomarebalink-link1 a, .product-item-buttons a {
border-radius: 5px;
}
.booklink-box, .kaerebalink-box, .tomarebalink-box, .product-item-box {
margin: 0 auto;
}

.cat-link, .cat-label{
color: #fff;
}
span.kaigyo{
display:block;
}
caption {
text-align: left;
font-weight: bold;
}

.date-tags {
    margin-top: 1em;
}

.header-container-in.hlt-top-menu .logo-header img {
height: auto;
width: auto;
}
.logo.logo-header.logo-image {
max-width: 250px;
padding-top:5px;
margin-left:10px;
}

.header-container-in.hlt-top-menu amp-img {
max-width: 250px;
}

.article h1 {
margin-bottom:1em;
}


.rakuten {
margin: 20px auto 0 auto;
width:200px;
}

a.prev.page-numbers, a.next.page-numbers {
width:60px;
margin-bottom:15px;
}

/*左上に背景色ありタイトル*/
.amabox{
margin: 2em auto; /* ボックスの余白 */
padding:3em 1em 1em; /* ボックス内側余白 */
position:relative; /* 配置(ここを基準に)*/
border: 3px solid #909792;	/* ボックスの線 (太さ　種類　色)*/
}
.amabox .box-title {
background-color:#edecea; /* タイトル背景色 */
font-size: 1em;/* タイトル文字の大きさ */
color: #686157 ; /* タイトル文字色 */
font-weight: bold;
padding: 7px 10px;/*タイトルの余白*/
line-height: 1;/*タイトルの行の高さ*/
position:absolute;	/* 配置(ここを動かす) */
top: 0; /*上から（0px）移動*/
left: 0; /*左から(0px)移動*/
}

.product-item-box:before {
content: "広告";
white-space: nowrap;
height:20px;
width:35px;
display:block;
padding: 2px 5px 8px 7px;
margin-bottom:10px;
  border: 1px solid #ccc;
  background: #f1e767;
  background: -webkit-gradient(linear, left top, left bottom, from(#fdfbfb), to(#ebedee));
  background: -webkit-linear-gradient(top, #fdfbfb 0%, #ebedee 100%);
  background: linear-gradient(to bottom, #fdfbfb 0%, #ebedee 100%);
  -webkit-box-shadow: inset 1px 1px 1px #fff;
  box-shadow: inset 1px 1px 1px #fff;
}

/************************************
** SNS
************************************/
.ss-top .sns-share-buttons {
justify-content: left;
}
.ss-top a.share-button {
  width: 12%;
  height: 34px;
}

#main a .button-caption {
	display: none;
}
#main .sns-buttons a {
	height: 35px;
	width: 35px;
	border-radius: 50%;
	opacity: 0.8;
	margin-right: 10px;
}
#main .sns-buttons a:last-child {
	margin-right: 0;
}
.sns-share-buttons {
	justify-content: flex-start;
}
.article-footer .sns-share-buttons, .article-footer .sns-follow-buttons {
	justify-content: center;
}
.sns-share-message, .sns-follow-message {
	color: #69788a;
	font-size: 0.8em;
}
.sns-follow-buttons a {
	font-size: 1.3em;
}
.sns-share-message::before, .sns-follow-message::before {
	content: '＼ ';
}
.sns-share-message::after, .sns-follow-message::after {
	content: ' ／';
}
.sns-share, .sns-follow {
	margin: 0;
}
.sns-share-buttons a .share-count,
.sns-follow-buttons a .follow-count {
    right: -10px;
    bottom: -10px;
    color: #aaa;
}

.ss-top a.share-button {
    width: 35px !important;
}

@media screen and (min-width: 481px){
.ss-top .sns-share-buttons {
    justify-content: left;
}}

/*320px以下amazon*/
@media screen and (max-width: 320px){
.amazon-se {
margin-left: -16px;
margin-right: -16px;
}}
.amazon-text {
font-size: .8em;
margin-top: 20px;
margin-bottom: 10px;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1240px以下*/
@media screen and (max-width: 1240px){
  /*必要ならばここにコードを書く*/
}

/*1030px以下*/
@media screen and (max-width: 1030px){
}

/*768px以下*/
@media screen and (max-width: 768px){
}

/*480px以下*/
@media screen and (max-width: 480px){
.toc {
width: 100%;
}
.logo.logo-header.logo-image {
max-width: 200px;
}
.header-container-in.hlt-top-menu amp-img {
max-width: 200px;
}
.navi-footer-in > .menu-footer li.menu-item {
    border-left: 1px solid #e2e2e2;
    border-right: 1px solid #e2e2e2;
    padding: 5px;
}
}