@charset "utf-8";
/*
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
医療法人美郷会　こころはすサイト共通
	ver.2025.08
	スタイルシート
────────────────────────────────────────
FileName:		/resources.kokorohasu/css/kokorohasu-style.css
Editor:			TRUSTEC
Description:	こころはすサイト共通のスタイルシート。
────────────────────────────────────────
2025/10/27:		公開。
2025/08/01:		開発開始。
────────────────────────────────────────
背景色:					#fafafa	rgba(250, 250, 250, 1)
本文文字色:				#000000	rgba(0, 0, 0, 1)
ハイライトカラー:
サブカラー：
ポイントカラー:
リンク:

フォント
	本文:				a-otf-ud-shin-go-pr6n, sans-serif	モリサワ A-OTF UD新ゴ Pr6N
	見出し:				tbudrgothic-std, sans-serif			モリサワ TBUD丸ゴシック Std
	標準サイズ:			14pt
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[CUSTOM PROPERTIES]
[COMMON]
	Layout
	Font
	Common Tags
[SECTION: HEADER]
[SECTION: FOOTER]
[SECTION: COMMON PARTS]
	Font & Text
	Decoration
	Indent
	Call Telephone
	Contact link
	Contact Banner
 [SECTION: MAIN]
	Introduction
	Content Lead
	Subtitle
	More
	Horizontal Rule
	Headline
	Buttons
[TOPIC-PATH]
[SECTION: COMMON-GUIDE]
[SECTION: PAGER]
[SECTION: LISTS]
	Contents List
	Return Page List
	Address List
	Error List
	SNS Icon List
[SECTION: SNS Share]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
*/





/* ::::: [CUSTOM PROPERTIES] ::::: */
:root {

	/*
	--------- --------- --------- ------- */
	/**	背景色	*/
	--common-background-color: #fafafa;
	/**	本文文字色	*/
	--common-color: #000000;

	/* Fonts
	--------- --------- --------- ------- */
	/**	フォントサイズ（標準）	*/
	--common-font-size: 18px;
	/**	フォントサイズ（小）	*/
	--common-font-size-smaller: smaller;
	/**	フォントサイズ（大）	*/
	--common-font-size-larger: larger;

	/**	フォントファミリー	*/
	--common-font-family: a-otf-ud-shin-go-pr6n, sans-serif;
	/**	フォントスタイル	*/
	--common-font-style: normal;
	/**	フォントの重み: 細字	*/
	--common-font-weight-light: 200;
	/**	フォントの重み: 標準	*/
	--common-font-weight: 300;
	/**	フォントの重み: 太字	*/
	--common-font-weight-bold: 700;

	/*	行間隔	*/
	--common-line-height: 1.5em;
	/*	文字間隔*/
	--common-letter-spacing: 0;

	/**	見出しフォントファミリー）	*/
	--title-font-family: tbudrgothic-std, sans-serif;
	/**	見出しフォントスタイル	*/
	--title-font-style: normal;
	/**	見出しフォントの重み: 標準	*/
	--title-font-weight: 400;
	/**	見出しフォントの重み: 太字	*/
	--title-font-weight-bold: 700;

/*	--title-font-family: "toppan-bunkyu-midashi-go-std", sans-serif;
	--title-font-weight: 900;
	--title-font-style: normal;*/
/*	--title-font-family: "fot-rodin-pron", sans-serif;
	--title-font-weight: 600;
	--title-font-style: normal;*/

	--title-font-family: "heisei-maru-gothic-std", sans-serif;
	--title-font-weight: 800;
	--title-font-style: normal;

	/*	行間隔	*/
	--title-line-height: 1.5em;
	/*	文字間隔*/
	--title-letter-spacing: 0.05em;

	/* Link
	--------- --------- --------- ------- */
	--link-color: iniitial;
	--hover-color: iniitial;
	--focus-color: iniitial;
	--active-color: iniitial;

	/* Point Colors
	--------- --------- --------- ------- */	
	--common-pointed-color-1: #8dc63f;
	--common-pointed-color-2: #00adee;
	--common-pointed-color-3: #f49ac1;
	
	--common-pointed-background-color-1: #e8f4d9;
	--common-pointed-background-color-2: #cceffc;
	--common-pointed-background-color-3: #fdebf3;

	/* Borders
	--------- --------- --------- ------- */
	--common-border-1: solid 1px rgba(0, 0, 0, 0.1);
	--common-border-color-1: rgba(0, 0, 0, 0.1);
	--common-border-color-2: #000000;
	--common-border-color-3: #000000;
	--common-border-color-4: #000000;
	--common-border-color-5: #000000;

	--common-border-radius: 3px;

	/* Transition
	--------- --------- --------- ------- */
	--common-hover-transition: 0.4s;

	/* Opacity
	--------- --------- --------- ------- */
	--common-opacity: 1;
	--common-hover-opacity: 0.5;

	/* Dialog
	--------- --------- --------- ------- */
	--modal-dialog-background-color: #ffffff;
	--modal-dialog-color: #000000;

	/* Header
	--------- --------- --------- ------- */
	--header-scroll-padding-top: 145px;

	/* Footer
	--------- --------- --------- ------- */

	/* CommonMargin
	--------- --------- --------- ------- */
	--common-margin: min(2rem, 5vw);
}

