 body {
     font-family: Arial, sans-serif;
     margin: 0 auto;
     padding: 0;
     width: auto;
 }

 .label-text {
     font-weight: normal;
     font-size: 12px;
     color: #6C6C6C;
     opacity: 1;
     text-align-last: center;
 }

 table {
     border-collapse: collapse;
     width: 100%;
 }

 th,
 td {
     border: none;
     /* 无边框 */
     padding: 8px;
     text-align: left;
 }

 th {
     font-weight: bold;
     /* 加粗 */
     color: #333;
     /* 黑色 */
 }

 td {
     font-weight: normal;
     /* 不加粗 */
     color: #6C6C6C;
     /* 深灰色 */
 }

 .col-10 {
     width: 10%;
 }

 .col-20 {
     width: 20%;
 }

 .col-22 {
     width: 22%;
 }

 .col-25 {
     width: 25%;
 }

 .col-30 {
     width: 30%;
 }

 .col-50 {
     width: 50%;
 }

 .col-55 {
     width: 55%;
 }

 .col-60 {
     width: 60%;
 }

 .col-bottom {
     vertical-align: bottom;
 }

 .col-top {
     vertical-align: top;
 }

 .container {
     width: 100%;
     max-width: 800px;
     min-width: 800px;
     margin: 0 auto;
     padding: 20px 20px 0px 20px;
 }

 .section {
     background-color: #f0f0f0;
     padding: 20px;
     margin-bottom: 20px;
     border-radius: 10px;
 }

 h1,
 h2,
 h3 {
     color: #333;
     margin: 0px;
 }

 .div-info-name {
     color: #333;
     margin: 0px 0px 10px 0px;
     font-size: 26px;
     font-weight: bold;
 }

 .div-info-other {
     color: #333;
     margin: 5px 0px 0px 0px;
     font-size: 20px;
 }

 .div-self-evaluation {
     color: #333;
     margin: 0px 0px 0px 0px;
     /*     font-size: 20px;*/
 }

 .p-self-evaluation {
     color: #6C6C6C;
     margin: 5px 0px 5px 0px;
 }

 .p-self-evaluation b {
     color: #333;
 }

 /*环形技能熟练度进度条*/
 .circle-progress {
     width: 60px;
     height: 60px;
     border-radius: 50%;
     position: relative;
     display: inline-block;
     margin: 10px 10px 0px 10px;
     background: conic-gradient(#4A5A88 0 0%, #d9d9d9 0 100%);
 }

 .circle-background {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     width: 70%;
     height: 70%;
     border-radius: 50%;
     background-color: #f0f0f0;
     /* 白色圆圈背景 */
     z-index: 0;
 }

 /* 语言标签样式 */
 .circle-text {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     font-size: 12px;
     font-weight: bold;
     color: #333;
 }

 .ellipse-label {
     display: flex;
     align-items: center;
     background-color: #4A5A88;
     /* 深蓝色 */
     color: white;
     /* 白色文字 */
     height: 36px;
     border-radius: 18px;
     /* 椭圆形 */
     padding: 0px 15px;
     position: relative;
     overflow: hidden;
     margin-top: 0px;
     margin-bottom: 6px;
 }

 .ellipse-label img {
     width: 24px;
     /* SVG 图像宽度 */
     height: 24px;
     /* SVG 图像高度自动调整 */
     margin-right: 20px;
     /* 图像和文字之间的间距 */
 }

 .ellipse-label .text {
     position: absolute;
     margin-left: 30px;
     /* 文字距离右侧的距离 */
 }

 .st0 {
     fill: #173265;
 }

 .table-work {
     width: 100%;
     border-collapse: collapse;
 }

 .table-work th,
 .table-work td {
     border: none;
     padding: 8px 8px 8px 8px;
     text-align: left;
 }

 .table-work th {
     border-bottom: 1px solid #333;
     color: #333;
 }

 .table-work td {
     color: #333;
     font-weight: bold;
     white-space: pre-wrap;
 }

 .table-work td.intro {
     padding: 5px 8px;
     color: #6C6C6C;
     font-weight: normal;
     /*     font-size: 14px;*/
 }

 .table-work td.intro b {
     color: #555;
 }

 thead {
     /* 默认 display: table-header-group; 会分页后显示*/
     display: contents;
 }

 @media print {

     table,
     tbody {
         page-break-after: auto;
     }

     table {
         border-collapse: collapse;
     }
 }
