.foodSensoryInspection { width: 100%; height: 100%; // 自定义内容 .page-box { box-sizing: border-box; min-height: 980px; margin-bottom: 20px; box-shadow: 0 3px 6px 1px #00000029; background-color: #fff; position: relative; } p { font-family: "宋体"; margin-top: 0.2em; margin-bottom: 0.2em !important; text-indent: 2em; line-height: 30px; text-align: justify; } .fz-11 { font-size: 11px !important; } .fz-13 { font-size: 13px !important; } .fz-14 { font-size: 14px !important; } .fz-15 { line-height: 26px; font-size: 15px !important; } .img-0 { width: 100%; } .img-20 { width: 20%; } .img-70 { width: 70%; } .td-0 { text-indent: 0em !important; } .openImgBox { margin: 20px 0 !important; } .block { font-size: 18px; font-family: "KAITI"; .bold { font-family: '黑体'; font-weight: bold; } } .block1 { font-size: 16px; font-family: "FangSong"; } .block2 { line-height: 20px; color: #333; } .block3 { font-family: '黑体'; } .center { text-align: center; margin-left: 0%; margin-right: 0%; text-indent: 0em; } .right-info { font-family: "KAITI"; text-align: right; } .page-box:nth-child(even) .bodystyle { font-family: 'FZLTXIHJW'; text-align: justify; margin: 0 15% 0 13%; padding-bottom: 80px; line-height: 30px; padding: 14% 0 12%; } .page-box:nth-child(odd) .bodystyle { font-family: 'FZLTXIHJW'; text-align: justify; margin: 0 13% 0 15%; padding-bottom: 80px; line-height: 30px; padding: 14% 0 12% 0; } .mainColor { color: #F48131; } .hr { height: 1px; width: 83%; border-top: 1px dotted #4E78EB; } .pageHeader { height: 100px; position: absolute; .f-right { color: #333; position: absolute; bottom: 8%; right: 10%; font-family: "youyuan"; } span { margin: 0 20px; } } .titleBox { margin-bottom: 100px; } .firstTitle { font-family: '黑体'; font-size: 1.6em !important; } .secondTitle { font-family: '仿宋'; } h1 { font-family: '宋体'; line-height: 2em; font-weight: bold; font-size: 1.8em; margin: 0; text-indent: 0em; } h2 { font-family: 'youyuan'; font-weight: 500; font-size: 1.6em; text-indent: 2em; } h3 { font-family: 'youyuan'; font-weight: 500; font-size: 1.2em; text-indent: 2em; } .mr-20 { margin-right: 20px; } .bold { font-weight: bold; } .img-rights { width: 350px; float: right; height: auto; margin: auto; margin-left: 18px; } .bk { margin-left: 2em; width: 80%; padding: 10px; color: #F48131; border: 2px dotted #F48131; } .pdf-view { min-width: 160px; flex: 1; span { cursor: pointer; } span:hover { color: #F48131; text-decoration: underline; } } .textarea-box { width: 88%; margin-left: 2em; overflow: auto; word-break: break-all; resize: none; border: 1px solid #666; border-radius: 5px; background-color: rgba(255, 255, 255, 0); outline-color: #F48131 } .input-box { border: none; border-bottom: 1px solid #333; background-color: rgba(255, 255, 255, 0); outline: none; } //视频 .video-box { margin: 20px 0 20px 0; border: 1px solid #F48131; padding: 2% 2%; } .videoname { display: flex; justify-content: center; align-items: center; font-size: 12px; } .collect-btn { cursor: pointer; width: 18px; height: 18px; margin-left: 10px; margin-top: 0.8%; } } .pdfModal { width: 100%; height: 90vh; .pdfBox-component { width: 100%; height: 100%; position: relative; .preview { width: 100%; height: 100%; .imageBox { height: calc(100% - 30px); overflow-x: hidden; overflow-y: auto; background: #ccc; box-sizing: border-box; } .imageBox:hover { cursor: zoom-in !important; } ::v-deep .el-dialog__header { background-color: rgba(0, 0, 0, 0.8); .header_title { display: flex; justify-content: space-between; align-items: center; color: #fff; font-weight: 900; font-size: 16px; font-family: 'FZLTXIHJW'; span:nth-child(2):hover { cursor: pointer; } } ::v-deep .el-dialog__title, ::v-deep .el-dialog__headerbtn .el-dialog__close { color: #fff; font-weight: 900; font-size: 16px; font-family: 'FZLTXIHJW'; } } .bottom_tool { height: 30px; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: flex-end; align-items: center; svg { margin-right: 15px; fill: #d1d1d1; } svg:hover { fill: #fff; cursor: pointer; } } } .notBox { position: absolute; top: 0; left: 0; width: 100%; height: calc(100% - 30px); min-height: 300px; } } } .custom-dialog { overflow: hidden !important; .el-dialog__body { padding: 0; } .el-dialog__header { background-color: rgba(0, 0, 0, 0.8); .header_title { display: flex; justify-content: space-between; align-items: center; color: #fff; font-weight: 900; font-size: 16px; font-family: 'FZLTXIHJW'; span:nth-child(2):hover { cursor: pointer; } } .el-dialog__title, .el-dialog__headerbtn .el-dialog__close { color: #fff; font-weight: 900; font-size: 16px; font-family: 'FZLTXIHJW'; } } } .header_title { display: flex; justify-content: space-between; align-items: center; // color: #fff; font-weight: 900; font-size: 16px; font-family: 'FZLTXIHJW'; span:nth-child(2):hover { cursor: pointer; } } /* 媒体查询做基础响应式布局 */ @media screen and (max-width: 1024px) { .pdfModal { width: 100%; height: 80vh; } h1 { font-size: 1.1em; } .custom-dialog { .el-dialog { width: 90vw !important; } } .span-box { display: inline-block; width: 8px; height: 8px; background-color: #FAAD70; } .span-text { font-size: 16px; font-weight: 100; padding: 0em 0.15em 0em 0.3em; } } @media screen and (max-width: 800px) { .pdfModal { width: 100%; height: 60vh; } .custom-dialog { .el-dialog { width: 90vw !important; } } }