@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){
  /*必要ならばここにコードを書く*/
}


/************************************
** トップページ用：コンテナ・ヒーロー・6通りの注文方法
************************************/

/* コンテナ */
.kk-wrap{
  max-width:1100px;
  margin:auto;
  padding:24px;
}

/* ヒーロー */
.kk-hero{
  background:#fafafa;
  border-bottom:1px solid #eee;
}
.kk-hero h1{
  font-size:clamp(22px,4.2vw,36px);
  line-height:1.3;
  margin:0 0 8px;
  font-weight:700;
}
.kk-hero .kk-sub{
  font-weight:700;
  margin:0 0 12px;
}
.kk-hero .kk-lead{
  margin:0 0 16px;
  line-height:1.8;
}
.kk-cta{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.kk-btn{
  display:inline-block;
  padding:10px 18px;
  border-radius:999px;
  background:#111;
  color:#fff;
  text-decoration:none;
}
.kk-btn.ghost{
  background:#fff;
  color:#111;
  border:1px solid #111;
}

/* 5カード導線 */
.kk-why h2{
  font-size:clamp(18px,3.2vw,24px);
  margin:0 0 12px;
}
.kk-cards5{
  display:grid;
  grid-template-columns:repeat(1,1fr);
  gap:10px;
  list-style:none;
  margin:0;
  padding:0;
}
.kk-cards5 a{
  display:block;
  padding:14px 16px;
  border:1px solid #eee;
  border-radius:12px;
  background:#fff;
  text-decoration:none;
}
.kk-cards5 strong{
  display:block;
  font-weight:700;
  margin:0 0 4px;
}
.kk-cards5 span{
  color:#555;
}
@media (min-width:720px){
  .kk-cards5{
    grid-template-columns:repeat(5,1fr);
  }
}

/* ========== 6通りの注文方法（kk-order） ========== */
.kk-order-title{
  font-size:clamp(18px,3.2vw,24px);
  margin:0 0 12px;
}
.kk-order-grid{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:14px;
  grid-template-columns:1fr;
}
@media (min-width:640px){
  .kk-order-grid{
    grid-template-columns:repeat(2,1fr);
  }
}
@media (min-width:980px){
  .kk-order-grid{
    grid-template-columns:repeat(3,1fr);
  }
}
.kk-order-card a{
  display:block;
  border:1px solid #eee;
  border-radius:14px;
  background:#fff;
  text-decoration:none;
  overflow:hidden;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.kk-order-card a:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 18px rgba(0,0,0,.06);
  border-color:#ddd;
}
.kk-order-fig{
  margin:0;
}
.kk-order-fig img{
  display:block;
  width:100%;
  height:auto;
}
.kk-order-text{
  padding:12px 14px;
}
.kk-order-text strong{
  display:block;
  font-weight:700;
  margin:0 0 4px;
  color:#111;
}
.kk-order-text span{
  color:#555;
  font-size:0.95em;
}

/************************************
** トップページ側メニュー（tside）用
************************************/

/* 中身（リンクの基本） */
.tside nav > ul > li > ul a{
  display:inline-block;
  padding:4px 0;
  text-decoration:none;
}
.tside nav > ul > li > ul a:hover{
  text-decoration:underline;
}


/************************************
** /order-shirts/ 用サイドメニュー
************************************/

/* コンテナ */
.side-order{
  width:200px;
  margin:0 auto 20px;
  text-align:center;
  box-sizing:border-box;
}
.side-order a{
  color:#333;
  text-decoration:none;
}
.side-order aside{
  margin:0;
}

/* ---------- アコーディオン本体 ---------- */

/* パネル共通（accrd01〜05） */
.side-order ul li ul{
  padding:.5em;
  border-width:3px;
  border-style:solid;
  background:#fff;
  display:none; /* 初期状態はJSで開くまで非表示 */
}

/* パネルの枠色 */
.side-order .accrd01{border-color:#f0b265;}
.side-order .accrd02{border-color:#f49bbb;}
.side-order .accrd03{border-color:#a5c98c;}
.side-order .accrd04{border-color:#60afd6;}
.side-order .accrd05{border-color:#9ca9c9;}

/* タブの帯色（下地） */
.side-order ul li:nth-of-type(1) p{background:#f0b265;}
.side-order ul li:nth-of-type(2) p{background:#f49bbb;}
.side-order ul li:nth-of-type(3) p{background:#a5c98c;}
.side-order ul li:nth-of-type(4) p{background:#60afd6;}
.side-order ul li:nth-of-type(5) p{background:#9ca9c9;}

/* タブのグラデーション（左から白く抜ける） */
.side-order a.accord,
.side-order a.accord2{
  display:block;
  padding:1em 0;
  width:100%;
  color:#fff;
  text-align:center;
  font-size:1.2em;
  background:rgba(255,255,255,1);
  background:-moz-linear-gradient(left, rgba(255,255,255,.7) 0%, rgba(255,255,255,.5) 25%, rgba(255,255,255,0) 100%);
  background:-webkit-gradient(left top, right top,
    color-stop(0%, rgba(255,255,255,.7)),
    color-stop(25%, rgba(255,255,255,.5)),
    color-stop(100%, rgba(255,255,255,0)));
  background:-webkit-linear-gradient(left, rgba(255,255,255,.7) 0%, rgba(255,255,255,.5) 25%, rgba(255,255,255,0) 100%);
  background:-o-linear-gradient(left, rgba(255,255,255,.7) 0%, rgba(255,255,255,.5) 25%, rgba(255,255,255,0) 100%);
  background:-ms-linear-gradient(left, rgba(255,255,255,.7) 0%, rgba(255,255,255,.5) 25%, rgba(255,255,255,0) 100%);
  background:linear-gradient(to right, rgba(255,255,255,.7) 0%, rgba(255,255,255,.5) 25%, rgba(255,255,255,0) 100%);
  cursor:pointer;
}
.side-order a.accord2{
  font-size:1em;
  padding:1.2em 0;
}
.side-order a.accord:hover,
.side-order a.accord2:hover{
  background:none;          /* グラデーションを消す */
  color:#fff;
  text-shadow:1px 1px 1px rgba(0,0,0,.4);
  /* Cocoon側に a:hover の下線指定があれば、そのまま使う */
}

/* パネル内共通 */
.side-order ul li ul li{
  margin-bottom:5px;
}

/* ブランド一覧（画像バナー） */
.side-order ul li ul li a{
  display:block;
  width:170px;
  height:30px;
  background-position:top center;
  background-repeat:no-repeat;
  margin:0 auto;
}
.side-order .accrd01 a{
  text-indent:-999em;
  -webkit-transition:0s;
  -moz-transition:0s;
  -o-transition:0s;
  transition:0s;
}
.side-order ul li ul li a:hover{
  background-position:bottom;
  box-shadow:1px 1px 2px #ccc,
              -1px 1px 2px #ccc,
              -1px -1px 2px #ccc,
               1px -1px 2px #ccc;
}

/* カラー・柄 （テキスト＋サムネ） */
.side-order .accrd02 a,
.side-order .accrd03 a{
  text-align:left;
}
.side-order .accrd02 img,
.side-order .accrd03 img{
  margin-right:1em;
  vertical-align:middle;
}

/* 価格帯 */
.side-order .accrd04 a{
  display:block;
  border-left:2px #666 solid;
  border-bottom:1px #666 solid;
  padding:4px 6px;
  text-align:left;
  white-space:nowrap;
  font-size:13px;
  line-height:1.4;
  box-sizing:border-box;
}
.side-order .accrd04 a b{
  font-size:1.4em;
  font-family:"ＭＳ Ｐ明朝","MS PMincho","ヒラギノ明朝 Pro W3","Hiragino Mincho Pro",serif;
  font-weight:bold;
}

/* ブランド名ごとの画像（/com/img/sidenav/ 以下） */
.side-order .accrd01 li.canclini a     { background-image:url("/com/img/sidenav/bnr_canclini.jpg"); }
.side-order .accrd01 li.albini a       { background-image:url("/com/img/sidenav/bnr_albini.jpg"); }
.side-order .accrd01 li.tmason a       { background-image:url("/com/img/sidenav/bnr_thomasmason.jpg"); }
.side-order .accrd01 li.tmjourney a    { background-image:url("/com/img/sidenav/bnr_tmjourney.jpg"); }
.side-order .accrd01 li.tmgold a       { background-image:url("/com/img/sidenav/bnr_tmgold.jpg"); }
.side-order .accrd01 li.alumo a        { background-image:url("/com/img/sidenav/bnr_alumo.jpg"); }
.side-order .accrd01 li.albiate a      { background-image:url("/com/img/sidenav/bnr_albiate.jpg"); }
.side-order .accrd01 li.anteks a       { background-image:url("/com/img/sidenav/bnr_anteks.jpg"); }
.side-order .accrd01 li.soktas a       { background-image:url("/com/img/sidenav/bnr_soktas.jpg"); }
.side-order .accrd01 li.testa a        { background-image:url("/com/img/sidenav/bnr_testa.jpg"); }
.side-order .accrd01 li.somelos a      { background-image:url("/com/img/sidenav/bnr_somelos.jpg"); }
.side-order .accrd01 li.oltolina a     { background-image:url("/com/img/sidenav/bnr_oltolina.jpg"); }
.side-order .accrd01 li.texta a        { background-image:url("/com/img/sidenav/bnr_texta.jpg"); }
.side-order .accrd01 li.getzner a      { background-image:url("/com/img/sidenav/bnr_getzner.jpg"); }
.side-order .accrd01 li.honegger a     { background-image:url("/com/img/sidenav/bnr_honegger.jpg"); }
.side-order .accrd01 li.acorn a        { background-image:url("/com/img/sidenav/bnr_acorn.jpg"); }
.side-order .accrd01 li.djohn a        { background-image:url("/com/img/sidenav/bnr_djanderson.jpg"); }
.side-order .accrd01 li.grandi a       { background-image:url("/com/img/sidenav/bnr_grandi.jpg"); }
.side-order .accrd01 li.weba a         { background-image:url("/com/img/sidenav/bnr_weba.jpg"); }
.side-order .accrd01 li.carlo a        { background-image:url("/com/img/sidenav/bnr_carloriva.jpg"); }
.side-order .accrd01 li.seais a        { background-image:url("/com/img/sidenav/bnr_seaisland.jpg"); }
.side-order .accrd01 li.oimport a      { background-image:url("/com/img/sidenav/bnr_others_import.jpg"); }
.side-order .accrd01 li.giza a         { background-image:url("/com/img/sidenav/bnr_giza.jpg"); }
.side-order .accrd01 li.others a       { background-image:url("/com/img/sidenav/bnr_others.jpg"); }
.side-order .accrd01 li.brembana a     { background-image:url("/com/img/sidenav/bnr_brembana.jpg"); }
.side-order .accrd01 li.carlobasetti a { background-image:url("/com/img/sidenav/bnr_carlobasetti.jpg"); }
.side-order .accrd01 li.leggiuno a     { background-image:url("/com/img/sidenav/bnr_leggiuno.jpg"); }
.side-order .accrd01 li.spence a       { background-image:url("/com/img/sidenav/bnr_spence.jpg"); }
.side-order .accrd01 li.monti a        { background-image:url("/com/img/sidenav/bnr_monti.jpg"); }
.side-order .accrd01 li.easycare a     { background-image:url("/com/img/sidenav/bnr_easycare.jpg"); }

/* サイドメニュー内フォントはサイト全体に合わせる */
.side-order,
.side-order *{
  font-family:inherit;
}

/* ---------- サイドバー下部のバナー群 ---------- */

.side-order ul.banner{
  margin:.5em auto;
  padding:0;
  list-style:none;
}
.side-order ul.banner li{
  margin:2px auto;
  padding:0;
  line-height:0;
}
.side-order ul.banner li a{
  display:block;
}
.side-order ul.banner li img{
  display:block;
  max-width:100%;
  height:auto;
}

/* 2個目以降の .banner にだけ枠線を付ける（最上段は枠なし） */
.side-order ul.banner:not(:first-child) li{
  border:1px #999 solid;
}
.side-order ul.banner:not(:first-child) li img{
  width:198px;
}

/* 開いているタブを少し強調（任意） */
.side-order li.is-open > p a.accord,
.side-order li.is-open > p a.accord2{
  text-shadow: 1px 1px 2px rgba(0,0,0,.35);
}

/************************************
** Cocoon 側の「押し込み」演出を無効化
************************************/

/* サイドメニュー内のリンクが上下に動かないようにする */
.side-order ul[class^="accrd"] li a,
.side-order .banner li a{
  position:static !important;
  top:auto !important;
}

/* カラー・柄・秋冬リストは枠・影を消してずれ防止 */
.side-order .accrd02 li a,
.side-order .accrd03 li a,
.side-order .accrd05 li a{
  box-shadow:none !important;
  border:none !important;
}
.side-order .accrd02 li a:hover,
.side-order .accrd02 li a:focus,
.side-order .accrd02 li a:active,
.side-order .accrd03 li a:hover,
.side-order .accrd03 li a:focus,
.side-order .accrd03 li a:active,
.side-order .accrd05 li a:hover,
.side-order .accrd05 li a:focus,
.side-order .accrd05 li a:active{
  box-shadow:none !important;
  border:none !important;
}

/* カラー・柄リストの行間と余白 */
.side-order ul.accrd02 li,
.side-order ul.accrd03 li{
  margin:0;
  padding:0;
}
.side-order ul.accrd02 li a,
.side-order ul.accrd03 li a{
  display:block;
  padding:4px 4px;
  margin-bottom:2px;
  line-height:1.5;
  box-sizing:border-box;
}


/************************************
** 追加調整：タブ高さ63px＋ホバー下線＋リスト項目ホバー青
**（JSは触らない＝動きは崩れません）
************************************/

/* 1) アコーディオン見出し（ブランド/カラー/柄/価格/秋冬）を高さ63pxに揃える */
.side-order a.accord,
.side-order a.accord2{
  padding:0 !important;
  height:63px;
  line-height:63px;
  box-sizing:border-box;
  text-decoration:none; /* 通常時は下線なし */
}

/* 2) 見出しにホバーで「下線」（旧サイトの見た目） */
.side-order a.accord:hover,
.side-order a.accord2:hover{
  text-decoration:underline;
  text-decoration-thickness:2px;
  text-underline-offset:0.18em;
}

/* 3) アコーディオン内のリンク（カラー/柄/価格/秋冬）にホバーで「青＋下線」 */
.side-order .accrd02 li a:hover,
.side-order .accrd03 li a:hover,
.side-order .accrd04 li a:hover,
.side-order .accrd05 li a:hover,
.side-order .accrd02 li a:focus,
.side-order .accrd03 li a:focus,
.side-order .accrd04 li a:focus,
.side-order .accrd05 li a:focus{
  color:#1e73be !important;
  text-decoration:underline !important;
  text-decoration-thickness:1px;
  text-underline-offset:0.18em;
}


/* 見出しバナー文字サイズ（これはそのままでOK） */
.side-order a.accord{ font-size:1.05em !important; }
.side-order a.accord2{ font-size:0.90em !important; }

/* 上部バナー（1枚目）だけ：元画像 200×87 をそのまま表示（拡大・潰れ・切れ防止） */
.side-order ul.banner:first-of-type{
  width:200px;
  margin:.5em auto;
  padding:0;
}

.side-order ul.banner:first-of-type li{
  margin:0;
  padding:0;
  line-height:0;
}

.side-order ul.banner:first-of-type li a{
  display:block;
  width:200px;
  margin:0 auto;
  padding:0 !important;
  border:0 !important;
  background:none !important;
  overflow:visible !important;
}

.side-order ul.banner:first-of-type li img{
  display:block;
  width:200px !important;
  height:auto !important;        /* 200×87なら自動的に87pxになります */
  max-width:none !important;
  max-height:none !important;
  transform:none !important;     /* ← これが「200px超え」の根本原因を止める */
  object-fit:initial !important; /* cover等を無効化 */
}

/* ========= ブランドバナー（accrd01）だけ：ホバーで瞬時に反転（sprite下段表示） ========= */

/* 通常（上段） */
.side-order ul.accrd01 li a{
  width:170px;
  height:30px;
  background-repeat:no-repeat;
  background-position:center top !important; /* 上段を表示 */
  background-size:170px 60px !important;    /* 30px×2段想定（旧サイトと同じ） */

  /* Cocoonのフェード/アニメを無効化して“瞬時”にする */
  opacity:1 !important;
  transition:none !important;
  -webkit-transition:none !important;
}

/* ホバー（下段＝反転側） */
.side-order ul.accrd01 li a:hover,
.side-order ul.accrd01 li a:focus{
  background-position:center bottom !important; /* 下段を表示（反転） */
  opacity:1 !important;
  transition:none !important;
  -webkit-transition:none !important;

  /* 旧サイトの影（必要なら） */
  box-shadow:1px 1px 2px #ccc,
             -1px 1px 2px #ccc,
             -1px -1px 2px #ccc,
              1px -1px 2px #ccc;
}

/* ==============================
   行間をもう少し詰める（カラー/柄）
============================== */
.side-order ul.accrd02 li a,
.side-order ul.accrd03 li a{
  padding:4px 6px;   /* ← 6px→4pxに詰める */
  gap:10px;          /* ← 12px→10px */
  line-height:1.15;  /* ← 1.25→1.15 */
}

/* サムネも少しだけ締める（好みで） */
.side-order ul.accrd02 li a img,
.side-order ul.accrd03 li a img{
  width:40px;        /* ← 44px→40px（バランス調整） */
}

/* ==============================
   見出し帯（バナー）の文字が黒くならないよう固定
============================== */
.side-order a.accord,
.side-order a.accord2,
.side-order a.accord:hover,
.side-order a.accord2:hover,
.side-order a.accord:focus,
.side-order a.accord2:focus,
.side-order a.accord:active,
.side-order a.accord2:active,
.side-order a.accord:visited,
.side-order a.accord2:visited{
  color:#fff !important;
}　

/* =========================================================
   #fabric-accordion：上段5枚タブだけを全幅5等分（色は触らない）
   ========================================================= */

/* 親が inline / center の影響を受けないように */
#fabric-accordion.fabric-accordion-top,
#fabric-accordion.fabric-accordion-top nav{
  width:100%;
}
#fabric-accordion.fabric-accordion-top nav{
  display:block;
  text-align:left; /* 念のため */
}

/* accord.js の出力が nav直下 ul でも、nav > div > ul でも効くように */
#fabric-accordion.fabric-accordion-top nav > ul,
#fabric-accordion.fabric-accordion-top nav > div > ul{
  display:flex;
  width:100%;
  margin:0;
  padding:0;
  list-style:none;
}

/* 5等分 */
#fabric-accordion.fabric-accordion-top nav > ul > li,
#fabric-accordion.fabric-accordion-top nav > div > ul > li{
  flex:1 1 0;
  min-width:0;
}

/* p の余白で中央寄りになるのを防ぐ */
#fabric-accordion.fabric-accordion-top nav > ul > li > p,
#fabric-accordion.fabric-accordion-top nav > div > ul > li > p{
  margin:0;
}

/* タブ(a)を幅いっぱいに（pの中でも直下でも対応） */
#fabric-accordion.fabric-accordion-top nav > ul > li > p > a.accord,
#fabric-accordion.fabric-accordion-top nav > ul > li > p > a.accord2,
#fabric-accordion.fabric-accordion-top nav > div > ul > li > p > a.accord,
#fabric-accordion.fabric-accordion-top nav > div > ul > li > p > a.accord2,
#fabric-accordion.fabric-accordion-top nav > ul > li > a.accord,
#fabric-accordion.fabric-accordion-top nav > ul > li > a.accord2,
#fabric-accordion.fabric-accordion-top nav > div > ul > li > a.accord,
#fabric-accordion.fabric-accordion-top nav > div > ul > li > a.accord2{
  display:block;
  width:100%;
  box-sizing:border-box;
  text-align:center;
}

/* #fabric-accordion：上段タブを横幅100%で5等分（色は触らない） */
#fabric-accordion.fabric-accordion-top,
#fabric-accordion.fabric-accordion-top nav{
  width:100% !important;
  max-width:none !important;
}

/* ここが“中央寄り”の原因になりやすいので潰す */
#fabric-accordion.fabric-accordion-top nav{
  display:block !important;
  text-align:left !important;
}

/* accord.jsが nav直下に ul を出す場合 */
#fabric-accordion.fabric-accordion-top nav > ul{
  display:flex !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}
#fabric-accordion.fabric-accordion-top nav > ul > li{
  flex:1 1 0 !important;
  min-width:0 !important;
}
#fabric-accordion.fabric-accordion-top nav > ul > li > p{
  margin:0 !important;
}
#fabric-accordion.fabric-accordion-top nav > ul > li > p > a.accord,
#fabric-accordion.fabric-accordion-top nav > ul > li > p > a.accord2{
  display:block !important;
  width:100% !important;
  text-align:center !important;
  box-sizing:border-box !important;
}

