@charset "utf-8";
/* h4：下線アクセント（全幅ではなく控えめな線） */
.contents h4 {
  clear: both;
  margin: 24px 0 14px;
  padding: 0 0 6px 20px;          /* ← 左20pxで h3/p と揃える */
  font-size: 20px;
  line-height: 1.5;
  color: #555;
  border-bottom: 2px solid #88b276; /* 縦線なし、下線で強調 */
}

/* h5：白背景＋点線枠で落ち着いた見出し */
.contents h5 {
  clear: both;
  margin: 20px 0 12px;
  padding: 7px 16px 6px 20px;     /* 左20pxでh3・pと統一 */
  font-size: 18px;
  line-height: 1.6;
  color: #555;
  display: inline-block;          /* テキスト幅に合わせて背景表示 */
  background: #fff;               /* 白背景 */
  border: 1px dotted #88b276;     /* サイト基調色で点線枠 */
  border-radius: 6px;             /* 柔らかさを出す角丸 */
}

/* h6：ピンクの丸ドット＋位置安定 */
.contents h6 {
  clear: both;
  margin: 16px 0 10px;
  padding-left: 36px;            /* 20 + 8(ドット) + 8(間隔) */
  font-size: 16px;
  line-height: 1.6;
  color: #666;
  position: relative;
}

.contents h6::before {
  content: "";
  position: absolute;
  left: 20px;                    /* 見出し群の基準ラインに合わせる */
  top: 50%;
  transform: translateY(-50%);   /* 行の中央に固定 */
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #f4a6b4;           /* ピンク */
}

/* スマホ微調整（任意） */
@media (max-width: 480px) {
  .contents h6 { padding-left: 32px; } /* 間隔を気持ちタイトに */
}

/* スマホ微調整（任意） */
@media (max-width: 480px) {
  .contents h4 { font-size: 19px; }
  .contents h5 { font-size: 17px; }
  .contents h6 { font-size: 16px; }
}

/* UL：丸ドットリスト（柔らかいトーン） */
.contents ul {
  margin: 0 0 20px 20px;
  padding: 0;
  list-style: none;
}

.contents ul li {
  position: relative;
  padding-left: 20px;
  margin-bottom: 8px;
  line-height: 1.7;
  color: #555;
}

.contents ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;                      /* 高さ中央に */
  transform: translateY(-50%);   /* 縦位置を正確に中央へ */
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #88b276;           /* グリーン（基調色） */
}

/* OL：番号リスト（スタイリッシュに整形） */
.contents ol {
  margin: 0 0 20px 20px;
  padding-left: 24px;              /* 数字がずれないよう少し広め */
  list-style-type: decimal;        /* 通常の番号付き */
  color: #555;
}
.contents ol li {
  margin-bottom: 8px;
  line-height: 1.7;
}
.contents ol li::marker {
  color: #88b276;                  /* 番号をアクセントカラーで */
  font-weight: bold;
}

/* スマホ対応 */
@media (max-width: 480px) {
  .contents ul li,
  .contents ol li {
    margin-bottom: 6px;
    line-height: 1.6;
  }
}

/* 重要キーワード用 */
.keyword {
  font-weight: bold;              /* 太字 */
  color: #e27b9c;                 /* 柔らかいピンク */
  background: rgba(255, 240, 245, 0.4); /* ほんのり背景をつけても可 */
  padding: 0 2px;                 /* 文字が詰まらないように軽く余白 */
  border-radius: 3px;             /* 柔らかさを出す */
}

/*----------------------------------------------
  ページ内リンク（id付きセクション）用のオフセット調整
  固定ヘッダーに隠れないようにスクロール位置を下げる
  ※すべての .contents 内の section[id] に自動適用される
  ※ヘッダーの高さに応じて scroll-margin-top の値を調整（例：96px）
----------------------------------------------*/
.contents section[id] {
  scroll-margin-top: 70px;
}


/*******************************************************
当院について
*******************************************************/
.yoko_2retsu_wrap .yoko_2retsu_img,.yoko_2retsu_wrap .yoko_2retsu_con{
	display: inline-block;
	box-sizing: border-box;
	vertical-align: top;
}
.yoko_2retsu_wrap .yoko_2retsu_img img{
	box-sizing: border-box;
}

