@charset "UTF-8";
/* ==========================================================
   activities セクション（冬の過ごし方）
   境界: y 7250–8808（section-relative 0–1558）
   基準: 2026-08-05 新カンプ（assets/design_20260805/top_server.jpg 2x実測）
   2026-08-06: 新カンプ反映。旧banner2を廃止し全幅intro写真をセクション先頭へ内包。
               金→青(#0159b3)、筆記体 金→銀グレー、カード帯は青→白の縦グラデ。
   PC版のみ（@media なし）。座標はすべて2xマスターの画素実測値。
   ========================================================== */

.activities {
  position: relative;
  width: var(--canvas);
  height: 1558px;
  background: var(--color-white);
  overflow: hidden;
}

/* ---- セクション先頭の全幅intro写真（旧banner2の後継） ----
   カンプ実測 y0–527。上下の白フェードは写真に焼き込み済み（2xマスター直切り）。 */
.activities__intro {
  width: var(--canvas);
  height: 527px;
}
.activities__intro img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ---- ヘッダー（センター揃え） ----
   実測: 筆記体 x381.5 y595 603×83 ／ H2インク y663–700 ／ リード1行目インク y740.5 */
.activities__head {
  padding-top: 132px; /* intro下端527 + 132 = H2ボックス上端659 */
  text-align: center;
}
.activities__script {
  position: absolute;
  left: 381.5px;
  top: 595px;
  width: 603px;
  height: 83px;
  /* 新カンプの筆記体は銀グレー。2xマスターの塗り面実測 = #eaeaec
     （base.cssの暫定トークン --color-script #b8c7db より大幅に淡い） */
  background-image: url(../../img/script/activities_silver.png);
}
.activities__heading {
  font-family: var(--font-jp);
  font-weight: 400; /* カンプのインク量実測に一致（500は約1.2倍太い） */
  padding-left: 2px; /* カンプのH2はキャンバス中心より+1px（行末送り分） */
  font-size: 42px;
  letter-spacing: 0.01em;
  line-height: 1;
  color: var(--color-blue);
}
.activities__lead {
  margin-top: 27px; /* H2ボックス下端701 → リード行ボックス上端728 */
  /* 2026-09-02 文字組み補正: カンプ（Figma）は「漢字1.148em・かな0.932em・約物0.670em」の
     3クラス送りで組まれている（PC/SPそれぞれのカンプで独立に実測し一致を確認）。
     Google Fonts配信の Zen Old Mincho は palt が効かない（probe実測で全字1emのまま）ため、
     基底ls＝かな送り／漢字は .kj span／約物は .pt span で3クラスを再現する。
     カンプ実測(1x): PC 漢字24.17 かな19.53 約物14.05 ／ SP 漢字16.04 かな13.08 約物9.41
     旧: letter-spacing 0.009em の一律ベタ組み＋.ptのmargin相殺（行幅だけ一致・内部最大11.5pxズレ） */
  padding-left: 3px; /* 3クラス化で行幅が変わるため中心補正を再導出（L1左端532.3 / L2左端475.2＝カンプ531.8/475.6） */
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 21px;
  letter-spacing: -0.068em; /* かな送り 0.932em（21px→19.57 / 14px→13.05） */
  line-height: 42px; /* 実測: 1行目インク740.5 / 2行目782.5 */
  color: var(--color-ink);
  white-space: nowrap;
}
.activities__lead .kj {
  letter-spacing: 0.148em; /* 漢字送り 1.148em（21px→24.11 / 14px→16.07。カンプ実測24.17/16.04） */
}
.activities__lead .pt {
  letter-spacing: -0.330em; /* 約物送り 0.670em（21px→14.07 / 14px→9.38。カンプ実測14.05/9.41＝ほぼ半角） */
}

