@charset "utf-8";
/*--------------------------------------------------------------------------------
  intro
--------------------------------------------------------------------------------*/
.intro {
  text-align: center;
  font-family: var(--ff-mgo);
  padding-top: var(--space-s);
}
.intro span {
  display: block;
  line-height: 1.5;
}
.intro .line1 {
  font-weight: 700;
  font-size: var(--fs-l);
  padding-bottom: 0.75rem;
}
.intro .line2 {
  display: inline-block;
  font-weight: 900;
  color: var(--pink);
  font-size: var(--fs-3l);
  position: relative;
  padding: 0 2.5rem 0 3.75rem;
}
.intro .line2:before,
.intro .line2:after {
  content: "";
  width: 2.5rem;
  height: 100%;
  display: inline-block;
  position: absolute;
  top: 0;
  background-image: url("../../image/icon/shine.svg");
  background-repeat: no-repeat;
  background-size: contain;
}
.intro .line2:before { left: 0; transform: scale(1, -1); background-position: center 20%; }
.intro .line2:after { right: 0; background-position: center 20%; }

/*--------------------------------------------------------------------------------
  メッセージ
--------------------------------------------------------------------------------*/
.mess {
  padding: var(--space-s) var(--side-space) var(--space-m) var(--side-space);
}
.mess-txt:not(:first-of-type) {
  padding-top: 1rem;
}

/*--------------------------------------------------------------------------------
  院長紹介
--------------------------------------------------------------------------------*/
.dr {
  position: relative;
  background-color: var(--bblue20);
  padding: var(--space-s) var(--side-space) var(--space-m) var(--side-space);
}
.dr:before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  background: url("../../image/mess-deco.svg") no-repeat center var(--space-2s);
  background-size: contain;
}
.dr * {
  position: relative;
  z-index: 1;
}
.dr-photo {
  border-radius: 9999px 9999px 0 0;
  overflow: hidden;
  width: max(60%, 160px);
  margin-left: auto;
  margin-right: auto;
  margin-top: var(--space-s);
}
.dr-name {
  line-height: 1.4;
  text-align: center;
  font-family: var(--ff-mgo);
  font-weight: 500;
  padding-top: 1.25rem;
  padding-bottom: 1.5rem;
}
.dr-name .jp {
  padding-top: 0.75rem;
  display: block;
  font-size: var(--fs-3l);
  font-weight: 700;
}
.dr-name .en {
  display: block;
  font-size: var(--fs-s);
  font-weight: 500;
  color: var(--bblue);
}

/* box
----------------------------------------*/
.dr-box {
  font-size: 0.95em;
  background-color: #FFF;
}
.dr-box--1 {
  border-radius: 0.75rem;
  margin-top: var(--space-3s);
}
.dr-box--2 {
  border-radius: 0 0 0.75rem 0.75rem;
}
.dr-box .inner {
  padding: var(--space-2s);
}
.dr-box-ttl {
  position: relative;
  padding-top: 2.5rem;
  margin-top: var(--space-2s);
}
.dr-box-ttl:before,
.dr-box-ttl:after {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.dr-box-ttl:before {
  content: "";
  line-height: 1;
  top: 0;
  width: 0.8rem;
  height: 0.8rem;
  display: inline-block;
  background-color: var(--yellow);
  border-radius: 100%;
  z-index: 2;
}
.dr-box-ttl:after {
  content: "";
  top: 0.2rem;
  width: 30%;
  height: 2.5rem;
  display: block;
  clip-path: polygon(0 100%, 3% 100%, 50% 6%, 97% 100%, 100% 100%, 50% 0);
  background-color: var(--bblue);
  z-index: 1;
}
.dr-box-ttl .txt {
  position: relative;
  background-color: #FFF;
  line-height: 1.4;
  text-align: center;
  font-family: var(--ff-mgo);
  font-size: var(--fs-3l);
  font-weight: 700;
  color: var(--bblue);
  border-top: 4px solid var(--bblue);
  padding-top: var(--space-s);
}

/* 経歴・沿革 */
.dr-timeline {
  line-height: 1.6;
  display: grid;
  grid-template-columns: auto 1fr;
  row-gap: 0.25rem;
}
.timeline-prof {
  row-gap: 0.5rem;
}
.dr-timeline dt {
  display: flex;
  justify-content: flex-end;
  color: var(--bblue);
}
.dr-timeline dt .m {
  width: 3em;
  text-align: right;
}
.dr-timeline dd {
  padding-left: 1em;
}

/*--------------------------------------------------------------------------------
  職場環境
--------------------------------------------------------------------------------*/
.point {
  padding: var(--space-m) var(--side-space) 0 var(--side-space);
}
.point-txt {
  padding-bottom: var(--space-s);
}
.point-txt p:not(:first-of-type) {
  padding-top: 1rem;
}
.point-txt .em {
  display: inline-block;
  margin: 0.5rem 0 0.25rem 0;
  font-family: var(--ff-mgo);
  font-weight: 700;
  color: var(--pink);
  font-size: var(--fs-l);
}
.point-list {
  list-style: none;
  line-height: 1.6;
  counter-reset: number 0;
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
  font-family: var(--ff-mgo);
  font-weight: 500;
  font-size: var(--fs-m);
}
.point-list li {
  counter-increment: number 1;
  background-color: var(--bpink20);
  border-radius: 0.5rem;
  padding: var(--space-3s);
  display: grid;
  grid-template-columns: 3rem auto;
}
.point-list li:before {
  content: counter(number);
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
  border-radius: 100%;
  background-color: var(--pink);
  font-weight: 500;
  color: #FFF;
  margin-top: -0.1rem;
}
.point-list li small {
  font-size: var(--fs-2s);
}

/*--------------------------------------------------------------------------------
  ビジョン
--------------------------------------------------------------------------------*/
.vision {
  padding: var(--space-s) var(--side-space) 0 var(--side-space);
}
.vision-txt {
  font-family: var(--ff-mgo);
  font-weight: 500;
  font-size: var(--fs-m);
  padding-bottom: var(--space-s);
}

/*--------------------------------------------------------------------------------
  福利厚生
--------------------------------------------------------------------------------*/
.welfare {
  background-color: var(--bblue50);
  padding: var(--space-s) var(--side-space) var(--space-m) var(--side-space);
}
.welfare-list {
  padding-top: var(--space-s);
  list-style: none;
  line-height: 1.3;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  font-family: var(--ff-mgo);
  font-weight: 700;
  font-size: var(--fs-m);
}
.welfare-list li {
  width: calc((99.9% - 0.75rem) / 2);
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  border: 3px solid var(--bblue70);
  background-color: #FFF;
  border-radius: 0.75rem;
  padding: 1em 0.5em;
}