/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Mar 24 2026 | 09:56:21 */
/* ここにCSSコードを追加

例:
.example {
    color: red;
}

CSS の知識に磨きをかけるためにご覧ください。
http://www.w3schools.com/css/css_syntax.asp

コメント終わり */ 

/*------------------------------------------------------
全ページ共通：フォント＆ロゴ
------------------------------------------------------*/
body {
	font-family: "M PLUS Rounded 1c", sans-serif !important;
}
#header #header_logo2 .icon_image {
	/*background: #FFFFFF;
	border-right: 1px solid #dedede;
	border-bottom: 1px solid #dedede;*/
}
@media screen and (max-width: 900px) {
	#header #header_logo2 .icon_image {
		border: none;
	}
}

/*------------------------------------------------------
全ページ共通：ヘッダー
------------------------------------------------------*/
/*----- ヘッダーメニュー（TCD） -----*/
#global_menu .menu .menu-item a {
	color: #3A5AA6;
}
#global_menu .menu .menu-item a:hover {
	color: #42C2DB;
}

/*------------------------------------------------------
全ページ共通（SP用）：フッターメニュー
------------------------------------------------------*/
/*----- TCD「SERUM」：スマホ用フッターバー最適化（一括調整） -----*/
@media (max-width: 767px) {

  /* ここだけ触ればOK（数値は好みで） */
  :root{
    --fb-h: 67px;             /* 高さ（押しやすさ） */
    --fb-font: 14px;          /* 文字サイズ */
    --fb-icon: 24px;          /* アイコンサイズ */
    --fb-bg: #4E6FBC;         /* 背景色 */
    --fb-text: #FFFFFF;       /* 通常の文字・アイコン色 */
    --fb-accent: #42C2DB;     /* 選択中/押下時の色（差し色） */
    --fb-border: rgba(255,255,255,.08);
  }

  /* 背景色・文字色（タイプ差を吸収） */
  .p-footer-bar--type1,
  .p-footer-bar--type2,
  .p-footer-bar--type3{
    background: var(--fb-bg);
    color: var(--fb-text);
  }

  /* 高さ・押しやすさ */
  .p-footer-bar{
    height: var(--fb-h);
    border-top: 1px solid var(--fb-border);
  }
  .p-footer-bar__item-link{
    height: var(--fb-h);
    justify-content: center;
    padding: 10px 6px; /* タップ余白 */
  }

  /* 文字サイズ（テーマ差で .label の場合もあるので両対応） */
  .p-footer-bar__item-label,
  .p-footer-bar__item-link .label{
    font-size: var(--fb-font);
    font-weight: 700;
    line-height: 1.15;
    white-space: nowrap; /* 変な改行防止 */
  }

  /* アイコンサイズ（Googleアイコン/アイコンフォント差を吸収） */
  .p-footer-bar__icon:before,
  .p-footer-bar__icon.c-icon,
  .p-footer-bar .icon,
  .p-footer-bar .icon_type_google,
  .p-footer-bar .material-icons{
    font-size: var(--fb-icon) !important;
  }

  /* 色（通常/アクティブ） */
  .p-footer-bar a{ color: var(--fb-text); }
  .p-footer-bar a:hover,
  .p-footer-bar a:active,
  .p-footer-bar a[aria-current="page"],
  .p-footer-bar .is-active{
    color: var(--fb-accent);
  }

  /* iPhone下（ホームバー）かぶり対策：safe-area を確保 */
  /* safe-area-inset-bottom は env() で取得できます :contentReference[oaicite:1]{index=1} */
  @supports (padding-bottom: env(safe-area-inset-bottom)) {
    .p-footer-bar{
      padding-bottom: env(safe-area-inset-bottom);
      height: calc(var(--fb-h) + env(safe-area-inset-bottom));
    }
    .p-footer-bar__item-link{
      height: calc(var(--fb-h) + env(safe-area-inset-bottom));
    }
    body{
      padding-bottom: calc(var(--fb-h) + env(safe-area-inset-bottom));
    }
  }
  /* env() 非対応端末の最低限 */
  body{ padding-bottom: var(--fb-h); }
}

/*------------------------------------------------------
TOPページ：：診療案内（TREATMENT）
------------------------------------------------------*/
/*----- 図画レイアウト：PC4カラム／SP2カラム -----*/
.col4to2_box_container {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;                /* 横・縦の余白をまとめて管理 */
	justify-content: flex-start;
	align-items: flex-start;  /* figureの縦位置を上揃え */
	box-sizing: border-box;
	margin: 0 0 1.5em 0;
	padding: 0;
}

