/* =========================================================
   COROHIME ブランドページ用CSS
   - 全セレクタを .cr-page 配下にスコープ
     （DMS共通ヘッダー・フッターのスタイルに干渉しません）
   - メインオレンジ : カローラ店オレンジ系 #F78F22
   - サブオレンジ   : corohime.com テーマカラー #FF6E01
   - フォント       : 游ゴシック統一
========================================================= */
.cr-page{
  --cr-orange:#F78F22;
  --cr-orange-deep:#FF6E01;
  --cr-orange-pale:#FFF3E6;
  --cr-green:#4FAE6B;
  --cr-green-pale:#EEF6EC;
  --cr-blue:#4A9FCB;
  --cr-blue-pale:#EBF4F9;
  --cr-cream:#FBF7F0;
  --cr-text:#3C3C3C;
  --cr-gray:#888;
  --cr-line:#E8E2D8;
  font-family:"游ゴシック体",YuGothic,"游ゴシック Medium","Yu Gothic Medium","游ゴシック","Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  font-size:16px;line-height:2;color:var(--cr-text);background:#fff;
  -webkit-font-smoothing:antialiased;
}
html,body{margin:0;padding:0;}
.cr-page,.cr-page *{margin:0;padding:0;box-sizing:border-box;}
.cr-page img{max-width:100%;display:block;border:0;height:auto;}
.cr-page a{color:inherit;}
.cr-page .cr-inner{max-width:1140px;margin:0 auto;padding:0 24px;}

/* ===== スクロールリビール共通 ===== */
.cr-page .cr-reveal{opacity:0;transform:translateY(36px);transition:opacity .9s cubic-bezier(.22,.61,.36,1),transform .9s cubic-bezier(.22,.61,.36,1);}
.cr-page .cr-reveal.is-visible{opacity:1;transform:none;}
.cr-page .cr-reveal.cr-d1{transition-delay:.12s;}
.cr-page .cr-reveal.cr-d2{transition-delay:.24s;}
.cr-page .cr-reveal-left{opacity:0;transform:translateX(-48px);transition:opacity 1s cubic-bezier(.22,.61,.36,1),transform 1s cubic-bezier(.22,.61,.36,1);}
.cr-page .cr-reveal-left.is-visible{opacity:1;transform:none;}
.cr-page .cr-reveal-right{opacity:0;transform:translateX(48px);transition:opacity 1s cubic-bezier(.22,.61,.36,1),transform 1s cubic-bezier(.22,.61,.36,1);}
.cr-page .cr-reveal-right.is-visible{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){
  .cr-page .cr-reveal,.cr-page .cr-reveal-left,.cr-page .cr-reveal-right{opacity:1;transform:none;transition:none;}
  .cr-page .cr-marquee-track,.cr-page .cr-word-track{animation:none!important;}
}

