caiping/public/static/mobile/css/detail.css

body {
    font-size: 3.7vw !important;
    background-color: rgb(251, 251, 251);
    /* background: linear-gradient(#2d8cf0 -163%, #fff 60%,#fff) no-repeat !important; */

}

.layui-tab-title {
    display: flex;
    overflow: scroll !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    /* IE 10+ */
}


::-webkit-scrollbar {
    display: none;
    /* Chrome Safari */
}


.layui-tab-bar {
    display: none !important;
}

.layui-tab-brief>.layui-tab-title .layui-this {
    color: #1287ff !important;
}

.layui-tab-brief>.layui-tab-more li.layui-this:after,
.layui-tab-brief>.layui-tab-title .layui-this:after {
    border-bottom: 0.5vw solid #1287ff !important;
}

/* .layui-tab-title li{
    width: 33% !important;
    padding: 0 !important;
} */

.layui-tab-title {
    height: 10vw !important;
}

.layui-tab-title .layui-this:after {
    height: 10vw !important;
}

/* .layui-tab-bar{
    display: none !important;
} */

.layui-tab-title li {
    font-size: 3.7vw !important;
    line-height: 10vw !important;
}

.detail-basic {
    padding: 3vw 4vw;
    border-radius: 2vw;
}


.detail-title {
    display: flex;
    align-items: center;

}

.basic-title {
    margin-bottom: 1vw;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.title-img {
    display: flex;
    align-items: center;
}

.basic-inner {
    display: flex;
    margin-bottom: 0.5vw;
}

.basic-inner span:nth-child(1) {
    width: 60%;
}

.basic-top-inner,
.bottom,
.basic-money,
.basic-annex {
    margin: 0 4vw;
    padding: 2vw 2vw;
    box-shadow: 0 1px 3px 0 rgb(5 32 96 / 10%);
    background-color: #fff;
}

.bottom-item {
    display: flex;
    margin-bottom: 1vw;
}

.bottom-person {
    margin-bottom: 1vw;
}

.bottom-top {
    margin-bottom: 2vw;
    display: flex;
    align-items: center;
    padding: 3vw 3vw 0vw 3vw;
}

.money-inner {
    display: flex;
    margin-bottom: 1vw;
}

.money-inner span {
    width: 50%;
}

.basic-annex {
    text-align: center;
}

.filelist {
    background-color: #fff;
    margin: 3vw;
    box-shadow: 0 1px 3px 0 rgb(5 32 96 / 10%);
}

#filesBox {
    padding: 2vw;
    text-align: center;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

#filesBox img {
    height: 15vw !important;
}

#filesBox li{
    width: 30vw;
    height: auto;
}

#filesBox p{
    padding: 0.5vh 0 ;
    width: 25vw;
    margin-left: 3vw;
    text-align: center;
    overflow: hidden;       
    text-overflow: ellipsis;
    white-space: nowrap;
}

#filesBox div{
    padding-bottom: 0.5vh !important;
    width: 17vw;
    height: 3vh;
    position: relative;
    border-radius: 0.2vw;
    display: none;
}

#filesBox a{
    width: 100%;
    height: 3vh;
    line-height: 3vh;
    border-radius: 1.2vw;
    font-size: 3vw;
}

/* 日志 */
.log-financial {
    color: rgb(255, 33, 0);
}

.detail-log {
    margin: 0 2vw;
    padding: 2vw 2vw 0vw 2vw;
    margin-bottom: 4vw;
}

.detail-log span {
    margin-right: 2vw;
}

.log-bottom {
    margin-top: 1vw;
    padding: 2vw 1vw 2vw 2vw;
    /* text-indent: 2em; */
    box-shadow: 0.19vw 0.3vw 0.4vw 0.03vw rgba(0, 0, 0, 0.1);
    background-color: #fff;
    border-radius: 2vw;
}

.log-company {
    color: rgb(65, 176, 107);
}

.content_img img {
    height: 25vh !important;
}

/* 日志 */
.log_top {
    padding-left: 1vw;
}

.log_top span {
    margin: 0 0.5vw;
}

