@charset "UTF-8";
/* =========================================================================
comura theme — main.css
- サイジング: vwスケーリング（PC基準1440 / SP基準750）をプレーンCSSで再現
PC: min( {px}px, calc({px} / 1440 * 100vw) ) … 1440で等倍・以下で縮小・以上で固定
SP: calc( {px} / 750 * 100vw ) … 〜767pxで適用
- タイポ: 和文=Shippori Mincho(明朝) / 欧文=EB Garamond(明朝に合わせたセリフ体)
- デザイン: 余白主体・写真主体・非対称エディトリアル配置
========================================================================= */
:root {
--bg: #EDF3EB; /* ページ背景（ヘッダー〜フッター全部統一。2026-07-07 #F3F6F1→#EDF3EB サイト全体で変更） */
--bg-soft: #EDF3EB; /* 帯・フッターも同色（背景は全面一色） */
--ink: #5A4A21; /* 見出し・ヘッダーナビ */
--ink-soft: #595426; /* 本文 */
--accent: #435B2C; /* テキストリンク（read more / contact / フッター） */
--line: #D9D6CC;
/* 和文=Shippori Mincho / 欧文=EB Garamond（明朝に合わせたセリフ体。Avenir/Nunito Sans/Crimson Proは廃止） */
--serif: "Shippori Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif; /* 和文 */
--sans: "EB Garamond", "Shippori Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif; /* 欧文（JPは明朝にフォールバック） */
/* デザインはほぼ全幅。左右は小さい余白のみ。画像は端まで見せる。 */
/* スケーリング: 1440基準のvw。1920まで拡大し、超えたら固定（両脇余白）。
＝ 各px上限は 1920換算値(=1440値×4/3)。max-width も 1920。 */
--container: 1920px;
--edge: min(61px, calc(46 / 1440 * 100vw));
--pad: var(--edge);
}
/* ---------- reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
margin: 0;
background: var(--bg);
color: var(--ink-soft);
font-family: var(--sans);
font-weight: 400;
font-size: 14px;
line-height: 2;
letter-spacing: .02em;
-webkit-font-smoothing: antialiased;
/* スティッキーフッター: コンテンツが短くてもフッターを画面下端に */
min-height: 100vh; display: flex; flex-direction: column;
}
.site-main { flex: 1 0 auto; } /* main が伸びてフッターを下へ押す */
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
h1, h2, h3 { margin: 0; color: var(--ink); font-weight: 400; }
p { margin: 0; }
/* container / full-bleed band */
.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--pad); }
/* 共通: 見出し・本文・read more */
.heading {
font-family: var(--serif);
font-weight: 400; color: var(--ink); line-height: 1.3;
letter-spacing: .04em;
font-size: min(30px, calc(30 / 1440 * 100vw + 8px));
margin-bottom: min(24px, calc(24 / 1440 * 100vw));
}
.lead { font-size: 13.5px; line-height: 2.1; margin-bottom: 26px; max-width: 30em; }
.readmore {
display: inline-block; font-size: 12px; letter-spacing: .16em; color: var(--accent);
padding-bottom: 3px; border-bottom: 1px solid currentColor;
}
/* read more のホバーは下線アニメのみ（薄くなるフェードは廃止） */
/* =========================================================================
Header
========================================================================= */
.site-header {
position: sticky; top: 0; z-index: 50;
background: var(--bg); /* 背景は全面一色（透過なし） */
}
.site-header__inner {
max-width: var(--container); margin-inline: auto;
height: min(160px, calc(120 / 1440 * 100vw)); padding: 0 min(93px, calc(70 / 1440 * 100vw));
display: flex; align-items: center; justify-content: space-between;
}
.site-logo { position: relative; top: min(13px, calc(10 / 1440 * 100vw)); } /* design比で中身を少し下げる */
.site-logo img { width: min(207px, calc(156 / 1440 * 100vw)); height: auto; }
/* ヘッダーナビ */
.global-nav { position: relative; top: min(13px, calc(10 / 1440 * 100vw)); display: flex; align-items: center; gap: min(50px, calc(38 / 1440 * 100vw)); font-size: min(24px, calc(18 / 1440 * 100vw)); font-weight: 500; letter-spacing: .02em; color: var(--ink); }
.lang-switch { white-space: nowrap; }
.global-nav__divider { color: var(--line); }
.global-nav__list { display: flex; align-items: center; gap: min(92px, calc(69 / 1440 * 100vw)); margin: 0; padding: 0; list-style: none; }
.global-nav__list a { transition: color .2s; }
.global-nav__list a:hover { color: var(--accent); }
/* product → sakura/India ドロップダウン（ホバー表示） */
.global-nav__list .menu-item-has-children { position: relative; }
/* 親(product)自体はリンク無効＝押せない。ホバーでサブメニューだけ出す */
.global-nav__list .menu-item-has-children > a { pointer-events: none; cursor: default; }
.global-nav__list .sub-menu {
position: absolute; top: 100%; left: 50%;
display: flex; flex-direction: column; align-items: center;
gap: min(20px, calc(15 / 1440 * 100vw));
margin: 0; padding: min(34px, calc(26 / 1440 * 100vw)) min(44px, calc(33 / 1440 * 100vw)) min(24px, calc(18 / 1440 * 100vw));
list-style: none; white-space: nowrap; background: var(--bg);
opacity: 0; visibility: hidden; transform: translateX(-50%) translateY(2px);
transition: opacity .35s ease, transform .35s ease; z-index: 60;
}
.global-nav__list .menu-item-has-children:hover .sub-menu,
.global-nav__list .menu-item-has-children:focus-within .sub-menu {
opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0);
}
/* サブメニュー(sakura/India)も通常メニューとフォント・字間を揃える */
.global-nav__list .sub-menu a { font-size: 1em; letter-spacing: .02em; color: var(--ink); }
/* トップへ戻るリンクはドロワー(SP)限定。PCナビには出さない（ロゴがhome動線） */
.global-nav__list .nav-home-drawer { display: none; }
.nav-toggle { display: none; border: 0; background: none; padding: 8px; cursor: pointer; }
.nav-toggle span { display: block; width: 24px; height: 1px; background: var(--ink); margin: 5px 0; transition: .3s; }
/* =========================================================================
Front page — Figma 1440原寸(1440×5133)の実測座標で絶対配置（vwスケール）
キャンバスはヘッダー(120px)直後から開始＝デザインy120-4920を表す(高さ4800)。
各要素のtopは (Figma_y - 120) / 4800、leftは Figma_x / 1440。フッターは別途。
========================================================================= */
.front-page { overflow-x: clip; }
.fp-canvas {
position: relative; width: 100%; max-width: 1920px;
margin-inline: auto; aspect-ratio: 1440 / 4800;
}
.fp-canvas .fp-img { position: absolute; object-fit: cover; z-index: 1; }
.fp-canvas .fp-text { position: absolute; z-index: 2; } /* テキストは画像より前面（Store等の重なりで隠れない） */
/* 画像（Figma実測 x,y,w,h） */
.fp-hero { left: 0; top: 0; width: 55.56%; height: 17.83%; } /* 0,120,800,856 */
.fp-accent { left: 67.22%; top: 15.50%; width: 32.78%; height: 7.75%; } /* 968,864,472,372 */
.fp-portrait { left: 10.83%; top: 21.50%; width: 30.28%; height: 12.08%; } /* 156,1152,436,580 */
.fp-sakura-img { left: 59.17%; top: 36.58%; width: 29.72%; height: 7.00%; } /* 852,1876,428,336 */
.fp-store-img { left: 57.64%; top: 74.08%; width: 38.75%; height: 7.75%; } /* 830,3676,558,372 */
.fp-closing-a { left: 8.61%; top: 80.92%; width: 23.89%; height: 9.00%; } /* 124,4004,344,432 */
.fp-closing-b { left: 42.22%; top: 86.58%; width: 27.22%; height: 8.08%; } /* 608,4276,392,388 */
/* テキスト（top-left アンカー / 実測左端・幅） */
.fp-concept-text { left: 43.89%; top: 29.54%; width: 47%; } /* x632, y1538 */
.fp-sakura-text { left: 10.14%; top: 39.39%; width: 49.7%; } /* x146, heading y2019。右端を画像に半文字食い込ませる */
.fp-gallery-text { left: 9.93%; top: 68.58%; width: 47%; } /* x143, y3412 */
.fp-store-text { left: 24.17%; top: 77.81%; width: 47%; } /* x348, y3855 (右インデント) */
/* feature（全幅フルブリード） */
.fp-feature { position: absolute; left: 0; top: 47.08%; width: 100%; height: 20.00%; } /* 0,2380,1440,960 */
.fp-feature-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.feature__arrow {
position: absolute; top: 50%; transform: translateY(-50%);
background: none; border: 0; cursor: pointer; color: #fff; opacity: .9;
font-size: min(40px, 2.08vw); line-height: 1; padding: 14px; text-shadow: 0 1px 8px rgba(0,0,0,.4);
}
.feature__arrow--prev { left: min(48px, 2.5vw); }
.feature__arrow--next { right: min(48px, 2.5vw); }
/* タグライン / contact（中央） */
.fp-tagline { position: absolute; left: 0; top: 96.7%; width: 100%; text-align: center; }
.closing__tagline { font-size: min(28px, 1.458vw); letter-spacing: .02em; color: var(--ink-soft); } /* 本文と同サイズ・同字間 */
.closing__tagline--jp { margin-top: 4px; font-family: var(--serif); }
.fp-contact {
position: absolute; left: 50%; top: 98.8%; transform: translateX(-50%);
font-size: min(28px, 1.458vw); font-weight: 400; letter-spacing: .02em; color: var(--accent); /* 本文と同サイズ・同字間 */
}
/* キャンバス内テキスト（実測: 本文21px/行間1.6、見出し27px）
フォント役割: 欧文(見出し/本文)=Crimson Pro / 和文=Shippori Mincho */
.fp-canvas .heading {
font-family: var(--sans); font-weight: 400; color: var(--ink);
font-size: min(36px, calc(26.75 / 1440 * 100vw)); line-height: 1.3; letter-spacing: .06em; /* 本文×10.83/8.5 */
margin-bottom: min(35px, 1.8vw);
}
.fp-canvas .lead { font-size: min(28px, 1.458vw); line-height: 1.6; margin-bottom: min(19px, .97vw); max-width: none; }
.fp-canvas .lead--jp { font-family: var(--serif); letter-spacing: .02em; }
/* read more: 本文と同サイズ・下線なし・ミディアム・リンク色 */
.fp-canvas .readmore {
font-size: min(28px, 1.458vw); font-weight: 400; color: var(--accent);
letter-spacing: .02em; /* 本文と同じ字間に（.16emの間延びを解消） */
line-height: 1; /* 行高による余白で下線が下がるのを防ぐ（文字に密着） */
border-bottom: 0; padding-bottom: 0; margin-top: min(22px, 1.5vw);
}
/* =========================================================================
about（concept）ページ — Figma 0622(ページ4) 実測準拠
hero=中央(幅584)。テキストは hero 左端(x428)に左揃え（右へ伸びる非対称レイアウト）。
========================================================================= */
/* ※座標はPDFの周囲余白(chrome)を除いた実ページ帯=1440正規化 (about0622_clean.png) 実測 */
.page-about { overflow-x: clip; }
.about-col {
width: min(906px, calc(680 / 1440 * 100vw)); /* hero幅=コンテンツ幅。テキストは手動改行なので折返さない */
margin-inline: auto; /* ページ中央寄せ（広い画面でも左に寄らない） */
padding-top: min(171px, calc(128 / 1440 * 100vw)); /* ヘッダー(120)直後〜hero上端 clean-y248 */
}
.about-hero {
width: min(906px, calc(680 / 1440 * 100vw)); aspect-ratio: 680 / 896; object-fit: cover; /* 左端揃え=ページ中央 */
}
/* 詩スタンザ（JP=明朝 / EN=欧文セリフ）。design: JPピッチ50px / ENピッチ39px */
.ab-jp {
font-family: var(--serif); color: var(--ink-soft); letter-spacing: .02em; line-height: 1.9;
font-size: min(35px, calc(26 / 1440 * 100vw));
margin: min(56px, calc(42 / 1440 * 100vw)) 0 0; /* design gap58 − 行間リーディング分 */
}
.ab-en {
font-family: var(--sans); color: var(--ink-soft); letter-spacing: .02em; line-height: 1.7;
font-size: min(31px, calc(23 / 1440 * 100vw));
margin: min(27px, calc(20 / 1440 * 100vw)) 0 0; /* design gap42 − リーディング */
}
.ab-jp--break { margin-top: min(124px, calc(93 / 1440 * 100vw)); } /* 2つ目の詩対の前 design113 − リーディング */
.ab-jp--first { margin-top: min(150px, calc(112 / 1440 * 100vw)); } /* about見出し撤去に伴い hero→本文の余白を確保 */
.about-closing {
text-align: center; margin-top: min(213px, calc(160 / 1440 * 100vw)); /* 本文→contactを大きく空ける */
padding-bottom: min(133px, calc(100 / 1440 * 100vw));
}
@media (max-width: 767px) {
/* SP=390基準のvw可変（PC同様に拡大縮小・上限capで肥大防止） */
.page-about { padding-inline: var(--edge); }
.about-col { margin-left: 0; width: 100%; padding-top: min(80px, calc(56 / 390 * 100vw)); }
.about-hero { width: 100%; aspect-ratio: 3/4; }
.ab-jp { font-size: min(22px, calc(17 / 390 * 100vw)); margin-top: min(56px, calc(44 / 390 * 100vw)); }
.ab-en { font-size: min(18px, calc(14 / 390 * 100vw)); margin-top: min(20px, calc(15 / 390 * 100vw)); }
.ab-jp--break { margin-top: min(80px, calc(60 / 390 * 100vw)); } /* 詩対の間: SPは60/390（サイト共通のセクションリズム）に詰める */
/* India(about型): 小本文はさらに小さく / 対のJP→ENは詰め / ブロック間は広め */
}
/* =========================================================================
product_sakura ページ — Figma 0622(ページ5) 1440換算リファレンス実測で絶対配置
キャンバスはヘッダー(120px)直後=デザインy120から。各要素 top=(y-120)/CH, left=x/1440。
CH(=6640)はcontact下端+余白までの距離（全体高さは当てにせず要素間距離で算出）。
画像10ボックスは背景以外塊の自動検出、テキストは茶字マスクで実測。
========================================================================= */
/* 和文メッセージ見出し（明朝・非ボールド）。sakura フロー版(.sak-flow)で使用 */
.sak-h {
font-family: var(--serif); font-weight: 400; color: var(--ink);
font-size: min(30px, calc(16 / 390 * 100vw)); line-height: 1.5; letter-spacing: .08em; /* SP16px→PC30px頭打ち（India見出し33pxとの並びを考慮） */
margin: -0.4em 0 0; /* 改行は
で指定。幅は広めにして自動折返し(孤立文字)を防ぐ */
}
/* 英訳本文（Crimson Pro） */
.sak-en {
font-family: var(--sans); color: var(--ink-soft);
font-size: min(23px, calc(15 / 390 * 100vw)); line-height: 1.4; letter-spacing: .01em; /* SP15px→PC23px頭打ち（JP30pxとの比≒0.77） */
margin-top: min(24px, calc(18 / 1440 * 100vw)); /* 改行は
。design EN上端に合わせる */
}
/* sakura SP: 見出し/英訳のサイズ（フロー版 .sak-flow でも使用） */
@media (max-width: 767px) {
.sak-h { white-space: normal; } /* font-sizeは基本ルール（16/390→26px頭打ち）に一本化 */
.sak-en { margin-top: min(18px, calc(14 / 390 * 100vw)); white-space: normal; } /* font-sizeは基本ルール（13.5/390→20px頭打ち）に一本化 */
}
/* =========================================================================
sakura フロー版（CMS: sakura_sections）。散在配置は margin-left(offset%)+width%。
タイポは sakura の .sak-h/.sak-en を流用（絶対配置の負マージンはフローで解除）
========================================================================= */
.page-sakura2 { overflow-x: clip; }
/* ヒーロー直下の余白は India と統一（.pt-top margin-bottom が主。ここは微調整） */
.sak-flow { width: 100%; max-width: 1920px; margin-inline: auto; }
.sak-flow .sak-sec { margin-top: min(150px, calc(112 / 1440 * 100vw)); }
.sak-flow .sak-sec:first-child { margin-top: 0; }
.sak-flow .sak-sec--image img { width: 100%; height: auto; display: block; }
.sak-flow .sak-h { margin: 0; }
.sak-flow .sak-en { margin-top: min(8px, calc(18 / 1440 * 100vw)); } /* JP-EN間を詰める（水上指定） */
.sak-flow .sak-sec--image + .sak-sec--text { margin-top: min(60px, calc(45 / 1440 * 100vw)); }
.sak-flow .sak-sec--imgtext { display: flex; gap: min(72px, calc(54 / 1440 * 100vw)); align-items: flex-start; }
.sak-flow .sak-sec--imgtext.img-right { flex-direction: row-reverse; }
/* 縦方向の揃え（imgtext）: 上(既定)/中央/下/縦積み */
.sak-flow .sak-sec--imgtext.va-center { align-items: center; }
.sak-flow .sak-sec--imgtext.va-bottom { align-items: flex-end; }
.sak-flow .sak-sec--imgtext.va-stack { flex-direction: column; align-items: flex-start; text-align: left; }
.sak-flow .sak-sec--imgtext.va-stack .sak-sec__img { flex-basis: auto !important; } /* 幅はインラインの width(=画像幅%) が効く */
.sak-flow .sak-sec--imgtext .sak-sec__img { flex: 0 0 auto; }
.sak-flow .sak-sec--imgtext .sak-sec__img img { width: 100%; height: auto; display: block; }
.sak-flow .sak-sec--imgtext .sak-sec__text { flex: 1 1 0; min-width: 0; }
@media (max-width: 767px) {
.sak-flow { padding-inline: var(--edge); }
.sak-flow .sak-sec { margin-top: min(80px, calc(60 / 390 * 100vw)); width: 100% !important; margin-left: 0 !important; }
.sak-flow .sak-sec--imgtext { flex-direction: column !important; gap: min(24px, calc(18 / 390 * 100vw)); }
.sak-flow .sak-sec--imgtext .sak-sec__img { width: 100% !important; }
/* SPの「写真→文字」余白を imgtext の gap(18/390) に統一。PC用の45/1440やCMS個別余白(インラインstyle)の漏れを !important で上書き */
.sak-flow .sak-sec--image + .sak-sec--text { margin-top: min(24px, calc(18 / 390 * 100vw)) !important; }
/* 縦積み時はPC用の text_top(文字を下げる個別調整・インラインstyle) を無効化＝gap 18/390 だけで統一 */
.sak-flow .sak-sec--imgtext .sak-sec__text { margin-top: 0 !important; }
}
/* =========================================================================
gallery ページ — 自由配置（絶対配置キャンバス）＋縦書きキャプション
・レイアウト固定。座標は % （キャンバス 1440幅×高さ7130 基準）
・SPはキャンバスごと比例縮小（デザイン固定のため）
========================================================================= */
.page-gallery2 { overflow-x: clip; }
.gal2-canvas {
position: relative; width: 100%; max-width: 1920px; margin-inline: auto;
aspect-ratio: 1440 / 7130;
}
.gal2-img { position: absolute; overflow: hidden; }
.gal2-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gal2-vtext {
position: absolute; writing-mode: vertical-rl;
font-family: var(--serif); color: var(--ink-soft); font-weight: 400;
font-size: min(28px, calc(24 / 1440 * 100vw)); line-height: 1; letter-spacing: normal; /* 24px@1440・28px頭打ち（水上指定）。字間0・1列=1ブロック */
}
.page-gallery2 .site-closing { margin-top: min(120px, calc(90 / 1440 * 100vw)); }
/* 縦書き列のグループ（テンプレ出力）。PCでは箱ごと消して従来の絶対配置に影響させない */
.gal2-vrow { display: contents; }
/* gallery SP: キャンバス(絶対配置)を解除して縦積みフロー化。
縦書きは維持・読めるサイズに。画像はワイド=全幅/その他=74%を元のx位置で左右振り分け、
詩グループ(gal2-vrow)もデザインのx位置から左/中央/右に配置。トリミング比は --ar で維持 */
@media (max-width: 767px) {
.gal2-canvas {
aspect-ratio: auto; height: auto;
padding: min(64px, calc(48 / 390 * 100vw)) var(--edge) 0;
}
/* 詩グループ: 行としてブロック化し、寄せはデザイン由来のクラスで振り分け。
direction:rtl で列の順序(1列目=右端)を維持、字送りは各列で ltr に戻す */
.gal2-vrow { display: block; direction: rtl; margin-top: min(32px, calc(24 / 390 * 100vw)); }
.gal2-vrow--right { text-align: right; }
.gal2-vrow--center { text-align: center; }
.gal2-vrow--left { text-align: left; }
.gal2-img {
position: static !important; height: auto !important; direction: ltr;
margin-top: min(80px, calc(60 / 390 * 100vw));
aspect-ratio: var(--ar, 3 / 4);
}
.gal2-canvas > .gal2-img:first-child { margin-top: 0; }
.gal2-vrow + .gal2-img { margin-top: min(16px, calc(12 / 390 * 100vw)); } /* 詩→写真は詰める（写真→写真の60/390は維持） */
/* 詩と写真が横で被らない組み合わせ（左詩→右写真・右詩→左写真）は写真を詩の横まで引き上げる */
.gal2-vrow--left + .gal2-img--right,
.gal2-vrow--right + .gal2-img--left { margin-top: calc(-1 * min(110px, calc(80 / 390 * 100vw))); }
/* 逆パターン: 中サイズ写真→反対側寄せの詩も、詩を写真の横まで引き上げる（全幅写真の後は被るので除外） */
.gal2-img--med.gal2-img--left + .gal2-vrow--right,
.gal2-img--med.gal2-img--right + .gal2-vrow--left { margin-top: calc(-1 * min(137px, calc(100 / 390 * 100vw))); }
.gal2-img.gal2-img--full { width: 100% !important; }
.gal2-img.gal2-img--med { width: 74% !important; }
.gal2-img--left { margin-right: auto; margin-left: 0; }
.gal2-img--right { margin-left: auto; margin-right: 0; }
.gal2-vtext {
position: static !important; display: inline-block; vertical-align: top;
direction: ltr; /* 縦書きの字送りは上→下のまま */
font-size: min(18px, calc(15 / 390 * 100vw));
}
/* 列の間隔＋デザイン由来の階段ずれ（左の列ほど下がる） */
.gal2-vtext + .gal2-vtext { margin-right: min(22px, calc(17 / 390 * 100vw)); margin-top: 2.4em; }
.gal2-vtext + .gal2-vtext + .gal2-vtext { margin-top: 4.8em; }
.page-gallery2 .site-closing { margin-top: min(96px, calc(72 / 390 * 100vw)); }
}
/* =========================================================================
product / India ページ — セクション積み上げ(フロー)方式・編集可能(繰り返しセクション)
・縦はフロー: セクション間の余白は固定。テキストが伸びたら以降が押し下がる（重ならない）
・横は各セクションの align(左/中央/右) + 幅 で配置（カンプ完全一致は不要方針）
・画像+テキストの横並びは flex 行（伸びたら行が高くなり以降を押し下げ）
・contact は共通フロー動線 .site-contact（about/gallery と同一パーツ）
========================================================================= */
.page-india { overflow-x: clip; }
.ind-flow {
position: relative; width: 100%; max-width: 1920px; margin-inline: auto;
padding: min(160px, calc(120 / 1440 * 100vw)) 0 0; /* 横paddingなし＝offset%がデザインx%に対応 */
}
.ind-title {
text-align: center; line-height: 1;
font-family: var(--sans); font-weight: 400; color: var(--ink);
font-size: min(41px, calc(31 / 1440 * 100vw)); letter-spacing: .14em;
margin: 0 0 min(120px, calc(90 / 1440 * 100vw));
}
/* セクション間の固定余白（＝ここが伸縮せず、テキスト増で以降を押し下げる）。
横位置は各セクションの inline style="margin-left:offset%;width:%" でデザイン実測位置に置く */
.ind-sec { margin-top: min(150px, calc(112 / 1440 * 100vw)); }
.ind-sec:first-of-type { margin-top: 0; }
/* 緩急: 画像の直後にくる本文はその画像の説明＝「セット」として詰める（大見出しは対象外） */
.ind-sec--image + .ind-sec--text:not(:has(.is-lead)) { margin-top: min(60px, calc(45 / 1440 * 100vw)); }
.ind-sec--image img { width: 100%; height: auto; display: block; }
.ind-h { font-family: var(--serif); font-weight: 400; color: var(--ink); font-size: min(27px, calc(20 / 1440 * 100vw)); line-height: 1.9; letter-spacing: .02em; margin: 0; }
.ind-h.is-lead { font-size: min(48px, calc(36 / 1440 * 100vw)); line-height: 1.5; letter-spacing: .06em; white-space: nowrap; } /* 大見出しは短いので1行固定＝孤立文字防止 */
.ind-en { font-family: var(--sans); color: var(--ink-soft); font-size: min(28px, calc(21 / 1440 * 100vw)); line-height: 1.6; letter-spacing: .01em; margin-top: min(20px, calc(15 / 1440 * 100vw)); }
.ind-h + .ind-en { margin-top: min(24px, calc(18 / 1440 * 100vw)); }
.ind-sec--spacer { width: 100% !important; margin-left: 0 !important; }
/* 画像＋テキスト 横並び（上揃え。テキストを下げたい時は section の text_top で調整） */
.ind-sec--imgtext { display: flex; gap: min(72px, calc(54 / 1440 * 100vw)); align-items: flex-start; }
.ind-sec--imgtext.img-right { flex-direction: row-reverse; }
.ind-sec--imgtext .ind-sec__img { flex: 0 0 auto; }
.ind-sec--imgtext .ind-sec__img img { width: 100%; height: auto; display: block; }
.ind-sec--imgtext .ind-sec__text { flex: 1 1 0; min-width: 0; }
/* contact 動線（共通パーツ）。余白は sakura ルールに近い 220 / 100 */
.ind-closing { text-align: center; padding-top: min(293px, calc(220 / 1440 * 100vw)); padding-bottom: min(133px, calc(100 / 1440 * 100vw)); }
@media (max-width: 767px) {
.ind-flow { padding: 64px var(--edge) 0; }
.ind-title { margin-bottom: 48px; }
.ind-sec { margin-top: 56px; width: 100% !important; margin-left: 0 !important; }
.ind-sec--imgtext { flex-direction: column !important; gap: 24px; }
.ind-sec--imgtext .ind-sec__img { width: 100% !important; }
.ind-h { font-size: 20px; }
.ind-h.is-lead { font-size: 26px; }
.ind-en { font-size: 15px; }
.ind-closing { padding-top: 96px; padding-bottom: 80px; }
}
/* =========================================================================
gallery ページ — Figma 0622(ページ7) ルックブック（中央1カラム・フロー）
画像588×780中央、各画像下に左揃え（画像左端）でラベル＋和文＋英文。
========================================================================= */
/* ※座標はPDFのchromeを除いた実ページ帯=1440正規化 (gallery0622_clean.png) 実測。画像680幅・中央 */
.page-gallery { max-width: var(--container); margin-inline: auto; padding-inline: var(--edge); overflow-x: clip; }
.gal-col { width: min(906px, calc(680 / 1440 * 100vw)); margin: 0 auto; padding-top: min(160px, calc(120 / 1440 * 100vw)); }
.gal-item { margin-top: min(227px, calc(170 / 1440 * 100vw)); } /* キャプション下端〜次画像（1行分広げる） */
.gal-item:first-child { margin-top: 0; }
.gal-img { width: 100%; aspect-ratio: 680 / 896; object-fit: cover; }
.gal-cap { margin-top: min(96px, calc(72 / 1440 * 100vw)); } /* design 画像→ラベル 93px */
.gal-label {
font-family: var(--sans); font-weight: 400; color: var(--ink);
font-size: min(39px, calc(29 / 1440 * 100vw)); letter-spacing: .16em;
}
.gal-jp {
font-family: var(--serif); color: var(--ink-soft); line-height: 1.7;
font-size: min(29px, calc(22 / 1440 * 100vw)); letter-spacing: .04em;
margin-top: min(27px, calc(20 / 1440 * 100vw));
}
.gal-en {
font-family: var(--sans); font-weight: 400; color: var(--ink-soft); line-height: 1.5;
font-size: min(32px, calc(24 / 1440 * 100vw)); letter-spacing: .02em;
margin-top: min(11px, calc(8 / 1440 * 100vw)); /* design JP→EN 24px相当 */
}
@media (max-width: 767px) {
.gal-col { width: 100%; padding-top: 40px; }
.gal-item { margin-top: 56px; }
.gal-label { font-size: 16px; }
.gal-jp { font-size: 15px; margin-top: 18px; }
.gal-en { font-size: 14px; }
}
/* =========================================================================
contact ページ — お問い合わせフォーム（日英併記 / 既存トンマナ準拠）
========================================================================= */
.page-contact { max-width: var(--container); margin-inline: auto; padding-inline: var(--edge); overflow-x: clip; }
.contact-inner {
width: min(1040px, calc(820 / 1440 * 100vw)); margin: 0 auto;
padding-block: min(133px, calc(100 / 1440 * 100vw)) min(173px, calc(130 / 1440 * 100vw));
}
.contact-head { text-align: center; margin-bottom: min(56px, calc(42 / 1440 * 100vw)); }
.contact-title {
font-family: var(--sans); font-weight: 400; color: var(--ink);
font-size: min(48px, calc(36 / 1440 * 100vw)); letter-spacing: .14em; line-height: 1.2;
}
/* 表記方針: 英語メイン(大)・日本語サブ(小・薄)。ボタン系は英語のみ */
.contact-lead { text-align: center; margin: 0 0 min(64px, calc(48 / 1440 * 100vw)); line-height: 1.7; color: var(--ink-soft); }
.contact-lead .lead-en { font-family: var(--sans); font-size: min(29px, calc(22 / 1440 * 100vw)); letter-spacing: .02em; color: var(--ink); display: block; }
.contact-lead .lead-jp { font-family: var(--serif); font-size: min(20px, calc(15.5 / 1440 * 100vw)); display: block; color: var(--ink-soft); opacity: .7; margin-top: min(8px, calc(6 / 1440 * 100vw)); }
.contact-form { display: block; }
.cf-row--2 { display: flex; gap: min(48px, calc(36 / 1440 * 100vw)); }
.cf-row--2 .cf-field { flex: 1 1 0; min-width: 0; }
.cf-field { margin-bottom: min(48px, calc(36 / 1440 * 100vw)); }
.cf-label { display: block; margin-bottom: min(16px, calc(12 / 1440 * 100vw)); color: var(--ink); }
.cf-label .cf-en { font-family: var(--sans); font-size: min(28px, calc(21 / 1440 * 100vw)); letter-spacing: .04em; }
.cf-label .cf-jp { font-family: var(--serif); font-size: min(19px, calc(15 / 1440 * 100vw)); letter-spacing: .04em; color: var(--ink-soft); opacity: .7; margin-left: .7em; }
.cf-input {
width: 100%; box-sizing: border-box; display: block;
font-family: var(--sans); font-size: min(28px, calc(21 / 1440 * 100vw)); color: var(--ink);
background: #FBFCFA; border: 1px solid var(--line); border-radius: 0;
padding: min(20px, calc(15 / 1440 * 100vw)) min(22px, calc(16 / 1440 * 100vw));
transition: border-color .2s;
}
.cf-input::placeholder { color: var(--ink-soft); opacity: .5; }
.cf-input:focus { outline: none; border-color: var(--accent); }
.cf-textarea { resize: vertical; min-height: min(320px, calc(240 / 1440 * 100vw)); line-height: 1.7; }
/* CF7 送信エンジン: 画面外に隠すが送信は機能させる（display:none はsubmit不具合回避のため使わない） */
.cf7-pipe { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); opacity: 0; pointer-events: none; }
/* select: ネイティブ矢印を消して明朝トンマナの矢印を付与 */
.cf-select-wrap { position: relative; }
.cf-select { appearance: none; -webkit-appearance: none; padding-right: min(56px, calc(42 / 1440 * 100vw)); cursor: pointer; }
.cf-select-wrap::after {
content: ""; position: absolute; right: min(24px, calc(18 / 1440 * 100vw)); top: 50%;
width: 9px; height: 9px; border-right: 1px solid var(--ink-soft); border-bottom: 1px solid var(--ink-soft);
transform: translateY(-70%) rotate(45deg); pointer-events: none;
}
.cf-actions { text-align: center; margin-top: min(64px, calc(48 / 1440 * 100vw)); }
.cf-submit {
display: inline-flex; align-items: baseline; gap: .8em; cursor: pointer;
font-family: var(--sans); color: var(--bg); background: var(--accent);
border: 1px solid var(--accent); border-radius: 999px;
padding: min(20px, calc(15 / 1440 * 100vw)) min(96px, calc(72 / 1440 * 100vw));
font-size: min(26px, calc(20 / 1440 * 100vw)); letter-spacing: .08em; transition: opacity .2s;
}
.cf-submit:hover { opacity: .8; }
/* 確認・完了ステップ */
.contact-step[hidden] { display: none; }
.cf-confirm-note { text-align: center; color: var(--ink-soft); margin-bottom: min(48px, calc(36 / 1440 * 100vw)); }
.cf-confirm-note .cf-en { font-family: var(--sans); font-size: min(28px, calc(21 / 1440 * 100vw)); color: var(--ink); }
.cf-confirm-note .cf-jp { font-family: var(--serif); font-size: min(19px, calc(15 / 1440 * 100vw)); color: var(--ink-soft); opacity: .7; margin-left: .7em; }
.cf-review { margin: 0; }
.cf-review-row { display: flex; gap: min(40px, calc(30 / 1440 * 100vw)); padding: min(28px, calc(21 / 1440 * 100vw)) 0; border-bottom: 1px solid var(--line); }
.cf-review-row:first-child { border-top: 1px solid var(--line); }
.cf-review dt { flex: 0 0 min(280px, calc(210 / 1440 * 100vw)); margin: 0; color: var(--ink); }
.cf-review dt .cf-en { font-family: var(--sans); font-size: min(26px, calc(20 / 1440 * 100vw)); letter-spacing: .04em; display: block; }
.cf-review dt .cf-jp { font-family: var(--serif); font-size: min(18px, calc(14 / 1440 * 100vw)); letter-spacing: .04em; color: var(--ink-soft); opacity: .7; display: block; margin-top: 2px; }
.cf-review dd { margin: 0; flex: 1 1 0; min-width: 0; font-family: var(--sans); font-size: min(28px, calc(21 / 1440 * 100vw)); color: var(--ink-soft); line-height: 1.7; white-space: pre-wrap; word-break: break-word; }
.cf-actions--2 { display: flex; justify-content: center; gap: min(32px, calc(24 / 1440 * 100vw)); }
.cf-back {
display: inline-flex; align-items: baseline; gap: .8em; cursor: pointer;
font-family: var(--sans); color: var(--ink); background: none;
border: 1px solid var(--ink-soft); border-radius: 999px;
padding: min(20px, calc(15 / 1440 * 100vw)) min(64px, calc(48 / 1440 * 100vw));
font-size: min(26px, calc(20 / 1440 * 100vw)); letter-spacing: .08em; transition: opacity .2s;
}
.cf-back:hover { opacity: .6; }
.contact-complete { text-align: center; }
.cf-complete-title { margin-bottom: min(32px, calc(24 / 1440 * 100vw)); }
.cf-complete-title .cf-en { font-family: var(--sans); font-size: min(38px, calc(28 / 1440 * 100vw)); color: var(--ink); display: block; letter-spacing: .04em; }
.cf-complete-title .cf-jp { font-family: var(--serif); font-size: min(21px, calc(16 / 1440 * 100vw)); color: var(--ink-soft); opacity: .7; display: block; margin-top: 8px; }
.cf-complete-text { line-height: 1.7; color: var(--ink-soft); margin-bottom: min(56px, calc(42 / 1440 * 100vw)); }
.cf-complete-text .lead-en { font-family: var(--sans); font-size: min(26px, calc(20 / 1440 * 100vw)); color: var(--ink); display: block; }
.cf-complete-text .lead-jp { font-family: var(--serif); font-size: min(20px, calc(15 / 1440 * 100vw)); display: block; opacity: .7; margin-top: 6px; }
.cf-home {
display: inline-flex; align-items: baseline; gap: .8em; cursor: pointer;
font-family: var(--sans); color: var(--ink); background: none;
border: 1px solid var(--ink-soft); border-radius: 999px;
padding: min(20px, calc(15 / 1440 * 100vw)) min(64px, calc(48 / 1440 * 100vw));
font-size: min(26px, calc(20 / 1440 * 100vw)); letter-spacing: .08em; transition: opacity .2s;
}
.cf-home:hover { opacity: .6; }
@media (max-width: 767px) {
.contact-inner { width: 100%; padding-block: 64px 80px; }
/* 確認画面: ラベル/値/注記を入力画面と同サイズに（SP未指定だと base の vw 計算で極小になる） */
.cf-confirm-note .cf-en { font-size: 16px; }
.cf-confirm-note .cf-jp { font-size: 12px; display: block; margin-left: 0; margin-top: 4px; } /* SPは英文と行を分ける */
.cf-review-row { flex-direction: column; gap: 6px; padding: 18px 0; }
.cf-review dt { flex-basis: auto; }
.cf-review dt .cf-en { font-size: 16px; display: inline; }
.cf-review dt .cf-jp { font-size: 12px; margin-top: 0; margin-left: .6em; display: inline; }
.cf-review dd { font-size: 16px; }
.cf-actions--2 { flex-direction: column; gap: 16px; }
.cf-back, .cf-actions--2 .cf-submit { width: 100%; justify-content: center; }
/* 完了画面: サブ日本語・リード文が極小になるのを解消 */
.cf-complete-title .cf-en { font-size: 22px; }
.cf-complete-title .cf-jp { font-size: 13px; }
.cf-complete-text .lead-en { font-size: 16px; }
.cf-complete-text .lead-jp { font-size: 13px; }
/* SP余白: PC基準(/1440)がSPで1/4に潰れて詰まるのを解消（完了画面＋共通） */
.contact-head { margin-bottom: 32px; }
.contact-lead { margin-bottom: 40px; }
.cf-field { margin-bottom: 28px; }
.cf-actions { margin-top: 40px; }
.cf-complete-title { margin-bottom: 24px; }
.cf-complete-title .cf-jp { margin-top: 10px; }
.cf-complete-text { margin-bottom: 44px; line-height: 1.9; }
.cf-complete-text .lead-jp { margin-top: 12px; }
.contact-title { font-size: 30px; }
.contact-lead .lead-en { font-size: 16px; }
.contact-lead .lead-jp { font-size: 13px; }
.cf-row--2 { flex-direction: column; gap: 0; }
.cf-field { margin-bottom: 28px; }
.cf-label .cf-en { font-size: 16px; }
.cf-label .cf-jp { font-size: 12px; }
.cf-input { font-size: 16px; padding: 13px 14px; } /* 16px=iOSズーム防止 */
.cf-textarea { min-height: 200px; }
.cf-submit, .cf-back, .cf-home { font-size: 16px; }
.cf-submit, .cf-back, .cf-home { width: 100%; justify-content: center; padding: 16px; } /* Back/完了ボタンも送信と同じ高さに */
}
/* =========================================================================
インタラクション（テキストリンクのホバー / スクロール表示）
========================================================================= */
/* テキストリンク: 下線が左から優しく伸びる（落ち着いた印象）。contact等の常時下線も統一 */
.global-nav__list a, .footer-nav__list a, .fp-canvas .readmore {
position: relative;
}
.global-nav__list a::after,
.footer-nav__list a::after,
.fp-canvas .readmore::after {
content: ""; position: absolute; left: 0; bottom: -0.32em;
width: 100%; height: 1px; background: currentColor;
transform: scaleX(0); transform-origin: right center; /* 離すと右へ流れて消える */
transition: transform .5s cubic-bezier(.4, 0, .2, 1);
}
.global-nav__list a:hover::after,
.footer-nav__list a:hover::after,
.fp-canvas .readmore:hover::after { transform: scaleX(1); transform-origin: left center; } /* 左から右へ出る */
/* contact 動線は常時下線（デザイン準拠・文字に密着）。ホバーで下線が右へ消え左から引き直される */
.site-contact { position: relative; } /* fp/sak-contact は既に position:absolute */
.fp-contact, .sak-contact, .ind-contact, .site-contact {
line-height: 1; /* body の line-height:2 継承を解除＝下線を文字に密着 */
padding-bottom: min(6px, calc(4 / 1440 * 100vw));
}
.fp-contact::after, .sak-contact::after, .ind-contact::after, .site-contact::after {
content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px;
background: currentColor; transform: scaleX(1); transform-origin: left center;
}
.fp-contact:hover::after, .sak-contact:hover::after, .ind-contact:hover::after, .site-contact:hover::after {
animation: contact-underline .6s cubic-bezier(.7, 0, .3, 1);
}
@keyframes contact-underline {
0% { transform: scaleX(1); transform-origin: right center; }
46% { transform: scaleX(0); transform-origin: right center; }
54% { transform: scaleX(0); transform-origin: left center; }
100% { transform: scaleX(1); transform-origin: left center; }
}
/* スクロール表示: 画面内に入ると下からふわっと浮かび上がる */
.reveal { opacity: 0; transform: translateY(30px); transition: opacity 1.1s ease, transform 1.1s cubic-bezier(.19, 1, .22, 1); will-change: opacity, transform; }
.reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
.reveal { opacity: 1 !important; transform: none !important; transition: none; }
}
/* =========================================================================
Footer
========================================================================= */
.site-footer { background: var(--bg-soft); padding-block: min(80px, calc(60 / 1440 * 100vw)) min(133px, calc(100 / 1440 * 100vw)); }
.site-footer__inner { max-width: var(--container); margin-inline: auto; padding-inline: var(--pad); text-align: center; }
/* contact 動線（中央・フッター直前。ギャラリー等で使用） */
.site-contact {
display: inline-block; position: relative;
font-family: var(--sans); font-weight: 400; color: var(--accent);
font-size: min(32px, calc(24 / 1440 * 100vw)); letter-spacing: .04em;
}
/* =========================================================================
共通パーツ: product最上部(タイトル+メイン画像) と contact動線
・sakura / India で「同じコード・同じ位置・同じサイズ」にするための土台
・sakura の絶対配置(.sak-title top1.868% / .sak-hero top3.118%,h12.043%)をフローで再現
========================================================================= */
/* ヒーロー直下→本文の余白（India/sakura 共通。旧: India広すぎ/sakura狭すぎ→中間で統一） */
.pt-top { width: 100%; margin-bottom: min(78px, calc(58 / 1440 * 100vw)); }
.page-india2 .ind2-col > :first-child { margin-top: 0; } /* 先頭見出しの余白は pt-top が受け持つ */
.pt-title {
text-align: center; line-height: 1; color: var(--ink); font-weight: 400;
font-family: var(--sans); font-size: min(41px, calc(31 / 1440 * 100vw)); letter-spacing: .14em;
padding-top: min(185px, calc(139 / 1440 * 100vw)); /* ヘッダー直下→タイトル (sakura top1.868%相当) */
margin: 0 0 min(83px, calc(62 / 1440 * 100vw)); /* タイトル→ヒーロー間 (sakura hero top3.118%相当) */
}
.pt-hero {
display: block; margin-inline: auto;
width: min(906px, calc(680 / 1440 * 100vw)); /* sakura hero幅 47.222% と同値 */
aspect-ratio: 680 / 896; object-fit: cover; /* sakura hero高さ 12.043% と同値 */
}
/* contact動線の共通ラッパ（フッター直前・中央）。about/india/gallery/sakura 共通 */
.site-closing {
text-align: center;
margin-top: min(200px, calc(150 / 1440 * 100vw));
padding-bottom: min(133px, calc(100 / 1440 * 100vw));
}
/* 共通パーツ SP（India/sakura 共通。タイトル/ヒーロー/contact上余白） */
@media (max-width: 767px) {
.pt-title { font-size: min(30px, calc(23 / 390 * 100vw)); padding-top: min(96px, calc(74 / 390 * 100vw)); margin-bottom: min(48px, calc(36 / 390 * 100vw)); }
/* ヒーローはSPで左右余白あり（TOP/about と統一）。親paddingの有無に関わらず端からvar(--edge) */
.pt-hero { width: min(100%, calc(100vw - 2 * var(--edge))); margin-inline: auto; aspect-ratio: 3 / 4; }
.site-closing { margin-top: min(70px, calc(54 / 390 * 100vw)); padding-bottom: 0; }
}
/* 中央(company)をページ中央=contactと揃える。左右(privacy/sitemap)は対称 */
.footer-nav__list {
display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
column-gap: min(165px, calc(124 / 1440 * 100vw));
margin: 0; padding: 0; list-style: none;
font-size: min(32px, calc(24 / 1440 * 100vw)); font-weight: 400; letter-spacing: .02em; color: var(--accent);
}
.footer-nav__list li:nth-child(1) { justify-self: end; }
.footer-nav__list li:nth-child(2) { justify-self: center; }
.footer-nav__list li:nth-child(3) { justify-self: start; }
/* 下層ページ簡易 */
.site-main { min-height: 40vh; }
/* =========================================================================
汎用下層ページ（page.php: privacy policy 等）— 中央1カラムの読み物
========================================================================= */
.plain-col {
max-width: 760px; margin-inline: auto;
padding: min(120px, calc(90 / 1440 * 100vw)) var(--edge) 0;
}
.plain-title {
font-family: var(--serif); font-weight: 400; color: var(--ink);
text-align: center; letter-spacing: .1em; line-height: 1.5;
font-size: min(26px, calc(18 / 390 * 100vw));
margin: 0 0 min(72px, calc(56 / 390 * 100vw));
}
.plain-body {
font-family: var(--serif); color: var(--ink-soft);
font-size: 15px; line-height: 2.1; letter-spacing: .02em;
}
.plain-body h2 {
font-family: var(--serif); font-weight: 400; color: var(--ink);
font-size: 18px; line-height: 1.6; letter-spacing: .04em;
margin: 56px 0 16px;
}
.plain-body h2:first-child { margin-top: 0; }
.plain-body p { margin: 0 0 1.4em; }
.plain-body ul, .plain-body ol { margin: 0 0 1.4em; padding-left: 1.5em; }
.plain-body li { margin-bottom: .4em; }
.plain-body a { color: inherit; text-decoration: underline; text-underline-offset: .2em; }
.plain-body a:hover { color: var(--accent); }
@media (max-width: 767px) {
.plain-col { padding-top: min(80px, calc(60 / 390 * 100vw)); }
.plain-body { font-size: 14px; }
.plain-body h2 { font-size: 16px; margin-top: 44px; }
}
/* =========================================================================
Responsive (SP: 〜767 / 基準750)
SPカンプ未支給のため、PCの非対称配置を素直に積み上げる解釈。
========================================================================= */
@media (max-width: 767px) {
.site-header__inner { height: auto; padding-block: min(30px, calc(23 / 390 * 100vw)); padding-inline: var(--edge); }
.site-logo img { width: min(190px, calc(142 / 390 * 100vw)); }
.nav-toggle { display: block; padding: 10px; position: relative; z-index: 20; } /* スクリムより前面（×で閉じられるように） */
.nav-toggle span { width: 28px; }
.global-nav__divider { display: none; }
.lang-switch { font-size: 11px; }
.global-nav__list {
position: fixed; inset: 0 0 0 auto; width: 76%; max-width: 340px;
flex-direction: column; align-items: flex-start; gap: min(30px, calc(24 / 390 * 100vw));
background: var(--bg); padding: 96px 32px; transform: translateX(100%);
transition: transform .35s ease; box-shadow: -10px 0 40px rgba(0,0,0,.06);
font-size: min(25px, calc(20 / 390 * 100vw)); /* ドロワーの文字を読める大きさに */
z-index: 10; /* スクリムより前面 */
}
body.nav-open .global-nav__list { transform: translateX(0); }
/* ドロワー背後のスクリム（ヘッダー::after＝ヘッダーのスタッキング内でドロワーの下・他全ての上） */
.site-header::after {
content: ''; position: fixed; inset: 0; background: rgba(0, 0, 0, .35);
opacity: 0; visibility: hidden; pointer-events: none;
transition: opacity .35s ease, visibility .35s ease;
z-index: 5;
}
body.nav-open .site-header::after { opacity: 1; visibility: visible; pointer-events: auto; }
/* SP: ドロップダウンは常時表示でインデント */
.global-nav__list .sub-menu {
position: static; transform: none; opacity: 1; visibility: visible;
flex-direction: column; align-items: flex-start; gap: 14px;
background: none; box-shadow: none; padding: 14px 0 4px 18px; white-space: normal;
}
/* SP: タップ時にPC用ドロップダウンのtransform(translateX(-50%))が乗ってズレるのを打ち消す */
.global-nav__list .menu-item-has-children:hover .sub-menu,
.global-nav__list .menu-item-has-children:focus-within .sub-menu { transform: none; }
/* SP: ドロワー限定の top リンク */
.global-nav__list .nav-home-drawer { display: block; }
body.nav-open .nav-toggle span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
body.nav-open .nav-toggle span:nth-child(2) { opacity: 0; }
body.nav-open .nav-toggle span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
/* SP: 絶対配置キャンバスを解除して縦積み（SPカンプ未支給のため素直に積む） */
.fp-canvas { aspect-ratio: auto; height: auto; padding: 0 var(--edge); }
.fp-canvas .fp-img, .fp-canvas .fp-text,
.fp-feature, .fp-tagline, .fp-contact {
position: static; left: auto; top: auto; transform: none;
width: 100% !important; height: auto !important; margin-top: 28px;
}
.fp-hero { margin: 0 calc(-1 * var(--edge)) 0; width: calc(100% + var(--edge) * 2) !important; aspect-ratio: 4/3; }
.fp-img { aspect-ratio: 4/3; }
.fp-portrait, .fp-accent { aspect-ratio: 3/4; }
.fp-canvas .heading { font-size: 24px; }
.fp-canvas .lead { font-size: 14px; }
.fp-canvas .readmore { font-size: 12px; }
.fp-feature { margin: 28px calc(-1 * var(--edge)) 0; width: calc(100% + var(--edge) * 2) !important; }
.fp-feature-img { position: static; aspect-ratio: 4/3; }
.feature__arrow { font-size: 26px; }
.fp-tagline { text-align: center; margin-top: 48px; }
.fp-contact { display: inline-block; margin-top: 18px; }
.closing__tagline { font-size: 14px; }
}
/* =========================================================================
SP 追加調整（2026-07-06）: 余白/フッター・contact文字/セレクタ矢印/タイトル
※既存SPブロックより後に置いて上書き
========================================================================= */
@media (max-width: 767px) {
:root { --edge: min(40px, calc(28 / 390 * 100vw)); } /* SPは左右余白を広めに */
/* about型ページのタイトル(India等)をSPでサイズアップ（sakuraタイトルと同大） */
/* フッター3リンク: SPは横並びのまま1行に収める（折返し防止）。小さすぎない範囲で */
/* SPは3リンクを両端まで広げる（中央は中央のまま。詰まった左寄りの塊に見えるのを解消） */
.footer-nav__list {
column-gap: min(20px, calc(15 / 390 * 100vw));
font-size: min(18px, calc(14 / 390 * 100vw)); white-space: nowrap;
}
.footer-nav__list li:nth-child(1) { justify-self: start; }
.footer-nav__list li:nth-child(3) { justify-self: end; }
/* フッターをコンテンツから離して「フッターらしく」（背景は変えられないので余白で分離） */
.site-footer { padding-block: min(150px, calc(115 / 390 * 100vw)) min(90px, calc(68 / 390 * 100vw)); }
.site-contact { font-size: min(24px, calc(18 / 390 * 100vw)); }
/* 問い合わせフォーム: セレクタの矢印を右端ギリギリから内側へ */
.cf-select-wrap::after { right: min(24px, calc(18 / 390 * 100vw)); }
.cf-select { padding-right: min(52px, calc(40 / 390 * 100vw)); }
}
/* =========================================================================
India ページ（ブロック積み上げ式 / デザイン 0704・0706 準拠）
- テキスト=左揃え1カラム(幅≈934/1440, 中央寄せ) / 画像=中央(680幅の縦フレーム)
- タイトル=中央ゴールド / 見出し=左ゴールド(JP明朝・EN Garamond) / 本文=小さめグレー
- 座標は 2045:3 の実測(1440正規化, india2045/full.png)を seed に overlay 調整
========================================================================= */
.page-india2 { overflow-x: clip; }
.ind2-col {
width: min(934px, calc(934 / 1440 * 100vw)); /* デザイン値934pxで頭打ち（ワイド画面で膨張させない） */
margin-inline: auto;
}
/* タイトル（中央・ゴールド・大） */
.ind2-title {
text-align: center; line-height: 1.2; color: var(--ink); font-weight: 400;
font-size: min(31px, calc(31 / 1440 * 100vw)); letter-spacing: .14em; /* デザイン値31pxで頭打ち */
padding-top: min(140px, calc(104 / 1440 * 100vw));
margin: 0 0 min(85px, calc(64 / 1440 * 100vw)); /* title→image design71 */
}
.ind2-title__jp { font-family: var(--serif); display: block; }
.ind2-title__en { font-family: var(--sans); display: block; }
/* 画像（中央・680幅の縦フレーム・cover）。design実測 680×899 */
.ind2-fig {
width: min(906px, calc(680 / 1440 * 100vw));
aspect-ratio: 680 / 899; object-fit: cover; object-position: center;
margin: min(150px, calc(112 / 1440 * 100vw)) auto min(100px, calc(75 / 1440 * 100vw));
}
.ind2-title + .ind2-fig { margin-top: 0; } /* 1枚目はタイトルのmargin-bottomが受け持つ */
/* 2枚目以降（本文の後に来る画像＝赤い生地）は上を大きく空ける。design: キャプション→画像 ≈280 */
.ind2-body + .ind2-fig { margin-top: min(373px, calc(280 / 1440 * 100vw)); }
/* 見出し（左・ゴールド）。JP/EN とも33px（クライアント指示2026-07-07）。design: 見出し→本文 JP53/EN33 */
.ind2-h {
color: var(--ink); font-weight: 400; line-height: 1.5; letter-spacing: .04em;
margin: min(115px, calc(86 / 1440 * 100vw)) 0 min(64px, calc(48 / 1440 * 100vw));
}
.ind2-h--en { margin-bottom: min(38px, calc(28 / 1440 * 100vw)); } /* ENは見出し→本文が狭い */
.ind2-fig + .ind2-h { margin-top: 0; } /* 画像直後は画像のmargin-bottomが受け持つ */
.ind2-h__jp { font-family: var(--serif); display: block; font-size: min(33px, calc(33 / 1440 * 100vw)); } /* クライアント指示33pxで頭打ち */
.ind2-h__en { font-family: var(--sans); display: block; font-size: min(33px, calc(33 / 1440 * 100vw)); }
.ind2-h__jp + .ind2-h__en { margin-top: min(10px, calc(8 / 1440 * 100vw)); }
/* 本文（左・小さめ）。design: JP行ピッチ34px(=lh1.62) / 段落ギャップ33px。改行はデザイン準拠の手動
*/
.ind2-body { text-align: left; color: var(--ink-soft); letter-spacing: .02em; }
.ind2-body p { margin: 0; }
.ind2-body p + p { margin-top: min(44px, calc(33 / 1440 * 100vw)); }
/* テキストリンク＝本文と同じ見た目、ホバー時のみ下線がアニメーションで伸びる */
.ind2-body a { color: inherit; text-decoration: none; position: relative; }
.ind2-body a::after {
content: ""; position: absolute; left: 0; right: 0; bottom: -.12em; height: 1px;
background: currentColor; transform: scaleX(0); transform-origin: left center;
transition: transform .45s cubic-bezier(.19,1,.22,1);
}
.ind2-body a:hover::after { transform: scaleX(1); }
.ind2-body--jp { font-family: var(--serif); font-size: min(21px, calc(21 / 1440 * 100vw)); line-height: 1.62; } /* デザイン値21pxで頭打ち */
/* EN本文はJPと同サイズ（クライアント指示 2026-07-07）。行間はやや詰め */
.ind2-body--en { font-family: var(--sans); font-size: min(21px, calc(21 / 1440 * 100vw)); line-height: 1.6; }
.ind2-h + .ind2-body { margin-top: 0; }
.ind2-body + .ind2-body { margin-top: min(20px, calc(15 / 1440 * 100vw)); } /* JP塊→EN塊は詰める */
/* ディバイダー後（使用生地/ACEセクション）は段落を詰める（デザイン0706: 本文がほぼ連続） */
.ind2-div ~ .ind2-body p + p { margin-top: min(24px, calc(18 / 1440 * 100vw)); }
/* ディバイダー（区切り線）＝本文と同じ色（クライアント指示2026-07-07） */
.ind2-div {
border: 0; border-top: 1px solid var(--ink-soft); width: 100%;
margin: min(160px, calc(120 / 1440 * 100vw)) 0;
}
@media (max-width: 767px) {
.ind2-col { width: 100%; padding-inline: var(--edge); }
.ind2-title { font-size: min(30px, calc(23 / 390 * 100vw)); padding-top: min(96px, calc(74 / 390 * 100vw)); margin-bottom: min(50px, calc(38 / 390 * 100vw)); }
.ind2-fig { width: 100%; margin: min(80px, calc(60 / 390 * 100vw)) auto min(52px, calc(40 / 390 * 100vw)); } /* 下=画像→章見出し40/390（pt-hero直後と統一） */
.page-india2 .pt-top { margin-bottom: min(52px, calc(40 / 390 * 100vw)); } /* hero→先頭見出しも40/390に統一（India限定・sakuraは不変） */
.ind2-h { margin: min(110px, calc(84 / 390 * 100vw)) 0 min(40px, calc(30 / 390 * 100vw)); }
.ind2-fig + .ind2-h { margin-top: 0; }
.ind2-h { line-height: 1.5; }
.ind2-h__jp { font-size: min(23px, calc(18 / 390 * 100vw)); }
.ind2-h__en { font-size: min(23px, calc(18 / 390 * 100vw)); }
.ind2-body + .ind2-fig { margin-top: min(200px, calc(150 / 390 * 100vw)); }
.ind2-body--jp { font-size: min(19px, calc(15 / 390 * 100vw)); line-height: 1.4; }
.ind2-body--en { font-size: min(19px, calc(15 / 390 * 100vw)); line-height: 1.4; }
.ind2-body br { display: none; }
.ind2-body p + p { margin-top: min(30px, calc(23 / 390 * 100vw)); }
.ind2-div { margin: min(90px, calc(68 / 390 * 100vw)) 0; }
}