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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/* Cocoon用：table th 背景色変更 */
.entry-content .card .table th {
  background-color: #e0f7f4 !important;
}

/* タイムライン全体 */
.timeline-box {
  background: #ffffff;
  border-radius: 12px;
  padding: 30px;
  box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

.timeline-title {
  position: relative;
  border-bottom: none !important;
  padding-bottom: 16px;
  text-align: center;
}

.timeline-title::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 50%;
  max-width: 220px;
  height: 6px;
  border-radius: 10px;
  background: linear-gradient(90deg, #6ecfc4, #f4d8df);
}

/* 日付ラベル */
.timeline-item-label {
  border-color: #f4d8df !important;
}

/* 縦ライン上の丸（ドット） */
.timeline-item::before {
  background-color: #f4d8df !important;
  border-color: #f4d8df !important;
}

/* 事業内容 */
.column-left {
  border-radius: 12px !important;
  padding: 25px;
  transition: 0.3s ease;
  color: #333 !important;
}

.column-center {
  border-radius: 12px !important;
  padding: 25px;
  transition: 0.3s ease;
  color: #333 !important;
}

.column-right {
  border-radius: 12px !important;
  padding: 25px;
  transition: 0.3s ease;
  color: #333 !important;
}

/* 共通：やわらかターコイズ */
/* success-box --- バランス型 --- */
.success-box {
  background-color: #e0f7f4 !important;
  border: 1px solid #9edfd7 !important;
  color: #5c4a50 !important;
}

/* primary-box（少し強め） */
.primary-box {
  background-color: #d2f1ec !important;
  border: 1px solid #6ecfc4 !important;
  color: #5c4a50 !important;
}

/* light-box（かなり淡い） */
.light-box {
  background-color: #f0fbf9 !important;
  border: 1px solid #cceee8 !important;
  color: #6a555c !important;
}

/* 共通：料金表らしく少し整える */
.blank-box {
  border-radius: 14px;
  padding: 25px;
  transition: 0.3s ease;
  color: #333 !important;
}

/* --- 青（ベーシック） --- */
.blank-box.bb-blue {
  background-color: #eef6ff !important;
  border: 1px solid #bcdcff !important;
}

/* --- 緑（標準・安心） --- */
.blank-box.bb-green {
  background-color: #eefaf3 !important;
  border: 1px solid #bfe8d1 !important;
}

/* --- 赤（おすすめ・上位） --- */
.blank-box.bb-red {
  background-color: #fff1f1 !important;
  border: 1px solid #f5c2c2 !important;
}

.blank-box:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.08);
}

.blank-box h3,
.blank-box .box-title {
  color: #1f6f68 !important;
}

/* テーブル基本 */
.entry-content table {
  border-collapse: separate !important;
  border-spacing: 0;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 6px 20px rgba(0,0,0,0.04);
}

/* 行の区切り */
.entry-content table tr {
  border-bottom: 1px solid #f1f1f1;
}

/* 左セル */
.entry-content table th {
　background: #fff !important;
  position: relative;
  padding: 18px 20px 18px 26px; /* 左に余白追加 */
  border: none !important;
}

.entry-content table th {
  border-left: 6px solid #6ecfc4;
  border-radius: 4px 0 0 4px;
}

.information-box {
  background: #ffffff;
  border-radius: 12px;
}

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

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

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