/*	DisplayWidth < MD	*/
@media (max-width: 991px) {

	:root {
	}
}

/*	DisplayWidth < XS	*/
@media (max-width: 575px) {

	:root {
	}
}





/* ::::: [COMMON] ::::: */

/* Layout
--------- --------- --------- ------- */
html, body {
	-ms-scroll-padding-top: var(--header-scroll-padding-top);
	-webkit-scroll-padding-top: var(--header-scroll-padding-top);
	-moz-scroll-padding-top: var(--header-scroll-padding-top);
	-o-scroll-padding-top: var(--header-scroll-padding-top);
	scroll-padding-top: var(--header-scroll-padding-top);
}

/* Font
--------- --------- --------- ------- */
html {
	font-size: var(--common-font-size);
}

/* Common Tags
--------- --------- --------- ------- */
body {
	background-color: var(--common-background-color);
	color: var(--common-color);
	font-family: var(--common-font-family);
	font-weight: var(--common-font-weight);
	font-style: var(--common-font-style);
	line-height: var(--common-line-height);
	letter-spacing: var(--common-letter-spacing);
}

p {
	font-size: inherit;
	line-height: inherit;
	line-height: var(--common-line-height);
}

a {
	text-decoration: none;
	transition: var(--common-hover-transition);
}
a:hover, 
a:focus
a:active {
	text-decoration: none;
/*	opacity: var(--common-hover-opacity);	*/
/*	filter: grayscale(95%) brightness(220%);*/
}

b, strong {
}

h1, h2, h3, h4, h5, h6 {
	font-size: 1rem;
	font-style: normal;
	font-weight: 300;
	text-align: initial;
	margin: 0;
	padding: 0;
}

svg {
	fill: currentColor;
	max-width: 100%;
	max-height: 100%;
	display: inline-block;
}





/* ::::: [SECTION: HEADER] ::::: */

/* Common
--------- --------- --------- ------- */
header {
}

/*
 * ページヘッダとグローバルメニューの記述は
 * style-header.css へ移行しました。
 */





/* ::::: [SECTION: FOOTER] ::::: */

/* Common
--------- --------- --------- ------- */
footer {
}

/*
 * ページフッタの記述は
 * style-foter.css へ移行しました。
 */





/* ::::: [SECTION: COMMON PARTS] ::::: */

/* Font & Text
--------- --------- --------- ------- */
.font-size-smaller {
	/*font-size: smaller;*/
	font-size: var(--common-font-size-smaller);
}
.font-size-larger {
	/*font-size: larger;*/
	font-size: var(--common-font-size-larger);
}

/* Decoration
--------- --------- --------- ------- */

/* Indent
--------- --------- --------- ------- */
.indent {
	text-indent: 1em;
}



/* Call Telephone
--------- --------- --------- ------- */
.callTelephone {
	margin: 0;
	padding: 0;
	display: inline-block;
	transition: var(--common-hover-transition);
}
.callTelephone:hover,
.callTelephone:focus,
.callTelephone:active {
	/*opacity: var(--common-hover-opacity);*/
	/*filter: grayscale(100%);*/
	/*filter: invert();*/
}

.callTelephone .call {
	display: block;
	line-height: 1.5em;
}

.callTelephone .receptionTime {
	display: block;
	font-size: 0.65em;
	font-weight: bold;
	line-height: 1em;
	text-align: center;
}



/* :::::  [SECTION: MAIN] ::::: */

