/** Shopify CDN: Minification failed

Line 212:19 Unexpected "*"
Line 218:19 Unexpected "*"

**/
/* ============================================================
   ONE EDITION — Custom CSS for Dawn Theme
   File: assets/custom.css
   ============================================================
   このファイルを Shopify管理画面 > テーマ > コード編集 >
   assets フォルダにアップロードしてください。
   ============================================================ */

/* ===== GOOGLE FONTS ===== */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,400;9..40,500&family=Noto+Sans+JP:wght@400;500&display=swap');

/* ===== DESIGN TOKENS (CSS Custom Properties) ===== */
:root {
  --oe-bg: #F4F3F0;
  --oe-surface: #FFFFFF;
  --oe-ink: #1A1A1A;
  --oe-ink-mid: #555550;
  --oe-ink-light: #999994;
  --oe-accent: #CC4A2E;
  --oe-border: #E0DEDA;
  --oe-dark: #111111;
  --oe-cream: #EDEAE4;
  --oe-font: 'DM Sans', 'Noto Sans JP', -apple-system, sans-serif;
  --oe-radius: 4px;
  --oe-ease: 0.4s cubic-bezier(0.22, 1, 0.36, 1);
  --oe-max-w: 1400px;
  --oe-side: max(24px, calc((100vw - var(--oe-max-w)) / 2));
}

/* ===== GLOBAL OVERRIDES ===== */
body,
.shopify-section,
button,
input,
select,
textarea {
  font-family: var(--oe-font) !important;
  -webkit-font-smoothing: antialiased;
}

body {
  background-color: var(--oe-bg) !important;
  color: var(--oe-ink);
  line-height: 1.6;
}

/* Dawn テーマ変数上書き */
:root {
  --font-heading-family: 'DM Sans', 'Noto Sans JP', sans-serif;
  --font-body-family: 'DM Sans', 'Noto Sans JP', sans-serif;
  --font-heading-weight: 500;
  --font-body-weight: 400;
  --color-background: 244, 243, 240;
  --color-foreground: 26, 26, 26;
  --color-button: 26, 26, 26;
  --color-button-text: 255, 255, 255;
}

