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

/*
コンテンツの背景色
*/
.main{
    background-color: #000;
}

.a-wrap {
    color: #fff;
}


/* 固定ページ内のH4見出しをゴールドグラデーションにする場合 */
.page .entry-content h4{
  background: linear-gradient(45deg, #b8860b, #e6ca65, #996515, #e6ca65, #b8860b);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block; /* グラデーションの範囲を文字幅に合わせる場合 */
  font-weight: bold;
}
 

/* 固定ページ内のH5見出し：文字も下線もゴールドグラデーション */
.page .entry-content h5 {
  /* 文字のグラデーション設定 */
  background: linear-gradient(90deg, #b39855 0%, #fff9e6 50%, #b39855 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: bold;
  
  /* 余白の調整（左端に寄せる） */
  padding-left: 0 !important;
  margin-left: 0 !important;
  
  /* 下線のグラデーション設定 */
  border-bottom: 1px solid !important; /* 下線の太さ */
  border-image: linear-gradient(90deg, #b39855 0%, #fff9e6 50%, #b39855 100%) 1 !important;
  padding-bottom: 4px; /* 文字と下線の間の隙間（お好みで調整） */
}


/* スマホの時だけアピールエリアの画像を切れないようにする */
@media screen and (max-width: 480px) {
  .appeal-area {
    background-size: contain !important; /* 画像をすべて表示 */
    background-repeat: no-repeat !important; /* 繰り返しなし */
    background-position: center center !important; /* 中央寄せ */
  }
}


/* 固定ページのタイトル部分の余白を完全にゼロにする */
.page .entry-header {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* ついでにタイトル文字そのものも非表示にする場合（必要であれば） */
.page .entry-title {
  display: none !important;
}