@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

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

.article h1 { /* 見だし 境界線 */
	padding:20px 0 0 0;
	border-top: 5px solid #d3d3d3;
}

.article {  /* 個別記事 境界線 */
	border-bottom:5px solid #d3d3d3;
}

.article h3 {
  border-left: 5px solid #55A8DC;/*左線*/
  border-top: none;
  border-right: none;
  border-bottom: none;
  padding: .5em .7em;/*余白*/
  background: rgba(255,107,107,0.15);/*背景色*/
  color: #323232;
  
}

/*モバイルヘッダーの文字と背景の色を変える*/
.search-menu-button.menu-button,
.navi-menu-button.menu-button{
	background-color: #fcfcfc;
	font-size:25px;
	color: #303030;
	height: 60px;
}

.logo-menu-button.menu-button{
	background-color: #fcfcfc;
	height: 60px;
}
/*モバイルヘッダーの文字と背景の色を変える*/


.site-name-text{ /*サイト名を太字*/
font-weight: 600;
}

/*グローバルメニューにアンダーライン*/
#navi li a:after {
content: '';
width: 0;
border-bottom: 3px solid #292d48; /*下線の太さ・色*/
display: block;
}
#navi .navi-in a:hover:after {
width: 100%;
border-bottom: 3px solid #292d48; /*下線の太さ・色*/
}
/*グローバルメニューにアンダーライン*/


/************************************
** 人気記事 タイトル
************************************/
#main .main-widget-label  {
	font-weight: bold;
}

/************************************
** Amazonリンク画像 サイズ指定
************************************/
.pis-l figure.product-item-thumb {
  width: 300px;
}

@media screen and (max-width: 480px){
  .pis-l figure.product-item-thumb {
    width: 100%;
  }
} 



/*--------------------------------------------------------
 * デフォルト型 サムネイル画像のサイズを変更
--------------------------------------------------------*/
.ect-vertical-card .entry-card-wrap .entry-card-thumb img { 
	width: 75%;
}

.widget_popular_entries img {width: 75%;} /*人気記事サムネイル*/
/*--------------------------------------------------------
 * デフォルト型 サムネイル画像のサイズを変更
--------------------------------------------------------*/

.coupon_list {
	padding-top: 1em; 
}

.coupon_list  p {
	color:red;
	font-size:1.3em;
}

/* コピーボタン  本体テンプレート Cocoon: footer-javascript.php */
 .copybtn{
 margin: 0.5em auto;
 padding:0.5em;
 border:solid 2px #ddd;color:#333;
 background: #ffbc7a;/*ボタン色*/
 width: fit-content;
 color:#414141;
 font-size:16px;
 /*font-weight: bold;*/
 text-align: center; 
 cursor:pointer;
 border-radius:10px;
}

.entry_copybtn{ /* コピーボタン  個別記事用のコピーボタン  Cocoon: footer-javascript.php */
 margin: 0.5em auto;
 padding:0.5em;
 text-align: center; 
 border:solid 2px #ddd;color:#333;
 background: #ffbc7a;/*ボタン色*/
 color:#414141;
 /*font-weight: bold;*/
 cursor:pointer;
 border-radius:10px;
}

.copybtn:active {
 -webkit-transform: translateY(4px);
 transform: translateY(2px);/*下に動く*/
 }


/*サイトタイトル文字の大きさ*/


/*インデックスカードの枠線*/
a.entry-card-wrap.a-wrap.border-element.cf {
	border: 2px solid #DCDCDC;
}

.amazon-item-box { /*Amazonのボックス用コード*/    
    width:100%;
}

/*サイドバー見だし背景色*/
/*
.sidebar h3{
	background-color:#4C8DCB;
}
*/

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

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}

/************************************
** SNS ボタンをまとめて丸くする
************************************/

.sns-buttons {
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	margin:0 0 7px;
}
.sns-buttons a.share-button {
	width: 40px;
	height: 40px;
	margin: 0 5px;
	border-radius: 50%;
}
.sns-buttons a.share-button .social-icon {
	font-size: 24px;
}
.sns-buttons a.share-button .button-caption {
	display: none;
}