@charset "UTF-8";
/* =========================================================================
   サーマス 共通ヘッダー / フッター スタイル  (site-header.css)
   - 全ページ共通のヘッダー・グローバルメニュー・What's New・フッターを定義
   - 文字はすべて実テキスト（高精細ディスプレイでも鮮明）
   - 既存CSSと衝突しないよう、専用の "sm" 接頭辞クラスを使用
   - 見た目を変えたいときは、このファイル1か所を直せば全ページに反映されます
   ========================================================================= */

.smHead, .smFoot, .smPagetop{
  font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","Meiryo",sans-serif;
  -webkit-font-smoothing:antialiased;
  box-sizing:border-box;
}
.smHead *, .smFoot *, .smPagetop *{box-sizing:border-box;}

/* ---------- ヘッダー ---------- */
.smHead{background:#fff;}
.smHeadInner{
  width:960px; margin:0 auto; border-top:4px solid #e8720c;
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:16px 20px; padding:16px 20px 12px; flex-wrap:wrap;   /* ← 翻訳で伸びても折り返して重ならない */
}
.smHeadLogo{display:flex; flex-direction:column; align-items:flex-start; gap:7px; flex:0 0 auto;}
.smBrand{display:inline-flex; align-items:center; gap:14px; text-decoration:none; color:inherit;}
.smBrand .smMark{width:64px; height:auto; flex:none; border:0; display:block;}
.smBtxt{display:flex; flex-direction:column; align-items:flex-start; line-height:1.1;}
.smL1{font-size:14px; color:#111; letter-spacing:.04em; margin-bottom:2px;}
.smL2{font-size:25px; font-weight:700; color:#111; letter-spacing:.05em; line-height:1.05;}
.smL2 .smCo{font-size:1em; font-weight:700; color:#111; letter-spacing:inherit; margin:0;}
.smEng{font-size:15px; color:#111; letter-spacing:.1em; margin-top:3px;
  font-family:Arial,Helvetica,sans-serif;}
.smCatch{
  display:inline-block; background:#f3ecd6; color:#5b5340;
  font-size:13px; padding:6px 14px; border-radius:2px; letter-spacing:.02em;
}

.smHeadRight{display:flex; flex-direction:column; align-items:flex-end; gap:12px;
  flex:1 1 360px; min-width:0;}

/* 言語切替（コンパクト。巨大なGoogle一覧の代わり） */
.smLangWrap{display:inline-flex; align-items:center; gap:6px;}
.smLangWrap .smLangIcon{font-size:13px; color:#8a8a8a; line-height:1;}
.smLang{
  font:inherit; font-size:12.5px; color:#555; background:#fff;
  border:1px solid #d8d8d8; border-radius:4px; padding:3px 26px 3px 9px;
  cursor:pointer; -webkit-appearance:none; appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M0 0l5 6 5-6z' fill='%23999'/></svg>");
  background-repeat:no-repeat; background-position:right 9px center;
}
.smLang:hover{border-color:#e8720c;}

/* What's New（横に流れるお知らせ：中身は whats_new.html を iframe 表示） */
.smWhatsNew{
  display:flex; align-items:center; gap:12px; background:#f3ecd6;
  border-radius:3px; padding:9px 16px; width:100%; max-width:560px; min-width:0;
}
.smWnLabel{display:flex; align-items:center; gap:7px; color:#5b5340; font-weight:700;
  font-size:14px; white-space:nowrap; flex:none;}
.smWnLabel svg{flex:none;}
.smWnDivider{width:1px; height:16px; background:#cfc6ac; flex:none;}
.smTickerFrame{flex:1 1 0; min-width:0; height:24px; border:0; background:transparent; display:block;}

/* グローバルメニュー（実テキスト。翻訳で伸びたら折り返す） */
.smNav{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; justify-content:flex-end;}
.smNav li{border-left:1px solid #e2e2e2;}
.smNav li:last-child{border-right:1px solid #e2e2e2;}
.smNav a{display:block; padding:5px 15px; text-align:center; text-decoration:none; line-height:1.25; white-space:nowrap;}
.smNav .smJa{display:block; font-size:17px; font-weight:700; color:#4a4a4a; letter-spacing:.02em;}
.smNav .smEn{display:block; font-size:10.5px; color:#b3b3b3; letter-spacing:.06em; margin-top:2px;}
.smNav li.on .smJa, .smNav a:hover .smJa{color:#e8720c;}
.smNav li.on .smEn{color:#e8720c;}

/* ---------- ページトップ ---------- */
.smPagetop{text-align:right; width:960px; margin:0 auto; padding:12px 20px 0;}
.smPagetop a{font-size:12px; color:#9a9a9a; text-decoration:none;}
.smPagetop a:hover{color:#e8720c;}

/* ---------- フッター ---------- */
.smFoot{background:#3c3f36; color:#d6d6ce; margin-top:20px;}
.smFootInner{width:960px; margin:0 auto; padding:24px 20px; text-align:center;}
.smFootNav{list-style:none; margin:0 0 14px; padding:0; display:flex; justify-content:center; flex-wrap:wrap;}
.smFootNav li{padding:0 16px; border-right:1px solid #5a5d52;}
.smFootNav li:last-child{border-right:0;}
.smFootNav a{color:#e2e2da; text-decoration:none; font-size:13px;}
.smFootNav a:hover{color:#fff; text-decoration:underline;}
.smCopy{margin:0; font-size:12px; color:#a5a89c; letter-spacing:.02em;}

/* ---------- Google翻訳のデフォルトUIを隠す（自前の言語セレクトで操作） ---------- */
/* ウィジェット本体はDOMに残す（機能に必要）が画面外へ */
#google_translate_element{position:absolute !important; left:-9999px !important; top:-9999px !important;
  width:1px; height:1px; overflow:hidden;}
/* 上部に出る翻訳バーを隠し、bodyのずれを打ち消す */
.goog-te-banner-frame{display:none !important;}
.goog-te-banner-frame.skiptranslate{display:none !important;}
body{top:0 !important; position:static !important;}

/* 画面が960pxより狭いときは横スクロール（元サイトと同じ固定幅運用） */