/* 各ボックス */
.col4to2_box {
	flex: 0 0 calc((100% - 60px) / 4);
	/* 100%からgap 20px × 3列ぶんを引き → 4分割 */
	box-sizing: border-box;
	margin: 0;
}

/* SP（689px以下）は2カラムに切替 */
@media screen and (max-width: 689px) {
	.col4to2_box_container {
		gap: 10px;              /* 横・縦の余白をまとめて管理 */
	}

	.col4to2_box {
		flex: 0 0 calc((100% - 10px) / 2);
		/* 100%からgap 10px × 1列ぶんを引き → 2分割 */
	}
}

/* figure・画像・キャプション */
.col4to2_box figure {
	margin: 0;
	padding: 0;
	width: 100%;
}

.col4to2_box figcaption {
	font-size: .9rem;
	line-height: 1.5;
	text-align: center;
	margin: .5em 0 0 0;
}

.col4to2_box img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
	border-radius: 10px;
}

.col4to2_box a {
	background: #4E6FBC;
	border-radius: 10px;
}

/*------------------------------------------------------
TOPページ：診療時間
------------------------------------------------------*/

.cb_box_content h2.common_catch {
	font-family: "M PLUS Rounded 1c", sans-serif !important;
	color: #3A5AA6;
}
.cb_carousel h2.common_catch {
	font-family: "M PLUS Rounded 1c", sans-serif !important;
	color: #3A5AA6;
}
.cb_free_space h2.common_catch {
	font-family: "M PLUS Rounded 1c", sans-serif !important;
	color: #3A5AA6;
}

.cb_box_content h3.headline {
	border-radius: 7px 7px 0 0;
}

.schedule_content div.schedule::after {
	font-size: 0.9em;
	white-space: pre-wrap;
	content: "▲火：〜19：00 ／ △水・土：〜18：00";
	position: relative;
	bottom: -10px;
	padding: 0;
}

/*------------------------------------------------------
固定ページ共通設定：Hタイトル設定（HEADING）
------------------------------------------------------*/
/*----- H2タイトル：ページキャッチコピー -----*/
.post_content h2.heading-catch {
	color: #3A5AA6;
	font-size: 2rem;
	text-align: center;
	position: relative;
	margin-bottom: 3rem;
	padding-bottom: 1.5rem;
	border-bottom: 1px solid #4E6FBC;
}
.post_content h2.heading-catch::before {
	content: attr(data-en);
	display: block;
	color: #4E6FBC;
	font-size: 1rem;
	text-transform: uppercase;
	opacity: 1;
	margin-bottom: 0.5rem;
}
@media screen and (max-width: 900px) {
.post_content h2.heading-catch {
	font-size: 1.75rem;
}}

/*----- H3タイトル：ページキャッチコピー -----*/
.post_content h3.heading-catch {
	color: #3A5AA6;
	font-size: 1.5rem;
	font-weight: bold;
	position: relative;
	margin-bottom: 1.2rem;
}
@media screen and (max-width: 900px) {
.post_content h3.heading-catch {
	font-size: 1.3rem;
	font-weight: bold;
	margin-bottom: 1rem;
}}

/*----- H2タイトル：通常 -----*/
h2.heading {
	color: #3A5AA6;
	font-size: 1.7rem;
	margin-bottom: 2.5rem;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	background: #DDEDF7;
	padding: 20px 10px;
	border-radius: 10px;
}
@media screen and (max-width: 900px) {
h2.heading {
	font-size: 1.5rem;
}}

/*----- H3タイトル -----*/
h3.heading {
	color: #3A5AA6;
	font-size: 1.6rem;
	margin: 0 0 2rem 0;
	padding: 0;
	position: relative;
	align-items: center;
	display: flex;
}

h3.heading::before {
	width: 5px;
	height: 1.5em;
	margin-right: .5em;
	background-color: #4E6FBC;
	border-radius: 5px;
	content: '';
	display: inline-block;
}
@media screen and (max-width: 900px) {
h3.heading {
	font-size: 1.3rem;
}}

/*------------------------------------------------------
ページ共通設定：リスト設定（LIST）
------------------------------------------------------*/
ul.list-common {
	margin: 0 !important;
	padding: 0 !important;
	position: relative;
}
ul.list-common li {
	line-height: 1.5;
	padding: 0.5em 0 0.5em 1.25em;
	list-style-type: none !important;
	position: relative;
}
ul.list-common li:before {
	color: #4E6FBC; /*アイコンの色*/
	font-family: "Font Awesome 5 Free";
	font-weight: 900; /*アイコンのウエイト*/
	content: "\f105"; /*アイコンの種類*/
	position: absolute;
	left : 0; /*左端からのアイコンまでの距離*/
}

