.teacher {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1; }
  .teacher:hover .teacher-tt {
    color: #96171A; }
  .teacher-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 1.6rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center; }
    @media screen and (max-width: 800px) {
      .teacher-inner {
        gap: 1rem; } }
  .teacher-des {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 0.8rem; }
    .teacher-des-inner {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      gap: 0.4rem;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center; }
      .teacher-des-inner .icon {
        --wh: 2.4rem;
        width: var(--wh);
        height: var(--wh);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-negative: 0;
        flex-shrink: 0; }
        @media screen and (max-width: 1200px) {
          .teacher-des-inner .icon {
            --wh: 1.8rem; } }
        .teacher-des-inner .icon img {
          width: 100%;
          height: 100%;
          -o-object-fit: contain;
          object-fit: contain;
          display: block; }
    .teacher-des .txt {
      text-align: center;
      --f-sz: 1.5rem;
      font-size: var(--f-sz);
      font-weight: 400;
      color: #475569; }
      @media screen and (max-width: 800px) {
        .teacher-des .txt {
          --f-sz: 1.3rem; } }
  .teacher-tt {
    font-size: 2rem;
    font-weight: 700;
    color: #1E1E1E;
    text-align: center;
    -webkit-transition: all 0.45s ease;
    transition: all 0.45s ease; }
    @media screen and (max-width: 500px) {
      .teacher-tt {
        font-size: 1.6rem; } }
  .teacher-link {
    position: absolute;
    inset: 0;
    z-index: 2; }

.box {
  background-color: #ffffff;
  width: 100%; }
  @media screen and (min-width: 1201px) {
    .box {
      padding: 0 2.4rem; } }
  .box-inner {
    --bder: 24rem;
    position: relative;
    display: block;
    overflow: hidden;
    z-index: 1;
    border-radius: 0 0 var(--bder) var(--bder); }
    .box-inner::before {
      position: absolute;
      content: "";
      left: 0;
      right: 0;
      width: 100%;
      bottom: 0;
      border-radius: var(--bder);
      height: 80%;
      background-color: #F5E8E8;
      z-index: -1; }
  .box-img {
    display: block;
    padding-top: calc((370 / 250) * 100%);
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    position: relative; }
    .box-img img {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
      object-fit: cover;
      display: block; }
  .box-decor {
    position: absolute;
    left: 0;
    width: 110%;
    -webkit-transform: translate(-31%, 65%);
    transform: translate(-31%, 65%);
    bottom: -1rem;
    padding-top: calc(180 / 180 * 100%); }
    .box-decor img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      -o-object-fit: contain;
      object-fit: contain;
      display: block; }

/*# sourceMappingURL=box.css.map */