{{#fields}}
<section class="c-articleHeading" data-on-inject="ArticleHeading">
  <div class="l-container">
    <div class="c-articleHeading__contain">
      <div class="c-articleHeading__dateAndType">
        <span class="c-articleHeading__date">{{article_heading_date}}</span>
        <span class="c-articleHeading__dot"></span>
        <span class="c-articleHeading__type">{{article_heading_type}}</span>
      </div>
      <div class="c-articleHeading__wrap">
        <h2 class="c-articleHeading__mainTitle">{{{article_heading_main_title}}}</h2>
        <p class="c-articleHeading__desc">{{{article_heading_description}}}</p>
      </div>
      {{#button_text}}
      <div class="c-articleHeading__shareBtnGroup -ttShow">
        <button class="m-button -fillRed c-articleHeading__shareBtn">
          <p class="m-button__text">{{button_text}}</p>
          <svg xmlns="http://www.w3.org/2000/svg" width="16" height="18" fill="none" viewBox="0 0 16 18">
            <path fill="#fff"
              d="M13.1283 17.3223c-.6519 0-1.2101-.2324-1.6748-.697-.4646-.4646-.6969-1.0229-.6969-1.6747 0-.0971.0104-.2116.0312-.3433.0208-.1318.052-.2531.0936-.3641l-6.30373-3.6616c-.20804.2358-.46463.4265-.76976.5721-.30514.1457-.6172.2185-.9362.2185-.65188 0-1.21013-.2323-1.67476-.697C.732316 10.2106.5 9.65236.5 9.00049c0-.66575.232316-1.22747.69695-1.68516.46463-.4577 1.02288-.68655 1.67476-.68655.319 0 .62413.06241.91539.18724.29126.12483.55479.30513.79057.54092l6.30373-3.61998c-.0416-.09708-.0728-.20804-.0936-.33287-.0208-.12482-.0312-.24272-.0312-.35367 0-.66575.2323-1.22746.6969-1.68516.4647-.4577 1.0229-.686549 1.6748-.686549.6657 0 1.2275.228849 1.6852.686549S15.5 2.38467 15.5 3.05042c0 .65187-.2288 1.21012-.6865 1.67475-.4577.46464-1.0195.69695-1.6852.69695-.319 0-.6276-.05201-.9258-.15603-.2982-.10402-.5513-.27393-.7594-.50971L5.13939 8.25153c.02774.11095.05201.23925.07282.38488.0208.14563.0312.26699.0312.36408 0 .09708-.0104.20111-.0312.31206-.02081.11096-.04508.22192-.07282.33287l6.30371 3.57838c.2081-.1942.4508-.3502.7282-.4681s.5964-.1769.957-.1769c.6657 0 1.2275.2289 1.6852.6866s.6865 1.0194.6865 1.6852c0 .6518-.2288 1.2101-.6865 1.6747-.4577.4646-1.0195.697-1.6852.697Zm0-13.14844c.319 0 .586-.10749.801-.32247.2149-.21498.3224-.48197.3224-.80097 0-.319-.1075-.58599-.3224-.80097-.215-.21498-.482-.32247-.801-.32247-.319 0-.586.10749-.801.32247-.215.21498-.3224.48197-.3224.80097 0 .319.1074.58599.3224.80097.215.21498.482.32247.801.32247ZM2.87171 10.1239c.319 0 .58599-.1075.80097-.32244.21498-.21498.32247-.48197.32247-.80097 0-.319-.10749-.586-.32247-.80097-.21498-.21498-.48197-.32247-.80097-.32247-.31901 0-.586.10749-.80098.32247-.21497.21497-.32246.48197-.32246.80097 0 .319.10749.58599.32246.80097.21498.21494.48197.32244.80098.32244ZM13.1283 16.074c.319 0 .586-.1075.801-.3225.2149-.215.3224-.4819.3224-.8009 0-.319-.1075-.586-.3224-.801-.215-.215-.482-.3225-.801-.3225-.319 0-.586.1075-.801.3225-.215.215-.3224.482-.3224.801 0 .319.1074.5859.3224.8009.215.215.482.3225.801.3225Z" />
          </svg>
        </button>
        <div class="c-articleHeading__tooltip">
          <div class="c-articleHeading__socialMedia">
            <a href="{{twitter_link}}" target="_blank" class="c-articleHeading__socialMediaIcon">
              <svg width="32" height="31" viewBox="0 0 32 31" fill="none" xmlns="http://www.w3.org/2000/svg">
                <rect x="0.5" width="31" height="31" rx="15.5" fill="white" />
                <path
                  d="M23.5 9.5C22.915 9.84725 21.7413 10.3205 21.0513 10.457C21.031 10.4622 21.0145 10.469 20.995 10.4742C20.3853 9.87275 19.5498 9.5 18.625 9.5C16.7613 9.5 15.25 11.0112 15.25 12.875C15.25 12.9732 15.2417 13.154 15.25 13.25C12.7352 13.25 10.8213 11.933 9.44875 10.25C9.2995 10.625 9.23425 11.2175 9.23425 11.774C9.23425 12.8247 10.0555 13.8568 11.3342 14.4965C11.0987 14.5572 10.8392 14.6007 10.5692 14.6007C10.1335 14.6007 9.67225 14.486 9.25 14.138C9.25 14.1507 9.25 14.1627 9.25 14.1762C9.25 15.6447 10.8085 16.6445 12.1945 16.9227C11.9132 17.0885 11.3463 17.105 11.0695 17.105C10.8745 17.105 10.1845 17.0157 10 16.9812C10.3855 18.185 11.776 18.8615 13.1013 18.8855C12.0648 19.6985 11.3455 20 9.223 20H8.5C9.841 20.8595 11.5487 21.5007 13.2603 21.5007C18.8328 21.5007 22 17.2535 22 13.25C22 13.1855 21.9985 13.0505 21.9963 12.9147C21.9963 12.9012 22 12.8885 22 12.875C22 12.8547 21.994 12.8352 21.994 12.815C21.9918 12.713 21.9895 12.6177 21.9872 12.5682C22.5798 12.1407 23.0935 11.6075 23.5 11C22.9563 11.2415 22.3728 11.4035 21.76 11.477C22.3855 11.102 23.2743 10.208 23.5 9.5Z"
                  fill="#31CEFF" />
              </svg>

            </a>
            <a href="{{facebook_link}}" target="_blank" class="c-articleHeading__socialMediaIcon">
              <svg width="32" height="31" viewBox="0 0 32 31" fill="none" xmlns="http://www.w3.org/2000/svg">
                <rect x="0.5" width="31" height="31" rx="15.5" fill="white" />
                <path
                  d="M15.997 6.5C10.9967 6.5 6.94263 10.554 6.94263 15.5543C6.94263 20.0729 10.2532 23.8181 14.5825 24.5V18.1722H12.2825V15.5543H14.5825V13.5595C14.5825 11.2884 15.9345 10.0361 18.0018 10.0361C18.9924 10.0361 20.0302 10.2126 20.0302 10.2126V12.4393H18.8856C17.7627 12.4393 17.4114 13.1384 17.4114 13.8547V15.5525H19.9206L19.5194 18.1704H17.4114V24.4982C21.7407 23.82 25.0513 20.0738 25.0513 15.5543C25.0513 10.554 20.9973 6.5 15.997 6.5Z"
                  fill="#0160A5" />
              </svg>

            </a>
            <a href="{{whatsapp_link}}" target="_blank" class="c-articleHeading__socialMediaIcon">
              <svg width="32" height="31" viewBox="0 0 32 31" fill="none" xmlns="http://www.w3.org/2000/svg">
                <rect x="0.5" width="31" height="31" rx="15.5" fill="white" />
                <path
                  d="M21.1006 10.4032C19.8746 9.17665 18.2444 8.50065 16.5075 8.5C12.9284 8.5 10.0156 11.4113 10.0143 14.9902C10.0137 16.1342 10.3127 17.2509 10.8808 18.235L10 21.5L13.4016 20.6959C14.35 21.2134 15.4174 21.4857 16.5042 21.4864H16.5068C20.0853 21.4864 22.998 18.5744 23 14.9961C23.0013 13.2613 22.3266 11.6304 21.1006 10.4032ZM19.6842 17.3101C19.549 17.689 18.8866 18.0543 18.5889 18.081C18.2912 18.1083 18.0123 18.2155 16.642 17.6754C14.9929 17.0254 13.9515 15.3347 13.8709 15.2268C13.7897 15.1183 13.2086 14.3474 13.2086 13.5492C13.2086 12.751 13.6278 12.3584 13.7767 12.1965C13.9255 12.034 14.1011 11.9937 14.2096 11.9937C14.3175 11.9937 14.4261 11.9937 14.5203 11.9976C14.636 12.0022 14.7641 12.008 14.8856 12.2778C15.03 12.5989 15.3452 13.401 15.3855 13.4822C15.4258 13.5635 15.4531 13.6584 15.3992 13.7663C15.3452 13.8742 15.3179 13.9418 15.2373 14.0367C15.1561 14.1316 15.067 14.2479 14.9942 14.3207C14.9129 14.4013 14.8284 14.4897 14.9227 14.6516C15.0176 14.8141 15.3426 15.3451 15.8249 15.7748C16.4451 16.3273 16.967 16.4982 17.1296 16.5801C17.2921 16.6614 17.3863 16.6477 17.4812 16.5392C17.5761 16.4313 17.8868 16.066 17.9947 15.9035C18.1027 15.741 18.2112 15.7683 18.3601 15.8222C18.5089 15.8762 19.3065 16.2688 19.4684 16.35C19.6309 16.4313 19.7388 16.4716 19.7791 16.5392C19.8194 16.6061 19.8194 16.9311 19.6842 17.3101Z"
                  fill="#00DD31" />
              </svg>

            </a>
          </div>
        </div>
      </div>
      {{/button_text}}
    </div>

  </div>
</section>

<!-- <ul class="Article-Main-Heading-With-Share">
<li><h2>article_heading_date</h2></li>

<li><p>{{article_heading_date.formatted}}</p></li>

<li><h2>article_heading_type</h2></li>
<li><p>{{article_heading_type}}</p></li>

<li><h2>article_heading_main_title</h2></li>
<li><p>{{{article_heading_main_title}}}</p></li>

<li><h2>article_heading_description</h2></li>
<li><p>{{{article_heading_description}}}</p></li>

<li><h2>button_text</h2></li>
<li><p>{{button_text}}</p></li>

<li><h2>twitter_link</h2></li>
<li><p>{{twitter_link}}</p></li>

<li><h2>facebook_link</h2></li>
<li><p>{{facebook_link}}</p></li>

<li><h2>whatsapp_link</h2></li>
<li><p>{{whatsapp_link}}</p></li>

{{#scsData.detailPageLink}}
<li><a href="{{scsData.detailPageLink}}" title="Go to detail page"><span class="detail- page">Details</span></a></li>
{{/scsData.detailPageLink}}
</ul> -->
{{/fields}}