/* =============================================================
   DENBA English site — 日本語サイトのテーマCSSに対する「差分だけ」
   -------------------------------------------------------------
   デザインは日本語サイト（themes/denbajp/style.css・phone.css）に
   合わせる方針。したがってこのファイルは独自のデザインを持たず、
   英語表示でだけ必要になる調整だけを書く。

   ★ここに .btn / .sec / .inr など「テーマ側の主要クラス」を
     上書きするルールを足さないこと。日本語サイトとデザインがずれる。
   ============================================================= */

/* --- ヘッダー右上：日本語サイトはフリーダイヤル画像＋番号。
       英語サイトは国内フリーダイヤルが使えないためメールに置き換える。
       周りの余白・文字サイズはテーマの .header_tel_block を活かす。 --- */
.header_tel_block .number.en_mail{
  display:flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}
.header_tel_block .number.en_mail i{
  font-size:.86em;
  opacity:.75;
}

/* スマホ幅では、メールアドレスが日本語サイトの電話番号より長く、
   左の取扱店マークに重なる（390px で実測）。文字を詰め、
   補足文は畳む。メール導線はハンバーガーメニューの中に残っている。 */
@media screen and (max-width: 768px){
  .header_tel_block .number.en_mail{
    font-size:1.2rem;
    justify-content:flex-end;
    gap:5px;
  }
  .header_tel_block .txt{
    display:none;
  }
}

/* --- 英語は日本語より1語が長い。ボタン内で折り返して
       高さがバラつくのを防ぐ。 --- */
header .btn_blocks .btn{
  white-space:nowrap;
}

/* --- 薬機法配慮の免責文（日本語サイトには無いブロック）。
       フッター下部のトーンに合わせる。 --- */
.footer-disclaimer-en{
  background:#0e1a28;
  color:#8496aa;
  font-size:12px;
  line-height:1.9;
  padding:20px 0;
  border-top:1px solid #1d2c3e;
}
.footer-disclaimer-en p{
  margin:0;
}

/* --- 日本語向けの行間・字送りは英文だと詰まって見えるので、
       本文テキストだけ僅かに開ける（見出しは触らない）。 --- */
.en-site .sec_head .txt,
.en-site .product_lists .txt,
.en-site .index_user_voice .txt_content p{
  line-height:1.85;
}

/* --- ヒーローのロゴ。日本語サイトはインラインSVG、
       英語サイトは同じSVGを外部ファイルで読むためサイズを指定する。 --- */
#topbnr .logg_img img{
  width:234px;
  max-width:60%;
  height:auto;
}

/* --- 取扱店マーク。日本語の「取扱店」より英語の方が長いので
       折り返さないようにする。 --- */
header .agency_logo .txt{
  white-space:nowrap;
}

/* --- アスリート帯（.type02）は右下に img_taisou.png が背景で入る。
       日本語の見出しは短いので当たらないが、英文は横に伸びて
       人物写真に重なる（1280px で実測）。左カラムに上限幅を与える。 --- */
.en-site .bnr_technology_block.type02 .flex .left{
  max-width:56%;
}
@media screen and (max-width: 900px){
  .en-site .bnr_technology_block.type02 .flex .left{
    max-width:none;
  }
}


/* =============================================================
   ここから下は「日本語トップのページ内 <style> をそのまま写したもの」
   -------------------------------------------------------------
   .intro_feature_grid（実績3枚組）と .index_pet_bnr（DENBA Pet 帯）は
   テーマの style.css ではなく **日本語トップのインラインCSS** で
   定義されている。英語ページは同じ <style> を持たないため、
   ここに写さないとレイアウトが崩れる。
   ★日本語トップ側でこの2ブロックのデザインを変えたら、ここも合わせること。
   ============================================================= */
