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

/* Cocoonのリスト崩れを防止する修正版 */
.entry-content .nomadList10 {
  position: relative;
  color: #323232;
  background: rgba(224,116,135,.07);
  border: 1px solid #E07487;
  padding-top: 2.5em;
  overflow: hidden;
  border-radius: 5px 5px 0 0;
  margin: 15px 0;
  max-width: 100% !important;
  width: 100% !important;
}

.entry-content .nomadList10 span {
  position: absolute;
  top: 0;
  left: 0;
  background: #E07487;
  color: #FFF;
  width: 100%;
  text-align: center;
  padding: .4em;
  box-sizing: border-box; /* 追加：Cocoon環境での横幅はみ出し防止 */
}

.entry-content .nomadList10 ul {
  margin: 0;
  padding: 15px 15px 15px 2em; /* 修正：黒い点（・）が箱の中に綺麗に収まるように左余白を確保 */
}

.entry-content .nomadList10 ul li {
  margin: 0 0 5px 0; /* 修正：Cocoon特有の不要な上下マージンをリセット */
  padding: 0;
}

.entry-content .nomadList10 p {
  padding-bottom: 0;
  margin: 0;
}

.nomadList5 {
  padding: .7em 2.5em;
  margin: 15px 0;
  color: #323232;
  border-left: solid 4px #323232;
  background:rgba(50,50,50,.07);
  max-width: 100% !important;
  width: 100% !important;
}
.nomadList5 ul {
  margin: 0;
  padding: 10px 0;
}
.nomadList5 ul li {
  margin-bottom: 5px;
}

.nomadBtn2 {
  color: #FFF !important;
  border-radius: 50em 50em 50em 50em;
  background: #E07487;
  padding: .7em 2em;
  display: inline-block;
  text-decoration: none !important;
  margin: 15px 0;
}

.nomadList9 {
  position: relative;
  color: #323232;
  background: #FFF;
  padding: .3em 1.7em;
  margin: 3em 0 15px 0;
  background:rgba(224,116,135,.07);
  border: 1px solid #E07487;
  max-width: 100% !important;
  width: 100% !important;
}
.nomadList9:after {
  position: absolute;
  font-family: "Font Awesome 5 Free", 'Quicksand', 'Avenir', 'Arial', sans-serif;
  content: '\f00c ここにタイトル';/* 文字の変更*/
  background: #E07487;
  color: #FFF;
  left: -1px;
  bottom: 100%;
  border-radius: 5px 5px 0 0;
  padding: 5px 15px;
  font-size: .8em;
  font-weight: 600;
  text-align: center;
}
.nomadList9 ul{
  margin: 0;
  padding: 10px;
}
.nomadList9 ul li {
  margin-bottom: 5px;
}

.nomadBox8 {
  position: relative;
  margin: 15px 0;
  padding: 1.5em;
  color: #323232;
  border-top: solid 2px #E07487;
  border-bottom: solid 2px #E07487;
}
.nomadBox8:before,
.nomadBox8:after {
  content: '';
  position: absolute;
  top: -10px;
  width: 2px;
  height: -webkit-calc(100% + 20px);
  height: calc(100% + 20px);
  background-color: #E07487;
}
.nomadBox8:before {left: 10px;}
.nomadBox8:after {right: 10px;}
.nomadBox8 p {
    margin: 0;
    padding: 0;
}

.box3-pink {
	position: relative;	/* 配置に関するもの(ここを基準に) */
	max-width:600px; /* ボックスの横幅 */
	margin: 2em auto;	/* ボックスの外側余白(上下:2em　左右:auto) */
	padding: 1.7em 2em;	/* ボックスの内側余白(上下:1.7em　左右:2em) */
	border: 2px solid #f27398;	/* ボックスの線 (太さ　線の種類　線の色)*/
	border-radius: 4px;	/* ボックスの角丸 */
}
.box3-pink .box-title {
	position: absolute; /* 配置に関するもの(ここを動かす) */
	top: -10px; /* 上から（-10px）移動*/
	left: 30px; /* 左から(30px)移動 */
	background: #fff; /* タイトル背景色 */
	color: #f27398; /* タイトル文字色 */
	padding: 0 10px;/* タイトルの余白 */
	line-height: 1;/* タイトルの行の高さ */
	font-size: 20px;/* タイトル文字の大きさ */
	font-weight: bold;/* タイトル文字の太さ */
}
.box3-pink p {
	margin: 0; /* 文字の外側余白リセット*/
	padding: 0; /* 文字の内側余白リセット*/
}

/* =========================================
   案件口コミ用BOX (nomad-review)
   ========================================= */
.nomad-review {
    background: #f8f9fa; /* 薄いグレーの背景 */
    padding: 15px 20px;
    margin-bottom: 15px; /* BOX同士の余白 */
    border-radius: 6px;  /* 角丸 */
    box-shadow: 0 2px 5px rgba(0,0,0,0.05); /* ほんのり影をつけてカード風に */
    position: relative;
}

/* 男性の口コミ（左に青いライン） */
.nomad-review.male {
    border-left: 5px solid #2563eb;
}
.nomad-review.male .nomad-review-title {
    color: #2563eb;
}

/* 女性の口コミ（左にピンクのライン） */
.nomad-review.female {
    border-left: 5px solid #db2777;
}
.nomad-review.female .nomad-review-title {
    color: #db2777;
}

/* 口コミのタイトル（「男性の口コミ」など） */
.nomad-review-title {
    font-weight: bold;
    margin-bottom: 8px;
    font-size: 1.05em;
}

/* 口コミの本文 */
.nomad-review-text {
    margin: 0 !important; /* AIの余計な改行を防ぐ */
    font-size: 0.95em;
    line-height: 1.6;
}

/* =========================================
   チェックボックス風リスト (check_box)
   ========================================= */
.check_box {
    background: #fdfdfd;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    padding: 15px 20px;
    margin-bottom: 20px;
}
.check_box ul {
    list-style-type: none;
    padding-left: 0;
    margin: 0;
}
.check_box ul li {
    position: relative;
    padding-left: 1.8em;
    margin-bottom: 8px;
    line-height: 1.6;
}
.check_box ul li:last-child {
    margin-bottom: 0;
}
/* チェックマークのアイコン（文字化け対策版） */
.check_box ul li::before {
    content: "✔"; /* 標準のチェックマークを使用 */
    font-weight: bold;
    position: absolute;
    left: 0;
    color: #4CAF50; /* 緑色 */
}

/* =========================================
   各種BOX内のリスト（ul）の下余白リセット
   ========================================= */
.nomadBox8 ul,
.box3-pink ul,
.nomadList10 ul,
.check_box ul {
    margin-bottom: 0 !important;
}