/* ---- カード 横1列4枚＋左送り無限ループ ----
   カンプ実測: カード 360×528（帯60＋写真300）／写真 300×460／
   1枚目 x65.5・ピッチ399（隙間39）・4枚目は右端で切れる＝はじめから横ループ前提。

   静止フレーム＝カンプ（先頭セットの1枚目がx65.5・左側は白）。
   ループ周期 = 4×399 = 1596px。translateX 65.5px → -1530.5px でちょうど1周期進み、
   終了フレーム（2セット目の1枚目がx65.5）と開始フレームが完全一致する＝継ぎ目なし。
   カードを3セット(12枚)並べる理由: 1周期のあいだ画面右側(〜1365px)を埋めるには
   トラック実体が 65.5〜1365+1530.5 の範囲で必要で、2セット(8枚=3153px)だと
   折り返し直前に右端へ白が出る。3セット(12枚=4749px)で常に埋まる。 */
.activities__marquee {
  margin-top: 60px; /* リード下端812 → カード上端872 */
  width: var(--canvas);
  height: 528px;
  overflow: hidden; /* トラックのはみ出しをキャンバス内に閉じる（横スクロール発生を防ぐ） */
}
.activities__track {
  display: flex;
  gap: 39px;
  width: max-content;
  /* 静止時（no-JS・reduced-motion）はカンプと同じ静止フレームを見せる */
  transform: translate3d(65.5px, 0, 0);
}
.js .activities__track {
  animation: activities-marquee 40s linear infinite;
  will-change: transform;
}
@keyframes activities-marquee {
  from { transform: translate3d(65.5px, 0, 0); }
  to   { transform: translate3d(-1530.5px, 0, 0); }
}
/* ホバーでは止めない（2026-08-18 市岡さん指示: カードは非リンクのため、
   カーソルが乗ってもループを流し続ける。旧: hover/focus-within で paused） */
.activities__card {
  position: relative;
  flex: 0 0 360px;
  width: 360px;
  height: 528px;
}
/* 左の縦書きラベル帯: 上104pxは#0159b3ベタ、そこから下端528pxで白に溶ける。
   中間ストップはカンプ列の画素実測（等間隔サンプル）。 */