ul.list-train {
	margin: 0 !important;
	padding: 0 !important;
	position: relative;
}
ul.list-train li {
	line-height: 1.5;
	padding: 0.5em 0 0.5em 1.5em;
	list-style-type: none !important;
	position: relative;
}
ul.list-train li:before {
	color: #4E6FBC; /*アイコンの色*/
	font-family: "Font Awesome 5 Free";
	font-weight: 900; /*アイコンのウエイト*/
	content: "\f239"; /*アイコンの種類*/
	position: absolute;
	left : 0; /*左端からのアイコンまでの距離*/
}

ul.list-bus {
	margin: 0 !important;
	padding: 0 !important;
	position: relative;
}
ul.list-bus li {
	line-height: 1.5;
	padding: 0.5em 0 0.5em 1.5em;
	list-style-type: none !important;
	position: relative;
}
ul.list-bus li:before {
	color: #4E6FBC; /*アイコンの色*/
	font-family: "Font Awesome 5 Free";
	font-weight: 900; /*アイコンのウエイト*/
	content: "\f207"; /*アイコンの種類*/
	position: absolute;
	left : 0; /*左端からのアイコンまでの距離*/
}

/*------------------------------------------------------
ページ共通設定：ボタン設定（BUTTON）
------------------------------------------------------*/
/*----- 共通ボタン設定 -----*/
.btn-base {
	width: 100%;
	display:block;
}
.btn-base a {
	margin-bottom:15px;
	text-decoration: none;
}
.btn-base .btn-common {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 300px;
	height: 61px;
	position: relative;
	background: #4E6FBC;
	border: 1px solid #4E6FBC;
	border-radius: 31px;
	box-sizing: border-box;
	padding: 0 37px 0 17px;
	color: #fff;
	line-height: 1.3;
	text-align: left;
	text-decoration: none;
	transition-duration: 0.3s;
	margin:35px auto;
}
a.btn-common:after {
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	
	font-family: "Font Awesome 5 Free"; 
	font-weight: 900;
	content: '\f061';
	position: absolute;
	top: ;
	right: 29px;
}
a.btn-common:hover {
	background: #fff;
	color: #4E6FBC !important;
	text-decoration: none;
}
a.btn-common:hover:after {
	color: #4E6FBC;
}

/*------------------------------------------------------
固定ページ：ページヘッダー
------------------------------------------------------*/
#page_header .direction_type1 {
	/*color: #3a5aa6;*/
}

/*------------------------------------------------------
固定ページ：医院案内（ABOUT）：
------------------------------------------------------*/
/*----- クリニック概要 -----*/
.clinic-info {
	position: relative;
	margin-bottom: 30px;
}
.clinic-info h1 {
	color: #3A5AA6;
	font-size: 29px; /*31px*/
	text-align: left;
	line-height: 1em; /*1.25em*/
	letter-spacing: 0; /*0.1em*/
	margin-bottom: 31px; /*31px*/
	padding-left: 80px; /*85px*/
}
.clinic-info h1 span {
	font-size: 15px; /*17px*/
	letter-spacing: 0.1em;
}
.clinic-info-logo {
position: absolute;
	top: 0px;
	left: 0px;
	width: 70px;
}
@media screen and (max-width: 900px) {
.clinic-info-logo img {
	border-radius: 0;
}}
.clinic-info-kamoku {
margin: 0 0 47px 0;
}
.clinic-info-kamoku ul {
	list-style: none;
	line-height: 0em;
	margin: 0;
	padding: 0;
}
.clinic-info-kamoku ul li {
	color: #4E6FBC;
	font-size: 13px;
	line-height: 0em;
	white-space: nowrap;
	display: inline;
	background: #fff;
	border: #4E6FBC 1px solid;
	border-radius: 7px;
	margin: 0 3px 0 0;
	padding: 8px 11px;
}
.clinic-info-kamoku ul li:nth-child(1) {
	color: #FFFFFF;
	font-size: 13px;
	line-height: 0em;
	white-space: nowrap;
	display: inline;
	background: #4E6FBC;
	border: #4E6FBC 1px solid;
	border-radius: 7px;
	margin: 0 3px 0 0;
	padding: 8px 11px;
}
@media screen and (max-width: 900px) {
.clinic-info h1 {
	font-size: 25px; /*31px*/
}
.clinic-info h1 span {
	font-size: 15px; /*17px*/
}
.clinic-info-kamoku {
	margin: 0 0 47px 0;
}
.clinic-info-kamoku ul {
}
.clinic-info-kamoku ul li {
	font-size: 11px;
	margin: 0 2px 0 0;
	padding: 5px 9px;
}
.clinic-info-kamoku ul li:nth-child(1) {
	font-size: 11px;
	padding: 5px 9px;
}}

