</noscript> <header class="o-header" id="siteHeader" data-scroll-parallax> <!-- Announce Bar --> <div class="o-announce" id="announceBar"> <div class="o-announce__inner"> <a href="https://akari-tea.jp/story/misola/" class="o-announce__text"> 【misola インタビュー】素材のポテンシャルを最大限に引き出すレストランが、なぜ「akari bottled tea」を導入したのか？ </a> <button class="o-announce__close" aria-label="閉じる"></button> </div> </div> <!-- ヘッダー本体 --> <div class="o-header__inner"> <!-- 1段目：ロゴ + アイコン --> <div class="o-header__top"> <div class="o-header__container"> <input type="checkbox" id="nav-toggle" class="o-nav-toggle-input" hidden> <label for="nav-toggle" class="o-nav-toggle" aria-label="メニュー" aria-expanded="false"> <span class="o-bars"> <span class="o-bar"></span> <span class="o-bar"></span> <span class="o-bar"></span> </span> </label> <div class="o-header__logo"> <a href="https://akari-tea.jp"> <svg viewBox="0 0 471.11 46.68" xmlns="http://www.w3.org/2000/svg" data-name="_layer02" id="layer02"> <g data-name="_layer01" id="layer01"> <g> <path fill="currentColor" d="M29.76,43.26c0,.16-.02.28-.06.36-.4.88-1.07,1.55-2.01,2.01-.94.46-1.87.69-2.79.69-1.68,0-2.89-.49-3.63-1.47-.74-.98-1.33-2.19-1.77-3.63-1.52,1.4-3.2,2.57-5.04,3.51-1.84.94-3.82,1.41-5.94,1.41-1.48,0-2.87-.29-4.17-.87-1.3-.58-2.35-1.43-3.15-2.55-.8-1.12-1.2-2.48-1.2-4.08,0-1.68.43-3.13,1.29-4.35.86-1.22,1.96-2.26,3.3-3.12,1.34-.86,2.78-1.56,4.32-2.1,1.54-.54,2.99-.95,4.35-1.23.92-.2,1.86-.38,2.82-.54.96-.16,1.9-.32,2.82-.48,0-1.12-.05-2.42-.15-3.9-.1-1.48-.41-2.7-.93-3.66-.52-.92-1.22-1.74-2.1-2.46-.88-.72-1.86-1.08-2.94-1.08-1.84,0-3.28.48-4.32,1.44-1.04.96-1.78,2.32-2.22,4.08-.04.2-.07.41-.09.63-.02.22-.05.43-.09.63-.04.24-.19.45-.45.63-.26.18-.53.27-.81.27-.76,0-1.45-.18-2.07-.54-.62-.36-.93-.96-.93-1.8,0-.48.08-.9.24-1.26.52-1.24,1.36-2.27,2.52-3.09,1.16-.82,2.45-1.45,3.87-1.89,1.42-.44,2.75-.66,3.99-.66,2.16,0,4.12.4,5.88,1.2,1.76.8,3.17,1.97,4.23,3.51,1.06,1.54,1.59,3.47,1.59,5.79,0,2.6-.01,5.22-.03,7.86-.02,2.64.05,5.28.21,7.92.04.88.22,1.65.54,2.31.32.66.98.99,1.98.99.52,0,1.07-.13,1.65-.39.58-.26.95-.39,1.11-.39.12,0,.18.1.18.3ZM19.26,39.42c-.16-1.8-.25-3.61-.27-5.43-.02-1.82-.05-3.65-.09-5.49h-.84c-1.24,0-2.61.19-4.11.57-1.5.38-2.93.95-4.29,1.71-1.36.76-2.47,1.71-3.33,2.85-.86,1.14-1.29,2.45-1.29,3.93,0,1.92.54,3.37,1.62,4.35,1.08.98,2.54,1.47,4.38,1.47.88,0,1.84-.21,2.88-.63,1.04-.42,2.04-.93,3-1.53.96-.6,1.74-1.2,2.34-1.8Z"></path> <path fill="currentColor" d="M65.64,45.54c0,.28-.28.48-.84.6-.56.12-1.15.2-1.77.24-.62.04-1.05.06-1.29.06-.56,0-1.18,0-1.86-.03-.68-.02-1.3-.11-1.86-.27-.52-.16-.95-.44-1.29-.84-.34-.4-.63-.8-.87-1.2-1.8-2.76-3.58-5.52-5.34-8.28-1.76-2.76-3.5-5.54-5.22-8.34l-3.48,2.58v13.44c0,.96.48,1.44,1.44,1.44.36,0,.72,0,1.08-.03.36-.02.7-.03,1.02-.03.2,0,.41.06.63.18.22.12.33.3.33.54,0,.48-.22.72-.66.72-1.12,0-2.22,0-3.3-.03-1.08-.02-2.18-.03-3.3-.03-.76,0-1.55.01-2.37.03-.82.02-1.63.05-2.43.09-.24,0-.49.02-.75.06-.26.04-.53.06-.81.06-.16,0-.29-.09-.39-.27-.1-.18-.15-.35-.15-.51,0-.28.12-.46.36-.54.24-.08.46-.12.66-.12s.42.01.66.03c.24.02.46.03.66.03.64,0,1.14-.07,1.5-.21.36-.14.54-.57.54-1.29V4.98c0-.92-.16-1.54-.48-1.86-.32-.32-.96-.48-1.92-.48-.32,0-.64.03-.96.09-.32.06-.64.09-.96.09-.4,0-.6-.2-.6-.6,0-.28.16-.46.48-.54.76-.2,1.55-.35,2.37-.45.82-.1,1.61-.21,2.37-.33.36-.08.86-.19,1.5-.33.64-.14,1.27-.27,1.89-.39.62-.12,1.05-.18,1.29-.18.2,0,.3.12.3.36l-.06,27.9c2.04-1.52,4-3.12,5.88-4.8,1.88-1.68,3.74-3.38,5.58-5.1.68-.6,1.32-1.21,1.92-1.83.6-.62,1.16-1.27,1.68-1.95.24-.28.58-.42,1.02-.42.4,0,.79.02,1.17.06.38.04.77.06,1.17.06.48,0,.97-.02,1.47-.06.5-.04.99-.06,1.47-.06.6,0,.9.32.9.96,0,.32-.24.48-.72.48-.64.04-1.26.1-1.86.18-.6.08-1.18.34-1.74.78-1.8,1.28-3.56,2.64-5.28,4.08-1.72,1.44-3.46,2.86-5.22,4.26.72,1.24,1.48,2.45,2.28,3.63.8,1.18,1.58,2.35,2.34,3.51,1.08,1.6,2.17,3.19,3.27,4.77,1.1,1.58,2.21,3.15,3.33,4.71.56.76,1.27,1.51,2.13,2.25.86.74,1.77,1.15,2.73,1.23.24.04.36.22.36.54Z"></path> <path fill="currentColor" d="M97.92,43.26c0,.16-.02.28-.06.36-.4.88-1.07,1.55-2.01,2.01-.94.46-1.87.69-2.79.69-1.68,0-2.89-.49-3.63-1.47-.74-.98-1.33-2.19-1.77-3.63-1.52,1.4-3.2,2.57-5.04,3.51-1.84.94-3.82,1.41-5.94,1.41-1.48,0-2.87-.29-4.17-.87-1.3-.58-2.35-1.43-3.15-2.55-.8-1.12-1.2-2.48-1.2-4.08,0-1.68.43-3.13,1.29-4.35.86-1.22,1.96-2.26,3.3-3.12,1.34-.86,2.78-1.56,4.32-2.1,1.54-.54,2.99-.95,4.35-1.23.92-.2,1.86-.38,2.82-.54.96-.16,1.9-.32,2.82-.48,0-1.12-.05-2.42-.15-3.9-.1-1.48-.41-2.7-.93-3.66-.52-.92-1.22-1.74-2.1-2.46-.88-.72-1.86-1.08-2.94-1.08-1.84,0-3.28.48-4.32,1.44-1.04.96-1.78,2.32-2.22,4.08-.04.2-.07.41-.09.63-.02.22-.05.43-.09.63-.04.24-.19.45-.45.63-.26.18-.53.27-.81.27-.76,0-1.45-.18-2.07-.54-.62-.36-.93-.96-.93-1.8,0-.48.08-.9.24-1.26.52-1.24,1.36-2.27,2.52-3.09,1.16-.82,2.45-1.45,3.87-1.89,1.42-.44,2.75-.66,3.99-.66,2.16,0,4.12.4,5.88,1.2,1.76.8,3.17,1.97,4.23,3.51,1.06,1.54,1.59,3.47,1.59,5.79,0,2.6-.01,5.22-.03,7.86-.02,2.64.05,5.28.21,7.92.04.88.22,1.65.54,2.31.32.66.98.99,1.98.99.52,0,1.07-.13,1.65-.39.58-.26.95-.39,1.11-.39.12,0,.18.1.18.3ZM87.42,39.42c-.16-1.8-.25-3.61-.27-5.43-.02-1.82-.05-3.65-.09-5.49h-.84c-1.24,0-2.61.19-4.11.57-1.5.38-2.93.95-4.29,1.71-1.36.76-2.47,1.71-3.33,2.85-.86,1.14-1.29,2.45-1.29,3.93,0,1.92.54,3.37,1.62,4.35,1.08.98,2.54,1.47,4.38,1.47.88,0,1.84-.21,2.88-.63,1.04-.42,2.04-.93,3-1.53.96-.6,1.74-1.2,2.34-1.8Z"></path> <path fill="currentColor" d="M124.44,19.74c0,.4-.15.77-.45,1.11-.3.34-.67.51-1.11.51-.6,0-1.03-.2-1.29-.6-.26-.4-.48-.86-.66-1.38-.18-.52-.45-.98-.81-1.38-.36-.4-.96-.6-1.8-.6h-.45c-.14,0-.29.02-.45.06-.68.12-1.42.54-2.22,1.26-.8.72-1.57,1.57-2.31,2.55-.74.98-1.35,1.95-1.83,2.91-.48.96-.74,1.76-.78,2.4-.04.64-.06,1.27-.06,1.89v1.83c0,2.16,0,4.32.03,6.48.02,2.16.03,4.3.03,6.42,0,.6.25,1.03.75,1.29.5.26,1.01.39,1.53.39.4,0,.8-.02,1.2-.06.4-.04.8-.06,1.2-.06.2,0,.34.09.42.27.08.18.12.35.12.51,0,.64-.32.96-.96.96-1.2,0-2.4-.03-3.6-.09-1.2-.06-2.4-.09-3.6-.09s-2.49.04-3.75.12-2.53.12-3.81.12c-.16,0-.27-.12-.33-.36-.06-.24-.09-.44-.09-.6,0-.4.16-.62.48-.66.44-.08.9-.1,1.38-.06.48.04.92.06,1.32.06.6,0,1.09-.13,1.47-.39.38-.26.59-.71.63-1.35.08-1.28.13-2.58.15-3.9.02-1.32.03-2.64.03-3.96v-5.82c-.04-1.72-.05-3.43-.03-5.13.02-1.7-.05-3.39-.21-5.07-.04-.8-.26-1.37-.66-1.71-.4-.34-1-.51-1.8-.51-.32,0-.65.03-.99.09-.34.06-.69.09-1.05.09-.32,0-.48-.24-.48-.72,0-.28.14-.48.42-.6.4-.12.82-.21,1.26-.27.44-.06.86-.11,1.26-.15,1.08-.2,2.16-.4,3.24-.6,1.08-.2,2.16-.44,3.24-.72.36.12.62.34.78.66.08.16.14.6.18,1.32.04.72.06,1.55.06,2.49v4.35c.88-1.4,1.88-2.8,3-4.2,1.12-1.4,2.4-2.56,3.84-3.48,1.44-.92,3.06-1.38,4.86-1.38.96,0,1.58.3,1.86.9.28.6.46,1.3.54,2.1.08.44.15.9.21,1.38.06.48.09.94.09,1.38Z"></path> <path fill="currentColor" d="M144,45.54c0,.2-.06.39-.18.57-.12.18-.28.27-.48.27-1.12,0-2.23-.03-3.33-.09-1.1-.06-2.23-.09-3.39-.09h-1.62c-1.2,0-2.39.03-3.57.09-1.18.06-2.35.09-3.51.09-.16,0-.27-.1-.33-.3-.06-.2-.09-.36-.09-.48,0-.2.02-.35.06-.45.04-.1.16-.17.36-.21.2-.08.43-.11.69-.09.26.02.51.03.75.03.28,0,.54.01.78.03.24.02.5.03.78.03.56,0,1.07-.13,1.53-.39.46-.26.69-.71.69-1.35v-24c0-.68-.12-1.21-.36-1.59-.24-.38-.74-.57-1.5-.57-.56,0-1.13.03-1.71.09-.58.06-1.15.13-1.71.21-.32,0-.48-.18-.48-.54,0-.4.16-.66.48-.78.48-.16.99-.27,1.53-.33s1.05-.13,1.53-.21c1.12-.2,2.24-.42,3.36-.66,1.12-.24,2.22-.5,3.3-.78.12-.04.28-.06.48-.06.44,0,.66.24.66.72,0,4.72-.01,9.46-.03,14.22-.02,4.76-.03,9.52-.03,14.28,0,.64.29,1.09.87,1.35.58.26,1.13.39,1.65.39.4,0,.81-.02,1.23-.06.42-.04.83-.06,1.23-.06.16,0,.26.1.3.3.04.2.06.34.06.42ZM139.14,4.02c0,1-.36,1.85-1.08,2.55-.72.7-1.58,1.05-2.58,1.05s-1.86-.35-2.58-1.05c-.72-.7-1.08-1.55-1.08-2.55s.36-1.85,1.08-2.55c.72-.7,1.58-1.05,2.58-1.05s1.86.35,2.58,1.05c.72.7,1.08,1.55,1.08,2.55Z"></path> <path fill="currentColor" d="M195.36,29.58c0,3.2-.71,6.08-2.13,8.64-1.42,2.56-3.38,4.57-5.88,6.03-2.5,1.46-5.39,2.19-8.67,2.19-1.44,0-2.88-.2-4.32-.6-1.44-.4-2.8-.6-4.08-.6-.28,0-.58.02-.9.06-.32.04-.64.06-.96.06-.68,0-1.02-.36-1.02-1.08,0-.24.04-.52.12-.84.08-.76.12-1.52.12-2.28s.02-1.52.06-2.28c0-.88,0-1.75.03-2.61.02-.86.03-1.73.03-2.61,0-4.8-.03-9.6-.09-14.4-.06-4.8-.09-9.6-.09-14.4,0-.56-.18-.92-.54-1.08-.36-.16-.78-.24-1.26-.24-.52,0-1.06.03-1.62.09-.56.06-1.12.09-1.68.09-.16,0-.33-.07-.51-.21-.18-.14-.27-.31-.27-.51,0-.24.12-.41.36-.51.24-.1.44-.17.6-.21,1.4-.28,2.81-.52,4.23-.72,1.42-.2,2.81-.48,4.17-.84.24-.08.49-.17.75-.27.26-.1.51-.15.75-.15.28,0,.41.18.39.54-.02.36-.03.64-.03.84v16.74c1.28-1.08,2.77-1.98,4.47-2.7,1.7-.72,3.39-1.08,5.07-1.08,2.84,0,5.22.7,7.14,2.1,1.92,1.4,3.36,3.23,4.32,5.49.96,2.26,1.44,4.71,1.44,7.35ZM189.36,29.52c0-1.44-.14-2.9-.42-4.38-.28-1.48-.74-2.83-1.38-4.05-.64-1.22-1.53-2.21-2.67-2.97-1.14-.76-2.59-1.14-4.35-1.14-.76,0-1.67.21-2.73.63-1.06.42-1.87.91-2.43,1.47-.76.72-1.34,1.5-1.74,2.34-.4.84-.62,1.8-.66,2.88l-.06,10.08v6.84c0,.28.03.65.09,1.11.06.46.13.79.21.99.32.64.95,1.05,1.89,1.23.94.18,1.71.27,2.31.27,2.16,0,4-.44,5.52-1.32,1.52-.88,2.75-2.06,3.69-3.54.94-1.48,1.63-3.13,2.07-4.95.44-1.82.66-3.65.66-5.49Z"></path> <path fill="currentColor" d="M231.66,30.78c0,3-.71,5.7-2.13,8.1-1.42,2.4-3.34,4.3-5.76,5.7-2.42,1.4-5.13,2.1-8.13,2.1s-5.56-.71-7.92-2.13c-2.36-1.42-4.24-3.32-5.64-5.7-1.4-2.38-2.1-5.03-2.1-7.95s.68-5.77,2.04-8.31c1.36-2.54,3.23-4.59,5.61-6.15,2.38-1.56,5.13-2.34,8.25-2.34,3.36,0,6.22.71,8.58,2.13,2.36,1.42,4.15,3.38,5.37,5.88,1.22,2.5,1.83,5.39,1.83,8.67ZM225.48,30.6c0-1.72-.13-3.45-.39-5.19-.26-1.74-.74-3.35-1.44-4.83-.7-1.48-1.71-2.67-3.03-3.57-1.32-.9-3.04-1.35-5.16-1.35-2,0-3.63.48-4.89,1.44-1.26.96-2.24,2.2-2.94,3.72-.7,1.52-1.18,3.16-1.44,4.92-.26,1.76-.39,3.42-.39,4.98,0,1.72.13,3.44.39,5.16.26,1.72.75,3.27,1.47,4.65.72,1.38,1.75,2.49,3.09,3.33,1.34.84,3.07,1.26,5.19,1.26s3.75-.44,5.01-1.32c1.26-.88,2.22-2.04,2.88-3.48.66-1.44,1.1-3.01,1.32-4.71.22-1.7.33-3.37.33-5.01Z"></path> <path fill="currentColor" d="M256.26,43.68c0,.36-.27.72-.81,1.08-.54.36-1.19.68-1.95.96-.76.28-1.49.5-2.19.66-.7.16-1.21.24-1.53.24-2.08,0-3.69-.26-4.83-.78-1.14-.52-1.94-1.38-2.4-2.58-.46-1.2-.69-2.82-.69-4.86,0-3.32,0-6.65.03-9.99.02-3.34.05-6.67.09-9.99h-4.32c-.28,0-.51.07-.69.21-.18.14-.37.21-.57.21s-.3-.14-.3-.42c0-.16.11-.48.33-.96s.37-.8.45-.96c.12.04.3.06.54.06h4.68l.06-7.62c.92-.6,1.76-1.27,2.52-2.01.76-.74,1.52-1.49,2.28-2.25.08-.08.16-.15.24-.21.08-.06.16-.09.24-.09.36,0,.54.14.54.42l-.36,11.7c1.28,0,2.55-.02,3.81-.06,1.26-.04,2.51-.06,3.75-.06.52,0,.78.3.78.9,0,.76-.34,1.14-1.02,1.14h-7.32c0,3.04-.01,6.09-.03,9.15-.02,3.06-.03,6.13-.03,9.21v4.62c0,1,.42,1.69,1.26,2.07.84.38,1.66.57,2.46.57,1.12,0,2.22-.18,3.3-.54.12-.08.3-.16.54-.24.24-.08.42-.12.54-.12.4,0,.6.18.6.54Z"></path> <path fill="currentColor" d="M278.58,43.68c0,.36-.27.72-.81,1.08-.54.36-1.19.68-1.95.96-.76.28-1.49.5-2.19.66-.7.16-1.21.24-1.53.24-2.08,0-3.69-.26-4.83-.78-1.14-.52-1.94-1.38-2.4-2.58-.46-1.2-.69-2.82-.69-4.86,0-3.32,0-6.65.03-9.99.02-3.34.05-6.67.09-9.99h-4.32c-.28,0-.51.07-.69.21-.18.14-.37.21-.57.21s-.3-.14-.3-.42c0-.16.11-.48.33-.96s.37-.8.45-.96c.12.04.3.06.54.06h4.68l.06-7.62c.92-.6,1.76-1.27,2.52-2.01.76-.74,1.52-1.49,2.28-2.25.08-.08.16-.15.24-.21.08-.06.16-.09.24-.09.36,0,.54.14.54.42l-.36,11.7c1.28,0,2.55-.02,3.81-.06,1.26-.04,2.51-.06,3.75-.06.52,0,.78.3.78.9,0,.76-.34,1.14-1.02,1.14h-7.32c0,3.04-.01,6.09-.03,9.15-.02,3.06-.03,6.13-.03,9.21v4.62c0,1,.42,1.69,1.26,2.07.84.38,1.66.57,2.46.57,1.12,0,2.22-.18,3.3-.54.12-.08.3-.16.54-.24.24-.08.42-.12.54-.12.4,0,.6.18.6.54Z"></path> <path fill="currentColor" d="M297.96,45.66c0,.2-.05.39-.15.57-.1.18-.27.27-.51.27-1.24,0-2.5-.03-3.78-.09-1.28-.06-2.56-.09-3.84-.09h-2.1c-.84,0-1.68.03-2.52.09-.84.06-1.68.09-2.52.09-.16,0-.27-.07-.33-.21-.06-.14-.09-.27-.09-.39v-.36c0-.12.02-.24.06-.36.08-.16.31-.25.69-.27.38-.02.78-.02,1.2,0,.42.02.69.03.81.03.56,0,1.06-.13,1.5-.39.44-.26.66-.71.66-1.35,0-3.08.02-6.15.06-9.21.04-3.06.06-6.11.06-9.15s0-6.25-.03-9.39c-.02-3.14-.03-6.27-.03-9.39,0-.28-.02-.59-.06-.93-.04-.34-.16-.61-.36-.81-.16-.2-.32-.31-.48-.33-.16-.02-.36-.03-.6-.03-.72,0-1.43.12-2.13.36-.7.24-1.39.36-2.07.36-.44,0-.66-.26-.66-.78,0-.32.25-.54.75-.66.5-.12.89-.2,1.17-.24,1.4-.32,2.92-.68,4.56-1.08,1.64-.4,3.12-.86,4.44-1.38.08,0,.16-.02.24-.06.08-.04.14-.06.18-.06.24,0,.39.08.45.24.06.16.09.34.09.54,0,1.12,0,2.23-.03,3.33-.02,1.1-.03,2.21-.03,3.33v16.8c0,3.08.02,6.17.06,9.27.04,3.1.06,6.19.06,9.27,0,.64.27,1.09.81,1.35.54.26,1.07.39,1.59.39.44,0,.86-.02,1.26-.06.4-.04.8-.06,1.2-.06.2,0,.32.11.36.33.04.22.06.39.06.51Z"></path> <path fill="currentColor" d="M331.19,39.12c0,.2-.04.32-.12.36-.12.4-.41.88-.87,1.44-.46.56-.97,1.09-1.53,1.59-.56.5-1.02.87-1.38,1.11-1.32.92-2.81,1.66-4.47,2.22-1.66.56-3.31.84-4.95.84-1.36,0-2.87-.22-4.53-.66-1.66-.44-3.07-1.04-4.23-1.8-2.24-1.48-3.88-3.42-4.92-5.82s-1.56-4.9-1.56-7.5c0-2.96.58-5.7,1.74-8.22,1.16-2.52,3.02-4.56,5.58-6.12,1.16-.68,2.46-1.25,3.9-1.71,1.44-.46,2.82-.69,4.14-.69,2.36,0,4.44.48,6.24,1.44s3.21,2.31,4.23,4.05c1.02,1.74,1.53,3.81,1.53,6.21,0,.68-.15,1.12-.45,1.32-.3.2-.75.3-1.35.3-.8,0-1.6-.02-2.4-.06-.8-.04-1.6-.08-2.4-.12-1.12-.08-2.23-.12-3.33-.12h-7.41c-1.36,0-2.72.04-4.08.12-.04.64-.08,1.26-.12,1.86-.04.6-.06,1.22-.06,1.86,0,1.48.18,3.01.54,4.59.36,1.58.94,3.04,1.74,4.38.8,1.34,1.82,2.42,3.06,3.24,1.24.82,2.74,1.23,4.5,1.23s3.52-.28,5.16-.84c1.64-.56,3.14-1.46,4.5-2.7.36-.36.69-.75.99-1.17.3-.42.63-.79.99-1.11.2-.2.42-.3.66-.3.2,0,.36.08.48.24.12.16.18.34.18.54ZM324.3,25.38c-.04-1.64-.18-3.21-.42-4.71-.24-1.5-.82-2.74-1.74-3.72-.92-.98-2.42-1.47-4.5-1.47-1.88,0-3.41.51-4.59,1.53-1.18,1.02-2.09,2.3-2.73,3.84-.64,1.54-1.12,3.11-1.44,4.71,1,.04,1.98.07,2.94.09.96.02,1.92.03,2.88.03,1.6,0,3.2-.03,4.8-.09s3.2-.13,4.8-.21Z"></path> <path fill="currentColor" d="M368.52,44.04c0,.2-.1.4-.3.6-.2.2-.38.36-.54.48-.52.4-1.27.74-2.25,1.02-.98.28-1.81.42-2.49.42-1.04,0-1.9-.3-2.58-.9-.68-.6-1.23-1.34-1.65-2.22-.42-.88-.79-1.74-1.11-2.58-.88,1.4-2.08,2.65-3.6,3.75-1.52,1.1-3.14,1.65-4.86,1.65-1.16,0-2.35-.09-3.57-.27-1.22-.18-2.35-.59-3.39-1.23-2.28-1.44-4.01-3.39-5.19-5.85-1.18-2.46-1.77-4.99-1.77-7.59,0-3.12.56-5.93,1.68-8.43,1.12-2.5,2.79-4.48,5.01-5.94,2.22-1.46,4.97-2.19,8.25-2.19.72,0,1.52.14,2.4.42.88.28,1.75.63,2.61,1.05.86.42,1.55.85,2.07,1.29V5.88c0-1.28-.33-2.01-.99-2.19-.66-.18-1.53-.27-2.61-.27-.36,0-.72.01-1.08.03-.36.02-.72.03-1.08.03-.16,0-.31-.06-.45-.18-.14-.12-.21-.26-.21-.42,0-.28.1-.46.3-.54.08-.08.17-.12.27-.12s.21-.02.33-.06c.84-.16,1.69-.29,2.55-.39.86-.1,1.73-.23,2.61-.39.88-.16,1.74-.33,2.58-.51.84-.18,1.68-.39,2.52-.63.04,0,.11-.02.21-.06.1-.04.17-.06.21-.06.2,0,.32.08.36.24.04.16.06.32.06.48,0,4.96-.02,9.9-.06,14.82-.04,4.92-.06,9.86-.06,14.82v8.94c0,.68.08,1.38.24,2.1.16.72.47,1.32.93,1.8s1.11.72,1.95.72c.4,0,.78-.08,1.14-.24.36-.16.74-.24,1.14-.24.28,0,.42.16.42.48ZM357.35,24.42c0-1.36-.28-2.64-.84-3.84-.56-1.2-1.36-2.18-2.4-2.94-1.04-.76-2.3-1.14-3.78-1.14-1.92,0-3.49.46-4.71,1.38-1.22.92-2.18,2.11-2.88,3.57-.7,1.46-1.18,3.03-1.44,4.71-.26,1.68-.39,3.28-.39,4.8,0,1.36.12,2.82.36,4.38s.67,3.02,1.29,4.38c.62,1.36,1.49,2.47,2.61,3.33,1.12.86,2.54,1.29,4.26,1.29,1.44,0,2.76-.45,3.96-1.35,1.2-.9,2.16-2.03,2.88-3.39.72-1.36,1.08-2.7,1.08-4.02v-11.16Z"></path> <path fill="currentColor" d="M405.71,43.68c0,.36-.27.72-.81,1.08-.54.36-1.19.68-1.95.96-.76.28-1.49.5-2.19.66-.7.16-1.21.24-1.53.24-2.08,0-3.69-.26-4.83-.78-1.14-.52-1.94-1.38-2.4-2.58-.46-1.2-.69-2.82-.69-4.86,0-3.32,0-6.65.03-9.99.02-3.34.05-6.67.09-9.99h-4.32c-.28,0-.51.07-.69.21-.18.14-.37.21-.57.21s-.3-.14-.3-.42c0-.16.11-.48.33-.96s.37-.8.45-.96c.12.04.3.06.54.06h4.68l.06-7.62c.92-.6,1.76-1.27,2.52-2.01.76-.74,1.52-1.49,2.28-2.25.08-.08.16-.15.24-.21.08-.06.16-.09.24-.09.36,0,.54.14.54.42l-.36,11.7c1.28,0,2.55-.02,3.81-.06,1.26-.04,2.51-.06,3.75-.06.52,0,.78.3.78.9,0,.76-.34,1.14-1.02,1.14h-7.32c0,3.04-.01,6.09-.03,9.15-.02,3.06-.03,6.13-.03,9.21v4.62c0,1,.42,1.69,1.26,2.07.84.38,1.66.57,2.46.57,1.12,0,2.22-.18,3.3-.54.12-.08.3-.16.54-.24.24-.08.42-.12.54-.12.4,0,.6.18.6.54Z"></path> <path fill="currentColor" d="M437.57,39.12c0,.2-.04.32-.12.36-.12.4-.41.88-.87,1.44-.46.56-.97,1.09-1.53,1.59-.56.5-1.02.87-1.38,1.11-1.32.92-2.81,1.66-4.47,2.22-1.66.56-3.31.84-4.95.84-1.36,0-2.87-.22-4.53-.66-1.66-.44-3.07-1.04-4.23-1.8-2.24-1.48-3.88-3.42-4.92-5.82s-1.56-4.9-1.56-7.5c0-2.96.58-5.7,1.74-8.22,1.16-2.52,3.02-4.56,5.58-6.12,1.16-.68,2.46-1.25,3.9-1.71,1.44-.46,2.82-.69,4.14-.69,2.36,0,4.44.48,6.24,1.44s3.21,2.31,4.23,4.05c1.02,1.74,1.53,3.81,1.53,6.21,0,.68-.15,1.12-.45,1.32-.3.2-.75.3-1.35.3-.8,0-1.6-.02-2.4-.06-.8-.04-1.6-.08-2.4-.12-1.12-.08-2.23-.12-3.33-.12h-7.41c-1.36,0-2.72.04-4.08.12-.04.64-.08,1.26-.12,1.86-.04.6-.06,1.22-.06,1.86,0,1.48.18,3.01.54,4.59.36,1.58.94,3.04,1.74,4.38.8,1.34,1.82,2.42,3.06,3.24,1.24.82,2.74,1.23,4.5,1.23s3.52-.28,5.16-.84c1.64-.56,3.14-1.46,4.5-2.7.36-.36.69-.75.99-1.17.3-.42.63-.79.99-1.11.2-.2.42-.3.66-.3.2,0,.36.08.48.24.12.16.18.34.18.54ZM430.67,25.38c-.04-1.64-.18-3.21-.42-4.71-.24-1.5-.82-2.74-1.74-3.72-.92-.98-2.42-1.47-4.5-1.47-1.88,0-3.41.51-4.59,1.53-1.18,1.02-2.09,2.3-2.73,3.84-.64,1.54-1.12,3.11-1.44,4.71,1,.04,1.98.07,2.94.09.96.02,1.92.03,2.88.03,1.6,0,3.2-.03,4.8-.09s3.2-.13,4.8-.21Z"></path> <path fill="currentColor" d="M471.11,43.26c0,.16-.02.28-.06.36-.4.88-1.07,1.55-2.01,2.01-.94.46-1.87.69-2.79.69-1.68,0-2.89-.49-3.63-1.47-.74-.98-1.33-2.19-1.77-3.63-1.52,1.4-3.2,2.57-5.04,3.51-1.84.94-3.82,1.41-5.94,1.41-1.48,0-2.87-.29-4.17-.87-1.3-.58-2.35-1.43-3.15-2.55-.8-1.12-1.2-2.48-1.2-4.08,0-1.68.43-3.13,1.29-4.35.86-1.22,1.96-2.26,3.3-3.12,1.34-.86,2.78-1.56,4.32-2.1,1.54-.54,2.99-.95,4.35-1.23.92-.2,1.86-.38,2.82-.54.96-.16,1.9-.32,2.82-.48,0-1.12-.05-2.42-.15-3.9-.1-1.48-.41-2.7-.93-3.66-.52-.92-1.22-1.74-2.1-2.46-.88-.72-1.86-1.08-2.94-1.08-1.84,0-3.28.48-4.32,1.44-1.04.96-1.78,2.32-2.22,4.08-.04.2-.07.41-.09.63-.02.22-.05.43-.09.63-.04.24-.19.45-.45.63-.26.18-.53.27-.81.27-.76,0-1.45-.18-2.07-.54-.62-.36-.93-.96-.93-1.8,0-.48.08-.9.24-1.26.52-1.24,1.36-2.27,2.52-3.09,1.16-.82,2.45-1.45,3.87-1.89,1.42-.44,2.75-.66,3.99-.66,2.16,0,4.12.4,5.88,1.2,1.76.8,3.17,1.97,4.23,3.51,1.06,1.54,1.59,3.47,1.59,5.79,0,2.6-.01,5.22-.03,7.86-.02,2.64.05,5.28.21,7.92.04.88.22,1.65.54,2.31s.98.99,1.98.99c.52,0,1.07-.13,1.65-.39.58-.26.95-.39,1.11-.39.12,0,.18.1.18.3ZM460.61,39.42c-.16-1.8-.25-3.61-.27-5.43-.02-1.82-.05-3.65-.09-5.49h-.84c-1.24,0-2.61.19-4.11.57-1.5.38-2.93.95-4.29,1.71-1.36.76-2.47,1.71-3.33,2.85-.86,1.14-1.29,2.45-1.29,3.93,0,1.92.54,3.37,1.62,4.35,1.08.98,2.54,1.47,4.38,1.47.88,0,1.84-.21,2.88-.63s2.04-.93,3-1.53c.96-.6,1.74-1.2,2.34-1.8Z"></path> </g> </g> </svg> </a> </div> <div class="o-header__icons" style="display:none;"> <a href="https://akari-tea.com/" class="o-link" aria-label="カート"> <svg class="o-icon"><use xlink:href="#cart"></use></svg> </a> </div> </div> </div> <!-- 2段目：メニュー --> <div class="o-header__bottom"> <div class="o-header__container"> <nav class="o-header__nav"> <ul id="menu-menu-1" class="o-nav-list"><li id="menu-item-32" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-32"><a href="https://akari-tea.jp/products/">Products</a><ul class="o-children"><li class="menu-item"><a href="https://akari-tea.jp/products/akt-hsb02/" class="o-navi-link">ほうじ茶スパークリング</a></li><li class="menu-item"><a href="https://akari-tea.jp/products/akt-rsb01/" class="o-navi-link">ルビー烏龍茶スパークリング</a></li></ul></li> <li id="menu-item-110" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-110"><a href="https://akari-tea.jp/about/">About</a></li> <li id="menu-item-33" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-33"><a href="https://akari-tea.jp/story/">Story</a></li> <li id="menu-item-31" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-31"><a href="http://akari-tea.jp/news/">News</a></li> <li id="menu-item-113" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-113"><a href="https://akari-tea.jp/company/">Company</a></li> </ul> </nav> </div> </div> </div> </header> <!-- モバイルメニュー --> <nav id="gNavi" class="o-mobile-nav"> <label for="nav-toggle" aria-label="メニュー" aria-expanded="false"> <div class="o-navi__inner"> <ul class="o-navi-list"> <li class="menu-item"><a href="https://akari-tea.jp">ホーム</a></li> </ul> <ul id="menu-menu-2" class="o-navi-list"><li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-32" id="menu-item-products"><a href="https://akari-tea.jp/products/">Products</a><ul class="o-children"><li class="menu-item"><a href="https://akari-tea.jp/products/akt-hsb02/" class="o-navi-link">ほうじ茶スパークリング</a></li><li class="menu-item"><a href="https://akari-tea.jp/products/akt-rsb01/" class="o-navi-link">ルビー烏龍茶スパークリング</a></li></ul></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-110"><a href="https://akari-tea.jp/about/">About</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-33"><a href="https://akari-tea.jp/story/">Story</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-31"><a href="http://akari-tea.jp/news/">News</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-113"><a href="https://akari-tea.jp/company/">Company</a></li> </ul> </div> </label> </nav> <main class="container"> <article class="product-article article akari-blog-style"> <!-- ヒーロー画像 --> <div class="product-hero article-hero" role="img" aria-label="ヒーロー画像: ほうじ茶スパークリング" style=" background-image: image-set( url('https://akari-tea.jp/wp-content/uploads/2025/11/JPEG画像-4D54-AE2D-92-0-scaled.jpeg') 1x, url('https://akari-tea.jp/wp-content/uploads/2025/11/JPEG画像-4D54-AE2D-92-0-scaled.jpeg') 2x ); aspect-ratio: 16 / 9; height: auto; @media (max-width: 768px) { background-image: image-set( url('https://akari-tea.jp/wp-content/uploads/2025/11/JPEG画像-4D54-AE2D-92-0-scaled.jpeg') 1x, url('https://akari-tea.jp/wp-content/uploads/2025/11/JPEG画像-4D54-AE2D-92-0-scaled.jpeg') 2x ); } "> <!-- タイトル --> <header class="product-title"> <h1 class="product-title">ほうじ茶スパークリング</h1> </header> </div> <!-- 本文 --> <div class="product-content article-content"> <p>希少な日本産茶葉がもたらす、贅沢なひととき。</p> <p>自分を優しく包み込む時間に寄り添う、akariのほうじ茶スパークリング。</p> <p><img fetchpriority="high" decoding="async" class="lazyload aligncenter size-full wp-image-58" src="https://akari-tea.jp/wp-content/uploads/2025/11/ほうじスパークリング商品画像_sub.jpg" alt="" width="1920" height="1080" srcset="https://akari-tea.jp/wp-content/uploads/2025/11/ほうじスパークリング商品画像_sub.jpg 1920w, https://akari-tea.jp/wp-content/uploads/2025/11/ほうじスパークリング商品画像_sub-300x169.jpg 300w, https://akari-tea.jp/wp-content/uploads/2025/11/ほうじスパークリング商品画像_sub-1024x576.jpg 1024w, https://akari-tea.jp/wp-content/uploads/2025/11/ほうじスパークリング商品画像_sub-768x432.jpg 768w, https://akari-tea.jp/wp-content/uploads/2025/11/ほうじスパークリング商品画像_sub-1536x864.jpg 1536w, https://akari-tea.jp/wp-content/uploads/2025/11/ほうじスパークリング商品画像_sub-1600x900.jpg 1600w" sizes="(max-width: 1920px) 100vw, 1920px" / loading="lazy"></p> <p>グラスを傾けると、ふわりと広がるカカオを思わせる芳醇な香り。<br /> ひと口含めば、繊細な泡とともに軽やかな香ばしさが広がり、余韻として心地よい甘みが続きます。</p> <p>使用するのは、村上園の 無農薬・無化学肥料 で育てられた茶葉。<br /> 45年にわたり土と向き合い、育まれたその茶葉は、深い甘みを秘めています。</p> <p><img decoding="async" class="lazyload aligncenter size-full wp-image-56" src="https://akari-tea.jp/wp-content/uploads/2025/11/ほうじスパークリング商品画像_kv.jpg" alt="" width="2000" height="1333" srcset="https://akari-tea.jp/wp-content/uploads/2025/11/ほうじスパークリング商品画像_kv.jpg 2000w, https://akari-tea.jp/wp-content/uploads/2025/11/ほうじスパークリング商品画像_kv-300x200.jpg 300w, https://akari-tea.jp/wp-content/uploads/2025/11/ほうじスパークリング商品画像_kv-1024x682.jpg 1024w, https://akari-tea.jp/wp-content/uploads/2025/11/ほうじスパークリング商品画像_kv-768x512.jpg 768w, https://akari-tea.jp/wp-content/uploads/2025/11/ほうじスパークリング商品画像_kv-1536x1024.jpg 1536w, https://akari-tea.jp/wp-content/uploads/2025/11/ほうじスパークリング商品画像_kv-1800x1200.jpg 1800w" sizes="(max-width: 2000px) 100vw, 2000px" / loading="lazy"></p> <p>さらに、この甘さを最大限に引き出すのが 山梨商店の砂炒り焙煎。</p> <p>高温で瞬時に香りを閉じ込めるこの伝統技法は、熟練の技がなければ成しえないもの。<br /> こうして生まれる、奥行きのある香ばしさが 「ほうじ茶スパークリング」 を唯一無二の味わいに仕立てます。</p> <p>忙しい毎日の中で、ふと深呼吸したくなる瞬間に。<br /> 自分をそっと労わる、特別な一杯です。</p> </div> <!-- 商品情報セクション + スライダー --> <section class="product-details-wrapper article-details-wrapper" style="display: flex; gap: 2rem; align-items: flex-start; @media (max-width: 768px) { flex-direction: column; }"> <!-- 商品情報 --> <div class="product-details article-details status-sold-out" style="flex: 1;"> <!-- 製品概要テーブル --> <div class="product-specs article-specs"> <table class="specs-table"> <tr> <th scope="row">名称</th> <td>炭酸飲料</td> </tr> <tr> <th scope="row">原材料名</th> <td>緑茶（静岡県産）／炭酸</td> </tr> <tr> <th scope="row">内容量</th> <td>300ml</td> </tr> <tr> <th scope="row">保存方法</th> <td>高温、直射日光を避け、涼しい場所に保存してください。</td> </tr> <tr> <th scope="row" rowspan=2>賞味期限</th> <td>180日（未開封）</td> </tr> <tr> <td>開栓後は冷蔵庫で保存し48時間以内にお召し上がりください。(ワインセラー不可) 添加物を使用しておりませんのでお早めにお召し上がりください</td> </tr> </table> </div> <!-- 販売価格 --> <header> <!-- 製品名 --> <div class="product-name name"> <h3 class="product-name__ja article-name__ja">ほうじ茶スパークリング</h3> </div> <!-- キャッチコピー --> <!-- 製品説明 --> <div class="product-prices article-prices"> <ul class="prices-list" style="list-style: none; padding: 0;"> <li style="display: flex; gap: 0.5rem; align-items: center;"> 販売価格： <span class='price'>5,400円</span><span class='label'>（1本）</span><span class='text'> ※表示は税込価格</span> </li> </ul> <a href="https://akari-tea.com/products/akt-rsb02" class="purchase-button" target="_blank">購入へ進む</a> <p class="supplement"><a href="https://akari-tea.com/products/akt-mx01" target="_blank">ルビー烏龍茶スパークリングとほうじ茶スパークリング、2本セットの購入は<u>こちら</u></a></p> </div> </header> </div> <!-- 商品画像スライダー --> <div class="product-gallery-slider gallery-slider splide" aria-label="商品ギャラリースライダー" style="flex: 1; max-width: 50%;"> <div class="splide__track"> <ul class="splide__list"> <li class="splide__slide" role="group" aria-roledescription="slide" style="position: relative; overflow: hidden; aspect-ratio: 1/1;"> <img src="https://akari-tea.jp/wp-content/uploads/2025/11/JPEG画像-4D54-AE2D-92-0-scaled.jpeg" loading="lazy" class="product-gallery-img" alt="ほうじ茶スパークリング - ギャラリー" style="object-fit: contain; aspect-ratio: auto;"> </li> <li class="splide__slide" role="group" aria-roledescription="slide" style="position: relative; overflow: hidden; aspect-ratio: 1/1;"> <img src="https://akari-tea.jp/wp-content/uploads/2025/11/ほうじスパークリング商品画像_thumb.jpg" loading="lazy" class="product-gallery-img" alt="ほうじ茶スパークリング - ギャラリー" style="object-fit: contain; aspect-ratio: auto;"> </li> </ul> </div> </div> </section> <!-- トップに戻る --> <div class="article-back article-back-left"> <a href="https://akari-tea.jp/products" class="article-back__link"> <span class="icon-wrap"> <svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-caret" viewBox="0 0 10 6"> <path fill-rule="evenodd" clip-rule="evenodd" d="M9.354.646a.5.5 0 00-.708 0L5 4.293 1.354.646a.5.5 0 00-.708.708l4 4a.5.5 0 00.708 0l4-4a.5.5 0 000-.708z" fill="currentColor"> </path></svg> </span><span>PRODUCT一覧に戻る</span> </a> </div> </article> </main> <section class="contact-sns"> <div class="contact-sns__container"> <h2 class="heading"><span class="ja">お問い合わせ</span><span class="en">CONTACT</span></h2> <div class="contact-sns__row"> <div class="text"> <p>akari bottled teaの最新ニュースや商品情報、イベントをご案内いたします。<br>飲食店・酒販店様は、公式LINEの法人窓口よりお問い合わせください</p> </div> <div class="contact-sns_list"> <ul> <li> <a href="https://www.instagram.com/akari_bottledtea?igsh=MWZlZWtoeTRjcDd0Yw==" target="_blank"> <!-- 変更: <img> を <picture> に置き換え。メディアクエリでモバイル時アイコンに切り替え --> <picture> <source media="(max-width: 768px)" srcset="https://akari-tea.jp/wp-content/themes/akari-bottle-tea-theme/assets/icon-instagram.svg" type="image/svg+xml"> <img src="https://akari-tea.jp/wp-content/themes/akari-bottle-tea-theme/assets/qr_instagram.svg" alt="公式Instagram QRコード" loading="lazy"> </picture> </a> </li> <li> <a href="https://lin.ee/8B7zaci" target="_blank"> <!-- 変更: 同上、LINE用 --> <picture> <source media="(max-width: 768px)" srcset="https://akari-tea.jp/wp-content/themes/akari-bottle-tea-theme/assets/icon-line.svg" type="image/svg+xml"> <img src="https://akari-tea.jp/wp-content/themes/akari-bottle-tea-theme/assets/qr_line.svg" alt="公式LINE QRコード" loading="lazy"> </picture> </a> </li> </ul> </div> </div> </div> </section> <div class="snslink_line"> <p><span>商品導入の</span><span>お問い合わせはこちら</span></p> <a href="https://lin.ee/8B7zaci" target="_blank"> <!-- 変更: 同上、LINE用 --> <picture> <source media="(max-width: 768px)" srcset="https://akari-tea.jp/wp-content/themes/akari-bottle-tea-theme/assets/icon-line.svg" type="image/svg+xml"> <img src="https://akari-tea.jp/wp-content/themes/akari-bottle-tea-theme/assets/qr_line.svg" alt="公式LINE QRコード" loading="lazy"> </picture> </a> </div> <footer class="container container--full-width text-center"> <!-- 追加: Footerメニューを表示。navタグで囲み、ARIA属性でアクセシビリティ向上 --> <nav class="footer-menu" aria-label="Footer Navigation" role="navigation"> <ul id="menu-footer-menu" class="footer-menu__list"><li id="menu-item-114" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-114"><a href="https://akari-tea.jp/products/">Products</a></li> <li id="menu-item-115" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-115"><a href="https://akari-tea.jp/about/">About</a></li> <li id="menu-item-116" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-116"><a href="https://akari-tea.jp/story/">Story</a></li> <li id="menu-item-117" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-117"><a href="http://akari-tea.jp/news/">News</a></li> <li id="menu-item-118" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-118"><a href="https://akari-tea.jp/company/">Company</a></li> </ul> </nav> <p>Copyright 2025 <a href="https://akari-tea.jp/company/">elm corporation</a> All rights reserved.</p> <script> document.addEventListener("DOMContentLoaded", function () { // ======================================== // 1. GSAP アニメーション（hemel風） // ======================================== gsap.registerPlugin(ScrollTrigger, TextPlugin); // セクション全体のフェードイン gsap.utils.toArray(".front-kv, .front-news, .front-products, .front-about-formula, .ps-experience, .front-story").forEach(el => { gsap.from(el, { opacity: 0, y: 80, duration: 1.4, ease: "power3.out", scrollTrigger: { trigger: el, start: "top 85%", toggleActions: "play none none reverse" } }); }); // テキスト逐次出現 gsap.utils.toArray(".heading .ja, .heading .en, .lede, .front-about-formula .text p").forEach(el => { gsap.fromTo(el, { opacity: 0, y: 40 }, { opacity: 1, y: 0, duration: 1.2, ease: "power2.out", stagger: 0.15, scrollTrigger: { trigger: el, start: "top 90%" } } ); }); // 製品画像パララックス gsap.utils.toArray(".front-products__item .image-main img").forEach(img => { gsap.to(img, { yPercent: -25, ease: "none", scrollTrigger: { trigger: img, start: "top bottom", end: "bottom top", scrub: 1 } }); }); // ======================================== // 2. ヘッダーメニュー機能（PC/モバイル両対応） // ======================================== const $ = jQuery; const $header = $('#siteHeader'); const $announce = $('.o-announce'); const $close = $('.o-announce__close'); const $toggle = $('.o-nav-toggle'); const $mobileNav = $('#gNavi'); let lastScroll = 0; const postId = 0; const cacheKey = 'announceClosed_' + postId; const isMobile = $(window).width() < 769; // 閉じる処理 $close.on('click', () => { $announce.slideUp('fast', () => { $header.css('transform', 'translateY(-36px)'); sessionStorage.setItem(cacheKey, '1'); }); }); // キャッシュ確認 if (sessionStorage.getItem(cacheKey) && $announce.length) { $announce.hide(); $header.css('transform', 'translateY(-36px)'); } // スクロールでヘッダー全体フェード $(window).on('scroll', () => { const current = $(window).scrollTop(); if (current > lastScroll && current > 100) { $header.addClass('o-header--hidden'); } else if (current < lastScroll) { $header.removeClass('o-header--hidden'); } lastScroll = current; }); // Announce Bar if (sessionStorage.getItem('announceClosed')) $announce.hide(); $('.o-announce__close').on('click', () => { $announce.slideUp('fast'); sessionStorage.setItem('announceClosed', '1'); }); // モバイル：ナビ開閉 if (isMobile) { $toggle.on('click', () => { $mobileNav.toggleClass('o-mobile-nav--open'); $('body').toggleClass('nav-open'); }); $(document).on('click', '.o-navi .menu-item-has-children > a', e => { e.preventDefault(); $(e.currentTarget).next('.o-children').toggleClass('o-children--open'); }); } // PC：ホバー else { console.log('footer.js 読み込み完了'); $('.o-nav-list > .menu-item-has-children').hover( function () { $(this).children('.o-children').stop(true, true).fadeIn(200); }, function () { $(this).children('.o-children').stop(true, true).fadeOut(300); } ); } // 追加提案: JSフォールバック（改善案3）。画面リサイズ時に画像を再確認 function updateSnsImages() { const isMobileView = window.matchMedia("(max-width: 768px)").matches; document.querySelectorAll('.contact-sns_list li a picture img').forEach(img => { if (isMobileView && img.src.includes('qr_instagram')) { img.src = "https://akari-tea.jp/wp-content/themes/akari-bottle-tea-theme/assets/icon-instagram.svg"; } else if (isMobileView && img.src.includes('qr_line')) { img.src = "https://akari-tea.jp/wp-content/themes/akari-bottle-tea-theme/assets/icon-line.svg"; } // 元に戻すロジックは省略、必要に応じて追加 }); } window.addEventListener('resize', updateSnsImages); updateSnsImages(); // 初回実行 }); </script> </footer> <script type="speculationrules"> {"prefetch":[{"source":"document","where":{"and":[{"href_matches":"/*"},{"not":{"href_matches":["/wp-*.php","/wp-admin/*","/wp-content/uploads/*","/wp-content/*","/wp-content/plugins/*","/wp-content/themes/akari-bottle-tea-theme/*","/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]} </script> <script> document.addEventListener('DOMContentLoaded', () => { if (typeof gsap === 'undefined') return; // GSAP未定義時は即return（エラー回避） gsap.config({ nullTargetWarn: false }); const shopsList = document.querySelector('.ps-experience__shops-list'); const experience = document.querySelector('.ps-experience'); if (shopsList) { // 要素存在時のみアニメ実行 // gsap.to(shopsList, { /* アニメーション設定 */ }); } else { console.log('GSAP target .ps-experience__shops-list not found - skipping animation'); } if (experience && typeof ScrollTrigger !== 'undefined') { // ScrollTrigger.create({ trigger: experience, /* 設定 */ }); } else if (!experience) { console.log('Element not found: .ps-experience - skipping ScrollTrigger'); } else { console.log('ScrollTrigger not defined - skipping'); } // ヒーロー画像のトリガー（共通 + news） const hero = document.querySelector('.story-hero, .product-hero, .news-hero'); if (hero) { const heroObserver = new IntersectionObserver(entries => { if (entries[0].isIntersecting) { hero.classList.add('loaded'); heroObserver.unobserve(hero); } }); heroObserver.observe(hero); } // 本文画像のスクロールフェードイン（IntersectionObserver） const contentImages = document.querySelectorAll('.article-content img, .about-content img'); // About対応追加 if (contentImages.length > 0) { const imgObserver = new IntersectionObserver((entries, observer) => { entries.forEach(entry => { if (entry.isIntersecting) { entry.target.classList.add('visible'); observer.unobserve(entry.target); } }); }, { rootMargin: '0px 0px -100px 0px', // 少し早くトリガー（パフォーマンス） threshold: 0.1 // 10%表示で発火 }); contentImages.forEach(img => { if (!img.complete) { img.addEventListener('load', () => imgObserver.observe(img)); } else { imgObserver.observe(img); } }); } }); </script> <script> document.addEventListener('DOMContentLoaded', function () { const header = document.getElementById('siteHeader'); const kvArea = document.getElementById('kvArea'); const triggerY = kvArea ? kvArea.offsetHeight : 0; function updateHeader() { const scrolled = window.scrollY; if (scrolled > triggerY) { header.classList.add('scrolled'); } else { header.classList.remove('scrolled'); } } window.addEventListener('scroll', updateHeader); updateHeader(); // 初回実行 }); </script> <script> (() => { const kvImg = document.querySelector('.front-kv__img'); if (!kvImg) return; const depth = 30; // 最大移動量（px） // ---- スクロール ---- const onScroll = () => { const rect = kvImg.getBoundingClientRect(); const offset = -rect.top / window.innerHeight; // 0〜1 const moveY = offset * depth; kvImg.style.transform = `translateY(${moveY}px)`; }; // ---- ジャイロ（スマホ）---- let gyroX = 0, gyroY = 0; const handleOrientation = (e) => { const x = e.beta || 0; // 前後 const y = e.gamma || 0; // 左右 gyroX = (y / 90) * depth; gyroY = (x / 90) * depth; applyParallax(); }; const applyParallax = () => { const scrollY = window.scrollY / window.innerHeight * depth; kvImg.style.transform = `translate(${gyroX}px, ${gyroY + scrollY}px)`; }; window.addEventListener('scroll', onScroll); if (window.DeviceOrientationEvent) { window.addEventListener('deviceorientation', handleOrientation); } onScroll(); })(); </script> <script> document.addEventListener('DOMContentLoaded', () => { const images = document.querySelectorAll('.product-gallery-img'); images.forEach(img => { img.style.display = 'block'; // 非表示解除 const parent = img.closest('.splide__slide'); if (parent) parent.style.backgroundImage = `url(${img.src})`; // srcから背景セット }); }); </script> <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/@splidejs/splide@4.1.0/dist/js/splide.min.js" id="splide-js-js"></script> <script type="text/javascript" id="splide-js-js-after"> /* <![CDATA[ */ document.addEventListener("DOMContentLoaded", function () { const sliderEl = document.querySelector(".kv-caption-slider"); const bgSlides = document.querySelectorAll(".kv-bg-slide"); if (sliderEl && bgSlides.length > 0) { // KVスライダー存在時 const syncBackground = function(splide) { const index = splide.index; bgSlides.forEach((slide, i) => slide.classList.toggle("active", i === index)); }; const totalSlides = sliderEl.querySelectorAll(".splide__slide").length; const splide = new Splide(".kv-caption-slider", { type: totalSlides > 1 ? "loop" : "slide", autoplay: totalSlides > 1 ? { delay: 5000, disableOnInteraction: false } : false, speed: 1400, arrows: true, pagination: true, drag: totalSlides > 1, perPage: 1, gap: 0, height: "auto", autoHeight: true, classes: { arrows: "splide__arrows kv-arrows", arrow: "splide__arrow kv-arrow", pagination: "splide__pagination kv-pagination" } }).mount(); splide.on("mounted", () => { document.querySelector(".splide__track").style.zIndex = "auto"; }); splide.on("mounted moved", () => syncBackground(splide)); if (totalSlides > 1) { document.getElementById("kvArea").addEventListener("click", (e) => { if (!e.target.closest(".splide__arrow, .splide__pagination, .front-kv__caption")) splide.go(">"); }); } // 高さ統一: 全てのキャプションを一番高いものに合わせる const captions = document.querySelectorAll(".front-kv__caption, .product-kv-caption"); let maxHeight = 0; captions.forEach(cap => { maxHeight = Math.max(maxHeight, cap.offsetHeight); }); // captions.forEach(cap => { cap.style.minHeight = `${maxHeight}px`; }); // リサイズ対応 window.addEventListener("resize", () => splide.refresh()); // 商品KV背景の動的セット（保持） const productBg = document.querySelector(".kv-bg-product"); if (productBg) { const pcUrl = productBg.dataset.pcUrl; const spUrl = productBg.dataset.spUrl || pcUrl; const isMobile = window.innerWidth <= 768; productBg.style.backgroundImage = `url(${isMobile ? spUrl : pcUrl})`; } } // 商品詳細スライダー const productSliderEl = document.querySelector(".product-gallery-slider"); if (productSliderEl) { const productTotalSlides = productSliderEl.querySelectorAll(".splide__slide").length; new Splide(".product-gallery-slider", { type: productTotalSlides > 1 ? "loop" : "slide", autoplay: productTotalSlides > 1 ? { delay: 5000, disableOnInteraction: false } : false, speed: 1400, arrows: true, pagination: true, drag: productTotalSlides > 1, perPage: 1, gap: "1rem", lazyLoad: "nearby", // 遅延ロード cover: true, // 新: imgをbackground-imageに変換（枠いっぱい） height: "auto", // アスペクト自動調整 fixedHeight: false, // オリジナル比保持 breakpoints: { 768: { perPage: 1, height: "auto" } } }).mount(); } }); //# sourceURL=splide-js-js-after /* ]]> */ </script> <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/@oddbird/css-anchor-positioning@0.0.6/dist/css-anchor-positioning.min.js" id="anchor-polyfill-js"></script> <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/gsap@3.13.0/dist/gsap.min.js?ver=3.13.0" id="gsap-core-js"></script> <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/gsap@3.13.0/dist/ScrollTrigger.min.js?ver=3.13.0" id="gsap-scrolltrigger-js"></script> <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/gsap@3.13.0/dist/TextPlugin.min.js?ver=3.13.0" id="gsap-textplugin-js"></script> <script id="wp-emoji-settings" type="application/json"> {"baseUrl":"https://s.w.org/images/core/emoji/17.0.2/72x72/","ext":".png","svgUrl":"https://s.w.org/images/core/emoji/17.0.2/svg/","svgExt":".svg","source":{"concatemoji":"https://akari-tea.jp/wp-includes/js/wp-emoji-release.min.js?ver=6.9"}} </script> <script type="module"> /* <![CDATA[ */ /*! This file is auto-generated */ const a=JSON.parse(document.getElementById("wp-emoji-settings").textContent),o=(window._wpemojiSettings=a,"wpEmojiSettingsSupports"),s=["flag","emoji"];function i(e){try{var t={supportTests:e,timestamp:(new Date).valueOf()};sessionStorage.setItem(o,JSON.stringify(t))}catch(e){}}function c(e,t,n){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);t=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data);e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(n,0,0);const a=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data);return t.every((e,t)=>e===a[t])}function p(e,t){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);var n=e.getImageData(16,16,1,1);for(let e=0;e<n.data.length;e++)if(0!==n.data[e])return!1;return!0}function u(e,t,n,a){switch(t){case"flag":return n(e,"\ud83c\udff3\ufe0f\u200d\u26a7\ufe0f","\ud83c\udff3\ufe0f\u200b\u26a7\ufe0f")?!1:!n(e,"\ud83c\udde8\ud83c\uddf6","\ud83c\udde8\u200b\ud83c\uddf6")&&!n(e,"\ud83c\udff4\udb40\udc67\udb40\udc62\udb40\udc65\udb40\udc6e\udb40\udc67\udb40\udc7f","\ud83c\udff4\u200b\udb40\udc67\u200b\udb40\udc62\u200b\udb40\udc65\u200b\udb40\udc6e\u200b\udb40\udc67\u200b\udb40\udc7f");case"emoji":return!a(e,"\ud83e\u1fac8")}return!1}function f(e,t,n,a){let r;const o=(r="undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?new OffscreenCanvas(300,150):document.createElement("canvas")).getContext("2d",{willReadFrequently:!0}),s=(o.textBaseline="top",o.font="600 32px Arial",{});return e.forEach(e=>{s[e]=t(o,e,n,a)}),s}function r(e){var t=document.createElement("script");t.src=e,t.defer=!0,document.head.appendChild(t)}a.supports={everything:!0,everythingExceptFlag:!0},new Promise(t=>{let n=function(){try{var e=JSON.parse(sessionStorage.getItem(o));if("object"==typeof e&&"number"==typeof e.timestamp&&(new Date).valueOf()<e.timestamp+604800&&"object"==typeof e.supportTests)return e.supportTests}catch(e){}return null}();if(!n){if("undefined"!=typeof Worker&&"undefined"!=typeof OffscreenCanvas&&"undefined"!=typeof URL&&URL.createObjectURL&&"undefined"!=typeof Blob)try{var e="postMessage("+f.toString()+"("+[JSON.stringify(s),u.toString(),c.toString(),p.toString()].join(",")+"));",a=new Blob([e],{type:"text/javascript"});const r=new Worker(URL.createObjectURL(a),{name:"wpTestEmojiSupports"});return void(r.onmessage=e=>{i(n=e.data),r.terminate(),t(n)})}catch(e){}i(n=f(s,u,c,p))}t(n)}).then(e=>{for(const n in e)a.supports[n]=e[n],a.supports.everything=a.supports.everything&&a.supports[n],"flag"!==n&&(a.supports.everythingExceptFlag=a.supports.everythingExceptFlag&&a.supports[n]);var t;a.supports.everythingExceptFlag=a.supports.everythingExceptFlag&&!a.supports.flag,a.supports.everything||((t=a.source||{}).concatemoji?r(t.concatemoji):t.wpemoji&&t.twemoji&&(r(t.twemoji),r(t.wpemoji)))}); //# sourceURL=https://akari-tea.jp/wp-includes/js/wp-emoji-loader.min.js /* ]]> */ </script> </body> </html>