.yoko_2retsu_img{
	width: 40%;
}
.yoko_2retsu_con{
	width: calc(60% - 8px);
}

@media (max-width: 1100px) {
	.yoko_2retsu_img{
		width: 50%;
	}
	.yoko_2retsu_con{
		width: calc(100% - 8px);
	}
}
@media (max-width: 900px) {
	.yoko_2retsu_img{
		width: 75%;
	}
}
@media (max-width: 600px) {
	.yoko_2retsu_img{
		width: 100%;
	}
}
@media (max-width: 600px) {
	.about_adress_43658{
		margin-left: 0.8em;
	}
}

/*******************************************************
自然療法
*******************************************************/

.contents .natural_page_wrap section {
margin-top: 0px;
}
@media (min-width: 601px) {
  .contents .natural_page_wrap section {
    margin-top: 20px;
  }
}

.nature-photos {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 0 20px 20px 20px;
}

.nature-photos img {
  width: calc(33.333% - 16px);  /* ← 枠と余白を計算して確実に3枚並ぶ */
  height: auto;
  background: #fff;
  border: 8px solid #fff;       /* 白枠をしっかり出す */
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
  box-sizing: border-box;       /* 枠線をwidthに含める！重要 */
}

/* スマホでは縦並び */
@media (max-width: 768px) {
  .nature-photos {
    flex-direction: column;
    align-items: center;
  margin: 10px;
  }

  .nature-photos img {
    width: 90%;
    margin-bottom: 20px;
  }
}

/* right時にテキストが右寄りにならないよう上書き */
.right h3,
.right p {
  text-align: left !important;   /* ← 強制的に左寄せ */
}

/* leftも念のため指定 */
.left h3,
.left p {
  text-align: left !important;
}


/*****************************
食事相談
***************************/

.float_left_wrap.shokuji_soudan{
	width: 32%;
}
@media (max-width: 800px) {
	.float_left_wrap.shokuji_soudan{
		float: none;
		text-align: center;
		width: 90%;
	}
}

.float_right_wrap.shokuji_soudan{
	width: 61%;
}
.float_right_wrap.shokuji_soudan ul{
	margin-top: 20px;
}
@media (max-width: 1100px) {
	.float_right_wrap.shokuji_soudan ul li{
		margin-bottom: 0;
	}
}
@media (max-width: 800px) {
	.float_right_wrap.shokuji_soudan{
		margin-top: 10px;
		float: none;
		width: 95%;
		margin-left: 0px;
	}
	.float_right_wrap.shokuji_soudan ul li{
		margin-bottom: 6px;
	}
	ul.float_right_wrap_chousei.shokuji_soudan{
		margin-bottom: 0;
		margin-top: 20px;
		padding-bottom: 0;
		margin-left: 20px;
	}
}

/*******************************************************
院長プロフィールへ
*******************************************************/

.btn-profile {
	margin-top: 20px;
  display: inline-block;
  background-color: #ec8b97; /* 淡いピンク */
  color: #fff;
  font-weight: bold;
  padding: 12px 30px;
  border-radius: 30px;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
	.btn-profile {
		display: block;
		margin: 20px auto 0;
		text-align: center;
	}
}

.btn-profile:hover {
  background-color: #f3aeb7; /* 少し濃いピンクでホバー時に変化 */
  transform: translateY(-2px);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15);
}

/*******************************************************
料金表
*******************************************************/
/* 価格表専用の見た目。既存の .ta3 には影響を与えません */
.ta3.ta3--pricing {
  border-collapse: separate;   /* 罫線のにじみを避ける */
  border-spacing: 0;
  width: 100%;
}

/* ヘッダーの体裁（任意：見やすさ強化） */
.ta3.ta3--pricing thead th {
  text-align: center;
  font-weight: 700;
  padding: 0.75em 0.8em;
  border-bottom: 2px solid #f2cfe0; /* 淡いピンクの下線 */
}

/* セルの基本余白 */
.ta3.ta3--pricing tbody td {
  padding: 0.7em 0.8em;
  vertical-align: middle;
  border-bottom: 1px solid #f6e6ee; /* ごく薄い区切り線 */
}

/* 1列目（メニュー列）：中央寄せ＋太字 */
.ta3.ta3--pricing tbody td:first-child {
  text-align: center;
  font-weight: 700;
}

