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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/* reCAPTCHAバッジ非表示 */
.grecaptcha-badge {visibility: hidden;}

/* トップ＆サイドリストメニュー */
.xiik-deco{padding-top:5px;}
.xiik-font-title{font-size:30px;font-weight:bold;}
.xiik-font-snippet{font-size:20px;}
@media screen and (max-width:480px){
.xiik-deco{padding-top:15px;}
.xiik-font-title{font-size:20px}
.xiik-font-snippet{font-size:14px;}
}

/* リンク強調 */
.xiik_ad > a:hover,.xiik_ad_side > a:hover,.entry-content > a:hover,.related-list > a:hover,.alm-listing > a:hover,.widget-entry-cards a:hover{box-shadow:0 3px 10px #CCCC;transform:translate(0,-2px);}

/* モバイルメニューで検索バーが飛ぶ対策 */
.search-menu-content {top:70%;}

/* モバイルメニュータイトルフォント */
.logo-menu-button {font-size:70%;}
/*.mobile-menu-buttons .menu-button > a {color:#FFFFFF;}*/

/* 目次の幅 */
.entry-content .toc {width:50%;max-width:100%;}

/* スポンサーリンクフォント */
.ad-label {font-size:70%;}

/* 投稿リストのカテゴリーラベル非表示 */
.cat-label {display:none;}

/* 人気記事3カラム対応 */
main .popular-entry-cards {display:flex;flex-wrap:wrap;}
main .popular-entry-card-link {width:33%;}
@media screen and (max-width:834px) {main .popular-entry-card-link {width:50%;}}
@media screen and (max-width:480px) {main .popular-entry-card-link {width:100%;}}

/* 関連記事（WordPress Infinite Scroll - Ajax Load More対応） */
@media screen and (max-width:480px){.related-entry-card-wrap{width:100%!important;}}

/* 新着記事（WordPress Infinite Scroll - Ajax Load More対応） */
main .alm-listing {display:flex;flex-wrap:wrap;}
main .new-entry-card-link {width:33%;}
@media screen and (max-width:834px) {main .new-entry-card-link {width:50%;}}
@media screen and (max-width:480px) {main .new-entry-card-link {width:100%;}}
main .widget-entry-card-content {font-weight:700;font-size: var(--cocoon-default-text-size);margin-left:0;}
main .alm-listing .a-wrap {height:auto;padding:5px 5px 21px;line-height:1.3;margin-bottom:4px;}
main .new-entry-card-thumb {margin-right:0;width:100%;}
main .ajax-load-more-wrap ul {padding-left:0;}

/* PCとモバイルのナビゲーションメニューを透明にして個々に色を付ける */
#navi .navi-in a, .menu-drawer a, .navi {background-color:#FFF0; color:#000;}
#menu-item-87323, .menu-item-87323 {background-color:#FFF9B2;}
#menu-item-87324, .menu-item-87324 {background-color:#94C7B2;}
#menu-item-87327, .menu-item-87327 {background-color:#93C7E4;}
#menu-item-87326, .menu-item-87326 {background-color:#F8AEB2;}
#menu-item-87325, .menu-item-87325 {background-color:#AD95CB;}

/* トップイメージトリミング */
.xiik_topimg{overflow:hidden;border-radius:15px;}
.xiik_topimg > img{object-fit:cover;aspect-ratio:calc(842/447)/1;display:block;width:100%;max-width:100%;}

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

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

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