.clinic-info-schedule {
	width: 100%;
	border-radius: 7px;
	margin: 0 0 37px 0;
	padding: 0;
}
#page_contents .clinic-info-schedule table {
	width: 100%;
	border: none !important;
	border-radius: 5px !important;
	margin: 0 0 11px 0;
	padding: 0;
}
#page_contents .clinic-info-schedule tr {
	border-top: none !important;
	border-bottom: none !important;
	border-left: none !important;
	border-right: none !important;
}
#page_contents .clinic-info-schedule th {
	text-align: center;
	line-height: 1em;
	vertical-align: middle;
	padding: 17px 5px 17px 5px !important;
	background: #F0F6FC;
	border-top: none !important;
	border-bottom: #DDEDF7 1px solid !important;
	border-left: #DDEDF7 1px solid !important;
	border-right: none !important;
}
#page_contents .clinic-info-schedule th:first-of-type {
	width: 30% !important;
	letter-spacing: 0.18em;
	border-radius: 7px 0 0 0;
	border-left: none !important;
}
#page_contents .clinic-info-schedule th:last-of-type {
	letter-spacing: 0.18em;
	border-radius: 0 7px 0 0;
}
#page_contents .clinic-info-schedule td {
	text-align: center;
	line-height: 1em;
	vertical-align: middle;
	margin: 0;
	padding: 17px 5px 17px 5px !important;
	border-top: none !important;
	border-bottom: #DDEDF7 1px solid !important;
	border-left: #DDEDF7 1px solid !important;
	border-right: none !important;
}
#page_contents .clinic-info-schedule td:not(:first-child) {
	color: #4E6FBC;
	font-size: 1.25rem;
}
#page_contents .clinic-info-schedule td:first-of-type {
	border-left: none !important;
}
@media screen and (max-width: 900px) {
#page_contents .clinic-info-schedule br {
	display: none;
}}
#page_contents .clinic-info-schedule p {
	font-size: 0.9em;
	line-height: 1.5em;
	margin: 0;
	padding: 0;
}

.clinic-info-address {
	position: relative;
	margin: 0;
}
.clinic-info-address address {
	margin-bottom: 10px;
	font-size: 1rem;
	line-height: 1.5rem;
	letter-spacing: 0.1rem;
	font-style: normal;
}
.clinic-info-address address span {
	padding-right: 6px;
	font-size: 0.9rem;
	letter-spacing: 0.12rem;
}
.clinic-info-address address i {
	font-size: 1.25rem;
	margin-left: 5px;
}
.clinic-info-address .clinic-info-tel  {
	font-size: 2rem;
	font-weight: 500;
	letter-spacing: 0.06rem;
}
@media screen and (max-width: 900px) {
.clinic-info-address .clinic-info-tel  {
	font-size: 1.75rem;
	font-weight: 100;
	letter-spacing: 0;
}}
.clinic-info-address .clinic-info-tel span {
	font-size: 1.75rem;
	margin-right: 11px;
}


/*----- 医療機器・設備紹介 -----*/
.clinic-equipment-box {
position: relative;
background: #f6f6f6;
border-radius: 5px;
margin-bottom: 30px;
}
.clinic-equipment-img {
margin: 0 !important;
}
.clinic-equipment-img img {
margin: 0;
vertical-align: bottom;
border-radius: 5px 5px 0 0;
}
.clinic-equipment-txtarea {
margin: 0;
padding: 20px 25px;
}
.clinic-equipment-txtarea p.category {
color: #122f3b;
font-size: 0.8rem;
font-weight: bold;
	line-height: 1;
text-align: center;
margin: 0 0 1em 0 !important;
padding: 0 !important;
}
.clinic-equipment-txtarea p.name {
color: #122f3b;
font-size: 1.1rem;
font-weight: bold;
	line-height: 1;
text-align: center;
margin: 0 !important;
padding: 0 !important;
}
.clinic-equipment-txtarea p {
margin: 0 0 0.5em 0 !important;
padding: 0 !important;
}

