/*
Theme Name: MONAD Child
Theme URI: https://tcd-theme.com/tcd110/
Template: monad_tcd110
Author: TCD
Author URI: https://tcd-theme.com/
Description: WordPress theme "MONAD" was developed with a clinic site such as a psychosomatic clinic. It is characterized by gentle animations that give the image of a reassuring clinic, and has features that make it easy to create a medical information page and a FAQ page.
Version: 1.5.1755509055
Updated: 2025-08-18 18:24:15

*/
/*** トップヘッダー見出し ***/
#header_slider_fixed_content h2{
	letter-spacing: 0.15em;
}

/******************************
	疑似要素　デザイン
******************************/
#intro_img{
	position: relative;
}
#intro_img::after{
	content: "";
	position: absolute;
	bottom: -100px;
	right: -100px;
	width: 170px;
	height: 215px;
	background: url("img/item/item_01.svg") no-repeat center/contain;
}
#content_builder > section:nth-of-type(1) {
	position: relative;
}
#content_builder > section:nth-of-type(1)::before {
  content: "";
  position: absolute;
  top: 160px;
  left: -130px;
  width: 170px;
  height: 215px;
  background: url("img/item/item_01.svg") no-repeat center/contain;
}
#content_builder > section:nth-of-type(3) {
	position: relative;
}
#content_builder > section:nth-of-type(3)::before {
  content: "";
  position: absolute;
  top: 0;
  left: -160px;
  width: 170px;
  height: 215px;
  background: url("img/item/item_02.svg") no-repeat center/contain;
}
/*** 疑似要素をふわっと表示させる ***/
/* 初期状態：透明 */
#intro_img::after,
#content_builder > section:nth-of-type(1)::before {
  opacity: 0;
  transition: opacity 1.5s ease-out;
}
/* 表示状態：ふわっと */
#intro_img.show::after,
#content_builder > section:nth-of-type(1).show::before,
#content_builder > section:nth-of-type(3).show::before {
  opacity: 1;
}
@media (max-width: 1160px) {
	#content_builder > section:nth-of-type(1)::before {
	  top: 120px;
	  left: -50px;
	}
	#content_builder > section:nth-of-type(3)::before {
	  top: 0;
	  left: -50px;
	}
}
/* タブレット */
@media (max-width: 800px) {
	#content_builder > section:nth-of-type(1)::before {
	  top: 50px;
	  left: -80px;
	  width: 150px;
	}
	#content_builder > section:nth-of-type(3)::before {
	  top: -100px;
	  left: -50px;
	  width: 150px;
	}
	#intro_img::after{
		width: 150px;
	}
}
/* 小さめタブレット・大きめスマホ */
@media (max-width: 575px) {
	#content_builder > section:nth-of-type(1)::before {
	  top: 20px;
	  left: 0;
	  width: 100px;
	}
	#content_builder > section:nth-of-type(3)::before {
	  top: -120px;
	  left: 0;
	  width: 90px;
	}
	#intro_img::after{
		right: -50px;
		width: 100px;
	}
}
/*** トップ本文 ***/
p.desc{
	text-align: left !important;
	max-width: 780px !important;
	margin-left: auto !important;
	margin-right: auto !important;
}
@media (max-width: 991px) {
	p.desc{
		max-width: 600px !important;
	}
}
/*** ヘルスメディコの特徴 ***/
.image_area_wrap .image_area {
    max-width: 960px;
	width: 100%;
    margin: 0 auto;
    position: relative;
}
.image_area_wrap .image_area_item_wrap {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.image_area_wrap .image_area_item_wrap .item {
    max-width: 48%;
    position: relative;
}
.image_area_wrap .image_area .item h3 {
    line-height: 1.3;
	font-size: 24px;
    font-weight: 500;
    margin: 0.7em 0 0.7em 0;
	text-align: center;
}
.image_area_wrap .image_area .item p {
    line-height: 1.7;
	font-size: 16px;
}
 /* タブレット */
@media (max-width: 800px) {
	.image_area_wrap .image_area .item h3 {
		line-height: 1.3;
		font-size: 24px;
	}
} 
/* 小さめタブレット・大きめスマホ */
@media (max-width: 600px) {
	.image_area_wrap .image_area .item {
		max-width: 100%;
		width: 100%;
	}
	.image_area_wrap .image_area .item h3 {
		line-height: 1.3;
		font-size: 24px;
	}
}  
/*** 採用情報 ***/
.recruit_banner{
    position: relative;
    display: flex;
	flex-wrap: wrap;
    justify-content: space-between;
}
.recruit_banner_item{
	width: 50%;
	margin: 0;
	padding: 0;
}
.recruit_banner_item img{
	border-radius: 0 !important;
}
/* 小さめタブレット・大きめスマホ */
@media (max-width: 600px) {
	.recruit_banner_item{
		width: 100%;
	}
} 
/******************************
	TOP ブログエリア
******************************/
#cb_content_4{
	z-index: 1;
	background-color: #f7fcf8;
	padding-top: 100px;
}
#cb_content_4 .blog_list .image_wrap{
	width: 250px;
	box-shadow: 5px 5px 0 #62be6d;
}
@media (max-width: 800px) {
	#cb_content_4 .blog_list .image_wrap{
		width: 200px;
	}
} 
/* 小さめタブレット・大きめスマホ */
@media (max-width: 600px) {
	#cb_content_4{
		padding-top: 40px;
	}
} 
/******************************
	お問い合わせフォーム　contactform7
******************************/
/* レイアウト */
.cf7-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 24px;
}
.cf7-col--full { grid-column: 1 / -1; }