/* ゼブラ（1行おきで薄い綺麗なピンク） */
.ta3.ta3--pricing tbody tr:nth-child(even) {
  background: #fff6fa; /* かなり薄いピンク */
}
/* 3列目（料金）を改行禁止に */
.ta3.ta3--pricing tbody td:nth-child(3) {
  white-space: nowrap;
}

/* スマホでは外枠を消す */
@media (max-width: 768px) {
  .ta3.ta3--pricing {
    border: none;
  }
}
@media (max-width: 600px) {
.ta3.ta3--pricing {
  padding: 10px 6px;
  }
.ta3.ta3--pricing thead th,.ta3.ta3--pricing thead td {
  padding: 0.6em 0.5em;
  }
}
/* スマホでの詰まり緩和（任意） */
@media (max-width: 480px) {
  .ta3.ta3--pricing thead th,
  .ta3.ta3--pricing tbody td {
    padding: 0.6em 0.6em;
  }
}

/*******************************************************
ホメオパシーセンターアルモニア
*******************************************************/

.float_left_wrap{
	float: left;
	width: calc(100% - 590px);
	box-sizing: border-box;
}
@media (max-width: 1100px) {
	.float_left_wrap{
		width: calc(100% - 390px);
	}
}
@media (max-width: 800px) {
	.float_left_wrap{
		float: none;
		text-align: center;
		width: 90%;
	}
}
.float_right_wrap{
	float: left;
	width: 350px;
	margin-left: 40px;
	box-sizing: border-box;
}
@media (max-width: 1100px) {
	.float_right_wrap{
		margin-left: 30px;
	}
}
@media (max-width: 800px) {
	.float_right_wrap{
		margin-top: 10px;
		float: none;
		width: 95%;
		margin-left: 0px;
	}
	ol.float_right_wrap_chousei{
		margin-bottom: 0;
		margin-top: 0;
		padding-bottom: 0;
		margin-left: 10px;
	}
}

/*******************************************************
お問い合わせ
*******************************************************/
/* ラジオボタンを横並びにする */
.contents .ta1 td label {
  display: inline-block;
  margin-right: 20px; /* ボタン同士の間隔 */
  line-height: 1.8;
}

/* テーブルのセルに余裕を持たせる（任意） */
.contents .ta1 td {
  vertical-align: middle;

/*******************************************************
一般診療
*******************************************************/
}

.float_left_wrap.injection{
	display: inline-block;
	width: 620px;
}
@media (max-width: 1250px) {
	.float_left_wrap.injection{
		width: 550px;
	}
}
@media (max-width: 1150px) {
	.float_left_wrap.injection{
		width: 500px;
	}
}
@media (max-width: 1100px) {
	.float_left_wrap.injection{
		width: 400px;
	}
}
@media (max-width: 800px) {
	.float_left_wrap.injection{
		width: 100%;
		box-sizing: border-box;
	}
}
@media (min-width: 501px) {
	.float_left_wrap.injection{
		margin-left: 20px;
	}
}

/*******************************************************
トップページ
*******************************************************/
/* ベース */
.news-list {
  margin: 0;
  padding: 0;
}
.news-list .list_wrap{
	margin-bottom: 10px;
}
.news-list dt,
.news-list dd {
  display: inline-block;
  vertical-align: top;  /* ← これで上揃え */
  margin: 0;
  padding: 0;
  line-height: 1.6;
}

/* 日付部分 */
.news-list dt {
  width: 6em;           /* ← 日付の固定幅。調整可 */
  font-weight: bold;
  color: #666;
  margin-right: 0.5em;  /* ← タイトルとの距離を詰める */
	box-sizing: border-box;
}

/* タイトル＋抜粋部分 */
.news-list dd {
  width: calc(100% - 11em);  /* 日付分を引いた幅 */
  color: #333;
	box-sizing: border-box;
	margin-left: 0 !important;
	padding-left: 0 !important;
}

/* 抜粋 */
.news-list .excerpt {
  margin-top: 0.25em;
  font-size: 0.9em;
  color: #666;
  line-height: 1.6;
}

/* スマホ（縦並びに切り替え） */
@media (max-width: 600px) {
	
	.contents dl.news-list {
	  padding: 0 10px !important;
	}

  .news-list dt,
  .news-list dd {
    display: block;
    width: 100%;
  }
  .news-list dt {
    margin-bottom: 0.2em;
  }
}

