@charset "UTF-8";

.medical .toc_list > li > a:hover,
.subject .toc_list > li > a:hover {
	color: var(--subject-color) !important;
}
.u-general .l-fv__img {background-image: url("../images/medical/fv_general.jpg");}
.u-child .l-fv__img {background-image: url("../images/medical/fv_child.jpg");}
.u-surgery .l-fv__img {background-image: url("../images/medical/fv_surgery.jpg");}
.u-laser .l-fv__img {background-image: url("../images/medical/fv_laser.jpg");}
.u-foot .l-fv__img {background-image: url("../images/medical/fv_foot.jpg");}
.u-beauty .l-fv__img {background-image: url("../images/medical/fv_beauty.jpg");}



/*症状・疾患から探す
---------------------------------------------------------*/
.p-medical__bg-white {
	background: #fff;
	padding-top: var(--gap-120);
	padding-bottom: 10px;
}
.p-medical__content {
	width: min(100%,1100px);
	margin-inline: auto;
}

/*流れ*/
.p-medical__content .p-flow__item {
	width: min(100%,1000px);
	margin-inline: auto;
}
.p-flow__item {
	position: relative;
	padding-left: min(100px,9vw);
	padding-bottom: var(--gap-60);
	margin-bottom: 1.0em;
}
.p-flow__item:last-of-type {
	padding-bottom: 1.0em;
	margin-bottom: 0;
}
.p-flow__item::before,
.p-flow__item::after {
	/*番号、罫線*/
	text-align: center;
	font: var(--font-en);
	color: #bd995b;
	font-size: var(--fs-50);
	letter-spacing: .05em;
	width: 1.2em;
	line-height: 1.2em;
	content: "";	
	position: absolute;
	left: 0;
}
.p-flow__item::before {
	content: "01";
	border-bottom: solid 4px #ebe0ce;
	top: 0;
	transform: translateY(-.1em);
}
.p-flow__item::after {
	content: "";
	height: calc(100% - 1.5em);
	border-right: solid 1px currentcolor;
	bottom: 0;
	transform: translateX(-50%);
}
.p-flow .p-flow__item:last-child::after {
	display: none;
}
.p-flow__img {
	float: right;
	width: min(36%,320px);
}
.p-flow__item:has(.p-flow__img) .p-flow__txt {
	float: left;
	width: min(60%,520px);
}
.p-flow__ttl {
	font-size: var(--fs-23);
	font-weight: bold;
	letter-spacing: .1em;
	line-height: 1.6em;
	margin-bottom: .3em;
}
.p-flow__item:nth-of-type(2)::before {content: "02";}
.p-flow__item:nth-of-type(3)::before {content: "03";}
.p-flow__item:nth-of-type(4)::before {content: "04";}
.p-flow__item:nth-of-type(5)::before {content: "05";}
.p-flow__item:nth-of-type(6)::before {content: "06";}
.p-flow__item:nth-of-type(7)::before {content: "07";}
.p-flow__item:nth-of-type(8)::before {content: "08";}
.p-flow__item:nth-of-type(9)::before {content: "09";}
.p-flow__item:nth-of-type(10)::before {content: "10";}

/*CTA*/
.p-medical__cta .com_cta {
	font-size: min(2.0rem,1.8vw);	/*「ご予約・お問い合わせ」基準*/
	text-align: left;
}
.p-medical__cta .com_cta__attention {
	margin-top: var(--gap-40);
	width: min(90%,900px);
	margin-inline: auto;
}

/*関連する治療・症状*/
.related .p-medical__content {
	border-top: solid 1px #d5cecc;
	padding: var(--gap-60) 0;
}
.p-medical__related-style {
	width: min(100%,1000px);
	margin-inline: auto;
	margin-top: var(--gap-40);
}
.p-medical__related-style:first-child {
	margin-top: 0;
}
.p-medical__related-style > dt {
	color: #bd995b;
	font-size: var(--fs-20);
	font-weight: bold;
	letter-spacing: .1em;
	line-height: 1.0em;
	padding-left: 1.0em;
	position: relative;
	margin-bottom: 1.0em;
}
.p-medical__related-style a:hover {
	color: #bd995b;
}
.p-medical__related-list,
.p-medical__related-area {
	line-height: 1.0em;
	display: flex;
    flex-wrap: wrap;
	gap: 1.0em 1.5em;
}
.p-medical__related-list li,
.p-medical__related-area > p {
	padding-right: 1.5em;
	border-right: solid 1px currentcolor;
}
.p-medical__related-list li:last-of-type,
.p-medical__related-area > p:last-of-type {
	padding-right: 0;
	border-right: none;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
/*CTA*/
.p-medical__cta .com_cta {
	font-size: min(1.8rem,1.9vw);	/*「ご予約・お問い合わせ」基準*/
}
.p-medical__cta .com_cta__attention {
	width: 100%;
}
/*関連する治療・症状*/
.p-medical__related-style > dt {
	font-size: var(--fs-18);
}
.p-medical__related-list,
.p-medical__related-area {
	font-size: var(--fs-14);
	column-gap: 1.0em;
}
.p-medical__related-list li,
.p-medical__related-area > p {
	padding-right: 1.0em;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
/*流れ*/
.p-flow__item {
	padding-left: 18vw;
}
.p-flow__img {
	float: none;
	width: 100%;
	margin: 0 auto 1.0em;
}
.p-flow__txt {
	float: none;
	width: 100% !important;
}
.p-flow__ttl {
	letter-spacing: .05em;
	line-height: 1.4em;
	margin-bottom: .2em;
}

/*CTA*/
.p-medical__cta .com_cta__attention {
	width: 100%;
}

/*関連する治療・症状*/
.p-medical__related-style > dt {
	font-size: var(--fs-18);
}
.p-medical__related-list,
.p-medical__related-area {
	font-size: var(--fs-14);
	column-gap: 1.0em;
}
.p-medical__related-list li,
.p-medical__related-area > p {
	padding-right: 1.0em;
}
}



/*科目
---------------------------------------------------------*/
.p-subject__pickup {
	background: var(--subject-light-color);
	padding: var(--gap-40) 4% var(--gap-40);
	border-radius: 10px;
}

.p-subject__links-list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: 2px;
	font-size: var(--fs-17);
	font-weight: bold;
	letter-spacing: .1em;
	line-height: 1.5em;
}
.p-subject__links-list a {
    display: flex;
    flex-direction: column;
    justify-content: center;
	height: 5.0em;
	padding-left: 5%;
	padding-right: 3.0em;
	position: relative;
	background: #f2f2ee;
}
.p-subject__links-list li:nth-child(4n) a,
.p-subject__links-list li:nth-child(4n-1) a {
	background: #f9f9f7;
}
.p-subject__links-list a:hover {
	color: #bd995b;
}
.p-subject__links-list .icon-arrow.maru {
	font-size: .5em;
	font-weight: normal;
	background: #bd995b;
	position: absolute;
	right: calc(3% + 1.0em);
	top: 50%;
	transform: translateY(-50%);
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.p-subject__pickup {
	padding: var(--gap-80) 5% var(--gap-80);
}
.p-subject__links-list a {
	padding-left: 1.0em;
	padding-right: 3.0em;
}
.p-subject__links-list .icon-arrow.maru {
	font-size: .4em;
	right: 3.0em;
}
}



/*
---------------------------------------------------------*/

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
}