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


/************************************
** ページフェードイン
************************************/

body {
  animation: fadein 0.5s forwards;
}

@keyframes fadein {
  0% {opacity: 0}
  100% {opacity: 1}
}



/************************************
** 見出しデザイン（統一版）
************************************/

/* =========================
   H2：グラデーション帯
========================= */

body .entry-content h2 {
  background: linear-gradient(to right, #21649c, #35d8f9) !important;
  color: #ffffff !important;
  padding: 16px 24px !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: 3px 5px 10px rgba(0,0,0,0.2) !important;
  margin-top: 50px !important;
  margin-bottom: 24px !important;
}

body .entry-content h2::before,
body .entry-content h2::after {
  display: none !important;
  content: none !important;
}



/* =========================
   H3：立体アクセントボックス
========================= */

body .entry-content h3 {
  position: relative;
  padding: 16px 20px 16px 22px !important;
  margin-top: 42px !important;
  margin-bottom: 20px !important;
  border: none !important;
  border-left: 6px solid #21649c !important;
  background: linear-gradient(180deg, #f7fbff 0%, #eef6ff 100%) !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
  color: #1a1a1a !important;
  box-shadow:
    0 2px 4px rgba(0,0,0,0.08),
    inset 0 1px 0 rgba(255,255,255,0.6);
  overflow: hidden;
}

body .entry-content h3::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2px;
  background: rgba(255,255,255,0.6);
}

body .entry-content h3::after {
  display: none !important;
  content: none !important;
}



/* =========================
   H4：シンプル細ライン
========================= */

body .entry-content h4 {
  padding-bottom: 6px !important;
  margin-top: 30px !important;
  margin-bottom: 14px !important;
  border: none !important;
  border-bottom: 2px solid #35d8f9 !important;
  background: transparent !important;
  font-weight: 600 !important;
  color: #333 !important;
}

body .entry-content h4::before,
body .entry-content h4::after {
  display: none !important;
  content: none !important;
}



/************************************
** 見出し余白調整
************************************/

.entry-content h2 + h3 {
  margin-top: 26px !important;
}

.entry-content h3 + h4 {
  margin-top: 14px !important;
}

.entry-content h3 + p {
  margin-top: 10px !important;
}



/************************************
** スマホ最適化
************************************/

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

  body .entry-content h2 {
    font-size: 20px !important;
    padding: 12px 14px !important;
    margin-top: 36px !important;
  }

  body .entry-content h3 {
    padding: 14px 14px 14px 16px !important;
    margin-top: 28px !important;
  }

  body .entry-content h4 {
    margin-top: 20px !important;
  }

}