/* =========================
   ブログ一覧：先頭だけ大きく
   ========================= */

/* グリッド（カード）なら横幅いっぱいに */
body.blog .is-first{
  grid-column: 1 / -1;
}

/* 画像を大きく（Cocoonは img に幅指定が入ることがあるため上書き） */
body.blog .is-first img{
  max-width: 100%;
  height: auto;
}

/* タイトルと抜粋を少し強調 */
body.blog .is-first .entry-card-title,
body.blog .is-first .card-title{
  font-size: 1.15em;
}

body.blog .is-first .entry-card-snippet,
body.blog .is-first .card-snippet,
body.blog .is-first .excerpt{
  font-size: 1em;
  line-height: 1.7;
}

/* =========================================
   ブログ一覧：先頭記事だけ「画像フル幅→下にテキスト」
   ========================================= */

/* 先頭記事の「左右2カラム」を解除して縦積みにする */
body.blog .is-first .entry-card,
body.blog .is-first .entry-card-wrap,
body.blog .is-first .entry-card-content,
body.blog .is-first .card-content{
  display: block !important;
}

/* サムネ枠をフル幅に */
body.blog .is-first .entry-card-thumb,
body.blog .is-first .card-thumb,
body.blog .is-first .entry-card-thumbnail{
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 12px !important;
  float: none !important;
}