/* 1,1,1 */
.log_commentary {
    color: rgb(0, 176, 80);
}

.log_company {
    color: rgb(255, 33, 0);
}

.log_content {
    margin: 0.3vw 1.5vw 1vw 1.5vw;
    padding: 0.5vw 0vw;
    text-indent: 2em;
    line-height: 2.1vh;
    background-color: rgb(255, 255, 255);
    /* background-color: aqua; */
    border-radius: 0.5vw;
    /* box-shadow:4px 4px 6px 2px rgba(0,0,0,0.3); */
    /* box-shadow: 0.17vw 0.17vw 0.4vw 0.03vw rgba(0, 0, 0, 0.1); */
    box-shadow: 0.19vw 0.16vw 0.4vw 0.03vw rgba(0, 0, 0, 0.1);
}

.log_content_color {
    /* background-color: rgb(250,250,250); */
}

.log_content_img img {
    /*height: auto;*/
    width: 30%;
    border-radius: 0.5vw;
    margin: 0.3vw 0;
}

.log_item_top {
    height: 70%;
    overflow: scroll;
}

.log_item_top {
    height: 60vh;
}

.log_item_bottom {
    display: flex;
    /* height: 17vh; */
    /* border-top: 1px solid #eee; */
    padding: 0 1.5vw;
    /* background-color: rgb(250,250,250); */
}

.log_input input {
    width: 55vw;
    height: 10vh;
    border: #eee 1px solid;
}

.wrapper{
    display: flex;
    justify-content: space-between;
}

.log_bottom_img {
    /* height: 5vh; */
}

.layui-form-label{
    padding: 0 !important;
    width: 22vw !important;
}

.layui-textarea{
    min-height: 9vh !important;
}

.logimg{
    display: flex;
}

.layui-input-block{
    margin-left: 0 !important;
}

.layui-form-item{
    margin: 2vw 2vw 0 2vw !important;
}

.log_bottom_img img {
    height: 4vw;
    width: 6vw;
    border-radius: 0.5vw;
    margin: 0.5vw 0vw 0.5vw 0.3vw;
}

.log_bottom_left {
    width: 100%;
    margin-top: 1.5vh;
}

.log_bottom_right {
    width: 5%;
}

.detail-log:nth-last-child(1){
    margin-bottom: 24vh;
}

/* 项目报告 */
.detail-report {
    margin-top: 3vw;
}

.report-item {
    margin: 3vw;
    padding: 2vw 3vw 1vw 3vw;
    background-color: #fff;
    box-shadow: 0 1px 3px 0 rgb(5 32 96 / 10%);
}

.report-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5vw;
}

.layui-tab-content {
    padding: 0 !important;
}

.report-overdue {
    display: flex;
}

.report-overdue span {
    width: 50%;
}

/* 项目人员 */
.person {
    display: flex;
    margin: 2vw 4vw;
    padding: 2vw;
    background-color: #fff;
    box-shadow: 0 1px 3px 0 rgb(5 32 96 / 10%);
}

.content {
    margin-bottom: 1vw;
}

/* 项目动态 */
.detail-dynamic {
    margin: 2vw 4vw;
}

.layui-timeline-title {
    font-size: 2vh !important;
}

.layui-btn-group .layui-btn:first-child {
    display: none !important;
}

.layui-btn-group .layui-btn:last-child{
    display: none !important;
}


/* 工作记录 */
.record {
    margin: 2vw 1vw;
    padding: 2vw 1vw;
    background-color: #fff;
    box-shadow: 0 1px 3px 0 rgb(5 32 96 / 10%);
}

.record1 {
    margin: 2vw;
    padding: 2vw;
    background-color: #fff;
    box-shadow: 0 1px 3px 0 rgb(5 32 96 / 10%);
}

.record-top {
    display: flex;
    justify-content: space-between;
}

.record-bottom {
    margin-top: 2vw;
    line-height: 2.5vh;
}

.layui-btn-group .layui-btn-primary:hover {
    color: #1287ff !important;
}


