app/template/user_data/campaign_summer_campaign.twig line 1

Open in your IDE?
  1. {% extends 'default_frame.twig' %}
  3. {% block main %}
  4. <style>
  5.     body {
  6.       margin: 0;
  7.       background: #eaf8ff;
  8.       color: #1d2f45;
  9.       font-family: "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  10.     }
  11.     .sc-summer {
  12.       max-width: 980px;
  13.       margin: 0 auto;
  14.       background: #fff;
  15.     }
  16.     .sc-summer img {
  17.       max-width: 100%;
  18.       height: auto;
  19.     }
  20.     .sc-hero,
  21.     .sc-sec01 {
  22.       margin: 0;
  23.     }
  24.     .sc-hero img,
  25.     .sc-sec01 img {
  26.       display: block;
  27.       width: 100%;
  28.     }
  29.     .sc-cta {
  30.       padding: 22px 5%;
  31.       text-align: center;
  32.     }
  33.     .sc-button,
  34.     .sc-product__button,
  35.     .sc-kotsukotsu__button {
  36.       display: flex;
  37.       align-items: center;
  38.       justify-content: center;
  39.       min-height: 48px;
  40.       color: #fff;
  41.       background: #0b5796;
  42.       border-radius: 6px;
  43.       font-weight: 700;
  44.       text-decoration: none;
  45.     }
  46.     .sc-button {
  47.       min-height: 58px;
  48.       background: linear-gradient(#098003, #135e0f);
  49.       font-size: 22px;
  50.     }
  51.     .sc-kotsukotsu {
  52.       margin: 24px 18px;
  53.       padding: 22px;
  54.       background: #feeaf3;
  55.       border: 2px solid #c53666;
  56.       border-radius: 8px;
  57.       text-align: center;
  58.     }
  59.     .sc-kotsukotsu__title {
  60.       margin: 0 0 14px;
  61.       color: #b41d4f;
  62.       font-size: 24px;
  63.       line-height: 1.35;
  64.     }
  65.     .sc-kotsukotsu__imageLink {
  66.       display: block;
  67.     }
  68.     .sc-kotsukotsu img {
  69.       display: block;
  70.       width: min(780px, 100%);
  71.       margin: 0 auto;
  72.     }
  73.     .sc-kotsukotsu__button {
  74.       width: min(320px, 100%);
  75.       margin: 16px auto 0;
  76.       background: #b41d4f;
  77.     }
  78.     .sc-section {
  79.       margin: 0 18px 18px;
  80.       border: 1px solid #7fb2e0;
  81.       background: #fff;
  82.     }
  83.     .sc-section__title {
  84.       display: inline-block;
  85.       margin: 0;
  86.       padding: 8px 36px 8px 18px;
  87.       color: #fff;
  88.       background: #0b5796;
  89.       font-size: 24px;
  90.       line-height: 1.2;
  91.       clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 50%, calc(100% - 24px) 100%, 0 100%);
  92.     }
  93.     .sc-products {
  94.       display: grid;
  95.       grid-template-columns: repeat(4, minmax(0, 1fr));
  96.       border-top: 1px solid #c9d9ea;
  97.     }
  98.     .sc-products--2 {
  99.       grid-template-columns: repeat(2, minmax(0, 1fr));
  100.     }
  101.     .sc-products--1 {
  102.       grid-template-columns: 1fr;
  103.     }
  104.     .sc-product {
  105.       position: relative;
  106.       display: flex;
  107.       flex-direction: column;
  108.       gap: 10px;
  109.       min-height: 365px;
  110.       padding: 18px;
  111.       border-right: 1px dotted #a9bfd4;
  112.       border-bottom: 1px dotted #a9bfd4;
  113.     }
  114.     .sc-product__imageLink {
  115.       display: flex;
  116.       align-items: center;
  117.       justify-content: center;
  118.       height: 150px;
  119.     }
  120.     .sc-product__img {
  121.       max-height: 140px;
  122.       object-fit: contain;
  123.     }
  124.     .sc-product__name {
  125.       margin: 0 0 6px;
  126.       font-size: 20px;
  127.       line-height: 1.25;
  128.       min-height: 2.5em;
  129.     }
  130.     .sc-product__desc {
  131.       margin: 0 0 8px;
  132.       font-size: 15px;
  133.       line-height: 1.45;
  134.       min-height: 2.9em;
  135.     }
  136.     .sc-product__spec {
  137.       display: inline-block;
  138.       margin: 0 0 8px;
  139.       padding: 2px 8px;
  140.       border: 1px solid #777;
  141.       font-size: 14px;
  142.       line-height: 1.2;
  143.     }
  144.     .sc-product__price {
  145.       display: flex;
  146.       align-items: baseline;
  147.       flex-wrap: wrap;
  148.       gap: 2px;
  149.       margin: 0 0 12px;
  150.       color: #111;
  151.       line-height: 1.05;
  152.       min-height: 2.2em;
  153.     }
  154.     .sc-product__priceValue {
  155.       font-family: "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  156.       font-size: 32px;
  157.       font-weight: 700;
  158.       letter-spacing: 0;
  159.     }
  160.     .sc-product__priceUnit {
  161.       font-family: "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  162.       font-size: 15px;
  163.       font-weight: 700;
  164.       line-height: 1.1;
  165.     }
  166.     .sc-product__button {
  167.       margin-top: auto;
  168.       min-height: 42px;
  169.       font-size: 15px;
  170.     }
  171.     .sc-product__badge {
  172.       position: absolute;
  173.       right: 12px;
  174.       top: 12px;
  175.       display: inline-flex;
  176.       align-items: center;
  177.       justify-content: center;
  178.       width: 72px;
  179.       height: 72px;
  180.       border-radius: 50%;
  181.       background: #0b7fc6;
  182.       color: #fff;
  183.       font-weight: 700;
  184.       line-height: 1.2;
  185.       text-align: center;
  186.     }
  187.     .sc-section--beauty {
  188.       border-color: #df78bc;
  189.     }
  190.     .sc-section--beauty .sc-section__title {
  191.       background: #d957a8;
  192.     }
  193.     .sc-section--brow {
  194.       border-color: #8b77c9;
  195.     }
  196.     .sc-section--brow .sc-section__title {
  197.       background: #7b68b9;
  198.     }
  199.     .sc-section--active,
  200.     .sc-section--daily {
  201.       border-color: #70b877;
  202.     }
  203.     .sc-section--active .sc-section__title,
  204.     .sc-section--daily .sc-section__title {
  205.       background: #37a35d;
  206.     }
  207.     .sc-section--sleep {
  208.       border-color: #497fc5;
  209.     }
  210.     .sc-section--sleep .sc-section__title {
  211.       background: #1f5aa8;
  212.     }
  213.     .sc-quality {
  214.       margin: 24px 18px 0;
  215.       padding: 18px;
  216.       background: linear-gradient(90deg, #0c5098, #fff);
  217.       color: #fff;
  218.     }
  219.     .sc-quality__title {
  220.       margin: 0 0 6px;
  221.       font-size: 22px;
  222.     }
  223.     .sc-quality__text {
  224.       margin: 0;
  225.     }
  226.     .sc-notes {
  227.       margin: 20px 18px 0;
  228.       padding: 18px;
  229.       background: #fff8dd;
  230.       font-size: 14px;
  231.     }
  232.     .sc-notes h2 {
  233.       margin: 0 0 8px;
  234.       color: #064579;
  235.       font-size: 20px;
  236.     }
  237.     .sc-notes ul {
  238.       margin: 0;
  239.       padding-left: 1.4em;
  240.     }
  241.     @media (max-width: 767px) {
  242.       .sc-summer {
  243.         max-width: none;
  244.       }
  245.       .sc-section,
  246.       .sc-kotsukotsu {
  247.         margin-left: 10px;
  248.         margin-right: 10px;
  249.       }
  250.       .sc-kotsukotsu {
  251.         padding: 16px;
  252.       }
  253.       .sc-section__title {
  254.         font-size: 20px;
  255.       }
  256.       .sc-products {
  257.         grid-template-columns: repeat(2, minmax(0, 1fr));
  258.       }
  259.       .sc-product {
  260.         display: flex;
  261.         min-height: 300px;
  262.         padding: 12px;
  263.       }
  264.       .sc-product__imageLink {
  265.         height: 120px;
  266.       }
  267.       .sc-product__img {
  268.         max-height: 112px;
  269.       }
  270.       .sc-product__name {
  271.         font-size: 16px;
  272.       }
  273.       .sc-product__desc {
  274.         font-size: 13px;
  275.       }
  276.       .sc-product__priceValue {
  277.         font-size: 26px;
  278.       }
  279.       .sc-product__priceUnit {
  280.         font-size: 13px;
  281.       }
  282.       .sc-button {
  283.         font-size: 18px;
  284.       }
  285.     }
  286.     @media (max-width: 420px) {
  287.       .sc-products {
  288.         grid-template-columns: 1fr;
  289.       }
  290.       .sc-product {
  291.         display: grid;
  292.         grid-template-columns: 120px 1fr;
  293.         grid-template-rows: auto;
  294.         min-height: 0;
  295.       }
  296.       .sc-product__imageLink {
  297.         grid-row: 1 / span 5;
  298.       }
  299.     }
  300.   </style>
  301. <div class="sc-summer">
  302.     <figure class="sc-hero">
  303.       <picture>
  304.         <source media="(max-width: 767px)" type="image/webp" srcset="{{ asset('assets/img/campaign/summer-campaign/mv_sp.webp') }}">
  305.         <source media="(max-width: 767px)" srcset="{{ asset('assets/img/campaign/summer-campaign/mv_sp.jpg') }}">
  306.         <source type="image/webp" srcset="{{ asset('assets/img/campaign/summer-campaign/mv_pc.webp') }}">
  307.         <img src="{{ asset('assets/img/campaign/summer-campaign/mv_pc.jpg') }}" alt="夏まとめ買いキャンペーン 最大20%OFF">
  308.       </picture>
  309.     </figure>
  311.     <div class="sc-cta">
  312.       <a class="sc-button" href="{{ url('product_list') }}">ご注文はこちら</a>
  313.     </div>
  315.     <figure class="sc-sec01">
  316.       <picture>
  317.         <source media="(max-width: 767px)" type="image/webp" srcset="{{ asset('assets/img/campaign/summer-campaign/img_sec01_sp.webp') }}">
  318.         <source media="(max-width: 767px)" srcset="{{ asset('assets/img/campaign/summer-campaign/img_sec01_sp.jpg') }}">
  319.         <source type="image/webp" srcset="{{ asset('assets/img/campaign/summer-campaign/img_sec01_pc.webp') }}">
  320.         <img src="{{ asset('assets/img/campaign/summer-campaign/img_sec01_pc.jpg') }}" alt="2026年7月31日まで 夏まとめ買いキャンペーン 割引条件">
  321.       </picture>
  322.     </figure>
  324.     <section class="sc-kotsukotsu">
  325.       <a class="sc-kotsukotsu__imageLink" href="https://million-store.com/healthfood/5252milk">
  326.         <picture>
  327.           <source media="(max-width: 767px)" type="image/webp" srcset="{{ asset('assets/img/campaign/summer-campaign/kotsukotsu_notice_sp.webp') }}">
  328.           <source media="(max-width: 767px)" srcset="{{ asset('assets/img/campaign/summer-campaign/kotsukotsu_notice_sp.jpg') }}">
  329.           <source type="image/webp" srcset="{{ asset('assets/img/campaign/summer-campaign/kotsukotsu_notice_pc.webp') }}">
  330.           <img src="{{ asset('assets/img/campaign/summer-campaign/kotsukotsu_notice_pc.jpg') }}" alt="こつこつミルク 新パッケージになりました">
  331.         </picture>
  332.       </a>
  333.       <a class="sc-kotsukotsu__button" href="https://million-store.com/healthfood/5252milk">詳細はこちら</a>
  334.     </section>
  336.     <section class="sc-section">
  337.       <h2 class="sc-section__title">人気商品</h2>
  338.       <div class="sc-products">
  339.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/healthfood/millionpower"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_mp.png') }}" alt="ミリオンパワー"></a><div class="sc-product__body"><h3 class="sc-product__name">ミリオンパワー</h3><p class="sc-product__desc">毎日の元気と健康維持に。無臭にんにくサプリメント</p><p class="sc-product__spec">3g×120包</p><p class="sc-product__price"><span class="sc-product__priceValue">5,670</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/healthfood/millionpower">詳細はこちら</a></div></article>
  340.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/healthfood/millionpower-hg"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_hg.webp') }}" alt="ミリオンパワーHG"></a><div class="sc-product__body"><h3 class="sc-product__name">ミリオンパワーHG</h3><p class="sc-product__desc">1.5倍のにんにく成分配合で、毎日元気に</p><p class="sc-product__spec">3g×120包</p><p class="sc-product__price"><span class="sc-product__priceValue">9,396</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/healthfood/millionpower-hg">詳細はこちら</a></div></article>
  341.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/healthfood/millionpower-sg"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_sg.webp') }}" alt="ミリオンパワーSG"></a><div class="sc-product__body"><h3 class="sc-product__name">ミリオンパワーSG</h3><p class="sc-product__desc">栄養機能食品。マルチビタミン配合</p><p class="sc-product__spec">2g×60包</p><p class="sc-product__price"><span class="sc-product__priceValue">4,860</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/healthfood/millionpower-sg">詳細はこちら</a></div></article>
  342.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/healthfood/psyche"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_psyre.webp') }}" alt="プシュケー レギュラー"></a><div class="sc-product__body"><h3 class="sc-product__name">プシュケー レギュラー</h3><p class="sc-product__desc">腸内環境のケアに、乳酸菌酵母共棲培養エキス</p><p class="sc-product__spec">レギュラー</p><p class="sc-product__price"><span class="sc-product__priceValue">21,600</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/healthfood/psyche">詳細はこちら</a></div></article>
  343.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/healthfood/psyche-hg"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_psy.webp') }}" alt="プシュケー ハイグレード"></a><div class="sc-product__body"><h3 class="sc-product__name">プシュケー ハイグレード</h3><p class="sc-product__desc">腸内環境のケアに、乳酸菌酵母共棲培養エキス</p><p class="sc-product__spec">ハイグレード</p><p class="sc-product__price"><span class="sc-product__priceValue">41,040</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/healthfood/psyche-hg">詳細はこちら</a></div></article>
  344.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/healthfood/aozakana"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_ao.png') }}" alt="さらさら青魚"></a><div class="sc-product__body"><h3 class="sc-product__name">さらさら青魚</h3><p class="sc-product__desc">DHA・EPAで健やかな毎日を</p><p class="sc-product__spec">90粒</p><p class="sc-product__price"><span class="sc-product__priceValue">1,620</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/healthfood/aozakana">詳細はこちら</a></div></article>
  345.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/healthfood/collagen"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_co.webp') }}" alt="ミリオンのコラーゲン"></a><div class="sc-product__body"><h3 class="sc-product__name">ミリオンのコラーゲン</h3><p class="sc-product__desc">飲みやすく、続けやすい</p><p class="sc-product__spec">2.5g×60包</p><p class="sc-product__price"><span class="sc-product__priceValue">4,924</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/healthfood/collagen">詳細はこちら</a></div></article>
  346.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/healthfood/shikisima-ginger"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_shiki.webp') }}" alt="四季島酵素ジンジャー"></a><div class="sc-product__body"><h3 class="sc-product__name">四季島酵素ジンジャー</h3><p class="sc-product__desc">酵素とショウガの力で温活</p><p class="sc-product__spec">4g×14包</p><p class="sc-product__price"><span class="sc-product__priceValue">2,500</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/healthfood/shikisima-ginger">詳細はこちら</a></div></article>
  347.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/healthfood/kyushu-aojiru"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_kyuao.webp') }}" alt="おいしい九州青汁"></a><div class="sc-product__body"><h3 class="sc-product__name">おいしい九州青汁</h3><p class="sc-product__desc">国産素材100%使用の青汁</p><p class="sc-product__spec">3g×30包</p><p class="sc-product__price"><span class="sc-product__priceValue">2,500</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/healthfood/kyushu-aojiru">詳細はこちら</a></div></article>
  348.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/goods/neteruma-ni"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_neteru.webp') }}" alt="寝てるま〜に"></a><div class="sc-product__body"><h3 class="sc-product__name">寝てるま〜に</h3><p class="sc-product__desc">貼るだけ、休息の質を高めます</p><p class="sc-product__spec">50包</p><p class="sc-product__price"><span class="sc-product__priceValue">5,500</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/goods/neteruma-ni">詳細はこちら</a></div></article>
  349.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/goods/massage-roller"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_mr.webp') }}" alt="マッサージローラー"></a><div class="sc-product__body"><h3 class="sc-product__name">マッサージローラー</h3><p class="sc-product__desc">8点ローラーが疲れをほぐす</p><p class="sc-product__spec">150g</p><p class="sc-product__price"><span class="sc-product__priceValue">8,800</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/goods/massage-roller">詳細はこちら</a></div></article>
  350.       </div>
  351.     </section>
  353.     <section class="sc-section sc-section--beauty">
  354.       <h2 class="sc-section__title">美容をサポート</h2>
  355.       <div class="sc-products">
  356.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/goods/eye-lifty"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_el.jpg') }}" alt="アイリフティ"></a><div class="sc-product__body"><h3 class="sc-product__name">アイリフティ</h3><p class="sc-product__desc">目元のハリとうるおいに</p><p class="sc-product__spec">12ml</p><p class="sc-product__price"><span class="sc-product__priceValue">1,980</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/goods/eye-lifty">詳細はこちら</a></div></article>
  357.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/goods/lifty-lifty"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_ll.jpg') }}" alt="リフティリフティ"></a><div class="sc-product__body"><h3 class="sc-product__name">リフティリフティ</h3><p class="sc-product__desc">ハリ・たるみに。顔全体カバー</p><p class="sc-product__spec">15ml</p><p class="sc-product__price"><span class="sc-product__priceValue">1,980</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/goods/lifty-lifty">詳細はこちら</a></div></article>
  358.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/goods/perfect-lifty"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_pl.jpg') }}" alt="パーフェクトリフティ"></a><div class="sc-product__body"><h3 class="sc-product__name">パーフェクトリフティ</h3><p class="sc-product__desc">ハリのある引き締まった肌へ</p><p class="sc-product__spec">15ml</p><p class="sc-product__price"><span class="sc-product__priceValue">1,980</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/goods/perfect-lifty">詳細はこちら</a></div></article>
  359.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/goods/perfect-whity"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_pw.jpg') }}" alt="パーフェクトホワイティ"></a><div class="sc-product__body"><h3 class="sc-product__name">パーフェクトホワイティ</h3><p class="sc-product__desc">美白に自信。透明感のある肌へ</p><p class="sc-product__spec">15ml</p><p class="sc-product__price"><span class="sc-product__priceValue">2,700</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/goods/perfect-whity">詳細はこちら</a></div></article>
  360.       </div>
  361.     </section>
  363.     <section class="sc-section sc-section--brow">
  364.       <h2 class="sc-section__title">美しい眉で印象アップ</h2>
  365.       <div class="sc-products sc-products--1">
  366.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/goods/eyebrow-stamp"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_st.png') }}" alt="アイブロウスタンプ"></a><div class="sc-product__body"><h3 class="sc-product__name">アイブロウスタンプ</h3><p class="sc-product__desc">形：ストレート / アーチ　カラー：グレイ / ブラウン。簡単スタンプで自然な美眉に。</p><p class="sc-product__price"><span class="sc-product__priceValue">3,300</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/goods/eyebrow-stamp">詳細はこちら</a></div></article>
  367.       </div>
  368.     </section>
  370.     <section class="sc-section sc-section--active">
  371.       <h2 class="sc-section__title">夏をアクティブに</h2>
  372.       <div class="sc-products sc-products--1">
  373.         <article class="sc-product"><span class="sc-product__badge">割引対象外</span><a class="sc-product__imageLink" href="https://million-store.com/goods/locomo-cream"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_lc.png') }}" alt="マッサージクリーム ロコモクリーム331"></a><div class="sc-product__body"><h3 class="sc-product__name">マッサージクリーム ロコモクリーム331</h3><p class="sc-product__desc">べたつかないクリーム。ひじ・ひざの痛みに</p><p class="sc-product__spec">120g</p><p class="sc-product__price"><span class="sc-product__priceValue">5,280</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/goods/locomo-cream">詳細はこちら</a></div></article>
  374.       </div>
  375.     </section>
  377.     <section class="sc-section sc-section--daily">
  378.       <h2 class="sc-section__title">毎日の健康習慣に</h2>
  379.       <div class="sc-products sc-products--2">
  380.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/goods/disinfection-spray"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_spr_60.png') }}" alt="ウイルス除菌スプレーPK2"></a><div class="sc-product__body"><h3 class="sc-product__name">ウイルス除菌スプレーPK2</h3><p class="sc-product__desc">2本でお得！</p><p class="sc-product__spec">60ml / 120ml</p><p class="sc-product__price">1,056円(税込)〜</p><a class="sc-product__button" href="https://million-store.com/goods/disinfection-spray">詳細はこちら</a></div></article>
  381.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/goods/hot-bubble"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_hb.png') }}" alt="ホットバブルプロ"></a><div class="sc-product__body"><h3 class="sc-product__name">ホットバブルプロ</h3><p class="sc-product__desc">毎日の入浴習慣に</p><p class="sc-product__spec">21錠 / 90錠</p><p class="sc-product__price">2,178円(税込) / 7,260円(税込)</p><a class="sc-product__button" href="https://million-store.com/goods/hot-bubble">詳細はこちら</a></div></article>
  382.       </div>
  383.     </section>
  385.     <section class="sc-section sc-section--sleep">
  386.       <h2 class="sc-section__title">寝苦しい夏の夜に</h2>
  387.       <div class="sc-products sc-products--2">
  388.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/goods/pillow"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_tr.png') }}" alt="快眠まくら 鶴の夢 SP"></a><div class="sc-product__body"><h3 class="sc-product__name">快眠まくら 鶴の夢 SP</h3><p class="sc-product__desc">全国の治療院さんと作ったこだわりマクラ</p><p class="sc-product__price"><span class="sc-product__priceValue">13,200</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/goods/pillow">詳細はこちら</a></div></article>
  389.         <article class="sc-product"><a class="sc-product__imageLink" href="https://million-store.com/goods/tsuru-m"><img class="sc-product__img" src="{{ asset('assets/img/lineup/img_item_trM.jpg') }}" alt="快眠まくら 鶴の夢 M"></a><div class="sc-product__body"><h3 class="sc-product__name">快眠まくら 鶴の夢 M</h3><p class="sc-product__desc">高さ調節ができ、寝心地満点</p><p class="sc-product__price"><span class="sc-product__priceValue">6,600</span><span class="sc-product__priceUnit">円(税込)</span></p><a class="sc-product__button" href="https://million-store.com/goods/tsuru-m">詳細はこちら</a></div></article>
  390.       </div>
  391.     </section>
  393.     <section class="sc-quality">
  394.       <h2 class="sc-quality__title">安心・信頼のミリオン品質</h2>
  395.       <p class="sc-quality__text">厳選した素材と確かな技術で、皆さまの健康と美しさをサポートします。</p>
  396.     </section>
  398.     <div class="sc-cta">
  399.       <a class="sc-button" href="{{ url('product_list') }}">ご注文はこちら</a>
  400.     </div>
  402.     <section class="sc-notes">
  403.       <h2>キャンペーンについて</h2>
  404.       <ul>
  405.         <li>2026年7月31日までのキャンペーンです。</li>
  406.         <li>送料・消費税を除く商品代金に応じて適用されます。</li>
  407.         <li>ご購入金額にかかわらず送料770円(税込)、メール便330円(税込)がかかります。</li>
  408.         <li>北海道1,320円(税込)、沖縄・離島1,650円(税込)です。</li>
  409.         <li>代金引換の場合は、代引き手数料330円(税込)が別途かかります。</li>
  410.         <li>2025年6月1日よりギフト包装・のし代金を有料(各110円税込)とさせていただきます。</li>
  411.       </ul>
  412.     </section>
  413.   </div>
  415. {% endblock %}