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

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


/* =========================================
   CF7：リンクの色変更（#7c5729）
   ========================================= */

/* 通常時 */
.wpcf7-form a {
  color: #7c5729 !important;
  text-decoration: none; /* 下線はお好みで削除OK */
}

/* ホバー時（少し濃く or 明るく） */
.wpcf7-form a:hover {
  color: #a88459 !important; 
  text-decoration: none;
}
h2 {
	color: #333 !important;
}

.header-container {
	height: 10vh;
}


body {
	background-color: #fff;
}


/* 見出しデザインのリセット*/
.article h2,
.article h4,
.article h5,
.article h6 {
background-color: transparent; /* 背景色を透明に */
border: none; /* 枠線なし */
border-radius: 0; /* 角の丸みなし */
}

/*フォント設定*/
p, body, h1, h2, h3, h4, a {
  font-family: "Cormorant Garamond", "Shippori Mincho", serif;
  font-weight: 400;
  font-style: normal;
}




/*字間*/
p, body {
letter-spacing: 2px;
}

h1, h2, h3 {
letter-spacing: 2px;
}


/*ヘッダーフッターまわりの調整*/
.breadcrumb,
.article-header,
.article-footer{
display: none;
}

.header-container-in {
padding-top: 10px;
padding-bottom: 10px;
	justify-content: left !important;
}

/*セクションまわりの細々とした余白の調整*/
.main {
padding-bottom:0!important;
margin-bottom:0!important;
margin-left:0!important;
margin-right:0!important;
}

/*フルワイドと余白の調整*/
.wp-block-cover, .n2-section-smartslider {
margin-bottom:0!important;
margin-top:0!important;
padding-bottom:0!important;
bottom: 0;
}

.wp-block-columns {
margin-bottom:0!important;
}

.entry-content, .content {
padding-top:0!important;
padding-bottom:0!important;

margin-bottom:0!important;
}

.content-bottom {
margin:0;
}

.article {
padding-bottom:0px!important;
margin-bottom:0px!important;
}

/*フッター*/
.footer {
margin-top:0px;
}

/*SNSシェア非表示*/
.page .sns-share,
.page .sns-follow {
display: none;
}

/*水平スクロールバー非表示*/
body {
overflow-x:clip;
font-size: 12px;
}

/*フルワイド*/
.fullwide {
width: 100vw;
margin: 0 calc(50% - 50vw);
padding: 0 calc(50vw - 50%);
}



.item-label {
	font-size: 13px;
	font-weight: 400;
}



/*ContactForm7カスタマイズ*/

table.CF7_table{
	width:80%; margin:0 auto; border: 0px solid #7C5729;
	margin-bottom: 10px !important;
} 

table.CF7_table tr{ 
	border-top: 0px solid #7C5729;
} 

table.CF7_table th {
	text-align: left;
}

.single .entry-content table.CF7_table, .page .entry-content table.CF7_table{ 
	display:table;
} 

/*入力欄*/ 
.CF7_table input, .CF7_table textarea { 
	border: 0.5px solid #d8d8d8;
} 

.CF7_table ::placeholder {
	color:#797979;
} 

/*「必須」文字*/ 
.CF7_req{ 
	font-size:.9em; padding: 5px; background: #7C5729;/*ブロンズ*/ color: #fff ; border-radius: 3px; margin-right:1em;
} 

/*「任意」文字*/ 
.CF7_unreq{ 
	font-size:.9em;
	padding: 5px;
	background: #bdbdbd;/*グレー*/
	color: #fff;
	border-radius: 3px;
	margin-right:1em;
} 

/* タイトル列 */ 
@media screen and (min-width: 768px){ 
	.CF7_table th{ 
		width:30%;/*横幅*/ 
		background-color:#FCFAF0;/*薄いベージュ*/ 
		
	} 
} 

/* レスポンシブ */ 
@media screen and (max-width: 768px){ 
	table.CF7_table{ width:95%; 
	} 
	
	.CF7_table tr, .CF7_table td, .CF7_table th{ 
		display: block; width: 100%; line-height:2.5em; 
	} 
	
	.CF7_table th{ 
		background-color:#FCFAF0; 
	} 
} 

/* 「送信する」ボタン */ 
.wpcf7 input.wpcf7-submit { 
	background-color:#7C5729;/*ブロンズ*/
		border-radius: 3px;
	border:0; 
	color:#fff; 
	font-size:1em; 
	font-weight:bold; 
	margin:0 auto; 
	width: 100px;
} 

