.content_image_section{
  background: #fff;
  padding-left: 50px;
  padding-right: 50px;

  & .content-image{
    &.display_image_on_right .content__information{
      flex-direction: row-reverse;

      @media(max-width:767px){
        flex-direction: column-reverse;
      }
    }
  }

  & .content__title{
    margin:0 0 40px;
    color: #000;
    font-family: var(--font-heading-family);
    font-size: 34px;
    font-style: normal;
    font-weight: var(--font-heading-weight);
    line-height: 36px;

    & sup{
      font-family: var(--font-heading-family);
      font-weight: var(--font-heading-weight);
      line-height: 0;
    }

    @media(max-width:767px){
      margin:0 0 30px;
      font-size: 26px;
      line-height: 28px;
    }
  }

  & .content__information{
    display: flex;
    gap: 120px;

    & .content__main{
      line-height: 0;

      & img{
        max-width: 100%;
        height: auto;

        &.small{
          min-width:441px;

          @media(min-width:768px) and (max-width:1100px){
            min-width:300px;
          }

          @media(max-width:767px){
            min-width: 100%;
          }
        }

        &.big{
          min-width:554px;

          @media(min-width:768px) and (max-width:1100px){
            min-width:300px;
          }

          @media(max-width:767px){
            min-width: 100%;
          }
        }
      }
    }

    @media(min-width:768px) and (max-width:1100px){
      gap: 50px;
    }

    @media(max-width:767px){
      flex-direction: column;
      gap: 30px;
    }
  }

  & .content__heading__wrapper .content__heading{
    margin: 0 0 30px;
    color: #333;
    font-family: var(--font-heading-family);
    font-size: 28px;
    font-style: normal;
    font-weight: var(--font-heading-weight);
    line-height: 34px;

    & sup{
      font-family: var(--font-heading-family);
      font-weight: var(--font-heading-weight);
      line-height: 0;
    }

    @media(max-width:767px){
      font-size: 18px;
      line-height: 26px;
    }
  }

  & .content_description{
    & > :last-child{
      margin-bottom: 0;
    }

    & h3{
      margin: 0 0 20px;
    }

    & p{
      font-family: var(--font-body-family);
      font-size: 16px;
      font-style: normal;
      font-weight: var(--font-body-weight);
      line-height: 22px;
      color: #333;
      margin:0 0 20px;

      & sup{
        font-family: var(--font-body-family);
        font-weight: var(--font-body-weight);
        line-height: 0;
      }

      & strong{
        font-family: var(--font-heading-family);
        font-weight: var(--font-heading-weight);
      }

      @media(max-width:767px){
        font-size: 14px;
        line-height: 20px;
      }
    }

    & ul,
    & ol{
      margin: 0 0 20px;
      padding-left: 25px;
      display: flex;
      flex-direction: column;
      gap: 5px;

      & li{
        font-family: var(--font-body-family);
        font-size: 16px;
        font-style: normal;
        font-weight: var(--font-body-weight);
        line-height: 22px;
        color: #333;

        & sup{
          font-family: var(--font-body-family);
          font-weight: var(--font-body-weight);
          line-height: 0;
        }

        & strong{
          font-family: var(--font-heading-family);
          font-weight: var(--font-heading-weight);
        }

        @media(max-width:767px){
          font-size: 14px;
          line-height: 20px;
        }
      }
    }

    & a{
      font-family: var(--font-body-family);
      font-size: 16px;
      font-style: normal;
      font-weight: var(--font-body-weight);
      line-height: 22px;
      color: #036;
      text-decoration: underline;

      &:hover{
        text-decoration: none;
      }
    }

    & p:only-child,
    & p:last-child{
      margin-bottom: 0;
    }
  }

  @media(max-width:767px){
    padding-left: 20px;
    padding-right: 20px;
  }
}