/* ===== TYPOGRAPHY ===== */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4 {
  font-family: var(--oe-font) !important;
  font-weight: 500 !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* 見出しのbold/italic混在を禁止 */
h1 *, h2 *, h3 *, h4 * {
  font-weight: inherit !important;
  font-style: normal !important;
}

p, li, span, a {
  font-family: var(--oe-font) !important;
}

/* ===== HEADER ===== */
/* ヘッダー外側のラッパー（白背景を消す） */
.section-header,
.header-wrapper {
  background: transparent !important;
  border-bottom: none !important;
}

/* ヘッダー本体（半透明ブラー） */
header.header {
  background: rgba(244, 243, 240, 0.82) !important;
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-bottom: none !important;
}

/* ロゴ */
.header__heading-link {
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase;
  color: var(--oe-ink) !important;
}

/* ナビゲーション */
.header__menu-item,
.header__menu-item span,
.list-menu__item--link {
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase;
  color: var(--oe-ink-mid) !important;
  transition: color var(--oe-ease);
}

.header__menu-item:hover,
.header__menu-item:hover span,
.list-menu__item--link:hover {
  color: var(--oe-ink) !important;
}

/* ヘッダーアイコン（カート等）— Dawn のデフォルトを崩さない */

/* ===== TOP ONLY: ダークヘッダー ===== */
/* oe-header-scroll.liquid が TOPページで body.oe-is-top を付与 */

/* ヘッダー背景を黒に */
body.oe-is-top .section-header {
  background: var(--oe-dark, #111) !important;
}
body.oe-is-top .header-wrapper {
  background: var(--oe-dark, #111) !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}
body.oe-is-top header.header {
  background: var(--oe-dark, #111) !important;
}

/* ロゴを白に（.h2 スパンも含む） */
body.oe-is-top .header__heading-link,
body.oe-is-top .header__heading-link .h2,
body.oe-is-top .header__heading-link span {
  color: #fff !important;
}

/* ナビリンクをはっきりした白に */
body.oe-is-top .header__menu-item,
body.oe-is-top .header__menu-item span,
body.oe-is-top .list-menu__item--link {
  color: rgba(255,255,255,0.85) !important;
}
body.oe-is-top .header__menu-item:hover,
body.oe-is-top .header__menu-item:hover span,
body.oe-is-top .list-menu__item--link:hover {
  color: #fff !important;
}

/* アイコン（検索・カート等）を白に */
body.oe-is-top .header__icon,
body.oe-is-top .header__icon svg {
  color: #fff !important;
}
body.oe-is-top .header__icon path,
body.oe-is-top .header__icon circle {
  stroke: #fff !important;
}
body.oe-is-top details[id^="Details-menu"] summary svg {
  color: #fff !important;
}

/* ===== BUTTONS ===== */
.button,
.shopify-payment-button__button,
button.button,
a.button {
  border-radius: 50px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase;
  font-family: var(--oe-font) !important;
  transition: all var(--oe-ease);
}

.button--primary {
  background-color: var(--oe-ink) !important;
  color: #fff !important;
}

.button--primary:hover {
  background-color: #333 !important;
}

.button--secondary {
  border: 1px solid var(--oe-ink) !important;
  background: transparent !important;
  color: var(--oe-ink) !important;
}

/* ===== SECTION UTILITIES ===== */
.page-width {
  max-width: var(--oe-max-w) !important;
  padding-left: 24px;
  padding-right: 24px;
}

.section-template--*,
.shopify-section {
  border: none !important;
}

/* セクション間のパディング */
.section-template--* + .section-template--* {
  margin-top: 0;
}

/* ===== SECTION LABELS (共通) ===== */
.oe-section-label {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--oe-ink-light);
  margin-bottom: 6px;
}

.oe-section-title {
  font-size: clamp(24px, 3.5vw, 40px);
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1.15;
  margin-bottom: 12px;
}

.oe-section-desc {
  font-size: 13px;
  font-weight: 400;
  color: var(--oe-ink-mid);
  line-height: 1.9;
  max-width: 380px;
}

.oe-section-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 48px;
}

.oe-link-more {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--oe-ink-light);
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: color var(--oe-ease);
  text-decoration: none;
}

.oe-link-more:hover {
  color: var(--oe-ink);
}

.oe-link-more svg {
  width: 12px;
  height: 12px;
}

/* ===== IMAGE BANNER (HERO) ===== */
.banner {
  min-height: calc(100svh - 52px);
}

.banner__content {
  bottom: 40px;
  left: 32px;
  text-align: left;
}

/* ===== FEATURED COLLECTION (PICK UP) ===== */
.collection-list,
.featured-collection {
  background: var(--oe-bg);
}

/* ===== PRODUCT CARD ===== */
.card-wrapper,
.product-card-wrapper {
  border-radius: var(--oe-radius);
  overflow: hidden;
}

.card__media,
.media--square {
  border-radius: var(--oe-radius);
}

/* アスペクト比 1:1（正方形サムネ）
   Dawn は --ratio-percent を商品画像の自然比率で設定するため
   card__inner.ratio も 100% に強制しないと高さがずれる */
.card__inner.ratio {
  --ratio-percent: 100% !important;
}

.card__media {
  padding-bottom: 100% !important;
  overflow: hidden !important;
}

/* .media ラッパーも正方形に収める */
.card__media .media {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

.card__media .media img,
.card__media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

.card__heading {
  font-size: 14px !important;
  font-weight: 500 !important;
}

/* ブランド名（vendor） */
.card__information .caption-with-letter-spacing {
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase;
  color: var(--oe-ink-light);
}

/* 価格 */
.price-item {
  font-size: 13px !important;
  font-weight: 500 !important;
}

/* カードホバー */
.card-wrapper:hover {
  transform: translateY(-2px);
  transition: transform var(--oe-ease);
}

/* ===== DARK SECTIONS ===== */
.oe-dark-section {
  background: var(--oe-dark) !important;
  color: #fff;
}

.oe-dark-section .oe-section-title {
  color: #fff;
}

.oe-dark-section .oe-section-desc {
  color: rgba(255, 255, 255, 0.35);
}

.oe-dark-section .oe-link-more {
  color: rgba(255, 255, 255, 0.35);
}

.oe-dark-section .oe-link-more:hover {
  color: #fff;
}

/* ===== HORIZONTAL SCROLL TRACK (共通) ===== */
.oe-scroll-track {
  display: flex;
  gap: 14px;
  overflow-x: auto;
  padding-bottom: 12px;
  scroll-snap-type: x mandatory;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.oe-scroll-track::-webkit-scrollbar {
  display: none;
}

/* ===== CAMERA SECTION (image-with-text) ===== */
.image-with-text {
  background: var(--oe-cream);
}

.image-with-text .grid {
  min-height: 90vh;
}

.image-with-text .image-with-text__media {
  grid-column: 1 / 4;
}

.image-with-text .image-with-text__content {
  padding: 72px 56px;
}

/* カメラスペック */
.oe-cam-specs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 36px;
}

.oe-cam-spec {
  padding: 12px 14px;
  background: rgba(0, 0, 0, 0.04);
  border-radius: var(--oe-radius);
}

.oe-cam-spec-label {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--oe-ink-light);
  margin-bottom: 1px;
}

.oe-cam-spec-value {
  font-size: 15px;
  font-weight: 500;
}

/* ===== PRODUCT PAGE (v3.2 — 45/55 Layout) ===== */

/*
 * Dawn の商品セクションを 45%（写真）/ 55%（情報+説明）の
 * 2カラムレイアウトに変更。右カラムに About / Film Details /
 * Shoot Ideas / Brand Story をインラインで表示する。
 */

/* Dawn product grid → 45/55 split */
.product {
  display: grid !important;
  grid-template-columns: 45% 1fr !important;
  column-gap: 48px !important;
  row-gap: 0 !important;
  max-width: var(--oe-max-w) !important;
  padding-bottom: 64px;
}

/* Dawn の grid__item に設定された max-width を上書き */
.product > .grid__item,
.product__media-wrapper,
.product__info-wrapper {
  max-width: 100% !important;
  width: 100% !important;
}

/* Left column: photo + sample teaser (teaser はJSでこの中に移動される) */
.product__media-wrapper {
  grid-column: 1 !important;
  grid-row: 1 !important;
  position: static !important;
  align-self: start !important;
  /* overflow:hidden は内側の .media に任せる（teaser がクリップされないように） */
}

/* Dawn が内部ギャラリーを sticky にするのを防止（スクロール重なり防止） */
.product__media-wrapper .product__column-sticky,
.product__media-wrapper media-gallery {
  position: static !important;
}

/* Right column */
.product__info-wrapper {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: start !important;
}

/* 内側のメディア要素に border-radius + overflow を適用 */
.product__media-wrapper .product__media-item .media {
  border-radius: var(--oe-radius);
}

/* Square product media (main image) — 1:1 固定, center crop */
.product__media-wrapper .media,
.product__media-wrapper .product__media,
.product__media-wrapper .product__media-item .media,
.product__media-wrapper .product-media-container {
  aspect-ratio: 1 / 1 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  overflow: hidden !important;
  /* Dawn の --ratio 変数によるサイズ変動を無効化 */
  width: 100% !important;
  max-width: 100% !important;
}

/* スライダーのアイテム自体も全幅に固定（PC・モバイル共通） */
.product__media-wrapper .product__media-item {
  width: 100% !important;
  max-width: 100% !important;
  flex-shrink: 0 !important;
  cursor: zoom-in;
}

/* Dawn のデフォルト拡大アイコン/ボタンのみ非表示（画像は残す） */
.product__modal-opener .product__media-icon,
.product__modal-opener .product__media-toggle,
.product__media-zoom {
  display: none !important;
}

/* modal-opener 自体はブロック表示を維持（中に画像がある） */
modal-opener.product__modal-opener,
.product__modal-opener {
  display: block !important;
  cursor: zoom-in !important;
}

/* Force cover fit regardless of Dawn's media-fit-contain setting */
.product__media-wrapper .media img,
.product__media-wrapper .product__media img,
.product__media-wrapper .product-media-container img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

/* Thumbnail gallery (desktop) */
.product__media-list--thumbnails {
  display: flex !important;
  gap: 6px;
  margin-top: 8px;
}

.product__media-list--thumbnails .product__media-item {
  flex: 1;
  aspect-ratio: 1;
  border-radius: 3px;
  overflow: hidden;
  cursor: pointer;
  border: 2px solid transparent;
  transition: border-color var(--oe-ease), opacity var(--oe-ease);
}

.product__media-list--thumbnails .product__media-item.is-active,
.product__media-list--thumbnails .product__media-item[aria-current="true"] {
  border-color: var(--oe-ink);
}

.product__media-list--thumbnails .product__media-item:hover {
  opacity: 0.8;
}

/* Right column: info + description */
.product__info-wrapper {
  position: static !important;
  padding-left: 0 !important;
}

/* --- Product title (h1): デザインカンプに合わせたスタイル --- */
.product__title h1,
h1.product__title,
.product__info-container h1 {
  font-size: 26px !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
  line-height: 1.3 !important;
  font-family: var(--oe-font) !important;
}

/* Brand / Vendor label (商品名の上) */
.product__text.caption-with-letter-spacing {
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--oe-ink-light) !important;
  margin-bottom: 6px !important;
}

/* 税込表示（「。」を非表示にする） */
.product__tax.caption {
  font-size: 11px !important;
  color: var(--oe-ink-light) !important;
  visibility: hidden;
  position: relative;
}

.product__tax.caption::after {
  content: '税込';
  visibility: visible;
  position: absolute;
  left: 0;
  top: 0;
}

/* 価格 */
.product__info-container .price-item--regular,
.product__info-container .price__regular .price-item {
  font-size: 24px !important;
  font-weight: 500 !important;
  font-family: var(--oe-font) !important;
}

/* "JPY" 通貨表示を非表示 */
.product__info-container .price-item--regular .money::after {
  content: none;
}

/* Add to Cart ボタン */
.product__info-container .product-form__submit {
  border-radius: 50px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  font-family: var(--oe-font) !important;
  max-width: 400px;
}

/* 送料表示 */
.product__info-container .shipping-note {
  font-size: 11px;
  color: var(--oe-ink-light);
}

/* --- Description blocks (oe-product-info snippet) --- */
.oe-pd-block {
  margin-bottom: 40px;
}

.oe-pd-heading {
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--oe-ink);
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--oe-border);
  font-family: var(--oe-font);
}

