/*单行文本省略*/
/*背景色*/
/*圆角*/
/*阴影*/
/*渐变*/
/*移动变换*/
/*旋转变换*/
/*flex布局*/
body {
  background: #f5f5f5;
}
.recorde {
  width: 100%;
  background: #fff;
  margin-top: .2rem;
  padding: .2rem;
}
.recorde .recorde-title p {
  line-height: .5rem;
  font-size: .28rem;
}
.recorde .recorde-title P:nth-child(1) > span:nth-child(2) {
  float: right;
  width: .3rem;
  height: .3rem;
}
.recorde .recorde-title P:nth-child(1) > span:nth-child(2) a {
  width: 100%;
  height: 100%;
  display: inline-block;
  background: url(../img/text.png) no-repeat center / 0.3rem;
}
.recorde .recorde-text {
  width: 100%;
  border-radius: 0.1rem;
  -moz-border-radius: 0.1rem;
  -webkit-border-radius: 0.1rem;
  -khtml-border-radius: 0.1rem;
  background: #fafafa;
  border: 0.01rem solid #f0f0f0;
  padding: .2rem;
  position: relative;
  margin-top: .15rem;
}
.recorde .recorde-text p:nth-child(1) {
  width: 100%;
  height: .8rem;
  line-height: .4rem;
  font-size: .24rem;
  overflow: hidden;
}
.recorde .recorde-text > a > div {
  width: 100%;
  height: 1.25rem;
  margin-bottom: .2rem;
}
.recorde .recorde-text > a > div div {
  width: 1.25rem;
  height: 1.25rem;
  position: relative;
  display: inline-block;
  margin-top: .1rem;
}
.recorde .recorde-text > a > div div img {
  position: absolute;
  top: 0;
}
.recorde .recorde-text .icon {
  width: .26rem;
  height: .14rem;
  position: absolute;
  top: -0.14rem;
  left: .3rem;
}
.recorde .recorde-text .icon img {
  position: absolute;
  top: 0;
}
.recorde .recorde-text .details-hide {
  overflow: auto;
  height: auto !important;
}
.client-details {
  width: 100%;
  padding: .15rem .2rem;
  background: #f5f5f5;
}
.client-details ul {
  width: 100%;
  border-radius: 0.1rem;
  -moz-border-radius: 0.1rem;
  -webkit-border-radius: 0.1rem;
  -khtml-border-radius: 0.1rem;
  border: 0.01rem solid #fafafa;
  -moz-box-shadow: 0 0.05rem 0.1rem #ccc;
  -webkit-box-shadow: 0 0.05rem 0.1rem #ccc;
  box-shadow: 0 0.05rem 0.1rem #ccc;
  margin-bottom: .3rem;
}
.client-details ul li {
  line-height: .6rem;
  font-size: .28rem;
  padding: 0 .2rem;
  background: #fff;
}
.client-details ul li:nth-child(1) {
  border-radius: 0.1rem 0.1rem 0 0;
  -moz-border-radius: 0.1rem 0.1rem 0 0;
  -webkit-border-radius: 0.1rem 0.1rem 0 0;
  -khtml-border-radius: 0.1rem 0.1rem 0 0;
  background: #27a7db;
  color: #fff;
  text-align: center;
}
.client-details ul li:nth-child(3) span,
.client-details ul li:nth-child(4) span {
  color: orange;
}
.client-details ul li:last-child {
  background: #fafafa;
  text-align: right;
  color: #d6d6d6;
  border-radius: 0 0 0.1rem 0.1rem;
  -moz-border-radius: 0 0 0.1rem 0.1rem;
  -webkit-border-radius: 0 0 0.1rem 0.1rem;
  -khtml-border-radius: 0 0 0.1rem 0.1rem;
}
.jbd-client-details ul li {
  font-size: .26rem;
  color: #a5a5a5;
}
.jbd-client-details ul li span {
  color: #575757;
}
.jbd-client-details ul li:nth-child(1) {
  line-height: .8rem;
  font-size: .3rem;
  background-image: url(../img/modifi.png);
  background-position: 95% .1rem;
  background-repeat: no-repeat;
  background-size: .28rem;
  position: relative;
}
.jbd-client-details ul li:nth-child(1) a {
  width: .6rem;
  height: 100%;
  font-size: .22rem;
  position: absolute;
  left: 88%;
  padding-top: .18rem;
  color: #fff;
}
.jbd-client-details ul li:nth-child(2) {
  color: #575757;
  font-size: .32rem;
}
.jbd-client-details ul li:nth-child(3) span,
.jbd-client-details ul li:nth-child(4) span {
  color: #575757;
}
.jbd-client-details ul li:last-child span {
  color: #d6d6d6;
}
.details-btn {
  width: 100%;
  height: 1rem;
  margin-top: .3rem;
}
.details-btn ul {
  display: flex;
  flex: 1;
  height: 1rem;
}
.details-btn ul li {
  flex: 1;
  padding: 0 .2rem;
  height: 1rem;
  position: relative;
}
.details-btn ul li a {
  width: 87.5%;
  height: 1rem;
  margin: 0 auto;
  background-color: orange;
  line-height: 1rem;
  text-align: center;
  display: inline-block;
  color: #fff;
  font-size: .34rem;
  position: absolute;
  top: 0;
  border-radius: 0.1rem;
  -moz-border-radius: 0.1rem;
  -webkit-border-radius: 0.1rem;
  -khtml-border-radius: 0.1rem;
}
.client-masege {
  width: 100%;
  padding-bottom: 1.2rem;
}
.client-masege .mesage_1,
.client-masege .mesage_2 {
  width: 100%;
  background: #fff;
  padding-left: .2rem;
}
.client-masege .mesage_1 li,
.client-masege .mesage_2 li {
  line-height: 1rem;
  font-size: .28rem;
  border-bottom: 0.01rem solid #f0f0f0;
}
.client-masege .mesage_1 li span,
.client-masege .mesage_2 li span {
  color: red;
  position: relative;
  left: .1rem;
}
.client-masege .mesage_1 li input,
.client-masege .mesage_2 li input {
  line-height: 1rem;
  width: 70%;
  float: right;
  text-align: right;
  color: #a9a9a9;
  padding-right: .2rem;
  font-size: .28rem;
}
.client-masege .mesage_1 li input[value],
.client-masege .mesage_2 li input[value] {
  color: #575757;
}
.client-masege .mesage_1 li input[placeholder],
.client-masege .mesage_2 li input[placeholder] {
  color: #a9a9a9;
}
.client-masege .mesage_1 li input[type="button"][value],
.client-masege .mesage_2 li input[type="button"][value] {
  color: #a9a9a9;
}
.client-masege .mesage_1 li:nth-child(3) {
  border: none;
}
.client-masege .mesage_2 {
  background-color: #f5f5f5;
  padding-left: 0;
}
.client-masege .mesage_2 li {
  padding-left: .2rem;
  height: 1rem;
  margin-top: .2rem;
  display: block;
  background-color: #fff;
}
.client-masege .mesage_2 li input[type="button"] {
  background: url(../img/go-left.png) no-repeat 95% center / 0.28rem;
  padding-right: .7rem;
}
.client-masege .mesage_2 li:last-child {
  height: .8rem;
  line-height: .8rem;
  padding-left: 0;
  border-bottom: 0.01rem solid #f0f0f0;
}
.client-masege .mesage_2 li:last-child > label {
  display: block;
  padding-left: .2rem;
  width: 100%;
  height: 100%;
  border-bottom: 0.01rem solid #f0f0f0;
}
.client-masege .mesage_2 li:last-child textarea {
  width: 100%;
  height: 2rem;
  border: 0;
  background: #fff;
  padding: .2rem;
  font-size: .28rem;
  display: block;
  border-bottom: 0.01rem solid #f0f0f0;
  margin-bottom: 1.2rem;
}
.client-masege .linkman-ul > li input {
  width: 80%;
  text-align: left;
  padding-left: .5rem;
}
.client-masege .linkman-ul > li input[value] {
  color: #575757;
}
.client-masege .linkman-ul > li input[placeholder] {
  color: #a9a9a9;
}
.client-masege .client-ul li input[type="button"][value] {
  color: #575757;
}
.client-masege .client-ul li:last-child textarea {
  margin-bottom: .2rem;
}
.linkman {
  width: 100%;
}
.linkman ul {
  width: 100%;
  background: #fff;
  padding: .2rem;
}
.linkman ul li {
  width: 100%;
  height: 1rem;
  border-radius: 0.1rem;
  -moz-border-radius: 0.1rem;
  -webkit-border-radius: 0.1rem;
  -khtml-border-radius: 0.1rem;
  border: 0.01rem solid #27a7db;
  line-height: 1rem;
  text-align: center;
  font-size: .3rem;
  margin-bottom: .2rem;
  position: relative;
}
.linkman ul li span {
  width: .36rem;
  height: .36rem;
  position: absolute;
  left: 90%;
  top: .3rem;
  background: url(../img/delete.png) no-repeat center / 0.36rem;
}
.linkman ul li:last-child {
  border: .01rem dashed #ccc;
}
.linkman ul li:last-child a {
  width: 100%;
  height: 100%;
  display: block;
  color: #27a7db;
  text-align: center;
  line-height: 1rem;
  font-size: .3rem;
  background: url(../img/add.png) no-repeat 28% center / 0.44rem;
}
.add-recorde {
  width: 100%;
  padding: .2rem;
  background: #f5f5f5;
}
.add-recorde .recorde-main ul li {
  width: 100%;
  font-size: .28rem;
  margin: .2rem 0;
}
.add-recorde .recorde-main ul li > input {
  width: 100%;
  height: .8rem;
  background: #fff;
  border: 0.01rem solid #f0f0f0;
  border-radius: 0.1rem;
  -moz-border-radius: 0.1rem;
  -webkit-border-radius: 0.1rem;
  -khtml-border-radius: 0.1rem;
  font-size: .28rem;
  line-height: .8rem;
  -moz-box-shadow: 0.01rem 0.01rem 0.02rem #ccc;
  -webkit-box-shadow: 0.01rem 0.01rem 0.02rem #ccc;
  box-shadow: 0.01rem 0.01rem 0.02rem #ccc;
  padding-left: .2rem;
}
.add-recorde .recorde-main ul li > span {
  width: 100%;
  height: .8rem;
  line-height: .8rem;
  -moz-box-shadow: 0.01rem 0.01rem 0.02rem #ccc;
  -webkit-box-shadow: 0.01rem 0.01rem 0.02rem #ccc;
  box-shadow: 0.01rem 0.01rem 0.02rem #ccc;
  background-image: url(../img/go-left.png);
  background-position: 97% center;
  background-repeat: no-repeat;
  background-size: .28rem;
  background-color: #fff;
  text-align: right;
  display: block;
  border: .01rem solid #ebebeb;
}
.add-recorde .recorde-main ul li > span > span {
  width: 30%;
  height: .8rem;
  line-height: .8rem;
  display: inline-block;
  background: #f5f5f5;
  text-align: center;
  float: left;
  border-right: .01rem solid #ebebeb;
}
.add-recorde .recorde-main ul li > span > input {
  width: 68%;
  height: .8rem;
  float: right;
  text-align: right;
  padding-right: .6rem;
}
.add-recorde .recorde-main ul li textarea {
  width: 100%;
  height: 3.6rem;
  border-radius: 0.1rem;
  -moz-border-radius: 0.1rem;
  -webkit-border-radius: 0.1rem;
  -khtml-border-radius: 0.1rem;
  -moz-box-shadow: 0.01rem -0.01rem 0.02rem #ccc;
  -webkit-box-shadow: 0.01rem -0.01rem 0.02rem #ccc;
  box-shadow: 0.01rem -0.01rem 0.02rem #ccc;
  border-color: #EBEBEB;
  padding: .2rem;
}
.add-recorde .recorde-main li:last-child {
  margin-bottom: 0;
}
.add-something {
  width: 100%;
  padding: .2rem;
  margin-top: .2rem;
  padding-bottom: 1.4rem;
}
.add-something > ul {
  width: 100%;
}
.add-something > ul > li {
  width: 100%;
}
.add-something > ul > li > p {
  width: 100%;
  line-height: .6rem;
  font-size: .28rem;
}
.add-something > ul > li > ul {
  width: 100%;
  border-radius: 0.1rem;
  -moz-border-radius: 0.1rem;
  -webkit-border-radius: 0.1rem;
  -khtml-border-radius: 0.1rem;
  -moz-box-shadow: 0 0 0.05rem #ccc;
  -webkit-box-shadow: 0 0 0.05rem #ccc;
  box-shadow: 0 0 0.05rem #ccc;
  background: #fff;
  margin-top: .2rem;
}
.add-something > ul > li > ul > li {
  width: 100%;
  height: .6rem;
  line-height: .6rem;
  font-size: .28rem;
  padding-left: .2rem;
}
.add-something > ul > li > ul > li:first-child {
  background: #FAFAFA ;
  text-align: center;
  color: #a9a9a9;
}
.add-something > ul > li > ul > li:first-child > span {
  width: 1rem;
  height: .6rem;
  display: inline-block;
  float: right;
  background: url(../delete.png) no-repeat left center / 0.24rem;
  font-size: .2rem;
  color: red;
  line-height: .6rem;
  z-index: 99;
}
.add-something > ul > li > ul > li:nth-child(2) {
  margin: 0 .2rem;
  border-bottom: 0.01rem solid #f0f0f0;
  padding-left: 0;
}
.add-something > ul > li > ul > li:nth-child(2) span {
  float: right;
  margin-right: .2rem;
  color: #a9a9a9;
  padding-right: .4rem;
  font-size: .22rem;
  background: url(../img/go-left.png) no-repeat 90% center / 0.24rem;
}
.add-something > ul > li > ul > li:nth-child(3) {
  margin: 0 .2rem;
  border-bottom: 0.01rem solid #f0f0f0;
  padding-left: 0;
}
.add-something > ul > li > ul > li:nth-child(3) span {
  width: 49%;
  height: 100%;
  display: inline-block;
  position: relative;
}
.add-something > ul > li > ul > li:nth-child(3) span input {
  width: 1.2rem;
  height: 100%;
  position: absolute;
  top: 0;
}
.add-something > ul > li:last-child {
  height: .8rem;
  border: 0.01rem solid #f0f0f0;
  margin-top: .2rem;
  background-color: #fff;
}
.add-something > ul > li:last-child a {
  width: 100%;
  height: 100%;
  display: block;
  color: #27a7db;
  text-align: center;
  line-height: .8rem;
  font-size: .3rem;
  background: url(../img/add.png) no-repeat 28% center / 0.44rem;
}
.somethings {
  width: 100%;
  background: #fff;
  padding: .2rem;
  padding-bottom: 1.2rem;
}
.somethings ul {
  width: 100%;
  background-color: #f5f5f5;
  padding: 0 .2rem;
  display: block;
  -moz-box-shadow: 0 0 0.05rem #ccc;
  -webkit-box-shadow: 0 0 0.05rem #ccc;
  box-shadow: 0 0 0.05rem #ccc;
}
.somethings ul li {
  font-size: .28rem;
  height: .8rem;
  line-height: .8rem;
  border-bottom: .01rem solid #ccc;
}
.somethings ul li:nth-child(2) > span {
  width: 50%;
  display: inline-block;
}
.somethings ul li:nth-child(3) {
  border: 0;
}
.alert-things {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  z-index: 199;
  display: none;
}
.alert-things ul {
  width: 80%;
  margin: 30% 10%;
  height: 5rem;
  background: #fff;
  padding: .2rem;
  border-radius: 0.1rem;
  -moz-border-radius: 0.1rem;
  -webkit-border-radius: 0.1rem;
  -khtml-border-radius: 0.1rem;
  -moz-box-shadow: 0 0 0.05rem #ccc;
  -webkit-box-shadow: 0 0 0.05rem #ccc;
  box-shadow: 0 0 0.05rem #ccc;
  overflow: scroll;
  position: relative;
}
.alert-things ul li {
  width: 100%;
  height: .6rem;
  line-height: .6rem;
  border-bottom: 0.01rem solid #f0f0f0;
  text-align: center;
  font-size: .28rem;
}
.alert-things ul li img {
  width: .32rem;
  height: .32rem;
  position: relative;
  left: .5rem;
}
.alert-things ul button {
  width: 90%;
  height: .8rem;
  line-height: .8rem;
  position: fixed;
  bottom: .5rem;
  left: 5%;
  text-align: center;
  font-size: .34rem;
  background: orange;
  color: #fff;
  z-index: 199;
}