@charset "UTF-8";
/* ============================================================
modern.css - Bait Breath rev.4
------------------------------------------------------------
ホームページビルダーの表レイアウトを一切変更せず、
見た目だけを現代化するオーバーレイCSS。
HTML側は の最後に次の1行を追加するだけ:
※必ず topic.css / pankuzu.css など既存CSSより「後」に置くこと。
対象ページ:
toppage.html … トップページ（5ボタンナビ・商品カード）
informationpage.html … お知らせページ（10ボタンナビ・本文）
★rev.4 の変更点
- HPBが自動挿入する style="width : 1375px" を無効化
- Goodsボタン復活に伴い bb-nav-disabled の扱いを整理
- ナビ整列の指定を style属性より強く効くよう調整
目次:
1 カラートークン
2 基本リセット
3 幅の可変化
4 ナビゲーション（共通）
5 ナビゲーション A: 5ボタン（トップページ）
6 ナビゲーション B: 10ボタン（お知らせページ）
7 SNSアイコン
8 商品カード（トップページ）
9 font要素の再定義
10 帯・区切り線
11 スライドショー / カルーセル
12 ストアバナー
13 フッター
14 本文エリア（お知らせページ）
15 スマートフォン（820px以下）
16 スマートフォン（480px以下）
17 モーション低減・印刷
============================================================ */
/* ============================================================
1. カラートークン
============================================================ */
:root{
--bb-bg: #0a0a0a;
--bb-surface: #141414;
--bb-card: #ffffff;
--bb-card-sub: #ebebeb;
--bb-text: #f2f2f2;
--bb-text-dark: #111111;
--bb-accent: #e60012;
--bb-accent-dk: #a3000d;
--bb-radius: 10px;
--bb-shadow: 0 2px 8px rgba(0,0,0,.45);
--bb-shadow-hi: 0 10px 28px rgba(0,0,0,.65);
--bb-ease: cubic-bezier(.2,.7,.3,1);
--bb-font: "Helvetica Neue","Segoe UI",
"Hiragino Kaku Gothic ProN","Noto Sans JP",
"メイリオ",Meiryo,sans-serif;
}
/* ============================================================
2. 基本リセット
============================================================ */
html{ -webkit-text-size-adjust:100%; }
body[bgcolor]{
background:var(--bb-bg) !important;
color:var(--bb-text) !important;
margin:0 !important;
font-family:var(--bb-font) !important;
line-height:1.7;
overflow-x:hidden;
}
*,*::before,*::after{ box-sizing:border-box; }
img{ max-width:100%; height:auto; border:0; vertical-align:middle; }
/* ============================================================
3. 幅の可変化（950px固定 → 最大950pxの可変）
============================================================ */
table[width="950"]{
width:100% !important;
max-width:950px !important;
margin-left:auto !important;
margin-right:auto !important;
border-collapse:separate !important;
border-spacing:0 !important;
}
/* ------------------------------------------------------------
★HPBが自動挿入する style="width : 1375px" を打ち消す
表を編集すると付与され、950pxを超えて列幅が崩れる原因になる。
HTMLからは消さずCSSで無効化する（HPBが再度書き戻すため）。
------------------------------------------------------------ */
td[style*="1375px"],
td[style*="width : 1375"],
td[style*="width:1375"]{
width:auto !important;
max-width:950px !important;
}
/* ============================================================
4. ナビゲーション（共通）
------------------------------------------------------------
★ボタンが折り返す最大の原因は、 や ![]()
の「間の改行」が
半角スペースとして描画されること。font-size:0 で潰す。
============================================================ */
a[id^="HPB_ROLLOVER"]{
display:inline-block;
vertical-align:top;
overflow:hidden;
transition:transform .25s var(--bb-ease),
box-shadow .25s var(--bb-ease),
filter .25s var(--bb-ease);
outline-offset:3px;
}
a[id^="HPB_ROLLOVER"]:hover{
transform:translateY(-3px);
filter:brightness(1.08);
}
a[id^="HPB_ROLLOVER"]:focus-visible{ outline:2px solid var(--bb-accent); }
a[id^="HPB_ROLLOVER"] img{ display:block; }
/* ------------------------------------------------------------
リンク先が未作成のボタン用クラス
------------------------------------------------------------
★注意★
このクラスが付いている間、ボタンはグレー表示かつクリック不可。
ページを作成してリンクを復活させたら、必ず
class="bb-nav-disabled" をHTMLから削除すること。
なお で囲まれている場合は誤用の可能性が高いため、
下の指定でクリック可能な状態に戻す（安全側に倒す）。
------------------------------------------------------------ */
img.bb-nav-disabled{
opacity:.30;
filter:grayscale(100%);
cursor:default;
pointer-events:none;
}
/* の中にある場合＝リンク復活済みとみなし、無効化を解除する */
a[href] img.bb-nav-disabled{
opacity:1;
filter:none;
cursor:pointer;
pointer-events:auto;
}
/* ============================================================
5. ナビゲーション A: 5ボタン（トップページ）
190px × 5 = 950px
============================================================ */
/* :has() は古いiOS Safariで未対応のため使わない。
colspan="5" のセルすべてに適用する（画像バナー行にも当たるが
font-size:0 は画像の表示に影響しないため無害）。 */
td[colspan="5"]{
font-size:0 !important;
line-height:0 !important;
letter-spacing:0 !important;
word-spacing:0 !important;
padding:0 !important;
}
/* ボタン行のみ折り返し禁止 */
td[colspan="5"][height="50"],
td[colspan="5"][width="950"]{
white-space:nowrap !important;
}
td[colspan="5"] a[id^="HPB_ROLLOVER"]{
font-size:0 !important;
line-height:0 !important;
margin:0 !important;
padding:0 !important;
border-radius:var(--bb-radius);
}
td[colspan="5"] a[id^="HPB_ROLLOVER"]:hover{
box-shadow:0 6px 18px rgba(230,0,18,.35);
}
td[colspan="5"] a[id^="HPB_ROLLOVER"] img[width="190"]{
width:190px !important;
height:110px !important;
margin:0 !important;
}
/* font-size:0 の巻き添えで文字が消えないよう、子要素で明示的に戻す */
td[colspan="5"] font,
td[colspan="5"] b,
td[colspan="5"] span,
td[colspan="5"] p{
font-size:medium;
line-height:1.7;
}
td[colspan="5"] font[size="+1"]{ font-size:clamp(14px,1.55vw,17px) !important; }
td[colspan="5"] font[size="-1"]{ font-size:clamp(11px,1.15vw,13px) !important; }
/* ============================================================
6. ナビゲーション B: 10ボタン（お知らせページ）
190px × 5 = 950px を上下2段
============================================================ */
table[bgcolor="#cc0000"] td[colspan="4"]{
font-size:0 !important;
line-height:0 !important;
letter-spacing:0 !important;
word-spacing:0 !important;
white-space:nowrap !important;
padding:0 !important;
width:950px !important;
max-width:950px !important;
text-align:center !important;
}
table[bgcolor="#cc0000"] td[colspan="4"] a{
display:inline-block;
vertical-align:top;
font-size:0 !important;
line-height:0 !important;
margin:0 !important;
padding:0 !important;
}
table[bgcolor="#cc0000"] td[colspan="4"] img[width="190"]{
display:inline-block;
vertical-align:top;
width:190px !important;
height:55px !important;
margin:0 !important;
border:0 !important;
}
/* ロゴ帯は全幅のまま */
table[bgcolor="#cc0000"] td[colspan="4"] img[width="950"]{
width:950px !important;
max-width:100% !important;
height:auto !important;
}
/* font-size:0 の巻き添え防止 */
table[bgcolor="#cc0000"] td[colspan="4"] font,
table[bgcolor="#cc0000"] td[colspan="4"] span,
table[bgcolor="#cc0000"] td[colspan="4"] p{
font-size:medium;
line-height:1.7;
}
/* ============================================================
7. SNSアイコン
------------------------------------------------------------
ロゴごとに縦横比が違うため border-radius:50% は使わない
（円形マスクで潰れる）。object-fit:contain で形を保つ。
============================================================ */
a[href*="twitter.com"] img,
a[href*="facebook.com"] img,
a[href*="instagram.com"] img,
a[href*="threads.net"] img,
a[href*="youtube.com"] img{
width:38px !important;
height:38px !important;
object-fit:contain;
border-radius:0;
margin:0 5px;
opacity:.78;
transition:transform .22s var(--bb-ease), opacity .22s var(--bb-ease);
}
a[href*="twitter.com"]:hover img,
a[href*="facebook.com"]:hover img,
a[href*="instagram.com"]:hover img,
a[href*="threads.net"]:hover img,
a[href*="youtube.com"]:hover img{
transform:scale(1.15);
opacity:1;
}
/* ============================================================
8. 商品カード（トップページ）
============================================================ */
td[bgcolor="#000000"] > a > img[width="452"]{
width:100% !important;
height:auto !important;
aspect-ratio:452/258;
object-fit:cover;
display:block;
border-radius:var(--bb-radius) var(--bb-radius) 0 0;
transition:transform .45s var(--bb-ease), filter .45s var(--bb-ease);
}
td[bgcolor="#000000"]:hover > a > img[width="452"]{
transform:scale(1.05);
filter:brightness(1.06) saturate(1.08);
}
/* キャプション */
td[bgcolor="#ffffff"],
td[bgcolor="#eeeeee"]{
background:var(--bb-card) !important;
color:var(--bb-text-dark) !important;
padding:14px 16px !important;
border-left:3px solid transparent;
transition:border-color .25s var(--bb-ease);
}
td[bgcolor="#eeeeee"]{ background:var(--bb-card-sub) !important; }
td[bgcolor="#ffffff"]:hover,
td[bgcolor="#eeeeee"]:hover{ border-left-color:var(--bb-accent); }
/* カテゴリラベル */
td[bgcolor="#cccccc"]{
background:linear-gradient(180deg,#2a2a2a,#1a1a1a) !important;
padding:7px 14px !important;
border-radius:0 0 var(--bb-radius) var(--bb-radius);
}
td[bgcolor="#cccccc"] font[face="Impact"]{
color:var(--bb-accent) !important;
font-family:"Barlow Condensed","Oswald",Impact,sans-serif !important;
font-size:12px !important;
font-weight:600;
letter-spacing:.14em;
text-transform:uppercase;
}
/* ============================================================
9. font要素の再定義
============================================================ */
font[face="メイリオ"]{
font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP",
"メイリオ",Meiryo,sans-serif !important;
}
font[size="+1"]{
font-size:clamp(14px,1.55vw,17px) !important;
font-weight:700;
line-height:1.45;
}
font[size="-1"]{
font-size:clamp(11px,1.15vw,13px) !important;
line-height:1.6;
color:#4a4a4a !important;
}
/* 黒背景上の font は白のまま（商品キャプション用の色指定を打ち消す） */
td[bgcolor="#000000"] font[size="-1"],
table[height="60"] font[size="-1"]{ color:inherit !important; }
/* ============================================================
10. 帯・区切り線
============================================================ */
td[bgcolor="#ff0000"]{
background:linear-gradient(90deg,var(--bb-accent-dk),var(--bb-accent)) !important;
}
hr[style]{
border:0 !important;
height:1px !important;
background:linear-gradient(90deg,transparent,var(--bb-accent),transparent) !important;
margin:32px auto !important;
max-width:950px;
}
/* ============================================================
11. スライドショー / カルーセル
============================================================ */
.hpb-photomotion{
border-radius:var(--bb-radius);
overflow:hidden;
box-shadow:var(--bb-shadow);
max-width:100%;
}
/* ============================================================
12. ストアバナー
============================================================ */
a[href*="baitbreath-store.net"] img,
a[href*="amazon.co.jp"] img{
border-radius:var(--bb-radius);
transition:transform .28s var(--bb-ease), box-shadow .28s var(--bb-ease);
}
a[href*="baitbreath-store.net"]:hover img,
a[href*="amazon.co.jp"]:hover img{
transform:translateY(-3px) scale(1.015);
box-shadow:var(--bb-shadow-hi);
}
/* ============================================================
13. フッター
============================================================ */
table[height="60"] a{
color:var(--bb-text) !important;
text-decoration:none !important;
display:inline-block;
padding:9px 4px;
border-bottom:1px solid transparent;
transition:color .2s var(--bb-ease), border-color .2s var(--bb-ease);
}
table[height="60"] a:hover{
color:var(--bb-accent) !important;
border-bottom-color:var(--bb-accent);
}
/* 会社情報（お知らせページ下部） */
td[bgcolor="#000000"] font[size="-1"]{
line-height:2.1;
letter-spacing:.03em;
}
td[bgcolor="#000000"] font[size="-1"] a{
color:#fff !important;
text-decoration:none;
border-bottom:1px solid rgba(255,255,255,.3);
transition:color .2s var(--bb-ease), border-color .2s var(--bb-ease);
}
td[bgcolor="#000000"] font[size="-1"] a:hover{
color:var(--bb-accent) !important;
border-bottom-color:var(--bb-accent);
}
/* ============================================================
14. 本文エリア（お知らせページ）
============================================================ */
td[bgcolor="#ffffff"] h1{
font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP",
"メイリオ",Meiryo,sans-serif;
font-size:clamp(19px,2.2vw,26px);
font-weight:700;
color:#333 !important;
margin:0 0 26px;
padding:22px 0 14px;
border-bottom:3px solid var(--bb-accent);
letter-spacing:.04em;
}
td[bgcolor="#ffffff"] h1 span{ color:#333 !important; }
td[bgcolor="#ffffff"] p{
font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP",
"メイリオ",Meiryo,sans-serif;
font-size:clamp(13px,1.25vw,15px);
line-height:2.0;
color:#4a4a4a !important;
margin:0 0 1.5em;
text-align:justify;
}
td[bgcolor="#ffffff"] p span{ color:#4a4a4a !important; }
td[bgcolor="#ffffff"] p b{ color:#222 !important; font-weight:700; }
/* 本文セルの余白 */
td[bgcolor="#ffffff"][style*="text-align : left"]{
padding:34px 46px 40px !important;
background:#fff !important;
}
/* ============================================================
15. スマートフォン（820px以下）
------------------------------------------------------------
★重要★ tr / td を display:block にしないこと。
colspan が無効化され、レイアウトが崩壊するため。
表構造は維持し、余白列を潰す方式で対応する。
============================================================ */
@media screen and (max-width:820px){
/* --- テーブル全体 --- */
table[width]{
width:100% !important;
max-width:100% !important;
height:auto !important;
table-layout:fixed !important;
}
td[width]{ width:auto !important; }
td[height]{ height:auto !important; }
/* HPBの1375px指定もここで無効化 */
td[style*="1375px"],
td[style*="width : 1375"],
td[style*="width:1375"]{
width:auto !important;
max-width:100% !important;
}
/* --- 商品グリッド：余白専用セルを畳む --- */
table[width="950"] > tbody > tr > td:not([bgcolor]):not([colspan]){
width:0 !important;
padding:0 !important;
font-size:0 !important;
line-height:0 !important;
}
table[width="950"] > tbody > tr > td[bgcolor]{
padding:0 !important;
vertical-align:top !important;
}
td[bgcolor="#ffffff"],
td[bgcolor="#eeeeee"]{ padding:9px 7px !important; }
td[bgcolor="#cccccc"]{ padding:5px 7px !important; }
td[bgcolor="#000000"] > a > img[width="452"]{
width:100% !important;
aspect-ratio:452/258;
border-radius:6px 6px 0 0;
}
td[bgcolor="#000000"]:hover > a > img[width="452"]{ transform:none; }
/* --- 文字サイズ --- */
font[size="+1"]{ font-size:12px !important; line-height:1.35 !important; }
font[size="-1"]{ font-size:10px !important; line-height:1.4 !important; }
td[bgcolor="#cccccc"] font[face="Impact"]{
font-size:9px !important;
letter-spacing:.06em;
}
/* --- 全幅バナー --- */
td[colspan] img{ width:100% !important; height:auto !important; }
img[width="950"]{ width:100% !important; height:auto !important; }
/* --- ナビ A: 5ボタン（トップ）を等比縮小して1行維持 --- */
td[colspan="5"] a[id^="HPB_ROLLOVER"] img[width="190"]{
width:20vw !important;
height:auto !important;
aspect-ratio:190/110;
}
/* --- ナビ B: 10ボタン（お知らせ）を等比縮小して5個ずつ維持 --- */
table[bgcolor="#cc0000"] td[colspan="4"]{
overflow:hidden;
width:100% !important;
max-width:100% !important;
}
table[bgcolor="#cc0000"] td[colspan="4"] img[width="190"]{
width:20vw !important;
height:auto !important;
aspect-ratio:190/55;
}
/* --- SNSアイコン --- */
a[href*="twitter.com"] img, a[href*="facebook.com"] img,
a[href*="instagram.com"] img, a[href*="threads.net"] img,
a[href*="youtube.com"] img{
width:30px !important; height:30px !important; margin:0 3px;
}
/* --- スライドショー：style属性の固定950x567を強制解除 --- */
.hpb-photomotion[style]{
width:100% !important;
height:auto !important;
max-width:100% !important;
}
#hpb-slideshow1{
width:100% !important;
height:56vw !important;
min-height:150px !important;
max-height:52vh !important;
}
.camera_wrap, .camera_src, .camera_target,
.camera_overlayer, .camera_target_content{
width:100% !important;
max-width:100% !important;
}
.camera_wrap{ height:auto !important; }
.camera_pag, .camera_prevThumbs, .camera_nextThumbs{ display:none !important; }
/* --- カルーセル --- */
#hpb-carousel1, .bx-wrapper, .bx-viewport{
width:100% !important;
max-width:100% !important;
}
.bx-wrapper{ margin:0 auto !important; border:0 !important; box-shadow:none !important; }
#hpb-carousel-list1 li{ width:100% !important; }
#hpb-carousel-list1 img{ width:100% !important; height:auto !important; }
/* --- 本文エリア --- */
td[bgcolor="#ffffff"][style*="text-align : left"]{
padding:20px 16px 24px !important;
}
td[bgcolor="#ffffff"] h1{
font-size:17px;
margin-bottom:18px;
padding:14px 0 10px;
}
td[bgcolor="#ffffff"] p{
font-size:13px !important;
line-height:1.85;
text-align:left;
}
/* --- フッターを2列に --- */
table[height="60"]{ table-layout:auto !important; }
table[height="60"] td{ width:50% !important; text-align:center; }
table[height="60"] a{ padding:11px 2px; font-size:12px; }
body[bgcolor]{ overflow-x:hidden !important; }
}
/* ============================================================
16. スマートフォン（480px以下）
============================================================ */
@media screen and (max-width:480px){
font[size="+1"]{ font-size:11px !important; }
font[size="-1"]{ font-size:9px !important; }
td[bgcolor="#ffffff"], td[bgcolor="#eeeeee"]{ padding:7px 5px !important; }
}
/* ============================================================
17. モーション低減・印刷
============================================================ */
@media (prefers-reduced-motion:reduce){
*,*::before,*::after{
animation-duration:.01ms !important;
animation-iteration-count:1 !important;
transition-duration:.01ms !important;
}
}
@media print{
body[bgcolor]{ background:#fff !important; color:#000 !important; }
a[id^="HPB_ROLLOVER"], .hpb-photomotion{ display:none !important; }
td[bgcolor="#ffffff"] p{ color:#000 !important; }
}
/* ============================================================
18. 製品ページ（pinehead jighead.html 等）
------------------------------------------------------------
白背景 + オレンジ基調のページ。トップページ（黒背景）と
配色が異なるため専用に上書きする。
============================================================ */
/* --- 白背景ページの本体 --- */
body[bgcolor="#ffffff"]{
background:#fff !important;
color:#333 !important;
}
/* --- 見出し（オレンジ帯） --- */
td[bgcolor="#ff972f"] h1{
margin:0 !important;
padding:16px 10px !important;
color:#fff !important;
font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP",
"メイリオ",Meiryo,sans-serif;
letter-spacing:.05em;
text-shadow:0 2px 8px rgba(0,0,0,.3);
border:0 !important;
}
td[bgcolor="#ff972f"] h1 span{ font-size:clamp(18px,3vw,42px) !important; }
td[bgcolor="#ff972f"] h1 i{ font-style:normal; }
h2{
font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP",
"メイリオ",Meiryo,sans-serif;
margin:30px 0 18px;
letter-spacing:.04em;
}
/* --- 製品説明文 --- */
body[bgcolor="#ffffff"] td > font[size="+2"]{
font-size:clamp(14px,1.5vw,17px) !important;
line-height:2.0;
color:#555 !important;
display:block;
padding:24px 10px;
}
/* --- 仕様表 --- */
table.bb-spec{
border-collapse:collapse !important;
border:0 !important;
margin:0 auto 8px;
max-width:800px;
width:100% !important;
box-shadow:0 4px 18px rgba(0,0,0,.2);
border-radius:10px;
overflow:hidden;
}
table.bb-spec td{
border:1px solid #2e2e2e !important;
padding:12px 8px !important;
transition:background .2s var(--bb-ease);
}
table.bb-spec td[bgcolor="#000000"]{ background:#111 !important; }
/* 表タイトル行 */
table.bb-spec tr:first-child td{
background:linear-gradient(180deg,#1e1e1e,#0c0c0c) !important;
padding:16px 8px !important;
border-bottom:2px solid #ff972f !important;
}
table.bb-spec tr:first-child font{
font-size:clamp(15px,1.9vw,22px) !important;
letter-spacing:.05em;
}
/* 列見出し行 */
table.bb-spec tr:nth-child(2) td{
background:#262626 !important;
border-bottom:2px solid #ff972f !important;
}
table.bb-spec tr:nth-child(2) font{
font-size:clamp(12px,1.3vw,15px) !important;
letter-spacing:.03em;
}
/* データ行 */
table.bb-spec td font[size="+2"]{
font-size:clamp(13px,1.45vw,17px) !important;
color:#ff972f !important;
line-height:1.5;
}
table.bb-spec tr:hover td[bgcolor="#000000"]{ background:#241d14 !important; }
/* 価格セル（両表で統一表示） */
table.bb-spec td.bb-price{
background:#161009 !important;
white-space:nowrap;
}
table.bb-spec td.bb-price font{
color:#ffb85c !important;
letter-spacing:.02em;
}
table.bb-spec tr:hover td.bb-price{ background:#2b2013 !important; }
/* 区切りの白行 */
table.bb-spec td[bgcolor="#ffffff"]{
background:#fff !important;
border-left:0 !important;
border-right:0 !important;
padding:0 !important;
}
/* --- 特徴リスト --- */
body[bgcolor="#ffffff"] table[border="0"][width="800"] font{
font-size:clamp(13px,1.45vw,17px) !important;
line-height:2.15;
color:#e07b1a !important;
}
/* --- 区切り線 --- */
body[bgcolor="#ffffff"] hr{
border:0;
height:1px;
background:linear-gradient(90deg,transparent,#ff972f,transparent);
margin:36px auto;
max-width:800px;
}
/* --- おススメ用途の帯 --- */
td[bgcolor="#000000"][colspan="8"]{ padding:18px 12px !important; }
td[bgcolor="#000000"][colspan="8"] font{
font-size:clamp(12px,1.35vw,16px) !important;
line-height:1.85;
}
/* --- コピーライト --- */
td[bgcolor="#ff972f"][colspan="8"]{ padding:13px !important; }
/* --- カルーセルのサムネイルページャ --- */
#custom-bxslider-pager{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:4px;
padding:14px 0 4px;
}
#custom-bxslider-pager a{
line-height:0;
border-radius:4px;
overflow:hidden;
opacity:.55;
transition:opacity .2s var(--bb-ease), transform .2s var(--bb-ease);
}
#custom-bxslider-pager a:hover,
#custom-bxslider-pager a.active{
opacity:1;
transform:translateY(-2px);
box-shadow:0 3px 9px rgba(0,0,0,.35);
}
/* --- 製品ページのスマホ対応 --- */
@media screen and (max-width:820px){
/* ナビ2段×5個を等比縮小して1行維持 */
body[bgcolor="#ffffff"] td[colspan="4"]{
font-size:0 !important;
line-height:0 !important;
white-space:nowrap !important;
padding:0 !important;
text-align:center !important;
}
body[bgcolor="#ffffff"] td[colspan="4"] a{
display:inline-block;
font-size:0 !important;
margin:0 !important;
}
body[bgcolor="#ffffff"] td[colspan="4"] img[width="190"]{
width:20vw !important;
height:auto !important;
aspect-ratio:190/55;
}
/* 仕様表 */
table[width="800"]{ width:100% !important; max-width:100% !important; }
table.bb-spec td{ padding:8px 3px !important; }
table.bb-spec td font[size="+2"]{ font-size:11px !important; }
table.bb-spec td.bb-price span{ font-size:100% !important; }
table.bb-spec tr:first-child font{ font-size:13px !important; }
table.bb-spec tr:nth-child(2) font{ font-size:10px !important; }
table.bb-spec tr:first-child td,
table.bb-spec tr:nth-child(2) td{ padding:10px 3px !important; }
/* 見出し */
td[bgcolor="#ff972f"] h1{ padding:11px 6px !important; }
td[bgcolor="#ff972f"] h1 span{ font-size:17px !important; }
h2{ margin:20px 0 12px; }
/* 説明文・特徴 */
body[bgcolor="#ffffff"] td > font[size="+2"]{
font-size:13px !important;
line-height:1.85;
padding:16px 12px;
}
body[bgcolor="#ffffff"] table[border="0"][width="800"] font{
font-size:12px !important;
line-height:1.95;
}
/* サムネイルページャ */
#custom-bxslider-pager img{ width:44px !important; height:32px !important; }
}