.oe-pd-body {
  font-size: 14px;
  color: var(--oe-ink-mid);
  line-height: 2.0;
  font-family: var(--oe-font);
}

/* Film Details spec rows */
.oe-pd-specs {
  margin: 0;
}

.oe-pd-spec-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 8px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  font-size: 14px;
}

.oe-pd-spec-row:last-child {
  border-bottom: none;
}

.oe-pd-spec-row dt {
  color: var(--oe-ink-light);
  font-weight: 400;
  font-size: 13px;
  min-width: 80px;
}

.oe-pd-spec-row dd {
  color: var(--oe-ink);
  font-weight: 500;
  text-align: right;
  font-size: 14px;
}

/* Cart note (under Add to Cart) */
.oe-pd-note {
  font-size: 11px;
  color: var(--oe-ink-light);
  line-height: 1.8;
  margin-bottom: 48px;
}

.oe-pd-note a {
  color: var(--oe-accent) !important;
}

/* --- Shipping banner (Pattern A — Refined) --- */
.oe-shipping-banner {
  border: 1px solid var(--oe-border);
  border-radius: 6px;
  padding: 12px 16px;
  margin-bottom: 32px;
  background: #faf9f7;
}

.oe-shipping-row {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  line-height: 1;
  font-family: var(--oe-font);
}