/* Introduction
--------- --------- --------- ------- */
.intro {
	height: 150px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

/* Introduction Headline
--------- --------- --------- ------- */
.intro .h-intro {
	font-family: var(--title-font-family);
	font-size: clamp(1.5rem, 3.2vw, 2.25em);
	font-weight: var(--title-font-weight);
	letter-spacing: var(--title-letter-spacing);
}



/* Horizontal Rule
--------- --------- --------- ------- */
.hr {
}



/* Headline
--------- --------- --------- ------- */
.h1, .h2, .h3, .h4, .h5, .h6 {
}



/* Buttons
--------- --------- --------- ------- */
.btn {
	font-size: var(--common-font-size);
	font-family: var(--title-font-family);
	font-style: var(--title-font-style);
	font-weight: var(--title-font-weight);
	letter-spacing: var(--title-letter-spacing);
	transition: var(--common-hover-transition);
}





/* ::::: [TOPIC-PATH] ::::: */

/* Setting
--------- --------- --------- ------- */
.topicpath {
	--topicpath-border: var(--common-border-1);
	--currentpage-weight: var(--common-font-weight);

	background-color: rgba(0, 0, 0, 0.05);
	font-size: var(--common-font-size-smaller);
	padding : 5px 0;
	border-top: var(--topicpath-border);
	border-bottom: var(--topicpath-border);
}

.topicpath .container {
}

.topicpath .breadcrumb {
	justify-content: flex-start;
	margin-bottom: 0;
}

.topicpath .breadcrumb .breadcrumb-item+.breadcrumb-item::before {
	content: var(--bs-breadcrumb-divider, "\F285");
	font-family: bootstrap-icons;
	font-size: var(--common-font-size-smaller);
}

.topicpath .breadcrumb .breadcrumb-item[aria-current="page"] {
	font-weight: var(--currentpage-weight);
}

.topicpath a {
	display: inline-block;
}





/* ::::: [SECTION: COMMON-GUIDE] ::::: */

/* Setting
--------- --------- --------- ------- */




/* :::::  [SECTION: PAGER] ::::: */

/*
--------- --------- --------- ------- */
.pager-wrap {
}

.pager-wrap span,
.pager-wrap a {
	background-color: rgba(255, 255, 255, 0.7);
	text-align: center;
	width: 3em;
	padding: 0.5em;
	border: solid 2px rgba(0, 0, 0, 0.2);
	display: inline-block;
}
.pager-wrap span {
	background-color: rgba(255, 255, 255, 1);
	color: rgba(0, 0, 0, 1);
	border-color: rgba(0, 0, 0, 1);
}



/* :::::  [SECTION: LISTS] ::::: */

/* Contents List
--------- --------- --------- ------- */
.list-contents,
.list-contents li {
	list-style: none;
}

.list-contents {
	margin-left: 2em;
	padding-left: 0;
}

.list-contents li:not(:last-child) {
	margin-bottom: 0.5em;
}
.list-contents li::before {
	content: "\f134";
	color: currentColor;
	font-family: bootstrap-icons;
	vertical-align: text-top;
	margin-right: 0.2em;
}

/* Return Page List
--------- --------- --------- ------- */

/* Error List
--------- --------- --------- ------- */

/* SNS Icon List
--------- --------- --------- ------- */

/* SNS Icons
--------- --------- --------- ------- */





/* :::::  [SECTION: SNS Share] ::::: */

/* SNS Share
--------- --------- --------- ------- */

/* SNS Share Simple
--------- --------- --------- ------- */





/* ::::: [BUTTON-STYLES: BTN-AND-MORE] ::::: */






/* Setting
--------- --------- --------- ------- */
.btn.btn-andmore,
.btn.btn-outline-andmore {
}

.btn-andmore,
.btn-outline-andmore {
	--button-pointed-color: var(--common-pointed-color-1);
	
	font-family: var(--title-font-family);
	font-size: var(--common-font-size-larger);
	font-weight: var(--title-font-weight);
	line-height: var(--title-line-height);
	letter-spacing: var(--title-letter-spacing);

	width: 300px;
    margin: 0 auto;
	padding: 0.5em 1em;
	border: 1px solid;
	border-radius: 0.25em;
	transition: 0.3s ease-out;
}

.btn-andmore:hover, 
.btn-outline-andmore:hover {
	transform: translateX(5px);
}

/*	Normal	*/
.btn-andmore {
    background-color: var(--common-pointed-color-1);
    color: #ffffff;
	border-color: #ffffff;
}
.btn-andmore:hover, 
.btn-andmore:focus, 
.btn-andmore:active {
    background-color: transparent;
    color: var(--common-pointed-color-1);
	border-color: var(--common-pointed-color-1);
}

/*	Outline	*/
.btn-outline-andmore {
    background-color: transparent;
    color: var(--common-pointed-color-1);
	border-color: var(--common-pointed-color-1);
}
.btn-outline-andmore:hover, 
.btn-outline-andmore:focus, 
.btn-outline-andmore:active {
    background-color: var(--common-pointed-color-1);
    color: #ffffff;
	border-color: #ffffff;
}