.activities__strip {
  position: absolute;
  top: 0;
  left: 0;
  width: 60px;
  height: 528px;
  background: linear-gradient(180deg,
    #0159b3 0%,
    #0159b3 19.7%,
    #1f6ebd 25%,
    #397fc5 30%,
    #518fcc 35%,
    #699ed2 40%,
    #7eadd9 45%,
    #92bade 50%,
    #a4c6e2 55%,
    #b5cfe6 60%,
    #c4d9ec 65%,
    #d4e1f1 70%,
    #e0eaf4 75%,
    #e9f0f8 80%,
    #f1f4f9 85%,
    #f8f9fb 90%,
    #fcfdfe 95%,
    #ffffff 100%);
}
.activities__label {
  position: absolute;
  top: 43px;
  left: 50%;
  transform: translateX(-50%);
  writing-mode: vertical-rl;
  font-family: var(--font-jp);
  font-weight: 500;
  font-size: 23px;
  letter-spacing: 0.240em; /* 既定＝カード4。カード別は下記で上書き */
  line-height: 1;
  color: var(--color-white);
}
/* カンプの縦組み送りは4枚それぞれ違う（重心ピッチ実測・PCとSPのカンプで同じ傾向を確認）。
   カンプ実測 1x: 灯りに出会う28.29 ／ 湯に浸かる27.24 ／ 景色を望む29.09 ／ 雪と遊ぶ28.53
   （旧実装は4枚一律 0.272em＝29.26 で、湯に浸かるが列で+8.1pxはみ出していた）
   トラックは同じ4枚を3セット並べるので nth-child(4n+x) でセット横断に効かせる。 */
.activities__card:nth-child(4n+1) .activities__label { letter-spacing: 0.235em; } /* 灯りに出会う 28.41 */
.activities__card:nth-child(4n+2) .activities__label { letter-spacing: 0.187em; } /* 湯に浸かる  27.30 */
.activities__card:nth-child(4n+3) .activities__label { letter-spacing: 0.265em; } /* 景色を望む  29.10 */
.activities__card:nth-child(4n+4) .activities__label { letter-spacing: 0.240em; } /* 雪と遊ぶ    28.52 */
/* 写真 */
.activities__photo {
  margin-left: 60px;
  width: 300px;
  height: 460px;
  object-fit: cover;
}

/* ---- 末尾ボタン ---- */
.activities__cta {
  display: flex;
  justify-content: center;
  margin-top: 50px;  /* 2026-08-19 市岡さん指示: ボタン上余白をPC50px/SP45pxに統一（カンプのばらつき補正） */
}
/* ラベル字送り: base.css の .u-btn は 0.2em（送り24.0）だが、このセクションのカンプは
   送り21.96px＝fs20px×1.098 ＝ ls 0.1em。ピル自体（290×60・位置）はカンプと一致しているので
   ls と text-indent（＝光学中心補正。indent=ls で中心が保たれる）だけを上書きする。
   カンプ実測 ラベルインク幅148.5px（x608.5–757.0）／実装 旧162.0px（x601.0–763.0） */
.activities__cta .u-btn {
  letter-spacing: 0.1em;
  text-indent: 0.1em;
}

/* 動きを減らす設定の環境ではループを止め、カンプの静止フレームを見せる */
@media (prefers-reduced-motion: reduce) {
  .js .activities__track { animation: none; }
}

/* ==========================================================
   SP（設計幅393px）— 2026-08-05 新SPカンプ
   基準: assets/design_20260805/top_sp_server.jpg（786×20435）の画素実測
   セクション境界: 1x y5540–6400（高さ860）。以下はすべてセクション相対1x座標。

   実測サマリ（1x・セクション相対）
     intro写真   0–225が絵柄（上下の白フェードは焼き込み）→ 高さ240で敷く
     筆記体      x64.0 y253.5 / 261×35.9（PC 603×83 の0.433倍・同一アセット）
     H2インク    y279.5–302.5 / x120.5–273.0（幅152.5＝PCの0.61倍 → 25.6px）
     リード1行目 インクy325.0 / 2行目 y353.0（行間28）・x59.0–332.5（PCの0.667倍 → 14px）
     カード      左端18.5・帯43＋写真216×331・カード高380.2・隙間27.5・ピッチ286.5
                 ＝PCカード（60+300 / 460 / 528 / 39）のほぼ一律0.72倍。
                 帯グラデは%指定なので高さ差し替えだけでPC定義が流用できる
     ラベル      灯 インク上端 y428.0（帯上端＋32）・送り約20.1（PC 29.26の0.72倍）
     ボタン      y771.5–816.5 / x93–307.5（214×45＝sp.cssの共通u-btn）。
                 中心はキャンバス中心より+3.5px（カンプ実測。events/accessの締めボタンは
                 中心ぴったりなのでカンプ側の個体差。padding-leftで再現）
   ========================================================== */
@media (max-width: 767px) {

  .activities { height: 860px; }

  /* intro: SP専用切り出し（img/sp/activities_intro.webp 393×240）。
     PC版と構図が違う（PCは横長2730×1054）ので流用不可 */
  .activities__intro { height: 240px; }

  /* ---- ヘッダー ----
     H2ボックス上端 = intro下端240 + 37.2 = 277.2。インクは +1.83（=0.0714em・PC実測比）で279.0 */
  .activities__head { padding-top: 37.2px; }
  .activities__script {
    left: 64px;
    top: 253.5px;
    width: 261px;
    height: 35.9px;
    /* アセットはPCと同一（1行組の Winter Activities）。
       旧 activities_sp_silver.png は旧カンプの2行組＝新カンプでは使わない */
  }
  .activities__heading {
    padding-left: 1px; /* カンプのH2インク中心は196.75（キャンバス中心+0.25） */
    font-size: 25.6px;
  }
  .activities__lead {
    margin-top: 14.2px; /* H2ボックス下端302.8 → リード行ボックス上端317.0 */
    padding-left: 1.5px; /* 2026-09-02 3クラス送り化で行幅が変わるため再導出（L1左端96.1 / L2左端58.0＝カンプ95.9/58.3） */
    font-size: 14px;
    line-height: 28px;
  }

  /* ---- カード（PC寸法の一律0.72倍。横並び＋2枚目が右端で見切れ＝ループ前提の見た目） ---- */
  .activities__marquee {
    margin-top: 23px;  /* リード下端373 → カード上端396 */
    height: 380.2px;
  }
  .activities__track {
    gap: 27.5px;
    transform: translate3d(18.5px, 0, 0); /* 静止フレーム＝カンプ（1枚目の左端18.5） */
  }
  .activities__card {
    flex: 0 0 259px;
    width: 259px;
    height: 380.2px;
  }
  /* 帯のグラデーションストップは%指定なので高さだけ差し替えればPC定義がそのまま効く
     （青ベタは19.7%＝74.9px＝カンプ実測の470.9で終わる） */
  .activities__strip { width: 43px; height: 380.2px; }
  .activities__label { top: 31.3px; font-size: 16.56px; }
  /* 写真は 432×662 の2x原本を きっかり1/2 に縮小させる（216×331）。
     高さを331.2等の端数にするとブラウザの縮小が2:1から外れて画がにじむ＝diffが跳ねる */
  .activities__photo { margin-left: 43px; width: 216px; height: 331px; }

  /* ボタン: カード帯下端776.2 → ボタン上端771.5（帯の末端4.7pxは白＝重なっても不可視） */
  .activities__cta {
    margin-top: -4.7px;
    padding-left: 7px; /* justify-content:center と合わせて中心を200へ（カンプ実測） */
  }
  /* SPカンプのラベル送りは15.95px。sp.css の .u-btn は fs15px×ls0.14em＝17.15 で+1.2px/字。
     fs は共通部品（events/access/cta と同じ .u-btn）なので触らず、送りだけ 0.064em に落として
     インク幅をカンプ（109.5px）へ合わせる。※カンプの実サイズは fs14px×0.14em 相当＝
     グリフ自体は実装が約7%大きいまま。fsを14pxへ落とすかは全セクション横断で要判断。 */
  .activities__cta .u-btn {
    letter-spacing: 0.064em;
    text-indent: 0.064em;
  }

  /* ループのキーフレームはPC座標（65.5 → -1530.5）なのでSP座標へ差し替える。
     周期 = 4枚 × ピッチ286.5 = 1146px。18.5 → -1127.5 で2セット目の1枚目が
     18.5に来る＝継ぎ目なし。SPでループを止める場合はこの1行を animation:none に */
  .js .activities__track { animation-name: activities-marquee-sp; }
  @keyframes activities-marquee-sp {
    from { transform: translate3d(18.5px, 0, 0); }
    to   { transform: translate3d(-1127.5px, 0, 0); }
  }
}

/* ==========================================================
   【2026-10-06 字間そろえ（字種別の詰めを廃止）】市岡さん指摘「文字が空いている所と詰まっている所の差が気になる」
   （リード「奥飛騨の冬には心ほどける時間があります。」のスクリーンショット）
   旧: かな送り 0.932em（基底 -0.068em）／漢字 1.148em（.kj）／約物 0.670em（.pt）＝カンプの palt 組みを span で再現していたが、
   Web の Zen Old Mincho は palt を持たず、かなだけ詰まり漢字だけ空いて見えていた（10/1 の concept と同じ原因）。
   → 日本語ページだけ、全字を同じ送り（1文字＋0.05em＝TOPの文章 concept と同じ値）にそろえる。
      ※ 現状の平均送りは実寸で 1.00em（かな0.93・漢字1.14 の平均）なので、この行だけは平均より 0.05em 広がる（行幅 PC +27px）。concept との統一を優先
   HTML の span はそのまま（戻す時はこのブロックを消すだけ）。英語ページ（en.html・lang="en"）は対象外
   ========================================================== */
html[lang="ja"] .activities__lead { letter-spacing: 0.05em; }
/* 【約物（市岡さん選択 B・2026-10-06）】読点「、」句点「。」は半角送り（margin-right -0.5em）、中黒「・」は左右均等に半角（margin 0 -0.25em）。
   かな・漢字は一律のまま。JIS X 4051 の約物半角で、字間の広い行で「、」の後が穴に見えるのを防ぐ（トップの文章 concept は 10/1 の全角のまま） */
html[lang="ja"] .activities__lead .kj { letter-spacing: inherit; }
html[lang="ja"] .activities__lead .pt { letter-spacing: inherit; margin-right: -0.5em; }