GTMのカスタムHTMLを使用してのアコーディオン実装がうまくいかない

Question

前提・実現したいこと

ここに質問の内容を詳しく書いてください。
STUDIOというサービスでサイト制作をしています。
アコーディオン機能を実装したいので、
GoogleタグマネージャーのカスタムHTMLを使って、コードを記入していましたが
アコーディオンがうまく動いてくれません。

Uncaught TypeError: Cannot read properties of null (reading 'style')
    at <anonymous>:1:177
    at gtm.js?id=GTM-WC86WZW:246
    at gtm.js?id=GTM-WC86WZW:247
    at gtm.js?id=GTM-WC86WZW:247
    at c (gtm.js?id=GTM-WC86WZW:248)
    at Ic (gtm.js?id=GTM-WC86WZW:46)
    at e (gtm.js?id=GTM-WC86WZW:126)
    at gtm.js?id=GTM-WC86WZW:31
    at Array.<anonymous> (gtm.js?id=GTM-WC86WZW:127)
    at Object.execute (gtm.js?id=GTM-WC86WZW:127)

該当のソースコード

<style> .accordion__answer--active { height: auto !important; padding-top: 16px !important; } </style> <script> "use strict"; var accordion = document.querySelector("#accordion"); var accordionItems = document.querySelectorAll("div[id*='accordion__item']"); accordion.style.cursor = "pointer"; accordion.addEventListener("click", function (e) { e.preventDefault(); var clickedAccordionItem = e.target.closest("div[id*='accordion__item']"); if (!clickedAccordionItem) return; var clickedAccordionAnswer = clickedAccordionItem.children[1]; accordionItems.forEach(function (accordionItem) { accordionItem.children[1].classList.remove("accordion__answer--active"); }); clickedAccordionAnswer.classList.add("accordion__answer--active"); }); </script>

Googleタグマネージャー
JS

試したこと

Googleタグマネージャーとの連携はできています。

補足情報（FW/ツールのバージョンなど）

この記事を参考に実装をしています
https://studio-gaz.design/blog/studio-gtm-accordion

こちらのホームページにて実装させようとしています
https://kiyohiro728.com/