/*2013 08 test*/ @charset "euc-jp"; /*----------------------------------------------------------------- 調整CSSは、common.cssに移動しました。 -----------------------------------------------------------------*/ @import url("/design/msdepart/css/common.css"); /*----------------------------------------------------------------- 全ての要素をリセット 各ブラウザの表示を統一するための設定です -----------------------------------------------------------------*/ html {overflow-y: scroll;} body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin: 0; padding: 0;} address,caption,cite,code,dfn,em,strong,th,var {font-style: normal;} table { border-collapse: collapse;border-spacing: 0;} caption,th {text-align: left;} h1,h2,h3,h4,h5,h6 {font-size: 100%;} img,abbr,acronym,fieldset {border: 0;} li {list-style-type: none;} img{vertical-align:middle;} td,input{font-size:12px;} .line {font-size:1px;line-height:1px;} em{color:#ff0000;} th,td{vertical-align:top;} /* サンプルソース問合せ対応用に追加120918 */ .tokusyu {color:#88B6FF;} /* 商品別特殊表示 */ #makebanner {width:1000px;} /*----------------------------------------------------------------- 基本スタイル -----------------------------------------------------------------*/ body { color: #333; font-size: 12px; font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"MS Pゴシック","MS PGothic",Sans-Serif; *font-size:small; *font:x-small; line-height: 1.6; } * html body { /* for IF6 */ font-family: "MS Pゴシック","MS PGothic",Sans-Serif; } /* clearfix */ .M_clearfix:after { content:""; display:block; clear:both; } /* for IE6 */ * html .M_clearfix { display:inline-block; } /* for IE7 */ *+html .M_clearfix { display:inline-block; } /*要素を中央揃いに*/ .M_center{ text-align:center; } /*要素を左に*/ .M_left{ text-align:left; } /*要素を右に*/ .M_right{ text-align:right; } p{ text-align:left; } /*上下のマージンを20px*/ .M_mgn20{ margin:20px auto; } /*テキスト色を赤に*/ .M_red{ color:#ff0000; } /*リンク色*/ a{text-decoration:none ;} a:link { text-decoration:none; color:#333;} a:visited { text-decoration:none; color:#333;} a:hover { color:#333; text-decoration:underline;} table, table td { font-size: 12px; line-height: 1.6; } #leftBnr { padding-left: 50px; background: url(/design/msdepart/img/common/left_bnr.gif) no-repeat left top fixed; } #container { margin-bottom: 20px; border-bottom: #000 1px solid; } #containerInner { margin: 0 auto; width: 1000px; } p.guide{font-size:10px; color:#666; margin:10px auto;} h2.txtTitle {background:url(/design/msdepart/image/bg_h2title.png) no-repeat; padding-top:4px; font-size:17px; margin:0px auto 10px; line-height:250%; text-indent:1.5em; color:#333; font-weight:bold; font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3";} /* move Event =========================================*/ #RightBanner {right:0; left:auto !important; margin:0; padding:0; font-size:10px; width:50px; background:#000; color:#fff;text-align:center;} #RightBanner p {text-align:center;} /* header =========================================*/ #header { width: 1000px; text-align:left; height:120px; } #header .headerL { float: left; width: 350px; } #header h1 { padding: 5px 0 0 2px; font-size: 1em; } #header .logo { margin-top: 20px; } #header .headerR { float: right; width: 650px; } .souryou { margin: 3px 6px 0 0; float: right; } .card { margin: 3px 6px 0 0; } .headerNav { /*margin-top: 5px;*/ width: 630px; overflow:hidden; } .headerNav li { float: left; } .topNav { padding: 4px 0 2px 0; text-align:right; } .topNav li { margin-left: 15px; padding: 0 5px 0 10px; background: url(/design/msdepart/img/common/arrow01.gif) no-repeat left 1px; display: inline; } #header .headerR,#header #globalNav{ z-index:auto; position:relative; } #header #M_basketOpenedBox{ z-index:100; } #header #globalNav ul{ position:relative; z-index:1; } /*== header の買い物かごボタン ==*/ #M_basketClosedBox { background: url("/design/msdepart/img/common/head_cart_btn.gif") 0 0 !important; width: 158px !important; height:32px !important; } .M_headBasket { width: 164px !important; height:50px !important; border:none !important; background :none !important; } #M_headBasketSwitch { float: none !important; height: 32px; width: 158px; } #M_headBasketIn { padding: 5px 0 !important; width: 128px !important; } #M_basketOpenedBox { background: none repeat scroll 0 0 #EEE !important; border: 1px solid #CCC !important; right: -30px !important; top: 30px !important; } /* glovalNavi =========================================*/ #globalNav{ background: url(/design/msdepart/img/common/bg01.gif) repeat-x; width:100%; margin:0 auto 10px; overflow:hidden; } nav.fixed { position: fixed; z-index:1; left: 0; top: 0; } #globalNav ul{ width: 1000px; /*height: 70px;*/ overflow:hidden; } #globalNav ul li { float: left; display: inline; } /* contents =========================================*/ #contents { width: 1000px; text-align:left; position: relative; } /* main =========================================*/ #main { width: 720px; text-align:left; } #main .topItemBlock table th { text-align: center; width: 33%; } #main .topItemBlock table td { padding: 5px 10px 20px 10px; text-align: center; } #main .newsBlock { border: #e0e0e0 5px solid; } #main .newsListLink { margin: -26px 10px 20px 0; text-align: right; } /* side =========================================*/ #side { margin-right: 30px; width: 250px; text-align:left; float:left; *overflow:hidden; } #side .sideBlock{ margin-bottom: 10px; background: url(/design/msdepart/img/common/side_bg.gif) no-repeat left top; border-bottom: #e0e0e0 1px solid; width: 250px; } #side .memberBlock{ margin: 0 8px 5px 8px; } #side .sideNav{ margin: 0 10px 10px 10px; } #side .sideNav li{ padding: 5px; background: url(/design/msdepart/img/common/line01.gif) repeat-x left bottom; } #side .searchBlock{ margin: 5px 10px 10px 10px; } #side .searchBlock input { height: 25px; width: 178px; border: #999 1px solid; } #side .searchBlock img{ vertical-align: top; } #side .calenderBlock{ margin: 5px 20px; } #side .calenderBlock table{ border-collapse: separate; border-spacing: 1px; width: 210px; } #side .sideBlock #leftRecent td{ padding-bottom: 5px; border-bottom: #e0e0e0 1px solid; } #side .sideBlock #leftRecent td p{ width: 160px !important; } #side .sideBlock #leftRecent td p.name{ padding-top: 5px; } .calenderBlock td{vertical-align:middle; /*width:auto; 今日の色が消えるため不可*/ /*text-align:center; 今日の文字位置がおかしくなるため不可*/ font-size:12px !important; } /* pagetop =========================================*/ #pageTop { bottom: 120px; display: none; position: fixed; right: 48px; z-index:10; } /* footerGuide =========================================*/ #footerGuide { margin: 0 auto; padding-bottom: 50px; width: 1000px; text-align:left; } #footerGuide .boxL, #footerGuide .boxR { width: 480px; } #footerGuide h2 { margin-bottom: 20px; } #footerGuide h3 { margin-bottom: 10px; } #footerGuide h4 { margin: 20px 0 5px 0; padding: 2px 10px; background: url(/design/msdepart/img/common/h4_bg.gif) no-repeat left 4px; border-bottom: #000 1px solid; font-weight: bold; } #footerGuide p { margin: 5px; } #footerGuide dl { margin: 0 5px; } #footerGuide dl dt { margin-top: 10px; color: #d00d1c; font-weight: bold; } #footerGuide ul { margin: 0 5px; } #footerGuide ul li { padding: 2px 0 2px 12px; background: url(/design/msdepart/img/common/point01.gif) no-repeat left 8px; } /* footer =========================================*/ #footer { background: #333; } #footerInner { margin: 0 auto; width: 1000px; text-align:left; } #footer .footerNav { margin: 20px 0 40px 0; float: left; } #footer .footerNav li { display: inline; color: #fff; border-right: #fff 1px dotted; } #footer .footerNav li.last { border-right: none; } #footer .footerNav li a { padding: 0 8px; color: #fff; } #footer .copyright { margin: 20px 0 0 0; float: right; color: #fff; } /*---------------------------------------------------- toppage ----------------------------------------------------*/ .M_reviewImg{ float:left; } .topBlock .M_reviewBox { float:right; width: 580px; /width: 540px; } .topBlock #M_reviewRead{width:580px; /width: 540px; overflow:hidden;} .M_reviewReadText {clear:both;} #recommended .lims table td { text-overflow: ellipsis; /*white-space: nowrap;*/ width: 150px; } /*---------------------------------------------------- 商品一覧 ----------------------------------------------------*/ #category h3 { margin-bottom: 10px; padding: 5px 0 5px 5px; background: #f5f5f5; } #totalbox{ margin-top: 20px; padding: 2px 5px; background: url(/design/msdepart/img/common/line01.gif) repeat-x bottom; } #M_lumpProductList { width: 760px !important;} .M_lumpProduct {width:180px !important;} #categoryRecommend a img {margin-top:10px;} .M_lumpOption { text-indent:-9999px; background:url(/design/msdepart/image/optionTxt.png) no-repeat; padding:5px 30px; color:transparent; } /*---------------------------------------------------- 商品詳細 ----------------------------------------------------*/ #pankuzu,.addpankuzu { margin-top: 10px; padding: 5px; background: #f5f5f5; } #itemList { margin-bottom: 2px; overflow:hidden; _zoom:1; } #itemList .preview { float: left; display: block; } #itemList .next { float: right; display: block; } .itemName { padding: 5px 10px; border: #333 1px solid; text-align: center; font-size: 1.4em; font-weight: bold; } #imgDetail { margin: 0 10px; float: left; width: 300px; display: inline; text-align: center; } #itemInfo { margin:0 10px 16px 0; float: right; width: 360px; display: inline; overflow:hidden; _zoom:1; } #itemInfo table th, #itemInfo table td { text-align: left; } #itemInfo table th { font-weight: normal; } #itemInfo .itemPrice { font-weight: bold; font-size: 1.2em; } #itemInfo .itemQuantity { background: #eaeaea; } #itemInfo .itemQuantity img { padding: 1px 0; } #itemInfo .basketBlock { margin: 15px 0; } #itemInfo .basketBlock li { margin-bottom: 5px; } #itemInfo .itemWishList { margin: 10px 0; } #itemInfo .itemWishList li { padding-bottom: 5px; } #itemInfo .snsBlock { padding: 5px 5px 2px 5px; border: #dad8d3 2px solid; } .detailAll{width:720px;} li.haisou {color:#ff0000; background:url(/images/brand/starIcon1.png) no-repeat; text-indent:20px;} #M_reviewViewAll { width: 100% !important; } /* 外税フォントサイズ */ #M_usualValue td font,#M_price2{font-size:12px !important;} #M_price2{width:40px !important;} /*---------------------------------------------------- 商品検索 ----------------------------------------------------*/ #searchWord { margin-bottom: 10px; padding: 5px 0 2px 5px; border-bottom: #ccc 1px solid; } #searchTable { margin: 10px 0; padding: 10px 20px; background: #f5f5f5; border: #cecece 1px solid; } #searchTable table { width: 678px; } #searchTable table th, #searchTable table td { padding: 2px 5px; } #searchData { margin: 10px auto; width: 720px; overflow:hidden; } #searchData table { width: 720px; } #searchData .line { height: 1px; font-size: 1px; line-height: 0; } #searchData .woong { padding: 2px 0 0 0; background:#666; color:#fff; } #searchData font { color: #999; } #searchData b { color: #333; } #searchData a img {width:80px; height:auto;} #searchData span.tokusyu{display:none;} #searchKwd {color:#666;} /*---------------------------------------------------- 検索結果 全商品一覧 ----------------------------------------------------*/ #searchTable input {border:solid 1px #ccc; height:18px; min-width:60px; margin:2px auto;} #searchTable input:focus {border:solid 3px #ccc; background:#eee; font-size:14px; height:24px;} #searchResultProduct { border-bottom: 1px dotted #CCCCCC; border-right: 1px dotted #CCCCCC; float: left; height: 280px; margin: 4px; padding: 4px; width: 162px; text-align:center; } /*---------------------------------------------------- ログイン ----------------------------------------------------*/ #M_mainContents { width: 720px; margin: 10px auto; text-align: left; line-height: 140%; } #M_form{ border:1px solid #ccc; padding:10px; margin:20px auto; text-align: center; } #M_contract { margin: 20px auto; text-align: left; padding: 10px; width: 700px; height: 400px; overflow: scroll; border: 1px solid #ccc; } .M_center { text-align: center; } #loginform, #orderInput { padding-bottom: 15px; text-align: center; } #loginform dd input { width: 160px !important; } div#loginform p#forgot { margin: 0 auto !important; } #orderInput p { margin: 0 auto; width: 500px; } /*---------------------------------------------------- 会社概要 ----------------------------------------------------*/ #main .companyTbl th { padding: 5px 15px; border-top: #ccc 1px solid; border-bottom: #ccc 1px solid; background: #f5f5f5; width: 25%; } #main .companyTbl td { padding: 5px 15px; border-top: #ccc 1px solid; border-bottom: #ccc 1px solid; } #main .companyTbl td ul li { padding: 2px 0 2px 15px; background: url(/design/msdepart/img/common/arrow01.gif) no-repeat left 5px; } #main .companyTbl td dl { margin: 10px 0; padding: 10px; background: #ecf4f5; } #main .companyTbl td dl dt { font-weight: bold; } #main .companyTbl td dl dd { padding-left: 1em; } #main .agreementBlock { margin: 10px 5px; } #main .agreementBlock dl { margin-bottom: 20px; } #main .agreementBlock dl dt { margin-bottom: 2px; padding-bottom: 2px; font-weight: bold; border-bottom: #ccc 1px solid; } #main .agreementBlock dl dd ol { margin-left: 20px; _margin-left: 25px; } #main .agreementBlock dl dd ol li { padding: 2px 0; list-style-type: decimal; } /*---------------------------------------------------- ご利用案内 ----------------------------------------------------*/ .guideLink { margin: 5px 0 0 10px; } .guideLink li { margin-right: 35px; padding-left: 12px; float: left; background: url(/design/msdepart/img/common/arrow01.gif) no-repeat left 5px; } .guideBlock h2 { margin: 50px 0 10px 0; } .guideBlock h3 { margin: 20px 0 5px 0; padding: 2px 10px; background: url(/design/msdepart/img/common/h4_bg.gif) no-repeat left 4px; border-bottom: #000 1px solid; font-weight: bold; } .guideBlock p { margin: 0 5px 10px 5px; } .guideBlock .attention { margin: 10px 0; padding: 10px 15px; background: #f5f5f5; } .guideBlock ol li { margin: 0 0 10px 30px; list-style-type: decimal; } .guideBlock ul { margin: 0 5px 10px 5px; } .guideBlock ul li { padding-left: 12px; background: url(/design/msdepart/img/common/point01.gif) no-repeat left 5px; } .guideBlock .addressBlock { padding: 15px 25px 5px 25px; background: #f5f5f5; } .guideBlock dl { margin: 0 5px 10px 5px; } .guideBlock dl dt { font-weight: bold; } .guideBlock dl dd { margin-bottom: 10px; } .guideBlock .addressBlock dt { float: left; width: 5em; font-weight: bold; } .guideBlock .addressBlock dd { margin-left: 6em; } /*---------------------------------------------------- 定期購入 ----------------------------------------------------*/ #M_repeatPriceTable{ border-top:1px solid #999; border-left:1px solid #999; width:100%; margin:16px 0; } #M_repeatPriceTable th{ text-align:center; background:#ffc; } #M_repeatPriceTable th, #M_repeatPriceTable td{ border-bottom:1px solid #999; border-right:1px solid #999; font-size:13px; padding:3px; } #M_repeatPriceTable th{ font-weight:normal; } #M_repeatPriceTable .M_taxIn{ font-size:11px; color:#666; } #M_repeatPriceTable td{ color:#ff0000; font-weight:bold; text-align:center; } #M_repeatBonus{ clear:both; overflow:hidden; _zoom:1; margin-top:16px; border:1px solid #999; } .M_repeatBonusWrap{ margin:8px; padding:16px; width:310px; float:left; } .M_repeatBonusName{ font-weight:bold; font-size:14px; margin-bottom:8px; } .M_repeatBonusClear{ overflow:hidden; _zoom:1; } .M_repeatBonusImg{ float:left; width:100px; margin-right:4px; } .M_repeatBonusImg img{ width:100px; } .M_repeatBonusDetail{ float:right; width:200px; } .stockY { color:#f00; font-weight:bold; } .repeatMgn { margin-bottom:8px; } #buyInfo { margin:20px 0 30px; overflow:hidden; _zoom:1; } #buyInfo h4 { background:#ccc; padding:8px; margin:8px 0; font-size:16px; font-weight:bold; } #buyInfo .repeatDescription{ padding:6px 12px; border:#333 solid 1px; } #buyInfo .buyBtn{ margin:16px 0; } #M_usualValue td, #M_usualValue td input{ font-size:18px; font-weight:bold; } #M_usualValue td input{ width:70px; } div.M_infoEmbedded { float:left; } .M_repeatPrice{margin:10px auto; font-size:16px; } .M_repeatPrice, .M_repeatPrice input.m_price {font-weight:bold;} .M_repeatPrice input.m_price {width:60px; font-size:18px; font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"MS Pゴシック","MS PGothic",Sans-Serif; } /*---------------------------------------------------- ニュース イベント ----------------------------------------------------*/ div#contents div#M_temp01 { margin-top:-15px; *margin-top:0; } div#contents div#M_infoBody dl{ overflow:hidden; _zoom:1; margin-bottom:12px; } div#contents div#M_infoBody dl dt{ float:left; font-weight:bold; padding:5px 16px; background:#333; color:#fff; } div#contents div#M_infoBody dl dd{ float:left; padding:4px 8px; border:1px solid #333; border-left:none; } #newsevent {height:120px; overflow-y:scroll;} #newsevent table table tr { background: url("/design/msdepart/img/common/arrow01.gif") no-repeat; /background: none; } #newsevent table table td { padding-left:12px; border-bottom: 1px dotted #CCC; } #mainTop .newsBlock {margin-bottom:20px;} /*---------------------------------------------------- top index チェック履歴 ----------------------------------------------------*/ td.itemBox table{/width:160px !important;} /* IE */ td.itemImg a img{/margin-left:26px;}/* IE */ .topBlock {margin-top:10px;} /*---------------------------------------------------- html page 独自ページ ----------------------------------------------------*/ #originalPage { text-align: center; width: 720px; margin:0 auto; } #originalPage h2, #originalPage h3, #originalPage h4{ text-align: left;} #originalPage h3, #originalPage h4, #originalPage p{ width:96%; margin:auto; text-align: left;} #originalPage h3{ font-size:14px; font-weight:bold;} #originalPage p{ margin-bottom:20px;} #originalPage p a:link{ color:#333; text-decoration:underline;} #originalPage p a:hover{ color:#CD5C5C; text-decoration:none;} ul.manualList {width:680px; margin:20px auto;} ul.manualList li{background:url(/images/363/leftdot.gif) no-repeat; text-align:left; margin:4px auto; text-indent:16px; line-height:150%;;} /*---------------------------------------------------- ポイント照会 ----------------------------------------------------*/ .woong a{text-decoration:none !important;} /*---------------------------------------------------- ポイント照会 ----------------------------------------------------*/ #point { background: #F2F2F2; border: 1px solid #CCC; margin: 10px auto 20px; padding: 20px 0; width: 100%; text-align:center; } div#pointMain table { margin: 0 auto 50px; width: 100%; } div#pointMain table td { border-bottom: 1px solid #CCCCCC; padding: 0; text-align: center; width: 200px; } /*---------------------------------------------------- SketchPage ----------------------------------------------------*/ #sketchPage p{ text-align: center; } #sketchPage em{ font-style:oblique; } #sketchPage #ribbon{ position:relative; } #sketchPage #ribbon img.ribbonImg{ position:absolute; *top:0; left:-27px; bottom:340px; *top:110px; } #spBtn{ width:720px; overflow:hidden; _zoom:1; } #spBtn a{ margin:0 auto 50px; *margin-left:75px; text-indent:-9999px; display:block; height:106px; width:576px; background:url(http://gigaplus.makeshop.jp/msdepart/images/sketchPage/spBtn.png) no-repeat; } #spBtn a:hover{ background:url(http://gigaplus.makeshop.jp/msdepart/images/sketchPage/spBtn_on.png) no-repeat; } p.spAtn{ background:#eee; padding:10px; border:1px solid #ccc; } #sp{ position:relative; } #spDetailBtn{ text-indent:-9999px; position:absolute; top:320px; left:140px; } #spDetailBtn a{ display:block; width:433px; height:114px; background:url(http://gigaplus.makeshop.jp/msdepart/images/sketchPage/spBtn02.png) no-repeat; overflow:hidden; _zoom:1; } #spDetailBtn a:hover{ background:url(http://gigaplus.makeshop.jp/msdepart/images/sketchPage/spBtn02_on.png) no-repeat; } /*---------------------------------------------------- multi form Enquete ----------------------------------------------------*/ #enqComment p{ width:100%; text-align:left; margin:10px auto; background:#333; padding:10px 20px; color:#fff; border:solid 2px #ccc; } #M_enqueteForm input{border:solid 1px #ccc; height:30px; margin:0px auto 10px;} #M_enqueteForm #input02, #M_enqueteForm #input03 {width:200px;} #enqComment p span.smallTxt{font-size:11px; color:#ccc; margin-top:10px;} #enqComment p a{color:#ff0066;} ul#M_enqueteCaution, ul#M_enqueteForm {width:580px !important;} textarea#input01 {border:solid 2px #999;} ul#M_enqueteCaution h3, ul#M_enqueteForm h3{ background:url(/design/msdepart/img/common/arrow01.gif) no-repeat left bottom; text-indent:14px; line-height:120%; font-size:13px; } div#M_enqueteBtn{margin:20px auto;} div#M_enqueteBtn input{width:80px; height:24px;} div#M_enqueteBtn input[type="button"], div#M_enqueteBtn input[type="reset"]{ border:solid 1px #ccc; width:80px; background:#333 no-repeat; color:#fff; border-radius: 10px;/* CSS3草案 */ -webkit-border-radius: 10px;/* Safari,Google Chrome用 */ -moz-border-radius: 10px; } /*---------------------------------------------------- present (kensho) ----------------------------------------------------*/ #present {width:100%; margin:10px auto; text-align:center;} #present input, #present textarea{border:solid 1px #ccc; margin:2px;font-size:12pt;} #present table {background: #eee; width:700px !important; border:double 4px #999; margin:10px auto;} #present table td{ padding:4px 2px;} #present textarea{margin-bottom:20px; width:500px;} #present input{max-width:500px;} /*---------------------------------------------------- 追加画像登録用 ----------------------------------------------------*/ .plusImgDetail{ text-align:center; } .plusImgDetail ul.plusImg{ overflow:hidden; _zoom:1; margin-top:20px; } .plusImgDetail .plusImg li { width:199px; float:left; padding-right:16px; *padding-right:10px; margin-left:16px; *margin-left:10px; border-right:1px #333 dotted; } .plusImgDetail ul.plusImg p{ margin-top:8px; } #plusItemInfo { overflow: hidden; _zoom:1; width: 720px; margin-top:24px; } #plusItemInfo table { float: left; margin-bottom: 10px; width: 430px; table-layout:fixed; } input.m_price { border: 0 none; padding-right: 3px; text-align: right; } input.m_price { background-color: transparent; color: #FF0000; font-size: 20px; width: 60px; } /* option list zaiko */ .M_inventory .stockTxt{ background:url(/design/msdepart/bg_end.gif) no-repeat; text-indent:-9999px; width:234px; height:17px; } /* detail review */ #M_review input {width:120px; border:1px solid #ccc; height:20px;} #star0,#star1,#star2,#star3,#star4{width:12px; border:none !important;}/* IEでimportant必要 */ #M_review textarea{width:98% !important; height:60px !important; border:solid 1px #ccc;} /* ここはimportant必要 */