@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
*/

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

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

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

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

/* SNSフォローボタンカスタマイズ */
 .sidebar .sns-follow-buttons {
   justify-content: center; /*ボタンを中央寄せにする*/
 }
 .sidebar .sns-follow {
   margin: 0 0 24px 0;
 }
 .sidebar .sns-follow-buttons a {
   border-radius: 50%;
   width: 40px; /*ボタンの横の大きさ*/
   height: 40px; /*ボタンの縦の大きさ*/
   font-size: 20px; /*アイコンのサイズ*/
   margin: 0 6px; /*ボタン同士の間隔*/
 }
 .sidebar .instagram-button {
   background-color: #c522b8 !important;
 }

/* プロフィールのSNSアイコン */
/* リンクアイコンのデザインを丸くする */
.author-box .sns-follow .sns-follow-buttons a.follow-button {
  font-size: 36px;
  width: 46px;
  height: 46px;
  margin-bottom: 10px;
  margin-right: 10px;
  color: #fff;
  border: none;
  border-radius: 50%;
  box-shadow: 0 0 5px 0 rgba(0,0,0,.1),0 3px 5px 0 rgba(0,0,0,.2);
}

/* アイコンをセンタリングする */
.author-box .sns-follow-buttons a.follow-button span::before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -55%);
}

/* リンクアイコンの背景色にSNSのブランドカラーを設定する */
.author-box .sns-follow-buttons a.twitter-button {
  background-color: #1da1f2 !important;
}

.author-box .sns-follow-buttons a.feedly-button {
  background-color: #6cc655 !important;
}

.author-box .sns-follow-buttons a.rss-button {
  background-color: #f26522 !important;
}

/* SNSシェアボタンの変更 */
#main .button-caption {
	display: none; /*キャプション非表示*/
}

#main .sns-share a {
	height: 25px; /*ボタンの高さ*/
}


/************************************
** 記事選択時の浮き上がり
************************************/
.a-wrap:hover{
transform: translateY(-2px);
box-shadow: 2px 2px 6px 0 #ccc;
}

/************************************
** 記事一覧のページネーション変更
************************************/
.page-numbers {
 border-radius: 50%;
}

.pagination-next {
 display: none;
}