@charset "UTF-8";




/* ========================================================
  
  Common

======================================================== */
.dr-post {
	position: relative;
	font: var(--font-min);
	font-size: 94%;
	line-height: 1.8;
	margin-bottom: .5em;
}
.dr-name {
	position: relative;
	font: var(--font-min);
	font-size: min(4vw,294%);
	line-height: 1.4;
	letter-spacing: .2em;
	margin-bottom: .5em;
}
.dr-name .u-font-en {
	color: var(--color-grn);
	font-size: 60%;
	margin-top: .2em;
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.dr-post {
	font-size: 90%;
	letter-spacing: .02em;
	line-height: 1.6;
}
.dr-name {
	font-size: 180%;
}
}

/* dr-bio
-----------------------------------------------*/
.dr-bio dd {
	font-size: 88%;
}
.dr-bio__reki {
	text-align: left;
	line-height: 1.6;
	border-spacing: 0 .4em;
}
.dr-bio__reki th {
	width: 5em;
	min-width: max-content;
	text-align: left;
	font-weight: normal;
	vertical-align: top;
	white-space: nowrap;
	padding-right: .6em;
}
.dr-bio .c-list > li::before {
	color: var(--color-grn);
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.dr-bio__inner {
	max-width: 980px;
	margin-inline: auto;
}
.dr-bio__col2 {
	display: flex;
	align-items: flex-start;
	column-gap: 3%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.dr-bio__inner.dr-bio__col2 {
	display: grid;
	row-gap: 1.6em;
}
}



/* ========================================================
  
  Layout

======================================================== */

/*---------------------------------------------------------
 Director
---------------------------------------------------------*/
.director {
	padding-top: 0;
}
.director .c-bg-color {
	height: calc(100% - min(12vw,160px));
	inset: auto 0 0 0;
}
.director .dr-bio {
	background-color: rgb(255 255 255 / 0.8);
}

/* Doctor - dir-prof
-----------------------------------------------*/
.dir-prof {
	position: relative;
	padding-bottom: 45px;
}
.dir-prof__img {
	max-width: max-content;
	margin-left: calc(50% - 50vw);
}
.dir-prof__name {
	position: absolute;
	width: 50%;
	max-width: 550px;
	padding: 4%;
	right: 0;
	bottom: 0;
}
.dir-prof__name::before {
	position: absolute;
	content: "";
	background: linear-gradient(to bottom, rgb(255 255 255 / 1), rgb(255 255 255 / 0.9));
	width: 100%;
	height: 100%;
	inset: 0;
	transform: skewX(-5deg);
	box-shadow: 0 0 10px rgb(0 0 0 / 0.1);
}
.dir-prof__name > div {
	max-width: max-content;
	margin-inline: auto;
}
.dir-prof__name .dr-post {
	font-size: min(2vw,147%);
	letter-spacing: .18em;
}
.dir-prof__name .dr-name {
	margin-bottom: 0;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.dir-prof__img {
	width: 84%;
	margin-left: -12%;
}
.dir-prof__name {
	margin-right: -3%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.dir-prof {
	padding-bottom: 25vw;
}
.dir-prof__img {
	width: 100%;
}
.dir-prof__name {
	width: 75%;
	padding: 5%;
}
.dir-prof__name .dr-post {
	font-size: 90%;
}
}

/* Doctor - dir-msg
-----------------------------------------------*/
.dir-msg {
	position: relative;
}
.dir-msg .c-hdg--min {
	color: var(--color-grn);
	font-size: min(3.8vw,252%);
	line-height: 1.5;
}
.dir-msg .c-bg-img {
	width: 51vw;
	height: auto;
	max-height: none;
	-webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 20%);
	mask-image: linear-gradient(to bottom, transparent 0%, black 20%);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: auto;
    mask-size: auto;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.dir-msg .l-flt__img {
	width: 49%;
	margin-right: 6%;
}
.dir-msg__txt {
	width: 60%;
	max-width: 610px;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.dir-msg .c-hdg--min {
	font-size: 160%;
}
.dir-msg .c-bg-img {
	width: 70vw;
	top: -25vw;
}
}




/*---------------------------------------------------------
 Specialist
---------------------------------------------------------*/
.spe-ttl {
	text-align: center;
	letter-spacing: .18em;
	padding-bottom: 1em;
	margin-bottom: 2em;
	border-bottom: 1px solid currentColor;
}
.spe-ttl span {
	display: block;
	font-size: 155%;
	letter-spacing: normal;
	margin-top: .2em;
}
.spe-flt .c-txt--circle {
	font-size: min(1.8vw,125%);
	background-color: rgb(255 255 255 / 0.8);
	left: 5%;
	bottom: -5%;
	box-shadow: 6px 6px 12px rgb(0 0 0 / 0.1);
}
.spe-flt .c-txt--circle span {
	display: block;
	font: var(--font-en);
	color: var(--color-grn);
	font-size: 314%;
	line-height: 0.9;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

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

.spe-flt .l-flt__img {
	width: 70%;
}
.spe-flt .c-txt--circle {
	font-size: 90%;
	left: -15%;
}
.spe-flt .dr-name {
	text-align: center;
}
}



/*---------------------------------------------------------
 Doctor
---------------------------------------------------------*/

/* Doctor - dr-list
-----------------------------------------------*/
.dr-list {
	display: grid;
	row-gap: 2em;
}
.dr-list__item {
	position: relative;
}
.dr-list__item figure {
	display: grid;
	justify-content: space-between;
	grid-template-columns: 49% 44%;
}
.dr-list__img {
	clip-path: polygon(0 0, 100% 0, 100% 52%, 35% 100%, 0 100%);
}
.dr-list__name:not(:has(.dr-post)) {
	align-self: center;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.dr-list {
	display: grid;
	justify-content: space-between;
	grid-template-columns: repeat(2,48.5%);
	row-gap: min(7vw,5.2em);
}
.dr-list__txt {
	width: 65%;
	max-width: 340px;
	margin-top: -3em;
	margin-left: auto;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.dr-list__item figure {
	grid-template-columns: 42% 50%;
	margin-bottom: 4%;
}
}



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

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

/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

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

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


}