/* ===== ヒーロー ===== */
.cr-page .cr-hero{position:relative;overflow:hidden;background:linear-gradient(160deg,#FFF6EC 0%,var(--cr-cream) 70%,#FFF0DF 100%);}
.cr-page .cr-hero::before{content:"";position:absolute;right:-140px;top:-140px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(247,143,34,.20),rgba(247,143,34,0) 70%);}
.cr-page .cr-hero::after{content:"";position:absolute;left:-160px;bottom:-180px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(255,110,1,.12),rgba(255,110,1,0) 70%);}
.cr-page .cr-hero .cr-inner{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;padding-top:84px;padding-bottom:96px;}
.cr-page .cr-label{display:inline-block;background:var(--cr-orange-deep);color:#fff;font-size:13px;font-weight:bold;letter-spacing:.2em;padding:5px 20px;border-radius:999px;margin-bottom:22px;}
.cr-page .cr-hero-sub{font-size:15px;font-weight:500;color:var(--cr-gray);letter-spacing:.2em;margin-bottom:6px;}
.cr-page .cr-brand-logo{font-size:64px;font-weight:bold;letter-spacing:.05em;line-height:1.15;color:var(--cr-text);}
.cr-page .cr-brand-logo .cr-brand{color:var(--cr-orange-deep);letter-spacing:.08em;}
.cr-page .cr-tagline{font-size:27px;font-weight:bold;letter-spacing:.18em;margin:20px 0 22px;}
.cr-page .cr-lead{font-size:15.5px;line-height:2.3;max-width:34em;}
.cr-page .cr-hero-photo{position:relative;}
.cr-page .cr-hero-photo img{border-radius:24px;box-shadow:0 18px 50px rgba(150,90,10,.20);aspect-ratio:4/3;object-fit:cover;width:100%;}
.cr-page .cr-badge{position:absolute;left:-18px;bottom:-18px;background:#fff;border-radius:16px;padding:14px 24px;box-shadow:0 8px 26px rgba(0,0,0,.12);font-size:13px;font-weight:bold;line-height:1.7;}
.cr-page .cr-badge .cr-badge-en{color:var(--cr-orange-deep);font-size:15px;letter-spacing:.08em;}
/* ヒーロー登場アニメ */
.cr-page .cr-label,.cr-page .cr-hero-sub,.cr-page .cr-brand-logo,.cr-page .cr-tagline,.cr-page .cr-lead{opacity:0;transform:translateY(28px);animation:crHeroUp .9s cubic-bezier(.22,.61,.36,1) forwards;}
.cr-page .cr-hero-sub{animation-delay:.1s;}
.cr-page .cr-brand-logo{animation-delay:.2s;}
.cr-page .cr-tagline{animation-delay:.35s;}
.cr-page .cr-lead{animation-delay:.5s;}
.cr-page .cr-hero-photo{opacity:0;transform:translateY(40px) scale(.97);animation:crHeroUp 1.1s .35s cubic-bezier(.22,.61,.36,1) forwards;}
@keyframes crHeroUp{to{opacity:1;transform:none;}}
/* 背景に流れる巨大タイポ */
.cr-page .cr-word-loop{position:absolute;left:0;bottom:18px;width:100%;overflow:hidden;pointer-events:none;z-index:1;}
.cr-page .cr-word-track{display:flex;white-space:nowrap;animation:crWordmove 38s linear infinite;}
.cr-page .cr-word-track span{font-size:110px;font-weight:bold;letter-spacing:.06em;color:rgba(247,143,34,.10);padding-right:.6em;line-height:1;}
@keyframes crWordmove{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ===== 写真マーキー ===== */
.cr-page .cr-photo-marquee{padding:64px 0;background:#fff;overflow:hidden;}
.cr-page .cr-strip{overflow:hidden;}
.cr-page .cr-strip + .cr-strip{margin-top:18px;}
.cr-page .cr-marquee-track{display:flex;gap:18px;width:-webkit-max-content;width:max-content;animation:crMarquee 46s linear infinite;}
.cr-page .cr-strip.cr-reverse .cr-marquee-track{animation:crMarqueeR 52s linear infinite;}
.cr-page .cr-marquee-track figure{flex:0 0 auto;width:330px;aspect-ratio:3/2;border-radius:18px;overflow:hidden;position:relative;}
.cr-page .cr-marquee-track img{width:100%;height:100%;object-fit:cover;}
.cr-page .cr-marquee-track figcaption{position:absolute;left:0;bottom:0;width:100%;padding:24px 16px 10px;font-size:12px;font-weight:bold;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.55));letter-spacing:.08em;}
@keyframes crMarquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@keyframes crMarqueeR{from{transform:translateX(-50%);}to{transform:translateX(0);}}

/* ===== セクション共通 ===== */
.cr-page section{padding:96px 0;display:block;}
.cr-page .cr-sec-head{text-align:center;margin-bottom:56px;}
.cr-page .cr-sec-en{display:block;color:var(--cr-orange-deep);font-size:15px;font-weight:bold;letter-spacing:.3em;margin-bottom:10px;}
.cr-page .cr-sec-ja{font-size:34px;font-weight:bold;letter-spacing:.12em;line-height:1.5;}
.cr-page .cr-deco{display:block;width:54px;height:4px;border-radius:2px;margin:20px auto 0;background:var(--cr-orange-deep);}

/* ===== ブランドステートメント ===== */
.cr-page .cr-statement{background:#fff;padding-top:48px;}
.cr-page .cr-formula{display:flex;align-items:center;justify-content:center;gap:22px;flex-wrap:nowrap;margin-bottom:48px;}
.cr-page .cr-f-row{display:contents;}
.cr-page .cr-chip{background:var(--cr-cream);border:2px solid var(--cr-line);border-radius:20px;padding:22px 38px;text-align:center;min-width:230px;}
.cr-page .cr-chip-en{font-size:25px;font-weight:bold;display:block;line-height:1.4;letter-spacing:.08em;}
.cr-page .cr-chip small{display:block;font-size:13px;color:var(--cr-gray);margin-top:4px;font-weight:normal;}
.cr-page .cr-op{font-size:36px;font-weight:bold;color:var(--cr-orange-deep);line-height:1;}
.cr-page .cr-op .cr-sp{display:none;}
.cr-page .cr-chip.cr-result{background:var(--cr-orange-pale);border-color:var(--cr-orange);}
.cr-page .cr-chip.cr-result .cr-chip-en{color:var(--cr-orange-deep);font-size:28px;}
.cr-page .cr-copy{max-width:760px;margin:0 auto;text-align:center;font-size:17px;line-height:2.5;}
.cr-page .cr-copy strong{color:var(--cr-orange-deep);font-size:21px;}

/* ===== 3つの想い ===== */
.cr-page .cr-values{background:var(--cr-cream);position:relative;overflow:hidden;}
.cr-page .cr-values::before{content:"VALUES";position:absolute;right:-10px;top:8px;font-size:140px;font-weight:bold;letter-spacing:.04em;color:rgba(247,143,34,.07);line-height:1;pointer-events:none;}
.cr-page .cr-values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;position:relative;}
.cr-page .cr-value-card{background:#fff;border-radius:22px;padding:44px 32px;text-align:center;box-shadow:0 6px 24px rgba(150,90,10,.08);transition:transform .4s ease,box-shadow .4s ease;}
.cr-page .cr-value-card:hover{transform:translateY(-8px);box-shadow:0 16px 36px rgba(150,90,10,.14);}
.cr-page .cr-num{font-size:14px;font-weight:bold;letter-spacing:.2em;color:var(--cr-orange-deep);}
.cr-page .cr-icon{font-size:46px;line-height:1;margin:16px 0 20px;}
.cr-page .cr-value-card h3{font-size:21px;font-weight:bold;letter-spacing:.06em;margin-bottom:16px;line-height:1.7;}
.cr-page .cr-value-card p{font-size:14.5px;line-height:2.05;text-align:left;}

/* ===== ブランドの広がり ===== */
.cr-page .cr-map-note{text-align:center;font-size:16px;margin-bottom:64px;line-height:2.3;}
.cr-page .cr-map-note strong{color:var(--cr-orange-deep);}
.cr-page .cr-dest{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;border-radius:26px;overflow:hidden;box-shadow:0 10px 36px rgba(0,0,0,.08);margin-bottom:64px;background:#fff;}
.cr-page .cr-photo{min-height:360px;overflow:hidden;}
.cr-page .cr-photo img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease;}
.cr-page .cr-dest:hover .cr-photo img{transform:scale(1.05);}
.cr-page .cr-body{padding:52px 48px;display:flex;flex-direction:column;justify-content:center;}
.cr-page .cr-cat{display:inline-block;align-self:flex-start;color:#fff;font-size:12px;font-weight:bold;letter-spacing:.12em;padding:5px 18px;border-radius:999px;margin-bottom:18px;}
.cr-page .cr-dest h3{font-size:29px;font-weight:bold;letter-spacing:.06em;line-height:1.4;}
.cr-page .cr-dest h3 small{display:block;font-size:14px;font-weight:normal;color:var(--cr-gray);letter-spacing:.06em;margin-top:6px;}
.cr-page .cr-desc{font-size:14.5px;line-height:2.15;margin:20px 0 28px;}
.cr-page .cr-btn{align-self:flex-start;display:inline-block;color:#fff;text-decoration:none;font-size:14px;font-weight:bold;letter-spacing:.08em;padding:14px 42px;border-radius:999px;transition:opacity .2s,transform .2s;}
.cr-page .cr-btn:hover{opacity:.85;transform:translateX(4px);}
.cr-page .cr-btn::after{content:" →";}
.cr-page .cr-park .cr-cat,.cr-page .cr-park .cr-btn{background:var(--cr-green);}
.cr-page .cr-park .cr-body{background:var(--cr-green-pale);}
.cr-page .cr-river .cr-cat,.cr-page .cr-river .cr-btn{background:var(--cr-blue);}
.cr-page .cr-river .cr-body{background:var(--cr-blue-pale);}
.cr-page .cr-river .cr-photo{order:2;}
.cr-page .cr-river .cr-body{order:1;}
.cr-page .cr-media .cr-cat,.cr-page .cr-media .cr-btn{background:var(--cr-orange-deep);}
.cr-page .cr-media .cr-body{background:var(--cr-orange-pale);}

/* ===== 締めのメッセージ ===== */
.cr-page .cr-closing{position:relative;background:var(--cr-orange-deep);color:#fff;text-align:center;overflow:hidden;padding:110px 0;}
.cr-page .cr-closing .cr-word-loop{position:absolute;left:0;top:50%;transform:translateY(-50%);width:100%;overflow:hidden;pointer-events:none;bottom:auto;}
.cr-page .cr-closing .cr-word-track span{color:rgba(255,255,255,.08);font-size:150px;}
.cr-page .cr-closing .cr-inner{position:relative;z-index:1;}
.cr-page .cr-closing h2{font-size:32px;font-weight:bold;letter-spacing:.18em;line-height:1.9;margin-bottom:22px;}
.cr-page .cr-closing p{max-width:720px;margin:0 auto;font-size:15px;line-height:2.4;}

/* ===== レスポンシブ =====
   テンプレート推奨ブレイクポイント（sp:-767 / tab:768-1279 / pc:1280-）に対応 */
@media screen and (max-width:1279px){
  .cr-page .cr-hero .cr-inner{grid-template-columns:1fr;}
  .cr-page .cr-brand-logo{font-size:48px;}
  .cr-page .cr-word-track span{font-size:80px;}
  .cr-page .cr-values-grid{grid-template-columns:1fr;}
  .cr-page .cr-values::before{font-size:90px;}
  .cr-page .cr-dest{grid-template-columns:1fr;}
  .cr-page .cr-river .cr-photo{order:0;}
  .cr-page .cr-river .cr-body{order:1;}
  /* 数式：COROLLA × HIMEJI を1行 → ↓ → COROHIME の縦組みに */
  .cr-page .cr-formula{flex-direction:column;gap:18px;}
  .cr-page .cr-f-row{display:flex;align-items:center;justify-content:center;gap:14px;width:100%;}
  .cr-page .cr-chip{min-width:0;flex:0 1 auto;padding:16px 22px;}
  .cr-page .cr-chip-en{font-size:19px;}
  .cr-page .cr-chip small{font-size:11.5px;margin-top:2px;}
  .cr-page .cr-op{font-size:26px;}
  .cr-page .cr-op.cr-eq .cr-pc{display:none;}
  .cr-page .cr-op.cr-eq .cr-sp{display:block;font-size:30px;animation:crBounceDown 1.6s ease-in-out infinite;}
  .cr-page .cr-chip.cr-result{padding:20px 48px;}
  .cr-page .cr-chip.cr-result .cr-chip-en{font-size:25px;}
}
@keyframes crBounceDown{0%,100%{transform:translateY(0);}50%{transform:translateY(8px);}}
@media screen and (max-width:767px){
  .cr-page .cr-hero .cr-inner{padding-top:56px;padding-bottom:72px;}
  .cr-page .cr-brand-logo{font-size:37px;letter-spacing:.02em;}
  .cr-page .cr-tagline{font-size:20px;letter-spacing:.1em;}
  .cr-page .cr-word-track span{font-size:56px;}
  .cr-page .cr-sec-ja{font-size:25px;}
  .cr-page .cr-copy{font-size:15px;}
  .cr-page .cr-copy strong{font-size:18px;}
  .cr-page .cr-chip{padding:13px 16px;}
  .cr-page .cr-chip-en{font-size:16.5px;letter-spacing:.04em;}
  .cr-page .cr-chip small{font-size:11px;}
  .cr-page .cr-op{font-size:21px;}
  .cr-page .cr-chip.cr-result{padding:18px 40px;}
  .cr-page .cr-chip.cr-result .cr-chip-en{font-size:22px;}
  .cr-page .cr-marquee-track figure{width:230px;}
  .cr-page .cr-body{padding:36px 26px;}
  .cr-page .cr-dest h3{font-size:23px;}
  .cr-page .cr-closing h2{font-size:23px;letter-spacing:.1em;}
  .cr-page .cr-closing .cr-word-track span{font-size:80px;}
  .cr-page section{padding:64px 0;}
}

/* ===== 改修追加分（マーキー一時停止／フォーカス表示／画像フェード） ===== */
/* マウス・フォーカス中はマーキーを一時停止（写真を見やすく） */
.cr-page .cr-strip:hover .cr-marquee-track,
.cr-page .cr-strip:focus-within .cr-marquee-track{animation-play-state:paused;}
/* キーボード操作時のフォーカス表示（マウスクリックでは出ない） */
.cr-page .cr-btn:focus-visible{outline:3px solid var(--cr-text);outline-offset:3px;}
/* FIELD写真：読み込み完了でふわっと表示（JS有効時のみ／hover拡大も維持） */
.cr-page.cr-js .cr-photo img.cr-fade{opacity:0;transition:transform .8s ease,opacity .8s ease;}
.cr-page.cr-js .cr-photo img.cr-fade.is-loaded{opacity:1;}

/* ===== v5：FIELDを4構成化（KOTI／TOWNBASE 追加） ===== */
.cr-page{--cr-beige:#B0966C;--cr-beige-pale:#F5EFE5;}
/* FIELD 03 KOTI（ブランドオレンジ・写真左） */
.cr-page .cr-koti .cr-cat,.cr-page .cr-koti .cr-btn{background:var(--cr-orange-deep);}
.cr-page .cr-koti .cr-body{background:var(--cr-orange-pale);}
/* FIELD 04 TOWNBASE（ベージュ・写真右） */
.cr-page .cr-townbase .cr-cat,.cr-page .cr-townbase .cr-btn{background:var(--cr-beige);}
.cr-page .cr-townbase .cr-body{background:var(--cr-beige-pale);}
.cr-page .cr-townbase .cr-photo{order:2;}
.cr-page .cr-townbase .cr-body{order:1;}
@media screen and (max-width:1279px){
  .cr-page .cr-townbase .cr-photo{order:0;}
}
