@import "../iconfont/iconfont.css";

* {
  padding: 0;
  margin: 0;
  outline: none;
}

a {
  text-decoration: none;
  color: inherit;
}

a:active {
  color: inherit;
}

ul,
li {
  list-style: none;
}
button, input {
  appearance: none;
  border: none;
  background-color: transparent;
  font-family: inherit;
}
input::placeholder {
  color: #768C83;
}
html,
body {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", serif;
  color: #444;
  background-color: #F7F7F7;
}

.container {
  display: flex;
  flex-direction: column;

  height: 100%;
  font-size: 0.37rem;
}
.page-container {
  flex: 1;
  height: 0;
  box-sizing: border-box;
  overflow: auto;

  display: flex;
  flex-direction: column;
  padding: 0.4rem;
  gap: 0.27rem;
}
.page-container > * {
  flex-shrink: 0;
}
.gray {
  color: #768C83;
}
.font-size26 {
  font-size: 0.35rem;
}
.font-size28 {
  font-size: 0.37rem;
}
.font-size30 {
  font-size: 0.4rem;
}
.font-size34 {
  font-size: 0.45rem;
}

/*flex布局常用组合*/
/*水平方向两端布局，垂直居中*/
.vertical-space-between {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
/*水平方向gap:10px，垂直居中*/
.vertical-gap10 {
  display: flex;
  align-items: center;
  gap: 0.13rem;
}
/*水平方向gap:10px，上对齐*/
.vertical-start-gap10 {
  display: flex;
  align-items: flex-start;
  gap: 0.13rem;
}
/*竖直方向，水平+垂直居中*/
.cloumnCenter {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
/*竖直方向，水平左对齐，垂直居中, gap:12px*/
.cloumn-gap12 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.16rem;
}
/*竖直方向，水平左对齐，垂直居中, gap:12px*/
.cloumn-center-gap16 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.21rem;
}
/*竖直方向，水平左对齐，垂直居中, gap:20px*/
.cloumn-gap20 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.27rem;
}
/*宽高为13px的蓝色圆点*/
.dot {
  width: 0.17rem;
  height: 0.17rem;
  background: #13B9A9;
  border-radius: 50%;
}

/*头部logo区域*/
.header {
  flex-shrink: 0;
  position: relative;

  display: flex;
  align-items: center;
  justify-content: center;
 }
.header-bg {
  width: 100%;
}
.header-logo {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;

  display: flex;
  align-items: center;
  justify-content: center;
}
.header-logo > img {
  width: 4.67rem;
}

/*区县选择区域样式*/
.box {
  border-radius: 0.27rem;
  background: #FFFFFF;

  display: flex;
  flex-direction: column;
  padding: 0.4rem;
  gap: 0.27rem;
}
.box > * {
  padding-bottom: 0.27rem;
  border-bottom: 1px solid #E5E5E5;
}
.box > *:last-child {
  padding-bottom: 0;
  border-bottom: none;
}
.search-box {
  border-radius: 0.16rem;
  background: #E5F6F0;
  color: #3D3D3D;

  display: flex;
  flex-direction: row;
  padding: 0.4rem 0.27rem;
}
.search-box > * {
  flex: 1;
  width: 0;
}

/*按钮样式*/
.btn-submit {
  height: 1.31rem;
  border-radius: 0.16rem;
  background: #1AC8B7;

  font-size: 0.4rem;
  font-weight: bold;
  color: #fff;

  display: flex;
  align-items: center;
  justify-content: center;
}

/*表格样式*/
table {
  background-color: #fff;
  border-collapse: collapse;
}
th {
  background-color: #E5F6F0;
  color: #13B9A9;
  font-size: 0.32rem;
  font-weight: normal;
}
th, td {
  padding: 0.27rem 0.13rem;
  border: 1px solid #E5F6F0;
  text-align: center;
}
td {
  font-size: 0.32rem;
  color: #444444;

}
.td-option {
  color: #13B9A9;
}

/*二维码样式*/
.code-box {
  align-items: center;
}
.code-box .code-img {
  width: 2.4rem;
}
.code-box .code-tip {
  font-size: 0.35rem;
}
.code-box .code-copyright {
  font-size: 0.27rem;
  color: #768C83;
  padding: 0.4rem 0;
}
