{"title":"ユニフォームTシャツ特集","description":"\u003c!-- =========================================================================\n  Ninety-nine ｜ ユニフォームTシャツ特集ページ テンプレート\n  ---------------------------------------------------------------------------\n  ■ 使い方（Shopify）\n    方法A（推奨）: テーマに page.uniform-tee.liquid を新規作成し、下記\n      \u003csection class=\"nn-special\"\u003e 〜 \u003c\/section\u003e を丸ごと貼付。\n      管理画面 → ページを追加 → テンプレートに「uniform-tee」を選択。\n    方法B（手軽）: 管理画面 → オンラインストア → ページ → ページを追加 →\n      本文右上の「\u003c \u003e（HTMLを表示）」に切替え、下記を貼付。\n      ※CSSはすべて .nn-special 配下にスコープ済みなので既存テーマと干渉しません。\n\n  ■ 差し替え箇所\n    ・色味 → 下の :root の変数を書き換えるだけで全体に反映\n    ・テキスト → 「▼テキスト」と書かれたコメントの直後\n    ・画像 → 「▼画像」と書かれたコメント直後の nn-ph の div を、\n             img タグ（src にShopifyの画像URL）に置き換え\n    ・商品リンク → href=\"#\" を各商品ページのURLに変更\n  ========================================================================= --\u003e\n\n\u003cstyle\u003e\n\/* ====== 色味：ここだけ変えれば全体の色が変わります ====== *\/\n.nn-special{\n  \/* ===== B案：硬派ブラック ===== *\/\n  --nn-bg:        #111110;   \/* 背景（ブラック） *\/\n  --nn-ink:       #ece9e1;   \/* 文字（オフホワイト） *\/\n  --nn-sub:       #9c988c;   \/* サブ文字（グレー） *\/\n  --nn-accent:    #ff4d2e;   \/* アクセント（差し色） *\/\n  --nn-on-accent: #111110;   \/* アクセントの上に載る文字色 *\/\n  --nn-line:      #2a2926;   \/* 罫線 *\/\n  --nn-card:      #1a1a17;   \/* カード背景 *\/\n  --nn-ph:        #26241d;   \/* 画像プレースホルダ *\/\n\n  --nn-maxw: 1120px;\n  --nn-gap: clamp(16px, 4vw, 40px);\n\n  \/* フォントはShopifyテーマの設定を自動で継承（テーマ変数→無ければ親から継承） *\/\n  font-family: var(--font-body-family, inherit);\n  color: var(--nn-ink);\n  background: var(--nn-bg);\n  display: block;\n  line-height: 1.75;\n  -webkit-font-smoothing: antialiased;\n}\n\n\/* ====== 基本 ====== *\/\n.nn-special *{ box-sizing: border-box; }\n.nn-special img{ display:block; width:100%; height:100%; object-fit:cover; }\n.nn-special a{ color: inherit; text-decoration: none; }\n.nn-wrap{ max-width: var(--nn-maxw); margin-inline:auto; padding-inline: clamp(16px,5vw,32px); }\n\n\/* 画像プレースホルダ（本番では \u003cimg\u003e に差し替え） *\/\n.nn-ph{\n  background: var(--nn-ph);\n  color: var(--nn-sub);\n  display:flex; align-items:center; justify-content:center;\n  font-size:12px; letter-spacing:.08em; text-align:center;\n  width:100%; height:100%;\n}\n\n\/* eyebrow（小見出しラベル） *\/\n.nn-eyebrow{\n  font-size:12px; letter-spacing:.28em; text-transform:uppercase;\n  color: var(--nn-accent); font-weight:700; margin:0 0 14px;\n}\n\n\/* ====== HERO ====== *\/\n.nn-hero{ position:relative; background:#111110; color:#fff; overflow:hidden; }\n.nn-hero__media{ position:absolute; inset:0; }\n.nn-hero__media .nn-ph{ background:#26241d; color:#8a877c; height:100%; }\n.nn-hero__inner{\n  position:relative; z-index:2;\n  min-height: min(78vh, 680px);\n  display:flex; flex-direction:column; justify-content:flex-end;\n  padding: clamp(28px,6vw,72px) clamp(16px,5vw,64px) clamp(28px,5vw,56px);\n  max-width: var(--nn-maxw); margin-inline:auto;\n  background: linear-gradient(to top, rgba(0,0,0,.55) 0%, rgba(0,0,0,.15) 45%, rgba(0,0,0,0) 75%);\n}\n.nn-hero__eyebrow{ color:#fff; opacity:.85; margin-bottom:18px; }\n.nn-hero__title{\n  font-size: clamp(34px, 8vw, 82px);\n  line-height: 1.02; font-weight: 800; letter-spacing:.01em; margin:0;\n}\n.nn-hero__title small{ display:block; font-size:.34em; font-weight:600; letter-spacing:.06em; opacity:.9; margin-top:14px; }\n.nn-hero__lead{ margin:20px 0 0; max-width: 620px; font-size: clamp(14px,1.6vw,16px); opacity:.92; }\n\n\/* ====== CONCEPT ====== *\/\n.nn-concept{ padding: clamp(56px,9vw,110px) 0; text-align:center; }\n.nn-concept__mark{ font-size:12px; letter-spacing:.3em; color:var(--nn-accent); font-weight:700; margin-bottom:24px; }\n.nn-concept__copy{\n  font-size: clamp(19px,3vw,30px); line-height:1.9; font-weight:600;\n  max-width: 720px; margin:0 auto;\n}\n.nn-concept__body{ margin: 28px auto 0; max-width: 560px; color: var(--nn-sub); font-size:15px; }\n\n\/* ====== INDEX \/ TOPICS グリッド ====== *\/\n.nn-section-head{ display:flex; align-items:baseline; justify-content:space-between; gap:20px; margin-bottom: clamp(24px,4vw,40px); border-top:1px solid var(--nn-line); padding-top:22px; }\n.nn-section-head h2{ font-size: clamp(22px,3.4vw,32px); margin:0; font-weight:800; letter-spacing:.02em; }\n.nn-section-head .nn-en{ font-size:12px; letter-spacing:.24em; color:var(--nn-sub); text-transform:uppercase; }\n\n.nn-topics{ padding-bottom: clamp(48px,8vw,90px); }\n.nn-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: var(--nn-gap); }\n.nn-grid--2{ grid-template-columns: repeat(2, 1fr); }\n.nn-visual{ padding: 0 0 clamp(48px,8vw,90px); }\n.nn-visual__media{ aspect-ratio: 4\/3; overflow:hidden; }\n.nn-card{ background:var(--nn-card); border:1px solid var(--nn-line); overflow:hidden; transition: transform .35s ease, box-shadow .35s ease; }\n.nn-card:hover{ transform: translateY(-6px); box-shadow: 0 18px 40px -24px rgba(0,0,0,.45); }\n.nn-card__media{ aspect-ratio: 4\/5; overflow:hidden; }\n.nn-card__media .nn-ph{ transition: transform .6s ease; }\n.nn-card:hover .nn-card__media .nn-ph, .nn-card:hover .nn-card__media img{ transform: scale(1.05); }\n.nn-card__body{ padding: 20px 20px 26px; }\n.nn-card__no{ font-size:12px; letter-spacing:.18em; color:var(--nn-accent); font-weight:700; }\n.nn-card__title{ font-size: clamp(16px,2vw,19px); font-weight:700; margin:10px 0 8px; line-height:1.5; }\n.nn-card__text{ font-size:13.5px; color:var(--nn-sub); margin:0; }\n\n\/* ====== ビジュアル（横長 4:3）は下部の .nn-visual を参照 ====== *\/\n\n\/* ====== 商品ラインナップ ====== *\/\n.nn-lineup{ padding: clamp(56px,9vw,110px) 0; }\n.nn-products{ display:grid; grid-template-columns: repeat(4, 1fr); gap: var(--nn-gap); }\n.nn-product{ display:block; }\n.nn-product__media{ aspect-ratio: 3\/4; overflow:hidden; background:var(--nn-ph); position:relative; }\n.nn-product__media .nn-ph, .nn-product__media img{ transition: transform .6s ease; }\n.nn-product:hover .nn-product__media .nn-ph, .nn-product:hover .nn-product__media img{ transform: scale(1.05); }\n.nn-product__badge{ position:absolute; top:12px; left:12px; background:var(--nn-accent); color:var(--nn-on-accent); font-size:11px; letter-spacing:.1em; padding:5px 10px; z-index:2; }\n.nn-product__name{ font-size:14px; font-weight:700; margin:14px 0 4px; }\n.nn-product__price{ font-size:14px; color:var(--nn-ink); }\n.nn-product__price span{ color:var(--nn-sub); font-size:12px; margin-left:6px; }\n\n\/* ====== 受注生産の帯（差別化メッセージ） ====== *\/\n.nn-note{ background:var(--nn-card); color:var(--nn-ink); border-block:1px solid var(--nn-line); }\n.nn-note__inner{ display:grid; grid-template-columns: repeat(3,1fr); gap: clamp(20px,4vw,40px); padding: clamp(40px,7vw,72px) 0; }\n.nn-note__item h3{ font-size:16px; font-weight:700; margin:0 0 10px; }\n.nn-note__item h3::before{ content:\"\"; display:block; width:26px; height:2px; background:var(--nn-accent); margin-bottom:14px; }\n.nn-note__item p{ margin:0; font-size:13.5px; color:var(--nn-sub); }\n\n\/* ====== CTA ====== *\/\n.nn-cta{ text-align:center; padding: clamp(64px,10vw,120px) 0; }\n.nn-cta h2{ font-size: clamp(24px,4vw,40px); font-weight:800; margin:0 0 14px; }\n.nn-cta p{ color:var(--nn-sub); margin:0 auto 32px; max-width:480px; }\n.nn-btn{\n  display:inline-block; background:var(--nn-accent); color:var(--nn-on-accent);\n  font-weight:700; letter-spacing:.06em; font-size:15px;\n  padding:16px 44px; border:1px solid var(--nn-accent);\n  transition: background .25s ease, color .25s ease;\n}\n.nn-btn:hover{ background:transparent; color:var(--nn-accent); }\n\n\/* ====== レスポンシブ ====== *\/\n@media (max-width: 860px){\n  .nn-grid{ grid-template-columns: repeat(2, 1fr); }\n  .nn-products{ grid-template-columns: repeat(2, 1fr); }\n  .nn-note__inner{ grid-template-columns: 1fr; gap:28px; }\n}\n@media (max-width: 520px){\n  .nn-grid{ grid-template-columns: 1fr; }\n  .nn-section-head{ flex-direction:column; align-items:flex-start; gap:6px; }\n}\n@media (prefers-reduced-motion: reduce){\n  .nn-special *{ transition:none !important; }\n}\n\u003c\/style\u003e\n\n\n\u003c!-- ======================= ここから本体 ======================= --\u003e\n\u003csection class=\"nn-special\"\u003e\n\n  \u003c!-- ============ HERO ============ --\u003e\n  \u003cheader class=\"nn-hero\"\u003e\n    \u003cdiv class=\"nn-hero__media\"\u003e\n      \u003c!-- ▼画像：キービジュアル。理想は横長のKVですが、暫定で商品画像を使用（object-fitで中央表示）。差し替え可 --\u003e\n      \u003cimg src=\"https:\/\/99ninety-nine.com\/cdn\/shop\/files\/Horse_Crest_Football_Shirt6.png?v=1783222092\u0026amp;width=1600\" alt=\"\" style=\"object-position:center 35%;\"\u003e\n    \u003c\/div\u003e\n    \u003cdiv class=\"nn-hero__inner\"\u003e\n      \u003c!-- ▼テキスト --\u003e\n      \u003cp class=\"nn-eyebrow nn-hero__eyebrow\"\u003eSpecial Feature ／ Uniform Tee\u003c\/p\u003e\n      \u003ch1 class=\"nn-hero__title\"\u003eユニフォームT特集\u003c\/h1\u003e\n    \u003c\/div\u003e\n  \u003c\/header\u003e\n\n  \u003c!-- ============ CONCEPT ============ --\u003e\n  \u003cdiv class=\"nn-concept nn-wrap\"\u003e\n    \u003c!-- ▼テキスト --\u003e\n    \u003cdiv class=\"nn-concept__mark\"\u003eCONCEPT\u003c\/div\u003e\n    \u003cp class=\"nn-concept__copy\"\u003e\n      ワールドカップシーズンである今年の夏のマストアイテム。\n    \u003c\/p\u003e\n    \u003cp class=\"nn-concept__body\"\u003e\n      サッカーのユニフォームを彷彿とさせるデザインが目をひくポイントに。\n    \u003c\/p\u003e\n  \u003c\/div\u003e\n\n  \u003c!-- ============ INDEX \/ TOPICS ============ --\u003e\n  \u003cdiv class=\"nn-topics nn-wrap\"\u003e\n    \u003cdiv class=\"nn-section-head\"\u003e\n      \u003ch2\u003ePick Up Items\u003c\/h2\u003e\n    \u003c\/div\u003e\n\n    \u003cdiv class=\"nn-grid nn-grid--2\"\u003e\n      \u003c!-- ピック1 ／ リンク：Horse Crest Football Shirt --\u003e\n      \u003ca href=\"https:\/\/99ninety-nine.com\/products\/six-star-graphic-%E3%82%B3%E3%83%94%E3%83%BC-1?utm_source=copyToPasteBoard\u0026amp;utm_medium=product-links\u0026amp;utm_content=web\" class=\"nn-card\"\u003e\n        \u003cdiv class=\"nn-card__media\"\u003e\n          \u003cimg src=\"https:\/\/99ninety-nine.com\/cdn\/shop\/files\/8Horse_Crest_Football_Shirt.png?v=1783222288\u0026amp;width=800\" alt=\"Horse Crest Football Shirt\"\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"nn-card__body\"\u003e\n          \u003cdiv class=\"nn-card__no\"\u003ePICK 01\u003c\/div\u003e\n          \u003ch3 class=\"nn-card__title\"\u003eHorse Crest Football Shirt\u003c\/h3\u003e\n          \u003cp class=\"nn-card__text\"\u003eフットボールシャツの意匠をそのままに。ワールドカップの熱をまとう、夏の主役級の一枚。\u003c\/p\u003e\n          \u003cp class=\"nn-product__price\" style=\"margin-top:10px;\"\u003e¥13,980 \u003cspan\u003e税込\u003c\/span\u003e\u003c\/p\u003e\n        \u003c\/div\u003e\n      \u003c\/a\u003e\n      \u003c!-- ピック2 ／ リンク：Eagle Crest Shirt --\u003e\n      \u003ca href=\"https:\/\/99ninety-nine.com\/products\/talephas-vintage-jersey-%E3%82%B3%E3%83%94%E3%83%BC?utm_source=copyToPasteBoard\u0026amp;utm_medium=product-links\u0026amp;utm_content=web\" class=\"nn-card\"\u003e\n        \u003cdiv class=\"nn-card__media\"\u003e\n          \u003cimg src=\"https:\/\/99ninety-nine.com\/cdn\/shop\/files\/9_f387074d-bced-420b-8891-61694692623f.png?v=1783568336\u0026amp;width=800\" alt=\"Eagle Crest Shirt\"\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"nn-card__body\"\u003e\n          \u003cdiv class=\"nn-card__no\"\u003ePICK 02\u003c\/div\u003e\n          \u003ch3 class=\"nn-card__title\"\u003eEagle Crest Shirt\u003c\/h3\u003e\n          \u003cp class=\"nn-card__text\"\u003eストライプ×イーグルの刺繍が主役。ゲームシャツ由来のデザインを夏の一枚に。\u003c\/p\u003e\n          \u003cp class=\"nn-product__price\" style=\"margin-top:10px;\"\u003e¥11,300 \u003cspan\u003e税込\u003c\/span\u003e\u003c\/p\u003e\n        \u003c\/div\u003e\n      \u003c\/a\u003e\n    \u003c\/div\u003e\n  \u003c\/div\u003e\n\n  \u003c!-- ============ ビジュアル（横長 4:3） ============ --\u003e\n  \u003cdiv class=\"nn-visual nn-wrap\"\u003e\n    \u003c!-- ▼画像：横長 4:3。暫定で商品画像を使用。差し替え可 --\u003e\n    \u003cdiv class=\"nn-visual__media\"\u003e\u003cimg src=\"https:\/\/99ninety-nine.com\/cdn\/shop\/files\/Horse_Crest_Football_Shirt7.png?v=1783222089\u0026amp;width=1400\" alt=\"Horse Crest Football Shirt\" style=\"object-position:center 30%;\"\u003e\u003c\/div\u003e\n  \u003c\/div\u003e\n\n  \u003c!-- ============ 商品ラインナップ ============ --\u003e\n  \u003cdiv class=\"nn-lineup nn-wrap\"\u003e\n    \u003cdiv class=\"nn-section-head\"\u003e\n      \u003ch2\u003eラインナップ\u003c\/h2\u003e\n      \u003cspan class=\"nn-en\"\u003eLine Up\u003c\/span\u003e\n    \u003c\/div\u003e\n\n    \u003cdiv class=\"nn-products\"\u003e\n      \u003c!-- 商品1 ／ Heritage Club Shirt --\u003e\n      \u003ca href=\"https:\/\/99ninety-nine.com\/products\/eagle-crest-shirt-%E3%82%B3%E3%83%94%E3%83%BC?utm_source=copyToPasteBoard\u0026amp;utm_medium=product-links\u0026amp;utm_content=web\" class=\"nn-product\"\u003e\n        \u003cdiv class=\"nn-product__media\"\u003e\n          \u003cspan class=\"nn-product__badge\"\u003eSELECT\u003c\/span\u003e\n          \u003cimg src=\"https:\/\/99ninety-nine.com\/cdn\/shop\/files\/Ninety-nine_96.png?v=1783059669\u0026amp;width=700\" alt=\"Heritage Club Shirt\"\u003e\n        \u003c\/div\u003e\n        \u003cp class=\"nn-product__name\"\u003eHeritage Club Shirt\u003c\/p\u003e\n        \u003cp class=\"nn-product__price\"\u003e¥9,800 \u003cspan\u003e税込\u003c\/span\u003e\u003c\/p\u003e\n      \u003c\/a\u003e\n      \u003c!-- 商品2 ／ Lamar Anthem Kit Short Sleeve --\u003e\n      \u003ca href=\"https:\/\/99ninety-nine.com\/products\/lamar-anthem-kit-short-tee?utm_source=copyToPasteBoard\u0026amp;utm_medium=product-links\u0026amp;utm_content=web\" class=\"nn-product\"\u003e\n        \u003cdiv class=\"nn-product__media\"\u003e\n          \u003cspan class=\"nn-product__badge\"\u003eSELECT\u003c\/span\u003e\n          \u003cimg src=\"https:\/\/99ninety-nine.com\/cdn\/shop\/files\/15_e71c6870-4005-4b39-8e18-7a50189682b0.png?v=1776323324\u0026amp;width=700\" alt=\"Lamar Anthem Kit Short Sleeve\"\u003e\n        \u003c\/div\u003e\n        \u003cp class=\"nn-product__name\"\u003eLamar Anthem Kit Short Sleeve\u003c\/p\u003e\n        \u003cp class=\"nn-product__price\"\u003e¥13,000 \u003cspan\u003e税込\u003c\/span\u003e\u003c\/p\u003e\n      \u003c\/a\u003e\n      \u003c!-- 商品3 ／ Horse Crest Football Shirt --\u003e\n      \u003ca href=\"https:\/\/99ninety-nine.com\/products\/six-star-graphic-%E3%82%B3%E3%83%94%E3%83%BC-1?utm_source=copyToPasteBoard\u0026amp;utm_medium=product-links\u0026amp;utm_content=web\" class=\"nn-product\"\u003e\n        \u003cdiv class=\"nn-product__media\"\u003e\n          \u003cspan class=\"nn-product__badge\"\u003eSELECT\u003c\/span\u003e\n          \u003cimg src=\"https:\/\/99ninety-nine.com\/cdn\/shop\/files\/8Horse_Crest_Football_Shirt.png?v=1783222288\u0026amp;width=700\" alt=\"Horse Crest Football Shirt\"\u003e\n        \u003c\/div\u003e\n        \u003cp class=\"nn-product__name\"\u003eHorse Crest Football Shirt\u003c\/p\u003e\n        \u003cp class=\"nn-product__price\"\u003e¥13,980 \u003cspan\u003e税込\u003c\/span\u003e\u003c\/p\u003e\n      \u003c\/a\u003e\n      \u003c!-- 商品4 ／ Eagle Crest Shirt --\u003e\n      \u003ca href=\"https:\/\/99ninety-nine.com\/products\/talephas-vintage-jersey-%E3%82%B3%E3%83%94%E3%83%BC?utm_source=copyToPasteBoard\u0026amp;utm_medium=product-links\u0026amp;utm_content=web\" class=\"nn-product\"\u003e\n        \u003cdiv class=\"nn-product__media\"\u003e\n          \u003cspan class=\"nn-product__badge\"\u003eSELECT\u003c\/span\u003e\n          \u003cimg src=\"https:\/\/99ninety-nine.com\/cdn\/shop\/files\/9_f387074d-bced-420b-8891-61694692623f.png?v=1783568336\u0026amp;width=700\" alt=\"Eagle Crest Shirt\"\u003e\n        \u003c\/div\u003e\n        \u003cp class=\"nn-product__name\"\u003eEagle Crest Shirt\u003c\/p\u003e\n        \u003cp class=\"nn-product__price\"\u003e¥11,300 \u003cspan\u003e税込\u003c\/span\u003e\u003c\/p\u003e\n      \u003c\/a\u003e\n    \u003c\/div\u003e\n  \u003c\/div\u003e\n\n  \u003c!-- ============ セレクト／受注手配の帯 ============ --\u003e\n  \u003cdiv class=\"nn-note\"\u003e\n    \u003cdiv class=\"nn-note__inner nn-wrap\"\u003e\n      \u003c!-- ▼テキスト --\u003e\n      \u003cdiv class=\"nn-note__item\"\u003e\n        \u003ch3\u003eオーダー後に手配\u003c\/h3\u003e\n        \u003cp\u003eご注文を受けてから海外の工場へ手配。在庫処分に巻き込まれない、今シーズンのセレクト。\u003c\/p\u003e\n      \u003c\/div\u003e\n      \u003cdiv class=\"nn-note__item\"\u003e\n        \u003ch3\u003e納期の目安\u003c\/h3\u003e\n        \u003cp\u003eご入金確認から7〜15営業日で発送（在庫がある場合は最短7日）。\u003c\/p\u003e\n      \u003c\/div\u003e\n      \u003cdiv class=\"nn-note__item\"\u003e\n        \u003ch3\u003eまとめ買いも\u003c\/h3\u003e\n        \u003cp\u003eチーム・サークル単位のまとめ買いも。夏のイベントにおそろいで。\u003c\/p\u003e\n      \u003c\/div\u003e\n    \u003c\/div\u003e\n  \u003c\/div\u003e\n\n  \u003c!-- ============ CTA ============ --\u003e\n  \u003cdiv class=\"nn-cta nn-wrap\"\u003e\n    \u003c!-- ▼テキスト --\u003e\n    \u003ch2\u003eこの夏の一枚を、手に入れよう。\u003c\/h2\u003e\n    \u003cp\u003e人気の“受注手配”アイテム。気になる型はお早めに。\u003c\/p\u003e\n    \u003c!-- ▼リンク：T-SHIRTコレクション --\u003e\n    \u003ca href=\"https:\/\/99ninety-nine.com\/collections\/t-shirt\" class=\"nn-btn\"\u003eT-SHIRT一覧を見る\u003c\/a\u003e\n  \u003c\/div\u003e\n\n\u003c\/section\u003e\n\u003c!-- ======================= 本体ここまで ======================= --\u003e","products":[],"url":"https:\/\/99ninety-nine.com\/collections\/%e3%83%a6%e3%83%8b%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0t%e3%82%b7%e3%83%a3%e3%83%84%e7%89%b9%e9%9b%86.oembed","provider":"Ninety-nine ","version":"1.0","type":"link"}