.art-content-box {
  font-size: 16.5px;
  line-height: 27px;
  padding-bottom: 20px
}

h1 {
  margin: 0
}

video {
  width: 100%;
  background-color: #ccc
}

.art-date {
  display: block;
  border-bottom: 1px solid #f2f2f2;
  padding-bottom: 5px;
  margin-bottom: 5px
}

.picture {
  display: block;
  margin: 10px 0;
  font-size: 14px
}

.picture img {
  width: 100%
}

.art-content {
  line-height: 30px;
  word-break: break-word
}

.art-content a {
  text-decoration: underline !important
}

.art-content img {
  max-width: 100%
}

.extra-list {
  list-style-type: square;
  font-size: 18px;
  line-height: 2;
  margin: 20px 0
}

.extra-item span {
  font-size: 15px
}

@media(min-width:768px) {
  .media-box {
    float: right;
    margin-left: 30px
  }

  video {
    width: 700px;
    height: 500px
  }

  .image-box {
    direction: rtl;
    column-gap: 20px
  }

  .image-box.column-2 {
    column-count: 2
  }

  .image-box.column-3 {
    column-count: 3
  }

  .picture {
    page-break-inside: avoid;
    margin: 0;
    width: 220px;
    padding: 10px 10px 5px;
    text-decoration: underline;
    background-color: #f5f5f5;
    text-align: center
  }
}