.CF7_btn{ 
	text-align:center; 
	margin-top:20px; 
} 

.wpcf7-spinner{ 
	width:0; margin:0; 
}

/* ===============================
   共通：入力欄の幅を統一（横いっぱい）
   =============================== */
.CF7_table td p {           /* 通常行はブロック */
  display: block;
  margin: 0;
}
.CF7_table td .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
  box-sizing: border-box;
}
.CF7_table td input[type="text"],
.CF7_table td input[type="email"],
.CF7_table td input[type="tel"],
.CF7_table td select,
.CF7_table td textarea {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box;
}
/* ご利用サービスだけ確実にフル幅 */
.CF7_table .wpcf7-form-control-wrap[data-name="select-700"] select {
  width: 100% !important;
  max-width: none !important;
}

/* =========================================
   日時行だけ：1列横並び・左詰め・隙間最小
   （<p> 内に .time-group がある行を対象）
   ========================================= */
.CF7_table td p:has(.time-group) {
  display: flex;                 /* 横並び */
  align-items: center;
  justify-content: flex-start;   /* 左詰め */
  flex-wrap: nowrap;             /* 折り返し禁止 */
  gap: 2px;                      /* 全体の間隔を詰める */
}
/* CF7 が差し込む改行は無効化 */
.CF7_table td p:has(.time-group) br {
  display: none !important;
}

/* 年月日と時間の間をさらに詰める */
.CF7_table td .wpcf7-form-control-wrap[data-name^="date"] {
  margin-right: 2px !important;
}

/* 時・分の並びと余白（超コンパクト） */
.CF7_table td .time-group {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  gap: 1px;                      /* select とテキストの隙間 */
}
.CF7_table td .time-group span {
  margin: 0 1.5px !important;    /* 「時」「分〜」の前後バランス */
}

/* 幅のバランス（スマホでも1行に収める） */
.CF7_table td p:has(.time-group) input[type="date"] {
  width: 45% !important;         /* 年月日を広めに */
  min-width: 130px;
}
.CF7_table td p:has(.time-group) .time-group select {
  width: 22% !important;         /* 「時」「分」 */
  min-width: 60px;
}
/* さらに狭い端末向けの微調整 */
@media (max-width: 480px) {
  .CF7_table td p:has(.time-group) input[type="date"] { width: 43% !important; }
  .CF7_table td p:has(.time-group) .time-group select { width: 21% !important; }
  .CF7_table td .time-group { gap: 1px; }
  .CF7_table td .time-group span { margin: 0 2px !important; }
}


/* =========================================
   年月日の入力欄を幅いっぱいにする
   ========================================= */
.CF7_table td p:has(.time-group) input[type="date"] {
  width: 100% !important;   /* ← 横幅を最大化 */
  min-width: auto !important;
  flex: 1 1 auto;            /* フレックス要素として自然に伸ばす */
  box-sizing: border-box;
  margin-right: 0 !important; /* 右余白を完全に削除 */
}

/* 年月日と時刻ブロックが詰まりすぎないよう最小限の隙間 */
.CF7_table td p:has(.time-group) {
  gap: 2px !important;
}

/* スマホでの見た目最適化（入力枠がはみ出すのを防止） */
@media (max-width: 480px) {
  .CF7_table td p:has(.time-group) input[type="date"] {
    width: calc(100% - 4px) !important; /* ほんの少し内側に */
  }
}




/* ───────────────────────────────
   Cocoonボタンのホバー時の白化を防止
─────────────────────────────── */
a.btn,
a.btn:hover,
a.btn:focus {
  background-color: #AA9C73 !important; /* あなたのベースカラー */
  color: #fff !important; /* 白文字固定 */
  filter: none !important; /* 明るさ補正を無効 */
  opacity: 1 !important;  /* 半透明防止 */
  transform: none !important; /* ズーム防止 */
  transition: background-color 0.3s ease, color 0.3s ease !important;
}

/* ホバー時に少しだけ色を薄くする（任意） */
a.btn:hover {
  background-color: #B8AA85 !important; /* やや明るいトーン */
}


/* ───────────────────────────────
   ヘッダーメニュー子項目ホバー演出の無効化
─────────────────────────────── */

/* 子メニューの背景が半透明化・ズームするのを防ぐ */
#navi ul.sub-menu,
.global-nav ul.sub-menu,
header nav ul.sub-menu {
  transform: none !important;
  filter: none !important;
  opacity: 1 !important;
  background-color: #fff !important; /* 白に固定（お好みで変更） */
  transition: none !important;
}

