@charset "UTF-8";
.hero .en {
  color: #666666;
}
.hero .ch {
  color: #666666;
  font-size: 20px;
  padding-top: 40px;
  line-height: 2.4;
  font-weight: 300;
}
.hero a {
  color: #333333;
  padding-top: 60px;
  display: inline-block;
  text-decoration: none;
  background-repeat: repeat-x;
  background-image: linear-gradient(to right, currentColor 100%, currentColor 0);
  background-size: 1px 1px;
  background-position: 0 100%;
  white-space: initial;
}
.hero a:hover, .hero a:active {
  color: #04CBC3;
  border-bottom: 1px solid #04CBC3;
  text-decoration: none;
}

.works {
  display: flex;
  padding: 30px 0;
  flex-wrap: wrap;
}
.works .work {
  text-align: right;
}
.works .company {
  text-align: left;
}
.works .position {
  color: #666666;
}
.works .duty, .works .companyName, .works .position, .works .workyear {
  padding: 10px 5%;
}
.works .companyName {
  color: #333333;
}
.works .workyear {
  min-width: 238px;
  color: #333333;
}

.myexperience, .skills, .contact {
  background-color: #fafafa;
}

.toolbox .tools {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  padding: 0 10%;
}
.toolbox .cards {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: center;
}
.toolbox .card {
  min-width: 220px;
  display: flex;
  justify-content: center;
  padding: 60px 2% 60px 2%;
  margin: 20px 1%;
  border-radius: 0;
  border: 0px;
  box-shadow: -4px -4px 20px 0px rgb(255, 255, 255), 4px 4px 25px 0 rgba(0, 0, 0, 0.1);
}
.toolbox img {
  width: 50%;
  align-self: center;
  padding-bottom: 20px;
}

.skills ul {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding-left: 25%;
  justify-content: center;
}
.skills ul div {
  width: 80%;
  display: flex;
  flex-wrap: wrap;
}
.skills li {
  display: flex;
  width: 50%;
  padding-bottom: 10px;
  min-width: 190px;
}
.skills li::before {
  content: "•";
  width: 5px;
  color: #333333;
  padding-right: 20px;
}

.education ul {
  width: 100%;
}
.education li {
  width: 60%;
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.education li p {
  padding-right: 3%;
  min-width: 187px;
  text-align: left;
}
.education li .school::after {
  content: "畢業";
  position: relative;
  left: 20px;
}

@media (max-width: 989px) {
  .works .work {
    text-align: left;
  }
  .skills ul {
    padding-left: 10%;
  }
  .skills ul div {
    width: 100%;
  }
}
@media (max-width: 575px) {
  .Me {
    position: relative;
  }
  .hero .ch {
    font-size: 20px;
    line-height: 1.8;
  }
  .education li {
    justify-content: center;
  }
  .education li p {
    text-align: center;
    padding-right: 0;
  }
  .toolbox .cards {
    justify-content: space-around;
  }
  .toolbox .card {
    min-width: 45%;
    padding: 50px 2% 50px 2%;
  }
  .toolbox .tools {
    padding: 0px 0px;
  }
  .works .duty, .works .companyName, .works .position, .works .workyear {
    padding: 5px 0;
  }
}/*# sourceMappingURL=me.css.map */