@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){
  /*必要ならばここにコードを書く*/
}
/* ========================================= */
/* Canvaテイスト全体フォント設定              */
/* ========================================= */
body {
  font-family: "Hiragino Maru Gothic ProN", "Yu Gothic Medium", sans-serif;
  line-height: 1.9;
  color: #333;
}

/* ========================================= */
/* Heroセクション（Canva風スカイブルー）      */
/* ========================================= */
.hero-section {
  background: linear-gradient(180deg, #4A90E2 0%, #6EB0F5 100%) !important;
  color: #fff !important;
  padding: 60px 20px !important;
  text-align: center !important;
  border-radius: 0 0 20px 20px;
}

.hero-section h1 {
  font-size: 28px !important;
  font-weight: 700 !important;
  margin-bottom: 12px !important;
}

.hero-section p {
  font-size: 16px !important;
  opacity: 0.95;
}

/* ========================================= */
/* Canvaカラー：料金プランボタン              */
/* ========================================= */
.hero-section .cta-button,
.wp-block-button__link,
a.cta-button {
  background: #FF6F61 !important; /* Canva風の赤みがかったコーラル */
  color: #fff !important;
  padding: 14px 28px !important;
  border-radius: 30px !important;
  font-weight: 700 !important;
  font-size: 18px !important;
  text-decoration: none !important;
  display: inline-block;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15) !important;
  transition: all 0.25s ease-in-out;
}

.cta-button:hover,
.wp-block-button__link:hover {
  transform: translateY(-2px);
  opacity: 0.9;
}

/* ========================================= */
/* Canva風：やさしいカードデザイン            */
/* ========================================= */
.section-card,
div[style*="border:2px solid"],
.card-box {
  background: #fff !important;
  border-radius: 20px !important;
  padding: 35px 28px !important;
  border: none !important;
  box-shadow: 0 4px 14px rgba(0,0,0,0.08) !important;
  margin-bottom: 45px !important;
}

/* ========================================= */
/* 見出し：Canvaテイスト（柔らかく太字）       */
/* ========================================= */
h2 {
  font-size: 24px !important;
  font-weight: 700 !important;
  margin-top: 40px !important;
  margin-bottom: 20px !important;
  color: #333;
}

h3 {
  font-size: 20px !important;
  font-weight: 600 !important;
  margin-top: 28px !important;
  margin-bottom: 12px !important;
}

/* ========================================= */
/* セクション間のゆったり余白                  */
/* ========================================= */
section,
.entry-content > div {
  margin-bottom: 55px !important;
}

/* ========================================= */
/* Canva風チェックアイコンのための調整         */
/* ========================================= */
.entry-content ul {
  padding-left: 1.2em;
}

.entry-content ul li {
  margin-bottom: 10px;
  font-size: 16px;
}

/* ========================================= */
/* フォームデザイン（CF7）                    */
/* ========================================= */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea,
.wpcf7 select {
  width: 100%;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid #ccc;
  font-size: 16px;
  margin-bottom: 16px;
}

.wpcf7-submit {
  background: #FF6F61 !important;
  border-radius: 30px !important;
  color: #fff !important;
  padding: 14px 30px !important;
  font-size: 18px !important;
  font-weight: 700;
  box-shadow: 0 4px 10px rgba(0,0,0,0.12) !important;
  transition: 0.25s ease;
}

.wpcf7-submit:hover {
  transform: translateY(-2px);
  opacity: 0.9;
}

/* ========================================= */
/* 法務ページ（読みやすい余白＆カード）        */
/* ========================================= */
.legal-wrapper {
  background:#fff !important;
  padding: 30px !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.07) !important;
  margin-bottom: 40px !important;
}

/* ========================================= */
/* ボタン汎用：角丸＆優しい影                 */
/* ========================================= */
.button,
a.button {
  border-radius: 25px !important;
  padding: 12px 26px !important;
  background: #4A90E2 !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.12) !important;
}

.button:hover {
  opacity: 0.9;
}