/* 子メニューの各リンク（aタグ）のホバー時も固定 */
#navi ul.sub-menu li a:hover,
.global-nav ul.sub-menu li a:hover,
header nav ul.sub-menu li a:hover {
  background-color: #f5f5f5 !important; /* 背景のみ薄いグレーに */
  color: inherit !important;
  transform: none !important;
  opacity: 1 !important;
  filter: none !important;
}



/*スライドショーサイズ設定*/

@media screen and (max-width: 1199px) {
  .n2-ss-slider,
  .n2-ss-slide {
    height: 900px !important;
  }
}

@media screen and (max-width: 768px) {
  .n2-ss-slider,
  .n2-ss-slide {
    height: 800px !important;
  }
}




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

	
	
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	
.header-container { position: absolute !important; top: 0; left: 0; width: 100%; background: rgba(255, 255, 255, 0) !important; z-index: 9999 !important; box-shadow: none !important; }
	
	


	/* ────────────────
  ヘッダーロゴを左寄せに強制
──────────────── */
body .header-container-in.hlt-top-menu {
  justify-content: flex-start !important;
  align-items: flex-start !important;
}

/* ロゴ画像・テキストを左端に寄せる */
body .header-container-in .logo-header,
body .header-container-in .logo-header .site-name-text,
body .header-container-in .logo-header .site-name-text-link {
  margin-left: 0 !important;
  margin-right: auto !important;
  text-align: left !important;
}
	
	
	/*上の余白子ページ*/
	.content.cf {
		margin-top: 75px;
	}
 	
	.spacer1 {
		display: none;
	}
	
	
	
.main {
padding-top: 0px !important;
}


	.menu-drawer {
		padding-top: 75px !important;
	}

	.navi-menu-close-button.menu-close-button {
		display: none !important;
	}
     
}






/* フッター背景画像＋白オーバーレイ */
footer.footer-container {
  position: relative;  /* ::beforeを重ねるために必要 */
  background-image: url("https://atelier-m-consulting.com/wp-content/uploads/2025/07/AdobeStock_447498496.jpeg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  color: #000; /* 白オーバーレイに合わせて黒文字推奨 */
  z-index: 0;
}

/* 白の60%オーバーレイ */
footer.footer-container::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.6); /* 白 60% */
  z-index: 0;
}

/* フッター内コンテンツを前面に */
footer.footer-container * {
  position: relative;
  z-index: 1;
}

/* スマホでは固定を解除して軽量化 */
@media screen and (max-width: 768px) {
  footer.footer-container {
    background-attachment: scroll;
  }
}

/*フッタ余白*/

@media screen and (max-width: 768px) {
	.footer-bottom.fdt-left-and-right.fnm-text-width.cf {
		margin-top: 0px !important;
	}
	
	.source-org.copyright {
		margin-top: 20px !important;
	}
}



/*記事ページ余白調整*/
.new-entry-card-link.widget-entry-card-link.a-wrap {
	padding-top: 30px;
	padding-bottom: 30px;
}

.new-entry-card-snippet.widget-entry-card-snippet.card-snippet {
		padding-top: 0px;
	padding-bottom: 5px;
}

.sidebar.nwa.cf {
	padding-top: 50px !important;
}


/* 「お問い合わせはこちら」ボタンの文字サイズを12px */
a.vk_button_link .vk_button_link_caption .vk_button_link_txt {
  font-size: 12px !important;
letter-spacing: 1.5px !important;
}




/* =========================================
   上2つ（女性向け・男性向け）：拡大・変化すべて無効化
   ========================================= */
a[href*="explanation_forwomen"],
a[href*="explanation_formen"] {
  transform: none !important;
  transition: none !important;
  box-shadow: none !important;
}

/* hover時も動きを一切出さない */
a[href*="explanation_forwomen"]:hover,
a[href*="explanation_formen"]:hover {
  transform: none !important;
  transition: none !important;
  box-shadow: none !important;
  background-color: #AA9C73 !important; /* 元の色で固定 */
  color: #fff !important;
}

/* =========================================
   その他ボタン（トータル診断など）：ふわっと明るく変化
   ========================================= */
a.btn:not([href*="explanation_forwomen"]):not([href*="explanation_formen"]) {
  transition: all 0.3s ease !important;
  transform: none !important;
}

a.btn:not([href*="explanation_forwomen"]):not([href*="explanation_formen"]):hover {
  background-color: #BBAE8C !important; /* 少し明るめ */
  transform: none !important; /* 拡大しない */
  box-shadow: none !important;
}