app/template/user_data/page_about-wine.twig line 1

Open in your IDE?
  1. {% extends 'default_frame.twig' %}
  3. {% block main %}
  4. <link rel="stylesheet" href="/html/user_data/assets/js/slick-1.6.0/slick.css">
  5. <link rel="stylesheet" href="/html/user_data/assets/js/slick-1.6.0/slick-theme.css">
  6. <script src="/html/user_data/assets/js/slick-1.6.0/slick.min.js"></script>
  7. <script>
  8.     $(function(){
  9.           $(".about-wine-cat__list").slick({
  10.             autoplay:true,
  11.             autoplaySpeed: 4000,
  12.             dots: false,
  13.             arrows:false,
  14.             slidesToShow: 1,
  15.             variableWidth: true,
  16.           });
  17.         
  18.         $(".about-wine-life__slide").slick({
  19.             autoplay:true,
  20.             autoplaySpeed: 4000,
  21.             dots: false,
  22.             arrows:false,
  23.             slidesToShow: 2,
  24.             variableWidth: true,
  25.           });
  26.         $(".about-wine-enjoy__dish-slider .swiper-wrapper").slick({
  27.             autoplay:true,
  28.             autoplaySpeed: 4000,
  29.             dots: false,
  30.             arrows:false,
  31.             slidesToShow: 4,
  32.             //variableWidth: true,
  33.             responsive: [{
  34.                 breakpoint: 767,
  35.                 settings: {
  36.                 slidesToShow: 2
  37.                 }
  38.             }]
  39.           });
  40.     });
  41.     if (window.matchMedia('(min-width:700px)').matches) {
  42.         document.addEventListener("DOMContentLoaded", function () {
  43.             const modalTriggers = document.querySelectorAll(".about-wine-variety__list-item");
  45.             modalTriggers.forEach(trigger => {
  46.                 const targetModalId = trigger.getAttribute("data-target");
  47.                 const targetModal = document.getElementById(targetModalId);
  49.                 const showModal = () => {
  50.                     targetModal.style.display = "flex";
  51.                 };
  52.                 const hideModal = () => {
  53.                     targetModal.style.display = "none";
  54.                 };
  56.                 trigger.addEventListener("mouseenter", showModal);
  58.                 trigger.addEventListener("mouseleave", () => {
  59.                     setTimeout(() => {
  60.                         if (!targetModal.matches(":hover")) {
  61.                             hideModal();
  62.                         }
  63.                     }, 0);
  64.                 });
  65.                 targetModal.addEventListener("mouseenter", showModal);
  67.                 targetModal.addEventListener("mouseleave", () => {
  68.                     setTimeout(() => {
  69.                         if (!trigger.matches(":hover")) {
  70.                             hideModal();
  71.                         }
  72.                     }, 0);
  73.                 });
  74.             });
  75.         });
  76.     }
  77.     </script>
  78.        <section class="about-wine-main cmn-sec page-main">
  79.             <div class="about-wine-main__inner cmn-sec__inner page-main__inner">
  80.                 <div class="about-wine-main__title cmn-sec-title">
  81.                     <h2>ABOUT WINE</h2>
  82.                 </div>
  83.                 <div class="about-wine-main__catch cmn-sec-catch">
  84.                     <p class="--pc">
  85.                         Pinot Noir , Chardonnay , Cabernet Sauvignon , Merlot , Cabernet Franc , Syrah , Grenache ,
  86.                         Sauvignon Blanc , Petit Verdot , Pinot Meunier , Riesling , Sangiovese , Nebbiolo , Pinot Gris ,
  87.                         Malbec , Mourvedre , Smillon , Cinsault , Viognier , Moscato , Carignan , Koshu , Pino Blanc ,
  88.                         Vermentino , Gewrztraminer , Chenin Blanc , Carmenere , Grenache Blanc , Barbera , Gamey ,
  89.                         Tempranillo , Muscadelle , Roussanne , Trebbiano , Gruner Veltliner , Aligot , Petite Sirah ,
  90.                         Glera , Zinfandel , Pinot Bianco
  91.                     </p>
  92.                     <p class="--sp">
  93.                         Pinot Noir , Chardonnay , Cabernet Sauvignon , Merlot , Cabernet Franc , Syrah , Grenache ,
  94.                         Sauvignon Blanc , Petit Verdot , Pinot Meunier , Riesling , Sangiovese , Nebbiolo , Pinot Gris ,
  95.                     </p>
  96.                 </div>
  97.                 <div class="about-wine-main__media">
  98.                     <div class="about-wine-main__txt-box">
  99.                         <strong>ワインは知れば知るほどおもしろい！</strong>
  100.                         <p>もちろん枠にとらわれず、自由に楽しむことが大前提。でも知識を広げると新たな楽しみも広がるかもしれません。ここではワインの基本についてご紹介します。</p>
  101.                     </div>
  102.                     <div class="about-wine-main__img-box">
  103.                         <!--<img src="/html/user_data/assets/img/common/life-style/calendar_media.webp" alt="カレンダー">-->
  104.                     </div>
  105.                 </div>
  106.             </div>
  107.         </section>
  109.         <section class="about-wine-cat cmn-sec">
  110.             <div class="about-wine-cat__inner cmn-sec__inner">
  111.                 <div class="cmn-label-title">
  112.                     <h2 class="--ja">種類について</h2>
  113.                     <span class="--en">WINE CATEGORY</span>
  114.                     <img src="/html/user_data/assets/img/common/pen_thick.svg" alt="ペンで書かれた線のイラスト">
  115.                 </div>
  116.                 <div class="about-wine-cat__catch">
  117.                     <div class="about-wine-cat__thumb">
  118.                         <img src="/html/user_data/assets/img/common/about-wine/cat_catch.webp" alt="種類についてのサムネイル">
  119.                     </div>
  120.                     <div class="about-wine-cat__txt-box">
  121.                         <strong>ワインってそもそも何？</strong>
  122.                         <p>ブドウを原料にアルコール発酵させたものがワイン。<br>唯一水を使わず100%ブドウから造られているお酒であるため、素材そのものの味わいを享受できます。</p>
  123.                     </div>
  124.                 </div>
  125.                 <div class="about-wine-cat__list">
  126.                     <div class="about-wine-cat__item about-card --red">
  127.                         <h3 class="about-card__title">
  128.                             赤ワイン
  129.                         </h3>
  130.                         <div class="about-card__label">
  131.                             <div>
  132.                                 <span>RED WINE</span>
  133.                                 <p>Listen to your inner heart. <span class="--pc">Listen to your inner heart.</span></p>
  134.                             </div>
  135.                             <img src="/html/user_data/assets/img/common/color-baner_red.svg" alt="red">
  136.                         </div>
  137.                         <div class="about-card__media">
  138.                             <div class="about-card__img-box">
  139.                                 <img src="/html/user_data/assets/img/common/about-wine/about-card_media_red.webp" alt="red">
  140.                             </div>
  141.                             <div class="about-card__txt-box">
  142.                                 <strong>About Red Wine</strong>
  143.                                 <img src="/html/user_data/assets/img/common/pen_thin.svg" alt="red">
  144.                                 <p>
  145.                                     黒ブドウを発酵させて造る赤いワイン。果皮と種、果実を一緒に使用するため、タンニン由来の渋味が特徴。漬け込み具合によっても色の濃淡や濃厚さなど個性が生まれます。
  146.                                 </p>
  147.                             </div>
  148.                         </div>
  149.                         <p class="about-card__deco">
  150.                             Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault ,
  151.                             Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo ,
  152.                             Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot Noir ,
  153.                         </p>
  154.                     </div>
  155.                     <div class="about-wine-cat__item about-card --white">
  156.                         <h3 class="about-card__title">
  157.                             白ワイン
  158.                         </h3>
  159.                         <div class="about-card__label">
  160.                             <div>
  161.                                 <span>WHITE WINE</span>
  162.                                 <p>Listen to your inner heart. <span class="--pc">Listen to your inner heart.</span></p>
  163.                             </div>
  164.                             <img src="/html/user_data/assets/img/common/color-baner_white.svg" alt="white">
  165.                         </div>
  166.                         <div class="about-card__media">
  167.                             <div class="about-card__img-box">
  168.                                 <img src="/html/user_data/assets/img/common/about-wine/about-card_media_white.webp" alt="white">
  169.                             </div>
  170.                             <div class="about-card__txt-box">
  171.                                 <strong>About White Wine</strong>
  172.                                 <img src="/html/user_data/assets/img/common/pen_thin.svg" alt="white">
  173.                                 <p>
  174.                                    白ブドウを発酵させて造るワイン。皮や種を除いた果汁だけを発酵させるため、淡い色に仕上がり、口当たりが滑らか。フレッシュな爽やかさとフルーティーな味わいが魅力。
  175.                                 </p>
  176.                             </div>
  177.                         </div>
  178.                         <p class="about-card__deco">
  179.                             Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault ,
  180.                             Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo ,
  181.                             Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot Noir ,
  182.                         </p>
  183.                     </div>
  184.                     <div class="about-wine-cat__item about-card --sparkling">
  185.                         <h3 class="about-card__title">
  186.                             スパークリングワイン
  187.                         </h3>
  188.                         <div class="about-card__label">
  189.                             <div>
  190.                                 <span>SPARKLING WINE</span>
  191.                                 <p>Listen to your inner heart. <span class="--pc">Listen to your inner heart.</span></p>
  192.                             </div>
  193.                             <img src="/html/user_data/assets/img/common/color-baner_spark.svg" alt="sparkling">
  194.                         </div>
  195.                         <div class="about-card__media">
  196.                             <div class="about-card__img-box">
  197.                                 <img src="/html/user_data/assets/img/common/about-wine/about-card_media_sparkling.webp" alt="sparkling">
  198.                             </div>
  199.                             <div class="about-card__txt-box">
  200.                                 <strong>About Sparkling Wine</strong>
  201.                                 <img src="/html/user_data/assets/img/common/pen_thin.svg" alt="sparkling">
  202.                                 <p>
  203.                                     発泡性のあるワインの総称。瓶詰めしたワインを密閉し、二時発酵させることで炭酸ガスが生まれる。白やロゼ、赤などそれぞれの持ち味と軽快な飲み口を楽しめます。
  204.                                 </p>
  205.                             </div>
  206.                         </div>
  207.                         <p class="about-card__deco">
  208.                             Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault ,
  209.                             Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo ,
  210.                             Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot Noir ,
  211.                         </p>
  212.                     </div>
  213.                     <div class="about-wine-cat__item about-card --rose">
  214.                         <h3 class="about-card__title">
  215.                             ロゼワイン
  216.                         </h3>
  217.                         <div class="about-card__label">
  218.                             <div>
  219.                                 <span>ROSE WINE</span>
  220.                                 <p>Listen to your inner heart. <span class="--pc">Listen to your inner heart.</span></p>
  221.                             </div>
  222.                             <img src="/html/user_data/assets/img/common/color-baner_rose.svg" alt="red">
  223.                         </div>
  224.                         <div class="about-card__media">
  225.                             <div class="about-card__img-box">
  226.                                 <img src="/html/user_data/assets/img/common/about-wine/about-card_media_rose.webp" alt="rose">
  227.                             </div>
  228.                             <div class="about-card__txt-box">
  229.                                 <strong>About Rose Wine</strong>
  230.                                 <img src="/html/user_data/assets/img/common/pen_thin.svg" alt="rose">
  231.                                 <p>
  232.                                     黒ブドウの果皮と種、果実を発酵させ、濃い赤色になる前に皮や種を取り除き、ピンク色に仕上げたワイン。タンニンの渋味と果実味のバランスを感じられるのが特徴。
  233.                                 </p>
  234.                             </div>
  235.                         </div>
  236.                         <p class="about-card__deco">
  237.                             Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault ,
  238.                             Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo ,
  239.                             Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot Noir ,
  240.                         </p>
  241.                     </div>
  242.                     <div class="about-wine-cat__item about-card --orange">
  243.                         <h3 class="about-card__title">
  244.                             オレンジワイン
  245.                         </h3>
  246.                         <div class="about-card__label">
  247.                             <div>
  248.                                 <span>ORANGE WINE</span>
  249.                                 <p>Listen to your inner heart. <span class="--pc">Listen to your inner heart.</span></p>
  250.                             </div>
  251.                             <img src="/html/user_data/assets/img/common/color-baner_orange.svg" alt="orange">
  252.                         </div>
  253.                         <div class="about-card__media">
  254.                             <div class="about-card__img-box">
  255.                                 <img src="/html/user_data/assets/img/common/about-wine/about-card_media_orange.webp" alt="orange">
  256.                             </div>
  257.                             <div class="about-card__txt-box">
  258.                                 <strong>About Orange Wine</strong>
  259.                                 <img src="/html/user_data/assets/img/common/pen_thin.svg" alt="orange">
  260.                                 <p>
  261.                                     白ブドウを原料に赤ワインと同じ製法で造るワイン。果皮ごと発酵させるためオレンジ色に仕上がる。原料や産地、作り手のセンスによってさまざまな香りや味わいが楽しめることで近年多くの飲食店で取扱いをされています。
  262.                                 </p>
  263.                             </div>
  264.                         </div>
  265.                         <p class="about-card__deco">
  266.                             Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault ,
  267.                             Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo ,
  268.                             Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot Noir ,
  269.                         </p>
  270.                     </div>
  271.                 </div>
  272.             </div>
  273.         </section>
  275.          <section class="about-wine-variety cmn-sec">
  276.             <div class="about-wine-variety__inner cmn-sec__inner">
  277.                 <div class="cmn-label-title">
  278.                     <h2 class="--ja">品種について</h2>
  279.                     <span class="--en">VARIETY</span>
  280.                     <img src="/html/user_data/assets/img/common/pen_thick.svg" alt="ペンで書かれた線のイラスト">
  281.                 </div>
  282.                 <div class="about-wine-variety__media">
  283.                     <div class="about-wine-variety__img-box">
  284.                         <img src="/html/user_data/assets/img/common/about-wine/variety_media.webp" alt="ペンで書かれた線のイラスト">
  285.                     </div>
  286.                     <div class="about-wine-variety__txt-box">
  287.                         <p>ワインの代表的な品種は、国際品種と呼ばれる６種類！</p>
  288.                         <p>世界各地で造られており、同じ品種でも産地や造り手によって個性が生まれます。ナチュラルワインの場合は、テイストが柔らかくなり、さらにドリンカブルに。</p>
  289.                         <p>ナチュラルワインは人気の品種より、多種多様な品種から造られる。お気に入りを見つけるのも楽しいのです。</p>
  290.                     </div>
  291.                 </div>
  292.             </div>
  293.             <ul class="about-wine-variety__list">
  294.                 <li>
  295.                     <a href="https://wineshop.salond.jp/products/list?category_id=282" data-target="modal01" class="about-wine-variety__list-item">
  296.                         <img class="--cabernet" src="/html/user_data/assets/img/common/about-wine/variety_logo_cabernet.svg"
  297.                             alt="カベルネ・ソーヴィニヨン">
  298.                         <span>カベルネ・ソーヴィニヨン</span>
  299.                     </a>
  300.                     <section class="about-wine-modal" id="modal01">
  301.                         <div class="about-wine-modal__image"><img src="/html/user_data/assets/img/common/about-wine/variety_modal_01.webp" alt=""></div>
  302.                         <div class="about-wine-modal__content">
  303.                             <img src="/html/user_data/assets/img/common/title_red.webp" alt="RED" class="about-wine-modal__type">
  304.                             <img src="/html/user_data/assets/img/common/color-baner_red.svg" alt="" class="about-wine-modal__banner">
  305.                             <h3 class="about-wine-modal__title">カベルネ・ソーヴィニヨン</h3>
  306.                             <p>赤ワイン用として世界の多くの国で栽培されている「ワインの王様」とも呼ばれる人気の品種。しっかりした骨格を持ち、深い色合いが特徴です。</p>
  307.                         </div>
  308.                     </section>
  309.                 </li>
  310.                 <li>
  311.                     <a href="https://wineshop.salond.jp/products/list?category_id=180" data-target="modal02" class="about-wine-variety__list-item">
  312.                         <img class="--merlot" src="/html/user_data/assets/img/common/about-wine/variety_logo_merlot.svg"
  313.                             alt="メルロー">
  314.                         <span>メルロー</span>
  315.                     </a>
  316.                     <section class="about-wine-modal" id="modal02">
  317.                         <div class="about-wine-modal__image"><img src="/html/user_data/assets/img/common/about-wine/variety_modal_02.webp" alt=""></div>
  318.                         <div class="about-wine-modal__content">
  319.                             <img src="/html/user_data/assets/img/common/title_red.webp" alt="RED" class="about-wine-modal__type">
  320.                             <img src="/html/user_data/assets/img/common/color-baner_red.svg" alt="" class="about-wine-modal__banner">
  321.                             <h3 class="about-wine-modal__title">メルロー</h3>
  322.                             <p>世界各地で栽培されている人気の品種。カベルネ・ソーヴィニヨンとブレンドされることも多く、主役だけでなく、脇を固める一面も。</p>
  323.                         </div>
  324.                     </section>
  325.                 </li>
  326.                 <li>
  327.                     <a href="https://wineshop.salond.jp/products/list?category_id=117" data-target="modal03" class="about-wine-variety__list-item">
  328.                         <img class="--pinot" src="/html/user_data/assets/img/common/about-wine/variety_logo_pinot.svg"
  329.                             alt="ピノ・ノワール">
  330.                         <span>ピノ・ノワール</span>
  331.                     </a>
  332.                     <section class="about-wine-modal" id="modal03">
  333.                         <div class="about-wine-modal__image"><img src="/html/user_data/assets/img/common/about-wine/variety_modal_03.webp" alt=""></div>
  334.                         <div class="about-wine-modal__content">
  335.                             <img src="/html/user_data/assets/img/common/title_red.webp" alt="RED" class="about-wine-modal__type">
  336.                             <img src="/html/user_data/assets/img/common/color-baner_red.svg" alt="" class="about-wine-modal__banner">
  337.                             <h3 class="about-wine-modal__title">ピノ・ノワール</h3>
  338.                             <p>フランス・ブルゴーニュ地方原産の品種。透明感のあるルビー色でタンニンは少なめ。カリフォルニアで生産されたものは濃厚さがアップします。</p>
  339.                         </div>
  340.                     </section>
  341.                 </li>
  342.                 <li>
  343.                     <a href="https://wineshop.salond.jp/products/list?category_id=163" data-target="modal04" class="about-wine-variety__list-item">
  344.                         <img class="--chardonnay" src="/html/user_data/assets/img/common/about-wine/variety_logo_chardonnay.svg"
  345.                             alt="シャルドネ">
  346.                         <span>シャルドネ</span>
  347.                     </a>
  348.                     <section class="about-wine-modal" id="modal04">
  349.                         <div class="about-wine-modal__image"><img src="/html/user_data/assets/img/common/about-wine/variety_modal_04.webp" alt=""></div>
  350.                         <div class="about-wine-modal__content">
  351.                             <img src="/html/user_data/assets/img/common/title_white.webp" alt="WHITE" class="about-wine-modal__type">
  352.                             <img src="/html/user_data/assets/img/common/color-baner_white.svg" alt="" class="about-wine-modal__banner">
  353.                             <h3 class="about-wine-modal__title">シャルドネ</h3>
  354.                             <p>人気・知名度ともにトップを誇るフランス・ブルゴーニュ地方原産の白ブドウの品種。造り手によって個性が際立ち、シャンパーニュの原料としても有名です。</p>
  355.                         </div>
  356.                     </section>
  357.                 </li>
  358.                 <li>
  359.                     <a href="https://wineshop.salond.jp/products/list?category_id=139" data-target="modal05" class="about-wine-variety__list-item">
  360.                         <img class="--sauvignon" src="/html/user_data/assets/img/common/about-wine/variety_logo_sauvignon.svg"
  361.                             alt="ソーヴィニヨン・ブラン">
  362.                         <span>ソーヴィニヨン・ブラン</span>
  363.                     </a>
  364.                     <section class="about-wine-modal" id="modal05">
  365.                         <div class="about-wine-modal__image"><img src="/html/user_data/assets/img/common/about-wine/variety_modal_05.webp" alt=""></div>
  366.                         <div class="about-wine-modal__content">
  367.                             <img src="/html/user_data/assets/img/common/title_white.webp" alt="WHITE" class="about-wine-modal__type">
  368.                             <img src="/html/user_data/assets/img/common/color-baner_white.svg" alt="" class="about-wine-modal__banner">
  369.                             <h3 class="about-wine-modal__title">ソーヴィニヨン・ブラン</h3>
  370.                             <p>シャルドネに並んで白ワインの代表格とも言える人気の品種。黄緑色のような透明感のある色と独特の香りを持ちます。</p>
  371.                         </div>
  372.                     </section>
  373.                 </li>
  374.                 <li>
  375.                     <a href="https://wineshop.salond.jp/products/list?category_id=114" data-target="modal06" class="about-wine-variety__list-item">
  376.                         <img class="--riesling" src="/html/user_data/assets/img/common/about-wine/variety_logo_riesling.svg"
  377.                             alt="リースリング">
  378.                         <span>リースリング</span>
  379.                     </a>
  380.                     <section class="about-wine-modal" id="modal06">
  381.                         <div class="about-wine-modal__image"><img src="/html/user_data/assets/img/common/about-wine/variety_modal_06.webp" alt=""></div>
  382.                         <div class="about-wine-modal__content">
  383.                             <img src="/html/user_data/assets/img/common/title_white.webp" alt="WHITE" class="about-wine-modal__type">
  384.                             <img src="/html/user_data/assets/img/common/color-baner_white.svg" alt="" class="about-wine-modal__banner">
  385.                             <h3 class="about-wine-modal__title">リースリング</h3>
  386.                             <p>ドイツを代表する白ブドウ品種。辛口から甘口まで幅広く使われる。甘口ワインに使われることが多い。</p>
  387.                         </div>
  388.                     </section>
  389.                 </li>
  390.             </ul>
  391.         </section>
  393.         <section class="about-wine-enjoy cmn-sec">
  394.             <div class="about-wine-enjoy__inner cmn-sec__inner">
  395.                 <div class="cmn-label-title">
  396.                     <h2 class="--ja">ワインを3倍楽しむ</h2>
  397.                     <span class="--en">ENJOY WINE × 3</span>
  398.                     <img src="/html/user_data/assets/img/common/pen_thick.svg" alt="ペンで書かれた線のイラスト">
  399.                 </div>
  400.                 <div class="about-wine-enjoy__thumb">
  401.                     <img src="/html/user_data/assets/img/common/about-wine/enjoy_thumb.webp" alt="ペンで書かれた線のイラスト">
  402.                 </div>
  403.                 <div class="about-wine-enjoy__sence">
  404.                     <div class="about-wine-enjoy__sence-title-wrap">
  405.                         <div class="about-wine-enjoy__sence-title-box">
  406.                             <h3>ENJOY<br>SENCE</h3>
  407.                             <span>感覚で楽しむ</span>
  408.                             <p>Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault ,
  409.                                 Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo
  410.                                 , Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot
  411.                                 Noir , </p>
  412.                         </div>
  413.                     </div>
  414.                     <ul class="about-wine-enjoy__sence-list">
  415.                         <li class="about-wine-enjoy__sence-item">
  416.                             <strong>色の変化を楽しむ</strong>
  417.                             <div class="about-wine-enjoy__sence-img-box">
  418.                                 <img src="/html/user_data/assets/img/common/about-wine/enjoy_sence01.webp" alt="ペンで書かれた線のイラスト">
  419.                             </div>
  420.                             <div class="about-wine-enjoy__sence-txt-box">
  421.                                 <p>赤、白、ロゼ、オレンジなどワインの色は自然の賜物。美しい色の濃淡や光の環境による色の変化を楽しむのも醍醐味。ナチュラルワインは無濾過のため、濁りが生じる場合もあるが、それは自然な造りであるがゆえの面白さと捉えて楽しもう。
  422.                                 </p>
  423.                             </div>
  424.                         </li>
  425.                         <li class="about-wine-enjoy__sence-item">
  426.                             <strong>香りを堪能する</strong>
  427.                             <div class="about-wine-enjoy__sence-img-box">
  428.                                 <img src="/html/user_data/assets/img/common/about-wine/enjoy_sence02.webp" alt="ペンで書かれた線のイラスト">
  429.                             </div>
  430.                             <div class="about-wine-enjoy__sence-txt-box">
  431.                                 <p>品種によって様々な果物や花、動物に例えられる。グラスに注いだら「アロマ」と呼ばれるワインの香りを堪能しよう。ナチュラルワインは「オフフレーバー」と言われる特有の香りが発生する場合もあるが、それは無添加であるからこそ。
  432.                                 </p>
  433.                             </div>
  434.                         </li>
  435.                         <li class="about-wine-enjoy__sence-item">
  436.                             <strong>味わいを感じる</strong>
  437.                             <div class="about-wine-enjoy__sence-img-box">
  438.                                 <img src="/html/user_data/assets/img/common/about-wine/enjoy_sence03.webp" alt="ペンで書かれた線のイラスト">
  439.                             </div>
  440.                             <div class="about-wine-enjoy__sence-txt-box">
  441.                                 <p>果実味、甘み、酸味、渋味、濃淡などさまざまな要素が絡み合って味わいが生まれるワインは、飲み込む前に口に含んだまま味わってみよう。「噛む（かむ）」イメージで口に広げることで、味と香りが混ざり、より個性を感じられるはず。
  442.                                 </p>
  443.                             </div>
  444.                         </li>
  445.                     </ul>
  446.                 </div>
  447.                 <div class="about-wine-enjoy__freely">
  448.                     <div class="about-wine-enjoy__freely-title-wrap">
  449.                         <div class="about-wine-enjoy__freely-title-box">
  450.                             <h3>ENJOY<br>FREELY</h3>
  451.                             <span>自由に楽しむ</span>
  452.                             <p>Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault ,
  453.                                 Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo
  454.                                 , Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot
  455.                                 Noir , </p>
  456.                         </div>
  457.                     </div>
  458.                     <div class="about-wine-enjoy__freely-thumb">
  459.                         <img src="/html/user_data/assets/img/common/about-wine/enjoy_freely.webp" alt="ペンで書かれた線のイラスト">
  460.                     </div>
  461.                     <div class="about-wine-enjoy__freely-media">
  462.                         <div class="about-wine-enjoy__freely-txt-box">
  463.                             <strong>よりおいしく飲む順番って？</strong>
  464.                             <p>
  465.                                 ワインの基本的なセオリーはありますが、楽しみ方は自由！<br>
  466.                                 自分なりの方法を見つけてワインを満喫しましょう。
  467.                             </p>
  468.                             <p>
  469.                                 ワインには、より深く味わうために飲む順番の王道があります。それは淡い色からスタートして、濃厚なものに変えていくこと。
  470.                             </p>
  471.                         </div>
  472.                         <div class="about-wine-enjoy__freely-img-box">
  473.                             <img src="/html/user_data/assets/img/common/about-wine/enjoy_freely_media.webp" alt="ペンで書かれた線のイラスト">
  474.                         </div>
  475.                     </div>
  476.                     <!--<ul class="about-wine-enjoy__freely-list">
  477.                         <li class="about-wine-enjoy__freely-item freely-card">
  478.                             <div class="freely-card__title-box">
  479.                                 <span>01.</span>
  480.                                 <strong>辛口のスパークリングワイン</strong>
  481.                             </div>
  482.                             <div class="freely-card__img-box">
  483.                                 <img src="/html/user_data/assets/img/common/about-wine/enjoy_freely_card01.webp" alt="ペンで書かれた線のイラスト">
  484.                             </div>
  485.                         </li>
  486.                         <li class="about-wine-enjoy__freely-item freely-card">
  487.                             <div class="freely-card__title-box">
  488.                                 <span>02.</span>
  489.                                 <strong>辛口の白ワイン</strong>
  490.                             </div>
  491.                             <div class="freely-card__img-box">
  492.                                 <img src="/html/user_data/assets/img/common/about-wine/enjoy_freely_card01.webp" alt="ペンで書かれた線のイラスト">
  493.                             </div>
  494.                         </li>
  495.                         <li class="about-wine-enjoy__freely-item freely-card">
  496.                             <div class="freely-card__title-box">
  497.                                 <span>03.</span>
  498.                                 <strong>濃厚な白 軽めの赤 ロゼ</strong>
  499.                             </div>
  500.                             <div class="freely-card__img-box">
  501.                                 <img src="/html/user_data/assets/img/common/about-wine/enjoy_freely_card01.webp" alt="ペンで書かれた線のイラスト">
  502.                             </div>
  503.                         </li>
  504.                         <li class="about-wine-enjoy__freely-item freely-card">
  505.                             <div class="freely-card__title-box">
  506.                                 <span>04.</span>
  507.                                 <strong>濃厚な赤ワイン</strong>
  508.                             </div>
  509.                             <div class="freely-card__img-box">
  510.                                 <img src="/html/user_data/assets/img/common/about-wine/enjoy_freely_card01.webp" alt="ペンで書かれた線のイラスト">
  511.                             </div>
  512.                         </li>
  513.                         <li class="about-wine-enjoy__freely-item freely-card">
  514.                             <div class="freely-card__title-box">
  515.                                 <span>05.</span>
  516.                                 <strong>甘口のワイン</strong>
  517.                             </div>
  518.                             <div class="freely-card__img-box">
  519.                                 <img src="/html/user_data/assets/img/common/about-wine/enjoy_freely_card01.webp" alt="ペンで書かれた線のイラスト">
  520.                             </div>
  521.                         </li>
  522.                     </ul>-->
  523.                 </div>
  524.                 <div class="about-wine-enjoy__dish">
  525.                     <div class="about-wine-enjoy__dish-title-wrap">
  526.                         <div class="about-wine-enjoy__dish-title-box">
  527.                             <h3>ENJOY<br>WITH<br>DISH</h3>
  528.                             <span>食事と楽しむ</span>
  529.                             <p>Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault ,
  530.                                 Lambrusco , Nebbiolo , Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo
  531.                                 , Primitivo , Pinot Noir , Gamay , Cinsault , Lambrusco , Nebbiolo , Primitivo , Pinot
  532.                                 Noir , </p>
  533.                         </div>
  534.                     </div>
  535.                 </div>
  536.                 <p class="about-wine-enjoy__dish-txt">
  537.                     乾杯、前菜、メインディッシュ、食後のデザートといったフレンチやイタリアンなどの西洋料理のフルコースにペアリングしていくのが基本の順番。濃厚なものをはじめに飲むと、次に軽いものを飲んだとき、より軽く感じてしまうため、基本に沿って「軽いものから重たいものに」持っていくのがベスト。
  538.                 </p>
  539.             </div>
  540.             <div class="about-wine-enjoy__dish-slider">
  541.                 <div class="swiper-wrapper">
  542.                     <div class="swiper-slide">
  543.                         <img src="/html/user_data/assets/img/common/about-wine/enjoy_slide01.webp" alt="ペンで書かれた線のイラスト">
  544.                     </div>
  545.                     <div class="swiper-slide">
  546.                         <img src="/html/user_data/assets/img/common/about-wine/enjoy_slide02.webp" alt="ペンで書かれた線のイラスト">
  547.                     </div>
  548.                     <div class="swiper-slide">
  549.                         <img src="/html/user_data/assets/img/common/about-wine/enjoy_slide03.webp" alt="ペンで書かれた線のイラスト">
  550.                     </div>
  551.                     <div class="swiper-slide">
  552.                         <img src="/html/user_data/assets/img/common/about-wine/enjoy_slide04.webp" alt="ペンで書かれた線のイラスト">
  553.                     </div>
  554.                     <div class="swiper-slide">
  555.                         <img src="/html/user_data/assets/img/common/about-wine/enjoy_slide01.webp" alt="ペンで書かれた線のイラスト">
  556.                     </div>
  557.                     <div class="swiper-slide">
  558.                         <img src="/html/user_data/assets/img/common/about-wine/enjoy_slide02.webp" alt="ペンで書かれた線のイラスト">
  559.                     </div>
  560.                     <div class="swiper-slide">
  561.                         <img src="/html/user_data/assets/img/common/about-wine/enjoy_slide03.webp" alt="ペンで書かれた線のイラスト">
  562.                     </div>
  563.                     <div class="swiper-slide">
  564.                         <img src="/html/user_data/assets/img/common/about-wine/enjoy_slide04.webp" alt="ペンで書かれた線のイラスト">
  565.                     </div>
  566.                 </div>
  567.             </div>
  568.         </section>
  570.         <section class="about-wine-life cmn-sec">
  571.             <div class="about-wine-life__inner cmn-sec__inner">
  572.                 <div class="cmn-label-title">
  573.                     <h2 class="--ja">ワインで作るライフスタイル</h2>
  574.                     <span class="--en">WINE IN LIFESTYLE</span>
  575.                     <img src="/html/user_data/assets/img/common/pen_thick.svg" alt="ペンで書かれた線のイラスト">
  576.                 </div>
  577.                 <div class="about-wine-life__thumb">
  578.                     <img src="/html/user_data/assets/img/common/about-wine/life_thumb.webp" alt="ペンで書かれた線のイラスト">
  579.                 </div>
  580.                 <div class="about-wine-life__list">
  581.                     <div class="about-wine-life__item life-media media01">
  582.                         <div class="life-media__img-box">
  583.                             <img src="/html/user_data/assets/img/common/about-wine/life_media01_img.webp" alt="ペンで書かれた線のイラスト">
  584.                         </div>
  585.                         <div class="life-media__txt-box">
  586.                             <img src="/html/user_data/assets/img/common/about-wine/life_media01_title.svg" alt="ペンで書かれた線のイラスト">
  587.                             <h3>１本を自由に変化させて楽しむ</h3>
  588.                             <p>複数で楽しむ家飲みの場合は、１本で８杯ほど注げるため、スパークリングや白、赤など複数のワインをそろえて食事に合わせて味の違いを楽しめます。ひとりや少人数で１本を楽しむ場合、飲み方を変えて楽しみましょう。赤ワインであれば、最初は氷とソーダを入れてスプリッツァにして喉を潤し、次に氷を入れてロックで。さらにストレート、最後はフルーツを入れてサングリアのような甘みのあるワインに。１本をワインのフルコースに見立てて、幅広い楽しみ方ができるのもワインの醍醐味。
  589.                             </p>
  590.                         </div>
  591.                     </div>
  592.                     <div class="about-wine-life__item life-media media02">
  593.                         <div class="life-media__txt-box">
  594.                             <h3>どんな料理に合わせたらいい？</h3>
  595.                             <p>ナチュラルワインのペアリングは、素材の風味を活かし、ワインの個性を生かすことがポイントです。 ナチュラルワインは通常、果汁の強化に繋がるような添加物が少なく、ブドウ本来の自然な果汁感や酸味・甘みをダイレクトに感じるため、シンプルな素材を重視した料理がよく合う印象です。</p>
  596.                         </div>
  597.                         <div class="life-media__img-box">
  598.                             <img src="/html/user_data/assets/img/common/about-wine/life_media02_img.webp" alt="ペンで書かれた線のイラスト">
  599.                             <span>01_SIN Xarel-lo　|　02_木村硝子キソ 15ozワイン　|　03_貝のムニエルレモン風味</span>
  600.                             <img class="life-media__title-img"
  601.                                 src="/html/user_data/assets/img/common/about-wine/life_media02_title.svg" alt="ペンで書かれた線のイラスト">
  602.                         </div>
  603.                         
  604.                         
  605.                     </div>
  606.                     <div class="about-wine-life__item-sub">
  607.                         <ul class="about-wine-life__slide">
  608.                             <li><img src="/html/user_data/assets/img/common/about-wine/life_media02_slide01.webp" alt=""></li>
  609.                             <li><img src="/html/user_data/assets/img/common/about-wine/life_media02_slide02.webp" alt=""></li>
  610.                             <li><img src="/html/user_data/assets/img/common/about-wine/life_media02_slide03.webp" alt=""></li>
  611.                             <li><img src="/html/user_data/assets/img/common/about-wine/life_media02_slide01.webp" alt=""></li>
  612.                             <li><img src="/html/user_data/assets/img/common/about-wine/life_media02_slide02.webp" alt=""></li>
  613.                             <li><img src="/html/user_data/assets/img/common/about-wine/life_media02_slide03.webp" alt=""></li>
  614.                         </ul>
  615.                         <div class="about-wine-life__content">
  616.                             <div><p>ジューシーな酸味や豊かな果実味を持つものは、酸味を活かす料理や、酸味が足りない料理に口内調理として合わせたりと楽しい組み合わせは無限大。風味豊かな香りは発酵食品の チーズはもちろんですが、日本の発酵食品である味噌や醤油、ぬか、漬け込みチーズなどを様々な産地の品種と合わせることで、色んな表情を見せるのも組み合わせの醍醐味です。<br>
  617. <br>
  618. ワインの特徴と食材の持ち味を活かすために軽い調理法でシンプルな料理も相性が良いです。例えば、グリルやソテー、オーブン焼きにして、ハーブやレモン、オリーブオイルで風味をつけると、ワインの自然なアロマと調和します。</p></div>
  619.                             <div><p>ベリー系のフルーツタルトや、シンプルな季節のフルーツにハチミツやナッツを合わせたデザートは、赤やオレンジ系のナチュラルワインと合わせたり、ワインの甘酸っぱい風味が引き立ちます。<br>
  620. <br>
  621. ナッツやドライフルーツを使った料理や、スパイスを使ったエスニックな料理はロゼとオレンジワインの相乗効果も楽しむのも一つ。濃厚なフムスやタプナード、オリーブなども言い出すとキリがないのが魅力ですね。<br>
  622. <br>
  623. 基本は難しいことは抜きにして、飲む方が自由に楽しいワインライフを送ることが一番重要と考えます。</p></div>
  624.                         </div>
  625.                     </div>
  626.                     <div class="about-wine-life__item life-media media03">
  627.                         <div class="life-media__img-box">
  628.                             <img src="/html/user_data/assets/img/common/about-wine/life_media03_img.webp" alt="ペンで書かれた線のイラスト">
  629.                             <span>01_木村硝子キソ 15ozワイン</span>
  630.                             <img class="life-media__title-img"
  631.                                 src="/html/user_data/assets/img/common/about-wine/life_media03_title.svg" alt="ペンで書かれた線のイラスト">
  632.                         </div>
  633.                         <div class="life-media__txt-box">
  634.                             <h3>どんなグラスを使ったらいい？</h3>
  635.                             <p>赤、白、スパークリングなど種類によって、ワイングラスの最適な形状は存在するが、家で楽しむなら基本的にはどんな器でも問題なし。お気に入りのワイングラスでもタンブラーでもコップでもなんでもOK！
  636.                             </p>
  637.                             <p>１つ自宅に置いておきたいグラスを選ぶなら、木村硝子店の「ピッコロ」がおすすめ。小ぶりで持ちやすく、ガラスが薄いため、香りと味わいがスッと口に広がり、ワインの醍醐味を十分に享受できる。程よい高さと品のあるフォルムでカジュアルにもフォーマルにも楽しめて、ビールや日本酒など様々な用途に使えるのも魅力。
  638.                             </p>
  639.                         </div>
  640.                     </div>
  641.                 </div>
  642.                 <div class="about-wine-life__thumb--bottom">
  643.                     <img src="/html/user_data/assets/img/common/about-wine/life_thumb_bottom.webp" alt="ペンで書かれた線のイラスト">
  644.                 </div>
  645.             </div>
  646.         </section>
  647.   {{ include('Block/knowwine.twig') }}
  649.        {{ include('Block/owner.twig') }}
  651.         {{ include('Block/faq.twig') }}
  652. {% endblock %}