@charset "utf-8";

@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap");

:root {
  /*--font-size: 16px;
    --font-size-small: 14px;
    --font-size-middle: 15px;
    --font-size-big: 18px;
    --font-size-large: 24px;*/
  --font-size: 17px;
  --font-size-small: 16px;
  --font-size-middle: 16px;
  --font-size-big: 24px;
  --font-size-large: 24px;

  --base-fonts: "Open Sans", "Microsoft JhengHei", "Microsoft YaHei", "微软雅黑",  Arial, sans-serif;
  --theme-blue: #248fd2;
  --theme-light-blue: #177DA6;
  --theme-dark-green: #297366;
  --theme-green: #12A646;
  --theme-light-green: #7EBF95;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: var(--base-fonts);
  color: currentColor;
  border: 0;
  position: relative;
}

input,
select,
textarea {
  font-family: var(--base-fonts);
  outline: none;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
}

input::-webkit-input-placeholder,
input:-moz-placeholder,
input::-moz-placeholder,
input:-ms-input-placeholder,
textarea::-webkit-input-placeholder,
textarea:-moz-placeholder,
textarea::-moz-placeholder,
textarea:-ms-input-placeholder {
  color: #aaa;
  font-family: var(--base-fonts);
}

input:focus,
input:focus {
  border-color: #007bff;
}

.label,
option {
  font-family: var(--base-fonts);
  outline: none;
}

img {
  border: none;
  outline: none;
}

a,
button {
  font-family: var(--base-fonts);
  cursor: pointer;
  text-decoration: none;
  outline: none;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
  -ms-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
}

li {
  list-style: none;
}

input::placeholder {
  color: #a9a9a9;
}

input:focus::placeholder {
  color: #ccc;
}