:root {
  --bg-title: #FF3C2E;
  --color-title: #ffffff;
  --color-icon: #FF3C2E;
  --bg-btn-about: #FF3C2E;
  --color-btn-about: #ffffff; }

.greenweave-about-us-about .button {
  color: var(--color-btn-about);
  background-color: var(--bg-btn-about); }

.greenweave-about-us-about .about-banner {
  position: relative;
  padding-right: 30px; }
  .greenweave-about-us-about .about-banner .img img {
    border-radius: 16px; }
  .greenweave-about-us-about .about-banner .title {
    position: absolute;
    bottom: 0;
    right: 0;
    background: var(--bg-title);
    color: var(--color-title);
    border-radius: 16px;
    padding: 45px 55px;
    font-size: 35px;
    line-height: 1.2;
    width: 55%; }

.greenweave-about-us-about .more-desc .item svg {
  fill: var(--color-icon);
  margin-right: 6px; }

.greenweave-about-us-about .more-desc .item:not(:last-child) {
  margin-bottom: 10px; }

.greenweave-about-us-about .btn-more {
  margin-top: 40px; }

.greenweave-about-us-about .list-counter {
  margin: 60px 0 0;
  gap: 30px; }
  .greenweave-about-us-about .list-counter .counter-item {
    -ms-flex: 0 0 calc(100% / 4 - 22.5px);
    flex: 0 0 calc(100% / 4 - 22.5px);
    max-width: calc(100% / 4 - 22.5px); }
    .greenweave-about-us-about .list-counter .counter-item .counter {
      text-align: center;
      position: relative; }
      .greenweave-about-us-about .list-counter .counter-item .counter .counter-num {
        font-size: 160px;
        line-height: 1;
        opacity: 0.08; }
      .greenweave-about-us-about .list-counter .counter-item .counter .desc {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
        font-weight: 600; }
    .greenweave-about-us-about .list-counter .counter-item:not(:last-child) .counter:before {
      content: '';
      position: absolute;
      top: calc(50% - 30px);
      right: -15px;
      width: 1px;
      height: 60px;
      background: currentcolor;
      opacity: 0.06; }

@media (min-width: 1200px) {
  .greenweave-about-us-about .about-banner {
    padding-right: 90px; }
  .greenweave-about-us-about .about-content {
    padding-left: 90px; } }

@media (max-width: 991px) {
  .greenweave-about-us-about .about-banner {
    margin-bottom: 30px; }
  .greenweave-about-us-about .list-counter .counter-item {
    -ms-flex: 0 0 calc(50% - 15px);
    flex: 0 0 calc(50% - 15px);
    max-width: calc(50% - 15px); }
    .greenweave-about-us-about .list-counter .counter-item:not(:last-child) .counter:before {
      content: none; } }

@media (max-width: 767px) {
  .greenweave-about-us-about .about-banner .title {
    font-size: 20px;
    padding: 20px; }
  .greenweave-about-us-about .more-desc .item:not(:last-child) {
    margin-bottom: 5px; }
  .greenweave-about-us-about .btn-more {
    margin-top: 20px; }
  .greenweave-about-us-about .list-counter {
    margin: 30px 0 0; }
    .greenweave-about-us-about .list-counter .counter-item {
      -ms-flex: 0 0 100%;
      flex: 0 0 100%;
      max-width: 100%; }
      .greenweave-about-us-about .list-counter .counter-item .counter .counter-num {
        font-size: 100px; }
      .greenweave-about-us-about .list-counter .counter-item .counter .desc {
        font-size: 18px; } }