/*------------------------------------------------------
固定ページ：院長・スタッフ紹介（STAFF）
------------------------------------------------------*/
/*----- 院長 -----*/
.staff-photo-box {
	position: relative;
}
.staff-photo-box .label {
	display: flex;
	position: absolute;
	bottom: -21px;
	right: 0px;
	min-width: 110px;
	min-height: 160px;
	border: 1px solid #4E6FBC;
	background-color: #4E6FBC;
	border-radius: 30px 3px 30px 3px; 
	z-index: 100;
}
.staff-photo-box img {
	width: 90%;
	margin: 0;
}
.staff-photo-box .label span {
	color: #FFF;
	writing-mode: vertical-rl;
}
.staff-photo-box .label span.kana {
	font-size: 0.75rem;
	padding: 19px 5px 19px 19px;
	margin-left: auto;
}
.staff-photo-box .label span.name {
	font-size: 1.3rem;
	padding: 19px 5px;
}
.staff-photo-box .label span.title {
	font-size: 1rem;
	padding: 19px 19px 19px 13px;
	margin-right: auto;
}

/*----- 略歴・所属学会・所属勉強会 -----*/
.biography-box {
	background: #F0F6FC;
	border: #DDEDF7 1px solid;
	border-radius: 10px;
	padding: 21px;
}
.biography-box p {
	margin: 0 !important;
}
.biography-box dl {
	font-size: 0.9rem;
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 1.5em;
}
.biography-box dl dt {
	color: #4E6FBC;
	width: 23%;
	line-height: 1.25em;
	margin: 0 0 0.25em 0 !important;
}
.biography-box dl dd {
	width: 77%;
	line-height: 1.25em;
	margin: 0 0 0.25em 0 !important;
}
.biography-box ul {
	font-size: 0.9rem;
	margin: 0 !important;
	padding: 0 !important;
	position: relative;
}
.biography-box li {
	list-style-type: none;
	line-height: 1.25em;
	margin: 0 0 0.25em 0 !important;
	padding: 0 0 0 1.25em;
	position: relative;
}
.biography-box li:before {
	color: #4E6FBC; /*アイコンの色*/
	font-family: "Font Awesome 5 Free";
	font-weight: 900; /*アイコンのウエイト*/
	content: "\f0da"; /*アイコンの種類*/
	position: absolute;
	left : 0; /*左端からのアイコンまでの距離*/
}

/*------------------------------------------------------
固定ページ：はじめての患者さまへ（FIRST-VISIT）
------------------------------------------------------*/

/*----- 診療の流れについて -----*/
.flow_step_container {
	display: flex;
	justify-content: center;
	align-items: center;
}

.flow_step_container ul { margin: 0; padding: 0;}
.flow_step_container li { margin: 0; padding: 0;}
.flow_step_container p { margin: 0; padding: 0;}
.flow_step_container dl { margin: 0; padding: 0;}
.flow_step_container dt { color: #3A5AA6; margin: 0; padding: 0;}
.flow_step_container dd { margin: 0; padding: 0;}
.flow_step_container .flow_step dd p { margin: 0 0 1rem 0; padding: 0;}

.flow_step_container .flow_step {
	padding-left: 0;
}
.flow_step_container .flow_step > li {
	list-style-type: none;
	display: flex;
	padding: 20px 0;
	border-bottom: solid 1px #DDEDF7;
}
.flow_step_container .flow_step > li dl dt {
	font-size: 1.2rem;
	align-items: center;
	line-height: 2;
	font-weight: bold;
	margin-bottom: 10px;
}
.flow_step_container .flow_step > li dl dd {
	background: #F0F6FC;
	padding: 20px 30px 15px 30px;
	border-radius: 10px;
}
.flow_step_container .flow_step > li .icon {
	line-height: 1;
	font-size: 3rem;
	font-weight: bold;
	color: #4E6FBC;
	text-align: center;
	width: 70px;
	position: relative;
	margin-top: 0;
}
.flow_step_container .flow_step > li .icon::before {
	content: 'FLOW';
	font-size: 0.75rem;
	display: block;
	margin-bottom: 3px;
	letter-spacing: 1px;
}
.flow_step_container .flow_step > li .icon::after {
	content: "";
	display: block;
	width: 1px;
	height: calc(100% - 40px);
	background-color: #DDEDF7;
	position: absolute;
	left: 0;
	right: 0;
	top: 60px;
	margin: auto;
}
.flow_step > li dl dd {
	margin: 0;
}
.flow_step > li dl {
	width: calc(100% - 70px);
	margin-top: 0.8em;
}


/*------------------------------------------------------
基本設定：404・検索結果ページ
------------------------------------------------------*/
#page_404_header .content h2.catch {
	color: #FFFFFF;
	text-shadow: #4e6fbc 0px 0px 5px;
}
#page_404_header .content .desc p {
	color: #FFFFFF;
	text-shadow: #4e6fbc 0px 0px 5px;
}


