@charset "UTF-8";


/* ========================================================
  
  page_common

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

/*
---------------------------------------------------------*/
.stf_name {
	font-size: 106%;
	line-height: 1.4;
	letter-spacing: .2em;
}
.stf_name dt {
	margin-bottom: .2em;
}
.stf_name .ft_min {
	position: relative;
	max-width: max-content;
	font-size: min(3.6vw,262%);
	letter-spacing: .2em;
	white-space: nowrap;
	padding-right: .8em;
}
.stf_name .ft_min i {
	position: absolute;
	color: var(--color-bgrn);
	font-size: 60%;
	right: 0;
	top: 0;
}
.stf_name .ft_en {
	font-size: 87%;
	letter-spacing: .2em;
	margin-top: .5em;
}
.stf_name .ft_en span {
	color: var(--color-bgrn);
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.stf_name {
	font-size: 90%;
}
.stf_name .ft_min {
	font-size: 200%;
}
}

/*stf_bio_box
---------------------------------------------------------*/
.stf_bio_box {
	background-color: rgba(255,255,255,0.5);
	margin-top: 5%;
}
.stf_bio_box dt {
	color: #2ab1b0;
	font: var(--font-min);
	font-size: 120%;
	letter-spacing: .15em;
	line-height: 1.5;
	margin-bottom: .8em;
}
.stf_bio_box dd {
	font-size: 94%;
	letter-spacing: .1em;
}
.stf_bio_box .com_list > li::before {
	background-color: #2ab1b0;
}

.tbl_reki {
	text-align: left;
	line-height: 1.5;
	border-spacing: 0 .5em;
}
.tbl_reki th {
	width: 6.5em;
	font-weight: normal;
	vertical-align: top;
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.stf_bio_box {
	background-color: rgba(255,255,255,0.5);
	margin-top: 5%;
}
.stf_bio_box dl:nth-of-type(n+2) {
	margin-top: 6%;
}
.stf_bio_box dt {
	font-size: 105%;
	margin-bottom: .6em;
}
.stf_bio_box dd {
	font-size: 90%;
	letter-spacing: .05em;
}
.tbl_reki th {
	width: 5.2em;
}
}



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

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

/*---------------------------------------------------------
 DENTIST
---------------------------------------------------------*/
.dentist_title {
	text-align: center;
	margin-bottom: 8%;
}
.dentist_title .com_h__deco {
	--deco-color: #3fc3b2;
	--deco-bg-color: #F5F5F2;
	opacity: 0.4;
	margin-bottom: .2em;
}


/* DENTIST: director
---------------------------------------------------------*/
.dir_img img {
	width: 70%;
	max-width: max-content;
	margin: auto;
}
.dir_msg {
	position: relative;
}
.dir_msg .com_bg__img {
	width: 66vw;
	max-width: 1000px;
	height: 865px;
	max-height: max-content;
	top: max(-140px,-10vw);
}
.dir_msg .com_bg__img::after {
	content:"";
	position: absolute;
	inset:0;

	background:
		linear-gradient(to right, var(--color-bei) 5%, transparent 50%),
		linear-gradient(to bottom, var(--color-bei) 5%, transparent 50%),
		linear-gradient(to top, var(--color-bei) 5%, transparent 50%);

	pointer-events:none;
}
/* PC,Tablet
------------------------------------------*/
@media only screen and (min-width: 768px) {

.dir_img .stf_name {
	font-size: 120%;
	max-width: max-content;
	margin: 3em 5% auto auto;
}
.dir_img .stf_name dd {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .2em 1.2em;
}
.dir_img .stf_name .ft_min {
	font-size: min(4vw,266%);
}
.dir_img .stf_name .ft_em {
	margin-top: 0;
}
.dir_msg .box_txt {
	width: 60%;
	max-width: 625px;
}
.dir_msg .box_txt p {
	font-size: 105%;
	line-height: 2.4;
}
#director .stf_bio_box {
	display: flex;
	column-gap: 14%;
}
}

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

.dir_msg .com_bg__img {
	top: -35vw;
}
.dir_img {
	width: 90%;
	margin: 0 auto 7%;
}
.dir_img img {
	width: 100%;
}
.dir_img .stf_name {
	margin-top: 2em;
}
}


/* DENTIST: stf_list
---------------------------------------------------------*/
.stf_list .stf_img {
	position: relative;
	max-width: max-content;
	margin: 0 auto 6%;
}
.stf_list .stf_name {
	margin-top: 6%;
}
/* PC,Tablet
------------------------------------------*/
@media only screen and (min-width: 768px) {

.stf_list {
	display: grid;
	justify-content: space-between;
	grid-template-columns: repeat(2,min(47%,550px));
	row-gap: min(8vw,8em);
}
.stf_list .stf_bio_box {
	padding: 8%;
}
.stf_list .stf_bio_box dl:nth-of-type(n+2) {
	margin-top: 6%;
}
}

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

.stf_list > li {
	padding-top: 10%;
	margin-top: 10%;
	border-top: 1px solid #E6E6E6;
}
.stf_list .stf_img {
	width: 90%;
}
}


/*---------------------------------------------------------
 OMOTENASHI
---------------------------------------------------------*/
#omotenashi .com_bg__color {
	background-color: rgba(213,172,85,0.1);
}
#omotenashi .com_bg__color::before {
	position: absolute;
	content: "";
	background: url(../../images/staff/bg-splay@2x.png) no-repeat right center;
	background-size: contain;
	width: 51%;
	height: 100%;
	right: 0;
	top: 0;
	z-index: -1;
}
.omotenashi_title {
	margin-bottom: 2.5%;
}
.omotenashi_title .com_h__en {
	padding-left: 2em;
	margin-bottom: 3em;
}
.omotenashi_title .com_h__en::before {
	color: var(--color-och);
	font-size: 110%;
}
.omotenashi_title .com_h__min img {
	display: inline-block;
	width: 4.43em;
	margin: 0 .1em 0 0;
	vertical-align: -1.6em;
}

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

.omotenashi_title .com_h__min {
	font-size: min(3vw,220%);
}
}

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

#omotenashi .com_bg__color::before {
	background-position: right bottom 25%;
}
.omotenashi_title {
	margin-bottom: 6%;
}
}



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

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

}

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

}
