@charset "UTF-8";

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


/************************************
** 子テーマ用のスタイルを書く
************************************/
/* ========================================
   ロザニカ カテゴリページ
======================================== */


/* ----------------------------------------
   ページ全体
---------------------------------------- */

body.category {
  background: #fff;
}

body.category .content,
body.category .content-in,
body.category .main {
  background: #fff;
}

body.category .main {
  max-width: 1100px;
  margin: 0 auto;
  padding-top: 48px;
  padding-bottom: 72px;
}


/* ----------------------------------------
   カテゴリタイトル
---------------------------------------- */

body.category .archive-title {
  max-width: 1100px;

  margin: 0 0 18px;
  padding: 0 0 16px !important;

  border-bottom: 1px solid #222;

  font-size: 32px;
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: -0.02em;

  color: #111;
}


/* ----------------------------------------
   カテゴリタイトルのフォルダアイコンを非表示
---------------------------------------- */

body.category .archive-title::before,
body.category .archive-title::after {
  content: none !important;
  display: none !important;
}

body.category .archive-title i,
body.category .archive-title svg,
body.category .archive-title .fa,
body.category .archive-title .fas,
body.category .archive-title .far,
body.category .archive-title [class*="fa-folder"] {
  display: none !important;
}



/* ----------------------------------------
   記事一覧
---------------------------------------- */

body.category .list {
  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;

  margin: 0;
  padding: 0;
}


/*
   記事カード本体の border / border-radius 等には
   手を加えない。
   Cocoon標準のカードデザインをそのまま利用する。
*/


/* ----------------------------------------
   記事サムネイル
---------------------------------------- */

body.category .entry-card-thumb {
  flex: 0 0 96px;

  width: 96px;
  height: 96px;

  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;
  border-radius: 8px !important;

  overflow: hidden;
}

body.category .entry-card-thumb img {
  display: block;

  width: 100%;
  height: 100%;

  margin: 0;
  padding: 0;

  object-fit: cover;

  border: 0 !important;
  border-radius: 0 !important;

  transition: transform 0.3s ease;
}

body.category .entry-card-wrap:hover .entry-card-thumb img {
  transform: scale(1.03);
}


/* ----------------------------------------
   記事タイトル
---------------------------------------- */

body.category .entry-card-content {
  flex: 1;
  min-width: 0;
}

body.category .entry-card-title {
  margin: 0;

  font-size: 16px;
  line-height: 1.55;
  font-weight: 700;

  color: #111;

  text-decoration: none !important;
}


/* ========================================
   タブレット
   834px以下
======================================== */

@media screen and (max-width: 834px) {

  body.category .main {
    padding-top: 32px;
    padding-bottom: 48px;
  }


  /* カテゴリ名 */

  body.category .archive-title {
    margin-bottom: 16px;

    font-size: 26px;
  }


  /* カテゴリ説明 */

  body.category .category-content,
  body.category .cat-description,
  body.category .archive-description {
    margin-bottom: 32px;

    font-size: 13px;
    line-height: 1.8;
  }


  /* 記事一覧 */

  body.category .list {
    grid-template-columns: 1fr;
    gap: 14px;
  }


  /* サムネイル */

  body.category .entry-card-thumb {
    flex-basis: 88px;

    width: 88px;
    height: 88px;
  }


  /* 記事タイトル */

  body.category .entry-card-title {
    font-size: 15px;
  }

}


/* ========================================
   スマートフォン
   480px以下
======================================== */

@media screen and (max-width: 480px) {

  body.category .main {
    padding-top: 24px;
    padding-bottom: 40px;
  }


  /* ----------------------------------------
     カテゴリ名
  ---------------------------------------- */

  body.category .archive-title {
    margin-left: 20px !important;
    margin-right: 20px !important;
    margin-bottom: 14px !important;

    padding: 0 0 11px !important;

    font-size: 22px;
    line-height: 1.4;
  }


 /* カテゴリ説明 */
body.category .category-content,
body.category .cat-description,
body.category .archive-description {
  max-width: none;

  margin-left: 20px !important;
  margin-right: 20px !important;
  margin-bottom: 28px !important;

  padding: 0 !important;

  font-size: 13px !important;
  line-height: 1.6 !important;

  color: #555;
}

/* Cocoon側のp指定も上書き */
body.category .category-content p,
body.category .cat-description p,
body.category .archive-description p {
  margin: 0 !important;

  font-size: 13px !important;
  line-height: 1.6 !important;
}


  /* ----------------------------------------
     記事サムネイル
  ---------------------------------------- */

  body.category .entry-card-thumb {
    flex-basis: 82px;

    width: 82px;
    height: 82px;
  }


  /* ----------------------------------------
     記事タイトル
  ---------------------------------------- */

  body.category .entry-card-title {
    font-size: 15px;
    line-height: 1.5;
  }

}