/* ラベルと必須/任意 */
.cf7-label { display:block; font-weight:600; margin-bottom:6px; }
.cf7-label .req { color:#d33; font-size:12px; margin-left:6px; }
.cf7-label .opt { color:#666; font-size:12px; margin-left:6px; }

/* 入力 */
.cf7-input:focus,
.cf7-textarea:focus {
  border-color:#3b82f6;
  box-shadow:0 0 0 3px rgba(59,130,246,.15);
}
textarea.cf7-textarea { min-height:160px; resize:vertical; }
#wpcf7-f195-o1 .cf7-col p{
	margin-bottom: 1em !important;
}
/* 送信ボタン */
.cf7-submit,
.wpcf7-submit {
  display:inline-block;
  padding:12px 24px;
  border:none;
  border-radius:999px;
  font-weight:700;
  cursor:pointer;
  background:#111;
  color:#fff;
}
.cf7-submit:hover { opacity:.9; }

/* エラースタイル */
.wpcf7-not-valid { border-color:#e11d48 !important; }
.wpcf7-not-valid-tip {
  color:#e11d48;
  font-size:12px;
  margin-top:6px;
}
.wpcf7-response-output {
  margin-top:16px;
  padding:12px 16px;
  border-radius:8px;
  font-weight:600;
}
.wpcf7 form.sent .wpcf7-response-output {
  border:1px solid #16a34a;
  color:#166534;
  background:#ecfdf5;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output {
  border:1px solid #e11d48;
  color:#9f1239;
  background:#fff1f2;
}

/* スピナー位置調整 */
.wpcf7-spinner { margin-left:8px; }

/* スマホ1カラム */
@media (max-width: 768px) {
  .cf7-grid { grid-template-columns: 1fr; }
}

/******************************
	お問い合わせフォーム WPForm
******************************/
/* レイアウト */
.wpforms-validate{
	max-width: 767px !important;
	padding: 48px !important;
	background-color: #f7fcf8 !important;
}
/* テキスト */
.wpforms-field-label{
	color: #4b3a21 !important;
}
/* 送信ボタン */
.wpforms-submit-container{
	text-align: center; 
}
.wpforms-submit{
	background-color: #62be6d !important;
	margin: auto;
	padding-left: 80px !important;
	padding-right: 80px !important;
	border-radius: 2rem  !important;
}
/* エラースタイル */
/* 小さめタブレット・大きめスマホ */
@media (max-width: 600px) {
	.wpforms-validate{
		padding: 32px 16px;
	}
}