.oe-shipping-row + .oe-shipping-row {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid #eee;
}

.oe-shipping-icon {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  opacity: 0.35;
  display: flex;
  align-items: center;
  justify-content: center;
}

.oe-shipping-icon svg {
  width: 16px;
  height: 16px;
  display: block;
}

.oe-shipping-text {
  flex: 1;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}

.oe-shipping-text strong {
  font-weight: 500;
  color: var(--oe-ink-mid);
  font-size: 13px;
  line-height: 1;
}

.oe-shipping-free {
  display: inline-flex;
  align-items: center;
  background: var(--oe-cream);
  color: var(--oe-ink-mid);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.04em;
  padding: 3px 8px;
  border-radius: 3px;
  line-height: 1;
}

/* --- Sample teaser (moved into product grid via JS) --- */
.oe-sample-teaser-section {
  /* セクション自体は非表示（中身はJSで移動済み） */
}

.oe-st-content {
  margin-top: 20px;
}

.oe-st-divider {
  height: 1px;
  background: var(--oe-border);
  margin-bottom: 20px;
}

.oe-st-label {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--oe-ink-light);
  margin-bottom: 10px;
}

.oe-st-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-bottom: 10px;
}

.oe-st-photo {
  border-radius: var(--oe-radius);
  overflow: hidden;
  position: relative;
  cursor: pointer;
  transition: transform var(--oe-ease);
}

.oe-st-photo:hover {
  transform: translateY(-1px);
}

.oe-st-photo img {
  width: 100%;
  aspect-ratio: 3/4;
  object-fit: cover;
  display: block;
}

.oe-st-credit {
  position: absolute;
  bottom: 4px;
  right: 6px;
  font-size: 8px;
  color: rgba(255, 255, 255, 0.5);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
  pointer-events: none;
}

.oe-st-viewall {
  display: block;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--oe-ink-light);
  text-align: center;
  padding: 8px 0;
  text-decoration: none;
  transition: color var(--oe-ease);
}

.oe-st-viewall:hover {
  color: var(--oe-ink);
}

/* ===== BLOG / MAGAZINE ===== */
.blog-articles .article-card {
  border-radius: var(--oe-radius);
  overflow: hidden;
}

/* カテゴリフィルタ */
.oe-filter-tags {
  display: flex;
  gap: 8px;
  margin-bottom: 40px;
  flex-wrap: wrap;
}

.oe-filter-tag {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 6px 16px;
  border-radius: 50px;
  border: 1px solid var(--oe-border);
  color: var(--oe-ink-mid);
  text-decoration: none;
  transition: all var(--oe-ease);
}

.oe-filter-tag:hover,
.oe-filter-tag.active {
  background: var(--oe-ink);
  color: #fff;
  border-color: var(--oe-ink);
}