/*== intro-feat-css ==*/

				.denba_intro .intro_feature_grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:46px;border-radius:16px;overflow:hidden;box-shadow:0 18px 44px rgba(16,36,61,.16);}
				.denba_intro .intro_feature{position:relative;display:block;overflow:hidden;min-height:470px;text-decoration:none;}
				.denba_intro .intro_feature + .intro_feature{box-shadow:inset 1px 0 0 rgba(255,255,255,.16);}
				.denba_intro .intro_feature:hover{transform:none;}
				.denba_intro .intro_feature .if-bg{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .6s ease;}
				.denba_intro .intro_feature:hover .if-bg{transform:scale(1.07);}
				.denba_intro .intro_feature .if-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,22,40,.10) 0%,rgba(10,22,40,.5) 52%,rgba(8,18,32,.9) 100%);}
				.denba_intro .intro_feature .if-body{position:absolute;left:0;right:0;bottom:0;padding:26px 26px 28px;text-align:left;}
				.denba_intro .intro_feature .num{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.18em;color:#7fe3d4;margin-bottom:12px;}
				.denba_intro .intro_feature .feature_title{display:block;font-size:21px;font-weight:800;color:#fff;-webkit-text-fill-color:#fff;line-height:1.4;margin:0 0 10px;letter-spacing:.01em;}
				.denba_intro .intro_feature .if-text{display:block;font-size:13.5px;color:#dce4f0;line-height:1.75;}
				.denba_intro .intro_feature .if-go{position:absolute;top:20px;right:20px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.16);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;line-height:1;transition:background .2s,transform .2s;}
				.denba_intro .intro_feature:hover .if-go{background:rgba(255,255,255,.32);transform:translateX(2px);}
				@media(max-width:760px){.denba_intro .intro_feature_grid{grid-template-columns:1fr;gap:16px;margin-top:32px;}.denba_intro .intro_feature{min-height:210px;}}
				
/*== index-pet-css ==*/

	#index.modern-home .index_pet_bnr{max-width:1180px;margin:64px auto 0;padding:0 20px;}
	#index.modern-home .index_pet_bnr .pet_inner{display:flex;align-items:stretch;background:#fbf7f1;border-radius:14px;overflow:hidden;box-shadow:0 10px 30px rgba(22,36,61,.07);}
	#index.modern-home .index_pet_bnr .pet_img{flex:0 0 47%;}
	#index.modern-home .index_pet_bnr .pet_img img{display:block;width:100%;height:100%;min-height:320px;object-fit:cover;}
	#index.modern-home .index_pet_bnr .pet_txt{flex:1 1 auto;display:flex;flex-direction:column;justify-content:center;padding:44px 46px;}
	#index.modern-home .index_pet_bnr .pet_ey{margin:0 0 14px;font-size:12px;font-weight:700;letter-spacing:.18em;color:#ad8a4e;}
	#index.modern-home .index_pet_bnr .pet_tit{margin:0 0 18px;font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-size:30px;font-weight:600;line-height:1.5;color:#16243d;}
	#index.modern-home .index_pet_bnr .pet_lead{margin:0 0 14px;font-size:15px;line-height:2;color:#40506a;word-break:auto-phrase;text-wrap:pretty;}
	#index.modern-home .index_pet_bnr .pet_spec{margin:0 0 26px;font-size:13px;line-height:1.9;color:#7a869c;word-break:auto-phrase;text-wrap:pretty;}
	#index.modern-home .index_pet_bnr sup{font-size:.55em;vertical-align:super;margin-right:.14em;}
	#index.modern-home .index_pet_bnr .pet_btn{align-self:flex-start;display:inline-flex;align-items:center;justify-content:center;min-width:264px;padding:15px 30px;border-radius:999px;background:#16243d;color:#fff;font-size:15px;font-weight:700;text-decoration:none;transition:background .25s,transform .25s;}
	#index.modern-home .index_pet_bnr .pet_btn:hover{background:#034097;color:#fff;transform:translateY(-2px);}
	/* 直下のヘルスケアバナー（全幅バンド）に上余白が無く密着するため、ペットブロックと同値で揃える */
	#index.modern-home .bnr_technology_block.type02{margin-top:64px;}
	@media(max-width:900px){
		#index.modern-home .bnr_technology_block.type02{margin-top:46px;}
	}
	@media(max-width:900px){
		#index.modern-home .index_pet_bnr{margin-top:46px;padding:0 14px;}
		#index.modern-home .index_pet_bnr .pet_inner{flex-direction:column;}
		#index.modern-home .index_pet_bnr .pet_img{flex:none;width:100%;}
		#index.modern-home .index_pet_bnr .pet_img img{min-height:0;height:210px;}
		#index.modern-home .index_pet_bnr .pet_txt{padding:28px 22px 32px;}
		#index.modern-home .index_pet_bnr .pet_tit{font-size:23px;}
		#index.modern-home .index_pet_bnr .pet_lead{font-size:14.5px;line-height:1.95;}
		#index.modern-home .index_pet_bnr .pet_btn{width:100%;min-width:0;}
	}
	

/* ── ヘッダーのキャッチコピー ────────────────────────────────────────────
   本体テーマは `header h1{font-size:1.2rem}` でこの1行を小さく見せている。
   ただし全ページ共通の文言なので、下層ページでは「そのページの h1」と
   2本立ちして、検索エンジンにページ固有のテーマが伝わらなくなっていた。
   → tools/apply-en-seo.mjs が <p class="site-tagline"> に落としている。
     テーマ側の `header h1` が効かなくなるので、同じ見た目をここで与える。 */
header .site-tagline{ font-size: 1.2rem; margin: 0; font-weight: inherit; line-height: inherit; }
