@charset "UTF-8";

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

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

.article h2 {
	margin-top: 3em;
}

.sidebar h3 {
    background: transparent;
    padding: 0.4em;
    margin: 2em 0 0.3em;
    border-bottom: 2px solid #f8b500;
}

.toc {
    border: 2px solid #d6a721;
	margin: 3em auto;
}

.toc-title {
    border-bottom: 1px solid #d6a721;
}

.widget_recent_entries ul, .widget_categories ul, .widget_archive ul, .widget_pages ul, .widget_meta ul, .widget_rss ul, .widget_nav_menu ul {
	padding: 0 1em;
}

.entry-content .speech-icon img, .entry-content .speech-icon amp-img {
	margin: 0;
}

.blank-box, .common-icon-box {
	margin: 2em 0;
}

.blank-box.bb-tab {
	margin-top: 3em;
}

table {
	margin: 2.5em 0 !important;
}
table th {
	background-color: #f1f3a5;
}
table th, table td {
	 border: 1px solid #AAA;
}
table tr:nth-of-type(2n+1) {
	background-color: #FFF;
}

.entry-content img {
	margin-top: 2.5em;
	margin-bottom: 2.5em;
}

.blogcard {
    padding: 3% 2% 1.8%;
}
.blogcard-type img {
	margin-top: 0;
	margin-bottom: 0;
}
.blogcard-type {
	margin: 3em 0;
}
.blogcard-favicon {
	margin-top: 0;
}
.blogcard-snipet {
	margin-top: 0.5em;
}

.blank-box.bb-tab::before {
	line-height: 1.8;
}

.marker-under {
	background: linear-gradient(transparent 60%, #ffe566 60%);
}

.widget_nav_menu li.menu-item {
    border-bottom: 1px dashed #ccc;
}


.rap-annotation-button {
    text-align: center;
    margin: -25px auto 80px;
}
.rap-annotation-button:before {
    content: "商品名で検索すると販売ページが表示";
    background-color: #ffe4e4;
    padding: 6px 10px;
    font-size: 0.9em;
}
.rap-annotation-text {
    text-align: left;
    margin: -25px auto 0px;
}
.rap-annotation-text:before {
    content: "商品名で検索すると販売ページが表示";
    background-color: #efefef;
    padding: 5px 10px;
    font-size: 0.8em;
}


.fz-05em {
	font-size: 0.5em!important;
}
.fz-06em {
	font-size: 0.6em!important;
}
.fz-07em {
	font-size: 0.7em!important;
}
.fz-08em {
	font-size: 0.8em!important;
}
.fz-09em {
	font-size: 0.9em!important;
}
.fz-11em {
	font-size: 1.1em!important;
}
.fz-12em {
	font-size: 1.2em!important;
}
.fz-13em {
	font-size: 1.3em!important;
}
.fz-14em {
	font-size: 1.4em!important;
}
.fz-15em {
	font-size: 1.5em!important;
}

.m0{ margin: 0!important; }/*周りからのmarginを0に*/
.m0-t{ margin-top: 0!important; }/*上からのmarginを0に*/
.m0-r{ margin-right: 0!important; }/*右からのmarginを0に*/
.m0-b{ margin-bottom: 0!important; }/*下からのmarginを0に*/
.m0-l{ margin-left: 0!important; }/*左からのmarginを0に*/

.m5{ margin: 5px!important; }
.m5-t{ margin-top: 5px!important; }
.m5-r{ margin-right: 5px!important; }
.m5-b{ margin-bottom: 5px!important; }
.m5-l{ margin-left: 5px!important; }

.m10{ margin: 10px!important; }
.m10-t{ margin-top: 10px!important; }
.m10-r{ margin-right: 10px!important; }
.m10-b{ margin-bottom: 10px!important; }
.m10-l{ margin-left: 10px!important; }

.m15{ margin: 15px!important; }
.m15-t{ margin-top: 15px!important; }
.m15-r{ margin-right: 15px!important; }
.m15-b{ margin-bottom: 15px!important; }
.m15-l{ margin-left: 15px!important; }

.m20{ margin: 20px!important; }
.m20-t{ margin-top: 20px!important; }
.m20-r{ margin-right: 20px!important; }
.m20-b{ margin-bottom: 20px!important; }
.m20-l{ margin-left: 20px!important; }

.m25{ margin: 25px!important; }
.m25-t{ margin-top: 25px!important; }
.m25-r{ margin-right: 25px!important; }
.m25-b{ margin-bottom: 25px!important; }
.m25-l{ margin-left: 25px!important; }

.m30{ margin: 30px!important; }
.m30-t{ margin-top: 30px!important; }
.m30-r{ margin-right: 30px!important; }
.m30-b{ margin-bottom: 30px!important; }
.m30-l{ margin-left: 30px!important; }

.m40{ margin: 40px!important; }
.m40-t{ margin-top: 40px!important; }
.m40-r{ margin-right: 40px!important; }
.m40-b{ margin-bottom: 40px!important; }
.m40-l{ margin-left: 40px!important; }

.m50{ margin: 50px!important; }
.m50-t{ margin-top: 50px!important; }
.m50-r{ margin-right: 50px!important; }
.m50-b{ margin-bottom: 50px!important; }
.m50-l{ margin-left: 50px!important; }

.m60{ margin: 60px!important; }
.m60-t{ margin-top: 60px!important; }
.m60-r{ margin-right: 60px!important; }
.m60-b{ margin-bottom: 60px!important; }
.m60-l{ margin-left: 60px!important; }

.m70{ margin: 70px!important; }
.m70-t{ margin-top: 70px!important; }
.m70-r{ margin-right: 70px!important; }
.m70-b{ margin-bottom: 70px!important; }
.m70-l{ margin-left: 70px!important; }

.m80{ margin: 80px!important; }
.m80-t{ margin-top: 80px!important; }
.m80-r{ margin-right: 80px!important; }
.m80-b{ margin-bottom: 80px!important; }
.m80-l{ margin-left: 80px!important; }

.m90{ margin: 90px!important; }
.m90-t{ margin-top: 90px!important; }
.m90-r{ margin-right: 90px!important; }
.m90-b{ margin-bottom: 90px!important; }
.m90-l{ margin-left: 90px!important; }

.m100{ margin: 100px!important; }
.m100-t{ margin-top: 100px!important; }
.m100-r{ margin-right: 100px!important; }
.m100-b{ margin-bottom: 100px!important; }
.m100-l{ margin-left: 100px!important; }


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1240px以下*/
@media screen and (max-width: 1240px){
	.btn-l, .ranking-item-link-buttons a, .btn-wrap.btn-wrap-l > a {
		margin: 2em 4em;
		padding: 14px 20px;
		font-size: 1.1em;
	}
}


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

}


/*768px以下*/
@media screen and (max-width: 768px){
	main.main{
		padding: 10px 25px;
	}

	.btn-l, .ranking-item-link-buttons a, .btn-wrap.btn-wrap-l > a {
		margin: 2em 3em;
		padding: 14px 35px;
		font-size: 1.2em;
	}

	.blogcard-snipet {
		margin-top: 0;
	}
}


/*480px以下*/
@media screen and (max-width: 480px){
	main.main{
		padding: 10px 15px;
	}
	.article h3, .article h4, .article h5, .article h6 {
		margin-top: 2em;
	}

	.btn-l, .ranking-item-link-buttons a, .btn-wrap.btn-wrap-l > a {
		margin: 2em 0;
		padding: 14px 35px;
		font-size: 1.1em;
	}

}