/* ===== POLICY PAGES (ポリシーページ共通) ===== */
.shopify-policy__container {
  padding-bottom: 80px !important;
}
@media (max-width: 749px) {
  .shopify-policy__container {
    padding-bottom: 56px !important;
  }
}

/* ===== BLOG ARTICLE (記事詳細ページ) ===== */

/* 本文エリア幅を 680px に制限（読みやすい1行35〜40文字） */
.article-template .page-width--narrow {
  max-width: 680px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 記事ヘッダー：タイトル周り */
.article-template header.page-width--narrow {
  display: flex !important;
  flex-direction: column !important;
  padding-top: 80px !important;
  padding-bottom: 0 !important;
  margin-bottom: 8px !important;
}
.article-template .article-template__title {
  font-size: 28px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  letter-spacing: 0.01em !important;
  margin-bottom: 0 !important;
}
.article-template .article-template__social-sharing {
  margin-top: 16px !important;
}

/* 日付 */
.article-template .article-template__date {
  font-size: 13px !important;
  color: var(--oe-ink-light, #9A9A9A) !important;
  letter-spacing: 0.02em !important;
  margin-bottom: 24px !important;
}

/* タイトル下ディバイダー */
.article-template .article-template__content {
  border-top: 1px solid var(--oe-border, #E0DEDA) !important;
  padding-top: 48px !important;
}

/* 本文テキスト */
.article-template .article-template__content.rte {
  font-size: 15px !important;
  line-height: 2 !important;
  letter-spacing: 0.02em !important;
  color: var(--oe-ink, #1A1A1A) !important;
}
.article-template .article-template__content.rte p {
  margin-bottom: 24px !important;
}
.article-template .article-template__content.rte p:last-child {
  margin-bottom: 0 !important;
}

/* 「ブログに戻る」リンク */
.article-template .article-template__back {
  max-width: 680px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-top: 64px !important;
}
.article-template .article-template__back a {
  font-size: 13px !important;
  color: var(--oe-ink-mid, #6B6B6B) !important;
  letter-spacing: 0.04em !important;
  transition: color var(--oe-ease) !important;
}
.article-template .article-template__back a:hover {
  color: var(--oe-ink, #1A1A1A) !important;
}


/* メタ行（タグ + 日付） — JS で挿入 */
.oe-article-meta {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  order: -1 !important;
  margin-bottom: 24px !important;
}
.oe-article-tag {
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--oe-accent, #CC4A2E) !important;
}
.oe-article-date {
  font-size: 13px !important;
  color: var(--oe-ink-light, #9A9A9A) !important;
  letter-spacing: 0.02em !important;
}
/* Dawn デフォルト日付の circle-divider リセット */
.article-template .circle-divider {
  display: block !important;
}

/* 署名エリア — JS で挿入 */
.oe-article-signature {
  margin-top: 56px !important;
  padding-top: 40px !important;
  border-top: 1px solid var(--oe-border, #E0DEDA) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
  color: var(--oe-ink-mid, #6B6B6B) !important;
  line-height: 1.8 !important;
}

/* モバイル調整 */
@media (max-width: 749px) {
  .article-template header.page-width--narrow {
    padding-top: 48px !important;
  }
  .article-template .article-template__title {
    font-size: 22px !important;
    margin-bottom: 0 !important;
  }
  .article-template .article-template__content {
    padding-top: 32px !important;
  }
  .article-template .article-template__content.rte {
    font-size: 14px !important;
  }
  .article-template .article-template__content.rte p {
    margin-bottom: 20px !important;
  }
  .article-template .article-template__back {
    padding-top: 48px !important;
  }
  .oe-article-signature {
    margin-top: 40px !important;
    padding-top: 32px !important;
  }
}

/* ===== ABOUT PAGE ===== */
/* テキスト+写真のスプリット */
.oe-about-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
  padding: 96px 0;
}

.oe-about-split.reverse {
  direction: rtl;
}

.oe-about-split.reverse > * {
  direction: ltr;
}

.oe-about-text h2 {
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.7;
  margin-bottom: 20px;
  text-transform: none;
}

.oe-about-text p {
  font-size: 14px;
  color: var(--oe-ink-mid);
  line-height: 2.1;
}

.oe-about-photo {
  aspect-ratio: 4/5;
  border-radius: var(--oe-radius);
  overflow: hidden;
}

.oe-about-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ===== HOW TO PAGE ===== */
/* TOC */
.oe-toc {
  padding: 48px 0;
  border-bottom: 1px solid var(--oe-border);
  margin-bottom: 64px;
}

.oe-toc-label {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--oe-ink-light);
  margin-bottom: 16px;
}

.oe-toc-list {
  list-style: none;
  padding: 0;
}

.oe-toc-list li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 0;
  border-bottom: 1px solid var(--oe-border);
  font-size: 14px;
  color: var(--oe-ink-mid);
  text-decoration: none;
  transition: color var(--oe-ease);
}

.oe-toc-list li:first-child a {
  border-top: 1px solid var(--oe-border);
}

.oe-toc-list li a:hover {
  color: var(--oe-ink);
}

.oe-toc-list li a .num {
  font-size: 11px;
  color: var(--oe-ink-light);
  letter-spacing: 0.06em;
}

/* コンテンツ2カラム */
.oe-content-inner {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 64px;
}

.oe-content-label {
  position: sticky;
  top: 80px;
  align-self: start;
}

.oe-content-label .num {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--oe-ink-light);
  margin-bottom: 4px;
}

.oe-content-label h2 {
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.03em;
  text-transform: none;
}

/* コールアウト */
.oe-callout {
  background: var(--oe-cream);
  border-radius: var(--oe-radius);
  padding: 24px;
  margin: 24px 0;
}

.oe-callout-label {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--oe-accent);
  margin-bottom: 8px;
}

.oe-callout p {
  font-size: 13px;
  color: var(--oe-ink-mid);
  line-height: 1.9;
}

/* Labs CTA block */
.oe-labs-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24px;
  background: var(--oe-dark);
  border-radius: var(--oe-radius);
  color: #fff;
  margin: 32px 0;
}

.oe-labs-cta h4 {
  font-size: 15px;
  font-weight: 500;
  margin-bottom: 4px;
  text-transform: none;
}

.oe-labs-cta p {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.45);
  margin: 0;
}

/* ゴーストボタン */
.oe-btn-ghost {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 11px 24px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: #fff;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: 50px;
  text-decoration: none;
  transition: all var(--oe-ease);
  white-space: nowrap;
}

.oe-btn-ghost:hover {
  border-color: rgba(255, 255, 255, 0.5);
  background: rgba(255, 255, 255, 0.04);
  color: #fff;
}

/* Q&A */
.oe-qa-item {
  border-bottom: 1px solid var(--oe-border);
  padding: 18px 0;
}

.oe-qa-item:first-child {
  border-top: 1px solid var(--oe-border);
}

.oe-qa-q {
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 8px;
  display: flex;
  gap: 8px;
}

.oe-qa-q span {
  color: var(--oe-accent);
  flex-shrink: 0;
}

.oe-qa-a {
  font-size: 13px;
  color: var(--oe-ink-mid);
  line-height: 1.9;
  padding-left: 22px;
}

/* ===== LABS PAGE ===== */
.oe-lab-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.oe-lab-card {
  background: var(--oe-surface);
  border-radius: var(--oe-radius);
  overflow: hidden;
  transition: transform var(--oe-ease);
}

.oe-lab-card:hover {
  transform: translateY(-2px);
}

.oe-lab-card-img {
  aspect-ratio: 16/10;
  overflow: hidden;
}

.oe-lab-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.oe-lab-card-body {
  padding: 20px;
}

.oe-lab-card-name {
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 4px;
}

.oe-lab-card-area {
  font-size: 12px;
  color: var(--oe-ink-mid);
  margin-bottom: 10px;
}

.oe-lab-card-tags {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}

.oe-lab-tag {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.06em;
  padding: 3px 8px;
  border-radius: 2px;
  border: 1px solid var(--oe-border);
  color: var(--oe-ink-mid);
}

/* ===== STATEMENT / BLOCKQUOTE ===== */
.oe-statement {
  padding: 96px 0;
  text-align: center;
}

.oe-statement blockquote {
  font-size: clamp(20px, 3vw, 32px);
  font-weight: 400;
  line-height: 1.8;
  max-width: 680px;
  margin: 0 auto;
  color: var(--oe-ink-mid);
  border: none;
  padding: 0;
}

/* ===== RELATED FILM (Dawn product-recommendations セクション) ===== */
/*
 * テーマエディタ → 商品ページ → 「おすすめ商品」セクションを有効にすると
 * Dawn が自動で表示する。以下はそのスタイル上書き。
 */
.product-recommendations .section-header__title,
.product-recommendations h2 {
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-family: var(--oe-font) !important;
  color: var(--oe-ink) !important;
  margin-bottom: 24px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid var(--oe-border) !important;
}

.product-recommendations .card__media {
  padding-bottom: 100% !important;
  overflow: hidden !important;
}

.product-recommendations .card__media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

/* ===== LIGHTBOX (写真モーダル) ===== */
.oe-lightbox-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(0, 0, 0, 0.92);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  cursor: zoom-out;
}

.oe-lightbox-overlay.is-active {
  opacity: 1;
  visibility: visible;
}

.oe-lightbox-overlay img {
  position: relative;
  z-index: 10000;
  max-width: 90vw;
  max-height: 88vh;
  object-fit: contain;
  border-radius: 4px;
  box-shadow: 0 16px 64px rgba(0, 0, 0, 0.4);
  transform: scale(0.95);
  transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.oe-lightbox-overlay.is-active img {
  transform: scale(1);
}

.oe-lightbox-close {
  position: absolute;
  top: 20px;
  right: 24px;
  z-index: 10001;
  width: 40px;
  height: 40px;
  background: none;
  border: none;
  color: rgba(255, 255, 255, 0.6);
  font-size: 28px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.2s;
}

.oe-lightbox-close:hover {
  color: #fff;
}

.oe-lightbox-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10001;
  width: 48px;
  height: 48px;
  background: rgba(0, 0, 0, 0.45);
  border: none;
  border-radius: 50%;
  color: rgba(255, 255, 255, 0.9);
  font-size: 24px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s, color 0.2s;
  -webkit-tap-highlight-color: transparent;
}

.oe-lightbox-nav:hover {
  background: rgba(0, 0, 0, 0.65);
  color: #fff;
}

.oe-lightbox-prev { left: 12px; }
.oe-lightbox-next { right: 12px; }

/* モバイル：矢印を画像に重ねて確実に表示 */
@media (max-width: 749px) {
  .oe-lightbox-nav {
    width: 40px;
    height: 40px;
    font-size: 22px;
    background: rgba(0, 0, 0, 0.55);
  }
  .oe-lightbox-prev { left: 8px; }
  .oe-lightbox-next { right: 8px; }
}

.oe-lightbox-counter {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.4);
  font-family: var(--oe-font);
}

