/* -----------------------
  .doctor
----------------------- */
.doctor {
  background: url(../img/doctor_bg.jpg) repeat left top / 100% auto;
  padding-bottom: min(18.85vw, 147px);
  position: relative;
}

.doctor .photo {
  position: absolute;
  z-index: 2;
  top: max(-15.51vw, -121px);
  right: 0;
}
.doctor .medal-box {
  display: grid;
  grid-template-columns: auto auto;
} 
.doctor .medal-box .txt {
  width: min(16.41vw, 128px);
  grid-area: 1 / 2 / 2 / 3;
  z-index: 3;
  transition-delay: .5s;
}
.doctor .medal-box .medal {
  grid-area: 1 / 1 / 2 / 3;
  z-index: 3;
  transition-delay: .75s;
}

.doctor .expert {
  position: relative;
  z-index: 4;
}

.doctor .profile .inner {
  position: relative;
}
.doctor .profile .inner::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background: 
    linear-gradient(to left, #a27b50, #a27b50) no-repeat left top, /* 上左 */
    linear-gradient(to bottom, #a27b50, #a27b50) no-repeat left top, /* 左 */
    linear-gradient(to right, #a27b50, #a27b50) no-repeat left bottom, /* 下 */
    linear-gradient(to top, #a27b50, #a27b50) no-repeat right bottom, /* 右 */
    linear-gradient(to left, #a27b50, #a27b50) no-repeat right top; /* 上右 */
    clip-path: inset(0 0 0 50%);
}

.doctor .profile-01 .inner::before {
  height: min(66.67vw, 520px);
  background-size:
    min(31.92vw, 249px) min(0.26vw, 2px),
    0 0,
    0 0,
    0 0,
    0 0;
}
.doctor .profile-02 .inner::before {
  height: min(59.87vw, 467px);
  background-size:
    min(22.44vw, 175px) min(0.26vw, 2px),
    0 0,
    0 0,
    0 0,
    0 0;
}
.doctor .profile-01.trigger.move .inner::before {
  animation: square_line 1.3s ease-in-out forwards;
}
.doctor .profile-02.trigger.move .inner::before {
  animation: square_line2 1.3s ease-in-out forwards;
}

@keyframes square_line {
  0% {
    background-size:
      min(31.92vw, 249px) min(0.26vw, 2px),
      0 0,
      0 0,
      0 0,
      0 0;
    clip-path: inset(0 0 0 50%);
  }

  15% {
    background-size:
      min(31.92vw, 249px) min(0.26vw, 2px),
      min(0.26vw, 2px) 0,
      0 0,
      0 0,
      0 0;
    clip-path: inset(0);
  }

  30% {
    background-size:
      min(31.92vw, 249px) min(0.26vw, 2px),
      min(0.26vw, 2px) 100%,
      0 min(0.26vw, 2px),
      0 0,
      0 0;
    clip-path: inset(0);
  }

  60% {
    background-size:
      min(31.92vw, 249px) min(0.26vw, 2px),
      min(0.26vw, 2px) 100%,
      100% min(0.26vw, 2px),
      min(0.26vw, 2px) 0,
      0 0;
    clip-path: inset(0);
  }

  75% {
    background-size:
      min(31.92vw, 249px) min(0.26vw, 2px),
      min(0.26vw, 2px) 100%,
      100% min(0.26vw, 2px),
      min(0.26vw, 2px) 100%,
      0 min(0.26vw, 2px);
    clip-path: inset(0);
  }

  100% {
    background-size:
      min(31.92vw, 249px) min(0.26vw, 2px),
      min(0.26vw, 2px) 100%,
      100% min(0.26vw, 2px),
      min(0.26vw, 2px) 100%,
      min(31.92vw, 249px) min(0.26vw, 2px);
    clip-path: inset(0);
  }
}
@keyframes square_line2 {
  0% {
    background-size:
      min(22.44vw, 175px) min(0.26vw, 2px),
      0 0,
      0 0,
      0 0,
      0 0;
    clip-path: inset(0 0 0 50%);
  }
  15% {
    background-size:
      min(22.44vw, 175px) min(0.26vw, 2px),
      min(0.26vw, 2px) 0,
      0 0,
      0 0,
      0 0;
    clip-path: inset(0);
  }
  30% {
    background-size:
      min(22.44vw, 175px) min(0.26vw, 2px),
      min(0.26vw, 2px) 100%,
      0 min(0.26vw, 2px),
      0 0,
      0 0;
    clip-path: inset(0);
  }
  60% {
    background-size:
      min(22.44vw, 175px) min(0.26vw, 2px),
      min(0.26vw, 2px) 100%,
      100% min(0.26vw, 2px),
      min(0.26vw, 2px) 0,
      0 0;
    clip-path: inset(0);
  }
  75% {
    background-size:
      min(22.44vw, 175px) min(0.26vw, 2px),
      min(0.26vw, 2px) 100%,
      100% min(0.26vw, 2px),
      min(0.26vw, 2px) 100%,
      0 min(0.26vw, 2px);
    clip-path: inset(0);
  }
  100% {
    background-size:
      min(22.44vw, 175px) min(0.26vw, 2px),
      min(0.26vw, 2px) 100%,
      100% min(0.26vw, 2px),
      min(0.26vw, 2px) 100%,
      min(22.44vw, 175px) min(0.26vw, 2px);
    clip-path: inset(0);
  }
}