.record-add {
    position: absolute;
    right: 2vw;
    top: 70vh;
}

.record-add img {
    width: 10vw;
}

.layui-tab .layui-tab-title li {
    min-width: 15vw !important;
}

.record-title {
    display: flex;
    align-items: center;
}

.top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 98vw;
    padding-right: 2vw;
    z-index: 1000;
}

.dropbtn {
    background-color: #fff;
    color: white;
    font-size: 16px;
    border: none;
    cursor: pointer;
    /* background: url({__MOBILE__}/img/list.png) no-repeat;
    width: 5vw; */
}

.dropbtn:hover,
.dropbtn:focus {
    background-color: #fff;
}

.dropdown {
    position: relative;
    display: inline-block;
    width: 38vw;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #fff;
    /* min-width: 160px; */
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
}

.dropdown-content a {
    color: black;
    /* padding: 12px 16px; */
    text-decoration: none;
    display: block;
    font-size: 1.9vh !important;
}

.dropdown a:hover {
    background-color: #fff;
}

.show {
    display: block;
    margin-left: 15vw;
}

/* 联系函 */
.invite-bottom {
    display: flex;
    margin-top: 2vw;
}

/* 点击图片放大 */
.imgzoom_pack {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, .7);
    display: none;
    z-index: 999;
}

.imgzoom_pack .imgzoom_img {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    overflow: hidden;
    background: black;
}

.imgzoom_pack .imgzoom_img img {
    width: 100%;
    position: absolute;
    top: 50%;
}

.informBlock {
    /* margin: 0 11% 22px; */
    /* width: 78%;
    text-align: center; */
}

.informBlock img {
    /* margin-bottom: 5px; */
    max-height: 300px;
    max-width: 100%;
    border-radius: 5%;
}

.long{
    width: 100% !important;
}

/*请款详情*/
.detail-request {
    margin-top: 3vw;
}

.request-item {
    margin: 3vw;
    padding: 2vw 3vw 2vw 3vw;
    /*text-align: center;*/
    background-color: #fff;
    box-shadow: 0 1px 3px 0 rgb(5 32 96 / 10%);
}

.request-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.layui-tab-content {
    padding: 0 !important;
}

.request-overdue {
    display: flex;
}

.request-overdue span {
    width: 50%;
    margin-bottom:1vw;
}

.request-overdue-long span {
    width: 100%;
    margin-bottom:1vw;
}

.request-overdue long {
    width: 100% !important;
    margin-bottom:1vw;
}

.request-title{
    margin-left:3vw;
}

.annex-content{
    margin-top: 2vw;
    margin-left: 3vw;
    margin-right: 3vw;
    background-color: #fff;
    text-align: center;
    padding: 2vw;
    box-shadow: 0 1px 3px 0 rgb(5 32 96 / 10%);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.annex-content img {
    height: 15vw !important;
}

.annex-content li{
    width: 30vw;
    height: auto;
}

.annex-content div{
    display: none;
}

.annex-content p{
    padding: 0.5vh 0 ;
    width: 25vw;
    margin-left: 3vw;
    text-align: center;
    overflow: hidden;       
    text-overflow: ellipsis;
    white-space: nowrap;
}

.annex-content a{
    width: 100%;
    height: 3vh;
    line-height: 3vh;
    border-radius: 1.2vw;
    font-size: 3vw;
}

.annex-title{
    margin-left: 3vw;
}

/* 生成二维码 */
.box-btn{
    width: 100%;
    /* text-align: center; */
    padding: 15px 0;
  }
  
  .code{
    width: 45vw;
    height: 10vw;
    background-color: #409eff;
    border-radius: 5px;
    border: #409eff;
    color: #fff;
    margin-left: 4.5vw;
  }
  
  .code-img{
    width: 100%;
    text-align: center;
    padding: 15px 0;
  }
  
  #qrcode img{
    margin: 0 auto;
  }
  
  #saveBtn{
    width: 45vw;
    height: 10vw;
    text-align: center;
    background-color: #67c23a;
    border-radius: 5px;
    border: #67c23a;
    color: #fff;
  }