img {
   object-fit: cover;
}

.content {
   width: 63%;
   margin: 0 auto;
}

.con-title {
   text-align: center;
}

.con-box {
   padding: 30px 0 0;
}

.con-title,
.con-h1 {
   font-size: 20px;
   padding: 10px 0;
}

.con-img {
   width: 300px;
   height: 200px;
   float: left;
   margin: 10px 20px 0 0;
   border-radius: 2px;
}

.con-container {}

.con-text {
   font-size: 14px;
   line-height: 28px;
   color: #777;
}

.con-text::before {
   content: '';
   display: inline-block;
   width: 30px;
   height: 1px;
}

.con-h4 {
   font-size: 14px;
   line-height: 28px;
   list-style: disc;
   color: #333;
   display: flex;
   flex-wrap: wrap;
   padding-top: 10px;
}

.list-item::before {
   content: '';
   border-radius: 50%;
   display: inline-block;
   width: 7px;
   height: 7px;
   margin: 11px 10px 0 0;
   background-color: #333;
}

.content-item {
   padding-bottom: 30px;
}

.content-item:not(:last-child) {
   border-bottom: 1px solid #f5f5f5;
   margin-bottom: 40px;
   padding-bottom: 60px;
}

.content-block {
   max-height: 450px;
   overflow: hidden;
}

.content-auto-height {
   max-height: none;
}

.content-open {
   text-align: center;
   font-size: 14px;
   padding: 10px 0;
   box-shadow: 0 -14px 20px 10px #fff;
   position: relative;
   z-index: 1;
   color: rgb(99, 157, 255);
   cursor: pointer;
   /*display: none;*/
}

.content-open::after {
   content: '';
   display: inline-block;
   width: 6px;
   height: 6px;
   border-left: 2px solid rgb(99, 157, 255);
   border-bottom: 2px solid rgb(99, 157, 255);
   transform: rotateZ(-45deg) translateY(-3px);
   margin-left: 9px;
}

.highlight-block{
   background-color: #f5f5f5;
   border-radius: 4px;
   padding: 20px;
}
.highlight-block .con-h1{
   color:rgb(67, 124, 223)
}
.highlight-block .con-h4{
   color:rgb(80, 80, 80);
}