.yn-content-v4 {}

.yn-content-v4 .content {
  color: #000;
}

.yn-content-v4 {}

.yn-content-v4 .yn-row-warp {
  display: flex;
  flex-wrap: wrap;
}

.yn-content-v4 .yn-right {
  flex: 0 0 auto;
  order: 2;
  width: 30%;
}

.yn-content-v4 .yn-left {
  flex: 1 1 auto;
  order: 1;
  width: 70%;
}

.yn-content-v4 table {
  border-collapse: collapse;
  width: 100%;
  /* box-shadow: 0 0 20px rgba(0,0,0,0.1); */
  margin: 20px 0;
}

.yn-content-v4 th {
  background: #DCDFE6;
  color: #000;
  padding: 15px;
  border: 1px solid #CDD0D6;
  text-align: center;
}

.yn-content-v4 td {
  padding: 12px;
  border: 1px solid #ddd;
  text-align: center;
}

.yn-content-v4 td a {
  text-decoration: underline;
}

.yn-content-v4 td a:hover {
  text-decoration: unset;
}

.yn-content-v4 tr:nth-child(even) {
  background: #f8f9fa;
}

.yn-content-v4 tr:hover {
  background: #e8f4ff;
}

@media only screen and (max-width: 499px) {

  .yn-content-v4 .yn-row-warp {
    display: block;
  }

  .yn-content-v4 .yn-right {
    flex: unset;
    order: unset;
    width: 100%;
  }

  .yn-content-v4 .yn-left {
    flex: unset;
    order: unset;
    width: 100%;
  }
}