.career-mission-section,
.career-vision-section {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  /* font-family: "Roboto", "Noto Sans TC", Arial; */
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.15;
  letter-spacing: normal;
}

.career-mission-section {
  margin-top: 69px;
  padding: calc(100vw * 173 / 1920) calc(100vw * 200 / 1920)
    calc(100vw * 173 / 1920) calc(100vw * 92 / 1920);
}

.career-vision-section {
  padding: calc(100vw * 73 / 1920) calc(100vw * 200 / 1920);
  background-color: #242930;
}

.career-mission-svg {
  width: calc(100vw * 746.428 / 1920);
  height: calc(100vw * 732.815 / 1920);
  margin-right: auto;
  transition: all 0.2s ease-in-out;
}

.career-vision-svg {
  width: calc(100vw * 675 / 1920);
  height: calc(100vw * 350 / 1920);
  margin-right: auto;
  transition: all 0.2s ease-in-out;
}

.career-mission-group {
  width: calc(100vw * 753 / 1920);
  transition: all 0.2s ease-in-out;
}

.career-vision-group {
  width: calc(100vw * 753 / 1920);
  transition: all 0.2s ease-in-out;
}

.career-main-title {
  font-size: calc(100vw * 80 / 1920);
  text-align: left;
  color: #ffffff;
  word-break: break-all;
}

.career-main-description {
  font-size: calc(100vw * 44 / 1920);
  text-align: left;
  color: #aab0b6;
}

.career-mission-section:not(.actived) .career-mission-svg {
  transform: translate3d(-25%, 0, 0);
  opacity: 0;
}

.career-mission-section:not(.actived) .career-mission-group {
  transform: translate3d(25%, 0, 0);
  opacity: 0;
}

.career-vision-section:not(.actived) .career-vision-svg {
  transform: translate3d(-25%, 0, 0);
  opacity: 0;
}

.career-vision-section:not(.actived) .career-vision-group {
  transform: translate3d(25%, 0, 0);
  opacity: 0;
}

.career-detail-section > :nth-child(2n + 1):not(.actived) {
  transform: translate3d(-25%, 0, 0);
  opacity: 0;
}

.career-detail-section > :nth-child(2n):not(.actived) {
  transform: translate3d(25%, 0, 0);
  opacity: 0;
}

.career-detail-section {
  position: relative;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  /* font-family: "Roboto", "Noto Sans TC", Arial; */
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: normal;
  text-align: left;

  margin-bottom: 20px;
}

.career-department-title,
.career-position-item {
  position: relative;
  width: 52%;
  max-width: 1000px;
  min-width: 700px;
  box-sizing: border-box;
  display: block;
  margin-left: auto;
  margin-right: auto;
  transition: all 0.2s ease-in-out;
}

.career-department-title {
  margin-top: 40px;
  font-size: 40px;
  font-weight: bold;
  line-height: 1.13;
  color: #19b9c3;
}

.career-position-item {
  display: flex;
  flex-wrap: nowrap;
  padding: 31px 40px;
  margin-top: 20px;
  border-radius: 40px;
  border: solid 1px #19b9c3;
}

.career-position-title {
  font-size: 28px;
  margin: 0 0 15px 0;
  line-height: 1.16;
  letter-spacing: normal;
  text-align: left;
  color: #ffffff;
}

.career-position-Location,
.career-position-Type {
  font-size: 26px;
  margin: 0;
  line-height: 1.13;
  letter-spacing: normal;
  text-align: left;
  color: #aab0b6;
}

.career-position-detail {
  position: relative;
  box-sizing: border-box;
  display: block;
  margin: auto 0 auto auto;
  white-space: nowrap;
  transition: all 0.2s ease-in-out;
}

.position-detail-icon {
  display: inline-block;
  width: 22px;
  height: 22px;
  object-fit: contain;
  margin-right: 0.4em;
}

.position-detail-text {
  font-size: 28px;
  transition: all 0.2s ease-in-out;
}

@media (max-width: 767px) {
  .career-mission-section,
  .career-vision-section {
    flex-direction: column-reverse;
  }

  .career-mission-section {
    padding: calc(100vw * 40 / 375) 0;
  }

  .career-vision-section {
    padding: calc(100vw * 80 / 375) 0;
  }

  .career-mission-svg,
  .career-vision-svg {
    margin: auto;
  }

  .career-mission-svg {
    width: calc(100vw * 250 / 375);
    height: calc(100vw * 245 / 375);
    margin-right: auto;
  }

  .career-vision-svg {
    width: calc(100vw * 270 / 375);
    height: calc(100vw * 140 / 375);
    margin-right: auto;
  }

  .career-mission-group,
  .career-vision-group {
    width: calc(100vw * 295 / 375);
    margin-bottom: calc(100vw * 40 / 375);
  }

  .career-main-title {
    /* font-size: calc(100vw * 80/1920); */
    font-size: calc(100vw * 36 / 375);
    text-align: center;
  }

  .career-main-description {
    /* font-size: calc(100vw * 44/1920); */
    font-size: calc(100vw * 24 / 375);
    text-align: center;
    margin-top: calc(100vw * 20 / 375);
  }

  .career-department-title,
  .career-position-item {
    width: 78.67%;
    max-width: unset;
    min-width: unset;
  }
  .career-position-item {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: calc(100vw * 20 / 360) calc(100vw * 21 / 360);
    border-radius: calc(100vw * 30 / 360);
  }
  .career-department-title,
  .career-position-title,
  .career-position-Location,
  .career-position-Type {
    text-align: center;
  }

  .career-position-title {
    font-size: calc(100vw * 18 / 360);
  }

  .career-position-Location,
  .career-position-Type {
    /* font-size: 16px; */
    font-size: calc(100vw * 16 / 360);
  }
  .career-position-detail {
    margin: auto;
    margin-top: 20px;
  }
  .position-detail-icon {
    width: calc(100vw * 16 / 360);
    height: calc(100vw * 16 / 360);
  }
  .position-detail-text {
    font-size: calc(100vw * 18 / 360);
  }
}