/* 画像を枠いっぱい（横100%）に */
body.blog .is-first .entry-card-thumb img,
body.blog .is-first .card-thumb img,
body.blog .is-first .entry-card-thumbnail img{
  display: block;
  width: 100% !important;
  height: auto !important;
  object-fit: cover;
  border-radius: 6px; /* 角丸不要なら消してOK */
}

/* テキスト側もフル幅に（右側に回り込ませない） */
body.blog .is-first .entry-card-info,
body.blog .is-first .card-info{
  width: 100% !important;
  float: none !important;
}

/* 抜粋は“適量”で止める（行数で制御） */
body.blog .is-first .entry-card-snippet,
body.blog .is-first .card-snippet,
body.blog .is-first .excerpt{
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;  /* 3〜6で調整 */
  overflow: hidden;
}

/* =========================================
   先頭記事：テキストの右寄り解消＋全文表示
   ========================================= */

body.blog .is-first{
  text-align: left !important; /* 親がcenterになっているケースを潰す */
}

/* タイトル・抜粋・メタ（本日/週/月/全体など）の箱をフル幅に */
body.blog .is-first .entry-card-info,
body.blog .is-first .card-info,
body.blog .is-first .entry-card-content,
body.blog .is-first .card-content{
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  text-align: left !important;
}

/* 抜粋は全部出す（前に line-clamp を入れていた場合の解除） */
body.blog .is-first .entry-card-snippet,
body.blog .is-first .card-snippet,
body.blog .is-first .excerpt{
  display: block !important;
  -webkit-line-clamp: unset !important;
  overflow: visible !important;
}