/* NEWマーク */
.new-label {
  display: inline-block;
  background: #f06c8d;   /* ピンク系 */
  color: #fff;
  font-size: 0.75em;
  font-weight: bold;
  border-radius: 3px;
  padding: 3px 6px 3px;
  margin-left: 6px;       /* タイトルとの間隔 */
  line-height: 1;
  vertical-align: middle;
}

/* 投稿本文（single.php）枠デザイン */
.page-content {
  background: #fff;                   /* 白背景 */
  border: 1px solid #ddd;             /* 薄いグレー枠線 */
  border-radius: 10px;                /* 柔らかく角丸 */
  padding: 30px 40px;                 /* 内側余白（読みやすく） */
  margin: 0 20px 40px;                /* 外側余白（他要素との間隔） */
  box-shadow: 0 4px 10px rgba(0,0,0,0.05); /* ほんのり影をつける */
}

/*******************************************************
投稿ページ
*******************************************************/

/* スマホ用の微調整 */
@media (max-width: 600px) {
  .page-content {
    padding: 20px 10px;
    margin: 0 10px 30px;
  }
}

/*******************************************************
アーカイブページ
*******************************************************/

/* アーカイブ一覧記事デザイン */
.archive-post {
  background: #fff;                     /* 白背景 */
  border: 1px solid #ddd;               /* 枠線 */
  border-radius: 10px;                  /* 角丸 */
  padding: 30px 40px;
  margin: 0 0 40px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.05); /* ほんのり影 */
}

/* タイトル */
.archive-post .archive-title {
  font-size: 22px;
  margin-bottom: 8px;
}

.archive-post .archive-title a {
  color: #333;
  text-decoration: none;
}

.archive-post .archive-title a:hover {
  text-decoration: underline;
}

/* 日付 */
.archive-post .archive-date {
  font-size: 14px;
  color: #777;
  margin-bottom: 20px;
}

/* 本文 */
.archive-post .archive-content {
  font-size: 16px;
  line-height: 1.8;
}

/* スマホ用調整 */
@media (max-width: 600px) {
  .archive-post {
    padding: 20px;
  }
  .archive-post .archive-title {
    font-size: 20px;
  }
}


/*******************************************************
診療のご案内
*******************************************************/

#guide_page{
	margin-top: 30px;
	margin-bottom: 20px;
}

.contents #guide_page h3{
	margin-bottom: 30px !important;
	font-size: 23px !important;
}


/*******************************************************
お問い合わせ
*******************************************************/
table.ta1.otoiawase_table{
	margin-top: 20px;
	margin-bottom: 20px;
}
table.ta1.otoiawase_table input[type="text"],
table.ta1.otoiawase_table input[type="email"],
table.ta1.otoiawase_table input[type="tel"],
table.ta1.otoiawase_table textarea {
  padding: 3px 4px;
  box-sizing: border-box;
}

@media (max-width: 800px) {
  table.ta1.otoiawase_table,
  table.ta1.otoiawase_table tbody,
  table.ta1.otoiawase_table tr,
  table.ta1.otoiawase_table th,
  table.ta1.otoiawase_table td {
    display: block;
    width: 100%;
  }

  table.ta1.otoiawase_table th {
    text-align: left;
    margin-bottom: 4px;
  }

  table.ta1.otoiawase_table td {
    margin-bottom: 16px;
  }
}

@media (max-width: 800px) {
	table.ta1.otoiawase_table td.gosoudan label{
		width: 100%;
		box-sizing: border-box;
		margin: 2px 0;
		padding: 0;
	}
	table.ta1.otoiawase_table td.gosoudan label input{
		vertical-align: middle;
	}
	table.ta1.otoiawase_table th{
		border-bottom: none;
		padding-bottom: 0;
	}
	table.ta1.otoiawase_table td{
		border-top: none;
		padding-top: 0;
	}
}

/* MW WP Form のボタンを .btn と同じ見た目に揃える */
.mw_wp_form .btn,
.mw_wp_form input.btn,
.mw_wp_form button.btn,
.mw_wp_form a.btn {
  font-size: 17px;
	padding: 6px 25px;
	width: 250px;
	margin-bottom: 20px;
}