/* クリック可能な写真のカーソル */
.oe-st-photo,
.oe-sg-item__media {
  cursor: zoom-in;
}

/* ===== FOOTER ===== */
.footer,
.section-footer {
  background: var(--oe-dark) !important;
  color: rgba(255, 255, 255, 0.55) !important;
}

.footer .footer__content-top {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 36px;
}

.footer .footer-block__heading {
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.85) !important;
}

.footer a {
  font-size: 12px !important;
  color: rgba(255, 255, 255, 0.6) !important;
  transition: color var(--oe-ease);
}

.footer a:hover {
  color: #fff !important;
}

.footer .footer__content-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  font-size: 10px;
}

/* ===== RESPONSIVE ===== */

/* Tablet */
@media (max-width: 1024px) {
  /* Product page: 42/58 on tablet */
  .product {
    grid-template-columns: 42% 1fr !important;
    column-gap: 32px !important;
  }

  /* Sample teaser: JS移動のため旧gridは不要 */

  .oe-about-split,
  .oe-about-split.reverse {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .oe-about-split.reverse {
    direction: ltr;
  }

  .oe-about-photo {
    aspect-ratio: 16/9;
  }

  .oe-content-inner {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .oe-content-label {
    position: static;
  }

  .oe-lab-grid {
    grid-template-columns: 1fr;
  }

  .oe-cam-specs {
    grid-template-columns: 1fr;
  }
}

/* Mobile */
@media (max-width: 768px) {
  /* Product page: single column on mobile */
  .product {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto !important;
    column-gap: 0 !important;
    row-gap: 24px !important;
  }

  .product__media-wrapper {
    position: static !important;
    grid-column: 1 !important;
    grid-row: auto !important;
    order: 1 !important;
  }

  /* teaser は media-wrapper の中にあるので order 不要 */

  .product__info-wrapper {
    grid-column: 1 !important;
    grid-row: auto !important;
    order: 2 !important;
  }

  /* Mobile media: 正方形 + cover（PCと同じトリミング） */
  .product__media-wrapper .media,
  .product__media-wrapper .product__media,
  .product__media-wrapper .product__media-item .media,
  .product__media-wrapper .product-media-container {
    aspect-ratio: 1 / 1 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    overflow: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .product__media-wrapper .media img,
  .product__media-wrapper .product__media img,
  .product__media-wrapper .product-media-container img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  /* Hide desktop thumbnails, show slide dots */
  .product__media-list--thumbnails {
    display: none !important;
  }

  /* Slide dots (Dawn's slider pagination) */
  .product__media-wrapper .slider-counter {
    display: flex !important;
    justify-content: center;
    gap: 6px;
  }

  /* Sample teaser on mobile (moved into product grid via JS) */
  .oe-st-content {
    margin-top: 16px;
  }

  .oe-st-grid {
    grid-template-columns: 1fr 1fr;
    gap: 4px;
  }

  .oe-st-photo img {
    aspect-ratio: 1 !important;
  }

  /* Description blocks tighter spacing */
  .oe-pd-block {
    margin-bottom: 32px;
  }

  .page-width {
    padding-left: 18px;
    padding-right: 18px;
  }

  .oe-section-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .oe-about-split {
    padding: 64px 0;
  }

  .oe-labs-cta {
    flex-direction: column;
    gap: 16px;
    text-align: center;
  }
}

/* ===== PRODUCT DESCRIPTION — Refined Styling ===== */
/* oe-product-info-general.liquid が .oe-desc-styled を付与 */

.oe-desc-styled {
  font-family: var(--oe-font);
  font-size: 14px;
  line-height: 2.0;
  color: var(--oe-ink-mid);
}

/* 最上位見出し (h1 / .oe-desc-h1) — 【】ブラケット見出し */
.oe-desc-styled .oe-desc-h1 {
  font-family: var(--oe-font);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.08em;
  color: var(--oe-ink);
  margin: 56px 0 20px;
  padding: 14px 0;
  border-top: 1px solid var(--oe-ink);
  border-bottom: 1px solid var(--oe-ink);
  text-align: center;
  text-decoration: none;
}

.oe-desc-styled .oe-desc-h1 strong,
.oe-desc-styled .oe-desc-h1 u {
  font-weight: 500;
  text-decoration: none;
}

.oe-desc-styled .oe-desc-h1:first-child {
  margin-top: 0;
}

/* h1 直後の h2 は間を詰める */
.oe-desc-styled .oe-desc-h1 + .oe-desc-h2,
.oe-desc-styled .oe-desc-h1 + h2 {
  margin-top: 24px;
}

/* h1 直後の h3 も間を詰める */
.oe-desc-styled .oe-desc-h1 + .oe-desc-h3,
.oe-desc-styled .oe-desc-h1 + h3 {
  margin-top: 16px;
}

/* h1 直後の p は間を詰める */
.oe-desc-styled .oe-desc-h1 + p {
  margin-top: 4px;
}

/* 大見出し (h2 / .oe-desc-h2) — セクション区切り */
.oe-desc-styled h2,
.oe-desc-styled .oe-desc-h2 {
  font-family: var(--oe-font);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--oe-ink);
  margin: 48px 0 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--oe-border);
  text-decoration: none;
}

.oe-desc-styled .oe-desc-h2 strong,
.oe-desc-styled .oe-desc-h2 u {
  font-weight: 500;
  text-decoration: none;
}

/* 最初の大見出しは上マージンを詰める */
.oe-desc-styled h2:first-child,
.oe-desc-styled .oe-desc-h2:first-child {
  margin-top: 0;
}

/* 中見出し (h3 / .oe-desc-h3) — 特徴名 */
.oe-desc-styled h3,
.oe-desc-styled .oe-desc-h3 {
  font-family: var(--oe-font);
  font-size: 13px;
  font-weight: 500;
  color: var(--oe-ink);
  margin: 28px 0 8px;
  letter-spacing: 0.04em;
  text-decoration: none;
}

.oe-desc-styled .oe-desc-h3 strong {
  font-weight: 500;
}

/* 中見出しが大見出しの直後の場合は間を詰める */
.oe-desc-styled h2 + h3,
.oe-desc-styled .oe-desc-h2 + .oe-desc-h3 {
  margin-top: 16px;
}

/* 段落 */
.oe-desc-styled p {
  margin: 0 0 16px;
  font-size: 14px;
  line-height: 2.0;
  color: var(--oe-ink-mid);
}

/* リスト */
.oe-desc-styled ul,
.oe-desc-styled ol {
  margin: 0 0 20px;
  padding-left: 20px;
}

.oe-desc-styled li {
  font-size: 13px;
  line-height: 2.0;
  color: var(--oe-ink-mid);
  margin-bottom: 2px;
}

.oe-desc-styled li::marker {
  color: var(--oe-ink-light);
  font-size: 10px;
}

/* bold テキスト */
.oe-desc-styled strong,
.oe-desc-styled b {
  font-weight: 500;
  color: var(--oe-ink);
}

/* リンク */
.oe-desc-styled a {
  color: var(--oe-accent);
  text-decoration: none;
}

.oe-desc-styled a:hover {
  text-decoration: underline;
}

/* 区切り線 */
.oe-desc-styled hr {
  border: none;
  border-top: 1px solid var(--oe-border);
  margin: 32px 0;
}

/* モバイル微調整 */
@media (max-width: 749px) {
  .oe-desc-styled .oe-desc-h1 {
    font-size: 14px;
    margin: 40px 0 16px;
    padding: 12px 0;
  }
  .oe-desc-styled h2 {
    margin: 36px 0 12px;
  }
  .oe-desc-styled h3 {
    margin: 24px 0 6px;
  }
}