/*
 * .-----------------------------------------------------.
 * |                       SUB C                         |
 * '-----------------------------------------------------'
 */

.swop21-subc-display-mobile {
  display: block;
}

.swop21-subc-display-desktop {
  display: none;
}

.swop21-subc-row1 {
  display: flex;
  flex-wrap: wrap;
}

.swop21-subc-row1 .swop21-subc-drawing,
.swop21-subc-row1 .swop21-subc-drawing-text {
  width: 100%;
}

.swop21-subc-texts {
  width: 100%;
}
.swop21-subc-img2 {
  width: 100%;
}

.swop21-subc-drawing {
  margin: 30px 15px 0;
}

.swop21-subc-drawing-line {
  position: absolute;
  height: 0;
}

.swop21-subc-drawing-text p {
  font-size: 21px;
  line-height: 28px;
  padding: 6% 4% 4%;
}

.swop21-subc-img1-holder {
  width: 100%;
  height: 0;
  padding-bottom: 59.8125%;
  position: relative;
}

.swop21-subc-img1-holder img {
  position: absolute;
  top: 0;
  left: 0;
  width: auto;
  height: 100%;
}

.swop21-subc-row2 {
  display: flex;
  flex-wrap: wrap;
}

.swop21-subc-text {
  padding: 4% 4% 16%;
}

.swop21-subc-text p {
  font-size: 21px;
  line-height: 28px;
}

.swop21-subc-lines {
  width: 38%;
  display: none;
}

.swop21-subc-line-1 {
  left: 50%;
  height: 40px;
  position: absolute;
  bottom: 0;
}

.swop21-subc-quote .swop21-line-vertic {
  height: 0;
}

.swop21-subc-quoteblock {
  padding: 8% 8%;
}

.swop21-subc-quoteblock blockquote.swop21-subc-quote {
  display: flex;
  background: url(../../images/2021/sub2/icon-quote.svg) no-repeat top left;
  padding-top: 87px;
}

.swop21-subc-quoteblock blockquote.swop21-subc-quote p {
  font-style: italic;
  font-size: 21px;
  line-height: 28px;
}

.swop21-subc-quote-lines {
  display: none;
}

.swop21-subc-quote-lines > div {
  height: 50%;
  display: block;
}

.swop21-subc-part-line {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 0;
}

.swop21-subc-link {
  text-transform: uppercase;
  text-align: right;
  margin: 16px 0 6px;
}

.swop21-subc-link a {
  background: url(../../images/2021/sub2/icon-arrow-right.svg) no-repeat center right;
  background-size: 20px;
  padding: 10px 30px 10px 10px;
  white-space: nowrap;
}

.swop21-subc-img-mobile .swop21-subc-mobile-line {
  bottom: 0;
}

.swop21-subc-img2-holder {
  width: 100%;
  height: 0;
  padding-bottom: 118.857%;
  position: relative;
}

.swop21-subc-img2-holder img {
  position: absolute;
  top: 0;
  right: 0;
  width: auto;
  height: 100%;
}

.swop21-subc-row2 {
  position: relative;
}

.swop21-subc-bottom-line {
  width: 100%;
  position: absolute;
  bottom: 0;
}

@media all and (min-width: 768px) {
  .swop21-subc-display-mobile {
    display: none;
  }

  .swop21-subc-display-desktop {
    display: block;
  }

  .swop21-subc-row1 {
    flex-wrap: nowrap;
  }

  .swop21-subc-row1 .swop21-subc-drawing {
    width: 40%;
    margin-left: 9%;
    padding-top: 67px;
  }

  .swop21-subc-row1 .swop21-subc-drawing-text {
    width: 50%;
  }

  .swop21-subc-drawing {
    margin: 0;
  }

  .swop21-subc-drawing-line {
    height: 100%;
    left: 9%;
  }

  .swop21-subc-drawing-text p {
    padding: 22% 10% 21% 10%;
  }

  .swop21-subc-texts {
    width: 70%;
  }
  .swop21-subc-img2 {
    width: 30%;
  }

  .swop21-subc-row2 {
    flex-wrap: nowrap;
    align-items: flex-end;
  }

  .swop21-subc-text {
    padding: 21.5% 2% 10% 6%;
  }

  .swop21-subc-lines {
    min-height: 90px;
    width: 39.5%;
    display: block;
  }

  .swop21-subc-line-1 {
    height: 70px;
    top: 0;
    left: 48%;
  }

  .swop21-subc-quote .swop21-subc-line-mob {
    position: absolute;
    width: 0;
  }

  .swop21-subc-quote {
    width: 65vw;
    display: flex;
    border: none;
    margin-top: 0;
  }

  .swop21-subc-quoteblock {
    padding: 11.5% 7% 7% 11%;
  }

  .swop21-subc-quoteblock blockquote.swop21-subc-quote p {
    font-size: 28px;
    line-height: 36px;
  }

  .swop21-subc-quote-lines {
    min-width: 7%;
    display: block;
  }

  .swop21-subc-img2-holder img {
    right: 0;
  }
}

@media all and (min-width: 1000px) {
  .swop21-subc-drawing-text p {
    padding: 22% 16% 15% 8%;
  }

  .swop21-subc-quote {
    width: 50vw;
    display: flex;
    border: none;
    margin-top: 0;
  }

  .swop21-subc-text {
    padding: 21% 12% 5% 19%;
  }

  .swop21-subc-quote-lines {
    min-width: 51%;
  }

  .swop21-subc-quote .swop21-line-vertic {
    height: 100%;
  }
}

@media all and (min-width: 1200px) {
  .swop21-subc-quote {
    width: 65vw;
  }

  .swop21-subc-text {
    padding: 11.5% 16% 8% 17%;
  }

  .swop21-subc-quote-lines {
    min-width: 64%;
  }

  .swop21-subc-part-line {
    width: 10%;
  }
}