/************************************************************************************************* * stylesheet.css : * * @author Strategy Corporation * @version 0.0, 新規作成 2003/07/13 *************************************************************************************************/ /* ----------------------------------------------------------------------------------------------- 旧Ｗｅｂの互換用 ------------------------------------------------------------------------------------------------ */ .fs10px { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 10px;} .fs12px { font-family: "MS PGothic", "Osaka"; font-size: 12px; line-height: 16px} .fs14px { font-family: "MS PGothic", "Osaka"; font-size: 14px; line-height: 18px} .fs20px { line-height: 20px} .fs30px { line-height: 30px} .date { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 8pt;color:#a0a0a0;} /* ----------------------------------------------------------------------------------------------- 左右のボックス：通常 .boxText { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 13px; } ------------------------------------------------------------------------------------------------ */ /* ----------------------------------------------------------------------------------------------- 「カート内容表示」ページで商品の在庫が無い時に表示する .stockWarning { font-family : "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size : 12px; color: crimson; } ------------------------------------------------------------------------------------------------ */ /* ----------------------------------------------------------------------------------------------- BODY：ボディ BODY { background: #ffffff; color: #000000; margin: 0px; background-image : url(img/pub/bg.jpg); background-attachment: fixed; } ------------------------------------------------------------------------------------------------ */ /* ----------------------------------------------------------------------------------------------- A：リンク（通常） ------------------------------------------------------------------------------------------------ */ A { color: #000000; /* フォントカラー */ text-decoration: none; /* テキストの装飾 */ } A:hover { color: #FF0000; /* フォントカラー */ text-decoration: underline; /* テキストの装飾 */ } /* ----------------------------------------------------------------------------------------------- A：リンク（下線付き） ------------------------------------------------------------------------------------------------ */ A.ulineLink { color: #0000FF; /* フォントカラー */ text-decoration: underline; /* テキストの装飾 */ } A:hover.ulineLink { color: #FF0000; /* フォントカラー */ } /* ----------------------------------------------------------------------------------------------- FORM：フォーム ------------------------------------------------------------------------------------------------ */ FORM { display: inline; /* インラインボックス */ } /* ----------------------------------------------------------------------------------------------- TR：ヘッダー（ショップ名） ------------------------------------------------------------------------------------------------ */ TR.header { background: #ffffff; /* 背景色 */ } /* ----------------------------------------------------------------------------------------------- TR：ヘッダー（ナビゲーション） ------------------------------------------------------------------------------------------------ */ TR.headerNavigation { background: #bbc3d3; /* 背景色 */ } /* ----------------------------------------------------------------------------------------------- TD：ヘッダー（ナビゲーション） ------------------------------------------------------------------------------------------------ */ TD.headerNavigation { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 12px; /* フォントサイズ */ background: #bbc3d3; /* 背景色 */ color: #ffffff; /* フォントカラー */ font-weight: bold; /* フォント太さ */ } /* ----------------------------------------------------------------------------------------------- A：ヘッダー（ナビゲーションのリンク） ------------------------------------------------------------------------------------------------ */ A.headerNavigation { color: #FFFFFF; /* フォントカラー */ } /* ----------------------------------------------------------------------------------------------- TR：ヘッダー（メッセージ） ------------------------------------------------------------------------------------------------ */ TR.headerInfo { background: #00ff00; /* 背景色 */ } /* ----------------------------------------------------------------------------------------------- TD：ヘッダー（メッセージ） ------------------------------------------------------------------------------------------------ */ TD.headerInfo { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Tahoma, Verdana, Arial, sans-serif; font-size: 12px; /* フォントサイズ */ background: #00ff00; /* 背景色 */ color: #ffffff; /* フォントカラー */ font-weight: bold; /* フォント太さ */ text-align: center; /* 横位置 */ } /* ----------------------------------------------------------------------------------------------- TR：フッター ------------------------------------------------------------------------------------------------ */ TR.footer { background: #bbc3d3; /* 背景色 */ } /* ----------------------------------------------------------------------------------------------- TD：フッター ------------------------------------------------------------------------------------------------ */ TD.footer { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 10px; /* フォントサイズ */ background: #bbc3d3; /* 背景色 */ color: #ffffff; /* フォントカラー */ font-weight: bold; /* フォント太さ */ } /* ----------------------------------------------------------------------------------------------- TABLE：情報ボックス ------------------------------------------------------------------------------------------------ */ TABLE.infoBox { background: #0000FF; /* 背景色 */ } /* ----------------------------------------------------------------------------------------------- TABLE：情報ボックス（コンテンツ） ------------------------------------------------------------------------------------------------ */ TABLE.infoBoxContents { background: #ffffef; /* 背景色 */ } /* ----------------------------------------------------------------------------------------------- TD：情報ボックス（タイトル） ------------------------------------------------------------------------------------------------ */ TD.infoBoxHeading { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 12px; /* フォントサイズ */ background: #0000FF; /* 背景色 */ color: #ffffff; /* フォントカラー */ } /* ----------------------------------------------------------------------------------------------- TD,SPAN：情報ボックス（情報・メッセージ） ------------------------------------------------------------------------------------------------ */ TD.infoBox, SPAN.infoBox { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 10px; /* フォントサイズ */ } /* ----------------------------------------------------------------------------------------------- TR：商品一覧（タイトル） ------------------------------------------------------------------------------------------------ */ TR.goodsListing-heading { font-size: 13px; /* フォントサイズ */ background: #dbdbff; /* 背景色 */ } /* ----------------------------------------------------------------------------------------------- 商品一覧（タイトル） ------------------------------------------------------------------------------------------------ */ TH.goodsListing-heading, TD.goodsListing-heading { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 13px; /* フォントサイズ */ background: #dbdbff; /* 背景色 */ color: #000000; /* フォントカラー */ font-weight: bold; /* フォント太さ */ font-variant: small-caps; /* 文字異体（全て大文字にする） */ } /* ----------------------------------------------------------------------------------------------- TR：商品一覧（奇数行データ） ------------------------------------------------------------------------------------------------ */ TR.goodsListing-data-odd { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 12px; /* フォントサイズ */ background: #ffffff; /* 背景色 */ } /* ----------------------------------------------------------------------------------------------- TR：商品一覧（偶数行データ） ------------------------------------------------------------------------------------------------ */ TR.goodsListing-data-even { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 12px; /* フォントサイズ */ background: #f4f7fd; /* 背景色 */ } /* ----------------------------------------------------------------------------------------------- TD：ページヘッダ ------------------------------------------------------------------------------------------------ */ TD.pageHeading, DIV.pageHeading { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 23px; /* フォントサイズ */ font-weight: bold; /* フォント太さ */ color: #003399; /* フォントカラー */ } /* ----------------------------------------------------------------------------------------------- TD：メイン ------------------------------------------------------------------------------------------------ */ TD.main, P.main { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 13px; /* フォントサイズ */ line-height: 1.5; /* 行の高さ */ } /* ----------------------------------------------------------------------------------------------- TD,SPAN：小さい文字（メッセージ） ------------------------------------------------------------------------------------------------ */ TD.smallText, SPAN.smallText { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 12px; /* フォントサイズ */ } /* ----------------------------------------------------------------------------------------------- TD：一覧表の項目名 ------------------------------------------------------------------------------------------------ */ TD.tableHeading { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 12px; /* フォントサイズ */ font-weight: bold; /* フォント太さ */ } /* ----------------------------------------------------------------------------------------------- CHECKBOX, INPUT, RADIO, SELECT：FORMの入力・選択項目 ------------------------------------------------------------------------------------------------ */ CHECKBOX, INPUT, RADIO, SELECT { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 13px; /* フォントサイズ */ } /* ----------------------------------------------------------------------------------------------- TEXTAREA：FORMの入力項目 ------------------------------------------------------------------------------------------------ */ TEXTAREA { width: 100%; font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 13px; /* フォントサイズ */ } /* ----------------------------------------------------------------------------------------------- TABLE：フォームエリア（境界線） ------------------------------------------------------------------------------------------------ */ TABLE.formArea { background: #f1f9fe; /* 背景色 */ border-color: #7b9ebd; /* 境界線の色 */ border-style: solid; /* 境界線のスタイル */ border-width: 1px; /* 境界線の幅 */ } /* ----------------------------------------------------------------------------------------------- TD：フォームエリア（タイトル） ------------------------------------------------------------------------------------------------ */ TD.formAreaTitle { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Tahoma, Verdana, Arial, sans-serif; font-size: 12px; /* フォントサイズ */ font-weight: bold; /* フォント太さ */ } /* ----------------------------------------------------------------------------------------------- TD：チェックアウト手順 ------------------------------------------------------------------------------------------------ */ TD.checkoutBar { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 10px; /* フォントサイズ */ color: #aabbdd; /* フォントカラー */ } /* ----------------------------------------------------------------------------------------------- SPAN：チェックアウト手順（現在の手順） ------------------------------------------------------------------------------------------------ */ SPAN.checkoutBarHighlighted { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 10px; /* フォントサイズ */ color: #000000; /* フォントカラー */ } /* ----------------------------------------------------------------------------------------------- TD:標準 ------------------------------------------------------------------------------------------------ */ TD { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 13px; } /* ----------------------------------------------------------------------------------------------- TD:TOP MENU ------------------------------------------------------------------------------------------------ */ .topMenu TD { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 8pt; } /* ----------------------------------------------------------------------------------------------- TD:TAB MENU ------------------------------------------------------------------------------------------------ */ .tabMenu TD { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 10pt; } /* ----------------------------------------------------------------------------------------------- TD:LEFT MENU ------------------------------------------------------------------------------------------------ */ .leftMenu TD { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 10pt; } /* ----------------------------------------------------------------------------------------------- TD:商品詳細 ------------------------------------------------------------------------------------------------ */ .detail TD { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 16px; } /* ----------------------------------------------------------------------------------------------- TD:商品リスト ------------------------------------------------------------------------------------------------ */ .tr_goodslist { font-family:"ＭＳ ゴシック"; font-size: 14; } /* ----------------------------------------------------------------------------------------------- 商品＆イベント情報タイトル欄 ------------------------------------------------------------------------------------------------ */ .realList { font-size: 13px; font-weight: bold; color: #0000FF; } TABLE.realList { background: #f8f8f8; /* 背景色 */ } A.realList { color: #0000FF; text-decoration: none; } A.realList:link { color: #0000FF; text-decoration: none; } A.realList:visited { color: #0000FF; text-decoration: none; } A.realList:hover { color: #0000FF; text-decoration: none; } /* ----------------------------------------------------------------------------------------------- 新着情報タイトル欄 ------------------------------------------------------------------------------------------------ */ A.newsList { color: #000000; text-decoration: none; } A.newsList:link { color: #000000; text-decoration: none; } A.newsList:visited { color: #000000; text-decoration: none; } A.newsList:hover { color: #FF0000; text-decoration: underline; /* テキストの装飾 */ } /* ----------------------------------------------------------------------------------------------- TABLE：リアルタイム情報ボックス ------------------------------------------------------------------------------------------------ */ TABLE.realBox { background: #0000FF; /* 背景色 */ } TABLE.realBoxContents { background: #ffffef; /* 背景色 */ } TD.realBoxHeading { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 10px; /* フォントサイズ */ background: #0000FF; /* 背景色 */ color: #ffffff; /* フォントカラー */ } TD.realBox, SPAN.realBox { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 10px; /* フォントサイズ */ } TR.realLine-odd { background: #f4f7fd; /* 背景色 */ } TR.realLine-even { background: #ffffff; /* 背景色 */ } /* ----------------------------------------------------------------------------------------------- ご利用方法 ------------------------------------------------------------------------------------------------ */ .guideTitle { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 14px; /* フォントサイズ */ } .guideText { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 12px; /* フォントサイズ */ } /* ----------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------ */ A:link { COLOR: #141278; TEXT-DECORATION: none } A:visited { COLOR: #141278; TEXT-DECORATION: none } A:active { COLOR: #141278; TEXT-DECORATION: none } A:hover { COLOR: #141278; TEXT-DECORATION: underline } .search A:link { COLOR: #ffffff } .search A:visited { COLOR: #ffffff } .search A:active { COLOR: #ffffff } .search A:hover { COLOR: #ffffff } BODY { MARGIN: 0px; BACKGROUND-COLOR: #ffffff } FORM { MARGIN: 0px } .head TD { FONT-SIZE: 70% } .head2 TD { FONT-SIZE: 80% } .navi TD { FONT-SIZE: 80% } .navi2 IMG { BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 1px solid; BORDER-BOTTOM: #000000 1px solid } .navi2 TD { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 10pt; } .navi3 TD { FONT-SIZE: 90% } .navi3 IMG { BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 1px solid; BORDER-BOTTOM: #000000 1px solid } .navi3 UL { MARGIN: 0px 0px 8px 5px; LIST-STYLE-TYPE: none } .navi3 LI { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 80%; PADDING-BOTTOM: 1px; PADDING-TOP: 0px } .navi3 LI A:link { COLOR: #000000 } .navi3 LI A:visited { COLOR: #000000 } .navi3 LI A:active { COLOR: #000000 } .navi3 LI A:hover { COLOR: #000000 } .navi4 TD { font-family: "MS PGothic", Osaka, "MS Gothic", Gothic, Verdana, Arial, sans-serif; font-size: 10pt; } .pickup IMG { BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 1px solid; BORDER-BOTTOM: #000000 1px solid } .kakaku { FONT-WEIGHT: bold; FONT-SIZE: 120%; COLOR: #d60000 } .spec TD { BORDER-TOP: #919191 1px solid; FONT-SIZE: 80% } .price TH { BORDER-TOP: #b9b9b9 1px dashed; FONT-SIZE: 80%; COLOR: #ffffff; BACKGROUND-COLOR: #050370; TEXT-ALIGN: left } .price TD { BORDER-TOP: #b9b9b9 1px dashed; FONT-SIZE: 80%; BACKGROUND-COLOR: #f3f3f3 } .price2 TD { FONT-SIZE: 80%; BACKGROUND-COLOR: #f3f3f3 } /* ----------------------------------------------------------------------------------------------- 　ランダム表示 ------------------------------------------------------------------------------------------------ */ .rdm{ width:220px; font-size:12px; margin:2px 2px 2px 2px; padding:2px 2px 2px 2px; border-left:1px solid #cccccc; border-top:1px solid #cccccc; } .rdm-img{ width:64px; padding:2px 2px 2px 2px; float:left; } .price-s{ color:#ff0000; font-weight: bold; } /* ------------------------------------------------------------------------------------------------ Border ------------------------------------------------------------------------------------------------ */ .tb1 { border: solid 1px #a0a0a0; } .dot { border-bottom: dotted 1px #a0a0a0; line-height: 110%; } .boxdot { border: dotted 1px #a0a0a0; } .rbdot { border-right: dotted 1px #a0a0a0;border-bottom: dotted 1px #a0a0a0; } /* ------------------------------------------------------------------------------------------------ フォントmargin ------------------------------------------------------------------------------------------------ */ .ymargin { line-height: 110%; color:#444444; } .ymargin-bl { line-height: 110%; } /* ------------------------------------------------------------------------------------------------ テキストリンク既読色変更 ------------------------------------------------------------------------------------------------ */ A.text:link { COLOR: #141278; TEXT-DECORATION: none } A.text:active { COLOR: #7B78ED; TEXT-DECORATION: none } A.text:visited { COLOR: #7B78ED; TEXT-DECORATION: none } A.text:hover { COLOR: #141278; TEXT-DECORATION: underline } A.text2:link { COLOR: #141278; TEXT-DECORATION: none } A.text2:active { COLOR: #AA2263; TEXT-DECORATION: none } A.text2:visited { COLOR: #AA2263; TEXT-DECORATION: none } A.text2:hover { COLOR: #141278; TEXT-DECORATION: underline } A.text3:link { COLOR: #141278; TEXT-DECORATION: none } A.text3:active { COLOR: #C4C2F8; TEXT-DECORATION: none } A.text3:visited { COLOR: #C4C2F8; TEXT-DECORATION: none } A.text3:hover { COLOR: #141278; TEXT-DECORATION: underline }