/* ************************************************ * 共通設定 * ************************************************ */ * { margin: 0px; padding: 0px; } body { color: #000000; font-size: small; font-family: "メイリオ", "Verdana", "ヒラギノ角ゴ Pro W3", "MS ゴシック", "Osaka‐等幅"; line-height: 1.6em; background-color: #ffccff; text-align:center; } br.clear { clear: both; font: 0pt/0pt sans-serif; } img { border: 0px; } a:link {color: #339; text-decoration: none;} a:visited {color: #339; text-decoration: none;} a:active {color: #339; text-decoration: none;} a:hover {color: #c36; text-decoration: underline;} /* ------------------------------------- * ページレイアウト * ------------------------------------- *※ページ全体の幅は800pxとなっています。 幅を広げる場合は、.sideと.mainのwidth の合計値が#containerのwidthになるよう 設定してください。 * ------------------------------------- */ /*背景の画像をリピート*/ #body_back { margin: 0px auto; width: 990px; background:url(https://img16.shop-pro.jp/PA01091/996/etc/990body_back.gif) repeat-y top; } /*ページ全体の幅、レイアウトをセンタリング*/ #container { margin:0px auto; width:930px; text-align:left; } /*****ヘッダー(ページタイトル、グローバルメニュー)*****/ /*タイトルバー*/ .header { width: 930px; height: 150px; background:url(https://img16.shop-pro.jp/PA01091/996/etc/stonesharmony_header.jpg) no-repeat left top; width:100%; clear:left; margin-bottom: 2px; } /*ロゴ位置*/ .logo_area { width: 300px; float: left; padding: 14px 0 0 13px; } /*4ボタン位置*/ .header_menu_area { width: 300px; float: right; padding: 14px 0 0 0px; } /*blogと石意味バナー位置*/ .header_bn_area { width: 170px; float: right; padding: 2px 0 0 0; } /*leftとmainを囲む*/ .wrapper { width:760px; float:left; } /* 画面左側メニューの幅 */ .left { float: right; width: 170px; } /* 中央の幅 */ .main { float: right; width: 560px; margin: 0 15px; } .right { float: left; width: 170px; } /*カートを見る・中身表示*/ .incart_name { text-align: left; } .incart_price { text-align: right; padding-bottom : 5px; } .total { border-top: 1px dotted #C3C3C3; text-align: right; padding: 5px 0; } .postage { border-top: 1px solid #C3C3C3; border-bottom: 1px solid #C3C3C3; margin-bottom: 10px; list-style-type: none; } .postage li { margin: 5px 0; color: red; text-align: center; } .cart_empty { border-bottom: 1px solid #C3C3C3; margin-bottom: 10px; } /***** メニューエリア共通 *****/ /*上飾り画像*/ .side_menu_header { width: 170px; height: 55px; margin: 10px auto 0; background:url(https://img16.shop-pro.jp/PA01091/996/etc/170side_header.gif) no-repeat center top; } /*メニュー背景画像リピート*/ .side_menu_middle { width: 170px; margin:0px auto; background:url(https://img16.shop-pro.jp/PA01091/996/etc/170side_middle.gif) repeat-y; } /*下飾り画像*/ .side_menu_footer { width: 170px; height: 32px; margin: 0 auto 10px; background:url(https://img16.shop-pro.jp/PA01091/996/etc/170side_footer.gif) no-repeat center top; } /*テキスト装飾 サイズ・中央揃え*/ .side_menu_center { font-size: 12px; text-align: center; padding: 5px; } /*メニューカテゴリタイトル画像*/ .left_search { width: 170px; height: 24px; background:url(https://img16.shop-pro.jp/PA01091/996/etc/170side_search.gif) no-repeat center top; text-indent: -9999px; margin-bottom: 10px; } .left_category { width: 170px; height: 24px; background:url(https://img16.shop-pro.jp/PA01091/996/etc/170side_category.gif) no-repeat center top; text-indent: -9999px; margin-bottom: 10px; } .right_cart { width: 170px; height: 24px; background:url(https://img16.shop-pro.jp/PA01091/996/etc/170side_cart.gif) no-repeat center top; text-indent: -9999px; } .right_series { width: 170px; height: 24px; background:url(https://img16.shop-pro.jp/PA01091/996/etc/170side_series.gif) no-repeat center top; text-indent: -9999px; margin-bottom: 10px; } .right_stone { width: 170px; height: 24px; background:url(https://img16.shop-pro.jp/PA01091/996/etc/170side_stone.gif) no-repeat center top; text-indent: -9999px; } /*カテゴリ リストのマークを消す*/ .left_category_list { list-style-type: none; margin-left: 5px; } /*カテゴリのレイアウト*/ .left_category_list li { font-size: 0.9em; padding: 1px 0 1px 20px; background: transparent url(https://img16.shop-pro.jp/PA01091/996/etc/side_category_mark.gif) no-repeat left center; line-height: 145%; } /* 特定商取引法に基づく表記(返品など)ボタン */ p#sk_link_other { text-align:left; margin-top:10px; } p#sk_link_other a { font-size:12px; } /* フッター(コピーライト) */ .footer { width:100%; clear: both; padding-top: 20px; text-align: center; font-size: 0.9em; } #group-list { border-top:#838383 dotted 1px; padding:5px 0px 0px; margin:10px 20px 0px 0px; } /* ------------------------------------- * 商品オプション 表形式 * ------------------------------------- */ #option_tbl { border-collapse:collapse; border-top:1px solid #ccc; border-left:1px solid #ccc; } #option_tbl th{ border-bottom:1px solid #ccc; border-right:1px solid #ccc; } #option_tbl td { border-bottom:1px solid #ccc; border-right:1px solid #ccc; } /***** トップページ *****/ #top_banner a { margin-bottom: 20px; display: block; } .main_recommend { width: 560px; height: 63px; background:url(https://img16.shop-pro.jp/PA01091/996/etc/560main_recommend.jpg) no-repeat center top; text-indent: -9999px; } .item_box { width: 185px; font-size: 0.9em; margin: 10px 0; } .item_box img { border: 1px solid #999; padding: 3px; margin: 6px; } .item_box_name { padding: 0 10px; line-height: 130%; } .item_box_price { padding: 0 10px 6px 0; text-align: right; } .item_box_soldout { margin: 0 30px; text-align: center; background-color: #999; } /***** 商品一覧ページ *****/ .title_bar { width: 560px; height: 40px; padding: 30px 0 0; font-size: 20px; text-align: center; background:url(https://img16.shop-pro.jp/PA01091/996/etc/560title_bar.jpg) no-repeat center top; } .topic_footer { width: 560px; height: 48px; margin-bottom: 40px; background:url(https://img16.shop-pro.jp/PA01091/996/etc/560topic_footer.jpg) no-repeat center top; } .sortlist { width: 310px; height: 30px; padding: 10px 0 0 250px; background:url(https://img16.shop-pro.jp/PA01091/996/etc/560sortlist.gif) no-repeat center top; } /***** 商品詳細ページ *****/ .item_detail_box { padding: 0 30px; } .item_name { border-style: solid; border-color: #44246c; border-width: 0 0 0 8px; margin-top: 5px; padding-left: 8px; } .item_table { } .item_table th { width: 100px; padding: 2px 0 2px 5px; background-color: #dddddd; } .item_table td { width: 200px; padding: 2px 0 2px 5px; background-color: #eeeeee; } .item_other_box img { margin: 4px; border: 1px solid #999; } /***** オプション詳細情報 *****/ #option { background-color: #fff; } #option table { margin: auto; border: 1px #E3E3E3 solid; border-collapse: collapse; border-spacing: 0; } #option table th { padding: 5px; border: #E3E3E3 solid; border-width: 0 0 1px 1px; background: #F5F5F5; font-weight: bold; line-height: 120%; text-align: center; } #option table td { padding: 5px; border: 1px #E3E3E3 solid; border-width: 0 0 1px 1px; text-align: center; } /***** 特定商取引法に基づく表記 *****/ /* 会社概要 */ .low { background: #eee; border-style: solid; border-color: #999; border-width: 0 1px 1px 1px; font-size: 0.95em; } .low dt { float: left; width: 105px; padding: 10px 5px 5px 5px; border-style: solid; border-color: #999; border-width: 1px 0 0 0; } .low dd { margin: 0 0 0 115px; padding: 10px 0 5px 5px; background: #fff; border-style: solid; border-color: #999; border-width: 1px 0 0 1px; } .law { width: 560px; border: 1px solid #999; border-collapse: collapse; } .law th { width: 115px; background: #eee; border: 1px solid #999; border-collapse: collapse; padding: 5px 0 5px 5px; } .law td { width: 445px; border: 1px solid #999; border-collapse: collapse; padding: 5px 0 5px 5px; } /***** パワーストーンの解説 *****/ #stone_story_list { list-style: none; margin-left: 20px; } #stone_story1, #stone_story2, #stone_story3, #stone_story4, #stone_story5, #stone_story6, #stone_story7, #stone_story8 { margin-top: 50px; font-size: 1.2em; } #stone_puri { margin-top: 50px; font-size: 1.2em; color: #ff69b4; } .stone_story { width: 560px; font-size: 11px; border: 1px solid #999; border-collapse: collapse; line-height: 1.4; } .stone_story th { text-align: center; border: 1px solid #999; border-collapse: collapse; padding: 3px 0 1px 3px; } .stone_story td { border: 1px solid #999; border-collapse: collapse; padding: 3px 0 1px 3px; } .stone_story td.bs { width: 20px; font-size: 10px; } .stone_story td.sn { width: 140px; font-size: 12px; font-weight: bold; } .stone_story td.sn2 { width: 50px; } .stone_story td.ko { width: 20px; } .stone_story td.pr { width: 50px; } .stone_story td.im { width: 280px; font-size: 12px; } .stone_story a { text-decoration: underline; } .stone_puri { width: 560px; font-size: 12px; border: 1px solid #ffb6c1; border-collapse: collapse; line-height: 1.5; } .stone_puri th { width: 120px; font-size: 14px; text-align: center; background-color: #fff4f9; border: 1px solid #ffb6c1; border-collapse: collapse; padding: 3px 0 1px 3px; } .stone_puri td { width: 440px; border: 1px solid #ffb6c1; border-collapse: collapse; padding: 3px 0 1px 3px; } /*** 共通スタイル ***/ .textcenter { text-align: center; } /***** 新着情報(iFrame) *****/ .iframebox { height: 120px; overflow-y: auto; overflow-x: hidden; padding: 5px; background-color: #ffffe0; border: 1px #ccc solid; line-height: 120%; font-size: 0.9em; } .iframebox dl { } .iframebox dt { float: left; width: 90px; padding: 5px 0; } .iframebox dd { padding: 5px 0 5px 90px; border-bottom: 1px #ccc solid; } /***** 商品詳細説明欄 テーブル用(2012/6/14) *****/ .spec_table { } .spec_table th { width: 100px; padding: 5px 0 2px 5px; background-color: #ffe5f2; line-height: 95%; } .spec_table td { width: 380px; padding: 5px 0 2px 5px; background-color: #ffeff7; } /***** 商品詳細 定価の打ち消し線を赤に(2012/08/15) *****/ .uchikeshi { text-decoration: line-through; color: #ff0000; } .kuromoji { color: #000000; } /***** 天然石で選ぶ Javascript(2012/09/07) *****/ .vmenuitem{ background-color: #ffffcc; cursor: pointer; width: 154px; padding: 0 0 0 10px; } .vmenu_on, .vmenu_off{ margin: 2px 0px; } .vmenu_on .vmenuitem{ border: 1px solid #cccc77; border-left: 5px solid #cccc77; } .vmenu_off .vmenuitem{ border: 1px solid #77cccc; border-left: 5px solid #77cccc; } .vmenu_on ul{ display: auto; padding: 0 0 0 40px; font-size: 0.9em; line-height: 140%; } .vmenu_on ul a { } .vmenu_on ul a:link {color:#000;} .vmenu_on ul a:visited {color:#000;} .vmenu_on ul a:hover {color:#000;} .vmenu_on ul a:active {color:#000;} .vmenu_off ul{ display: none; } /***** カレンダー用(2012/09/07) *****/ .table_calendar { width: 140px; font-size: 11px; background-color: #ffffe5; border: 2px solid #ffcc99; border-collapse: collapse; text-align: center; margin: 2px auto; } .table_calendar tr { height: 22px; } .table_calendar td { border: 1px solid #ffcc99; border-collapse: collapse; } .table_calendar td.hd { background-color: #ff7f7f; } .table_calendar td.wd { background-color: #ffffcc; } .table_calendar td.red { background-color: #ff9999; } .table_calendar td.none { background-color: #ffffff; } /***** パンくずリスト文字サイズ(2012/09/19) *****/ .panmoji { font-size: 10px; line-height: 100%; } /***** 四神説明テーブル(2012/10/25) *****/ .shijin { } .shijin th { width: 430px; padding: 5px 0 5px 5px; background-color: #ffe5f2; line-height: 100%; font-size: 14px; } .shijin th.genbu { background-color: #333333; color: #ffffff; padding-left: 20px; } .shijin th.seiryu { background-color: #3366cc; color: #ffffff; padding-left: 20px; } .shijin th.suzaku { background-color: #ff704c; padding-left: 20px; } .shijin th.byakko { background-color: #e6e6e6; padding-left: 20px; } .shijin td { width: 430px; padding: 5px; background-color: #ffffff; line-height: 100%; } /***** トップページカテゴリ紹介バナー(小)(2012/11/26) *****/ .mainbn_sl { float: left; border: 1px solid #ccc; width: 276px; font-size: 12px; line-height: 120%; margin: 0 4px 4px 0; } .mainbn_sr { float: left; border: 1px solid #ccc; width: 276px; font-size: 12px; line-height: 120%; margin: 0 0 4px 0; } .mainbn_sl img { padding: 3px; } .mainbn_sr img { padding: 3px; } .mainbn_s_text { padding: 0 5px 5px; color: #333333; } .mainbn_space { float: left; width: 4px; } /***** トップページカテゴリ紹介バナー(大)(2012/12/11) *****/ .mainbn_l { border: 1px solid #ccc; width: 558px; font-size: 0.9em; line-height: 120%; margin-bottom: 4px; } .mainbn_l img { padding: 3px 3px 0 3px; } .mainbn_l_text { padding: 0 5px 5px; color: #333333; } /***** トップページお知らせテキスト用(2012/11/28) *****/ .mainnews_text { font-size: 0.9em; text-align: center; line-height: 130%; } /***** カテゴリ一覧 タイトル&テキスト用(2012/11/29) *****/ .catetitle { width: 560px; background-color: #ffffea; color: #333333; } .catetitle_text { font-size: 0.9em; line-height: 130%; padding: 10px; } /* *** clearfix(floatの回り込みを解除) *** */ .main:after, .side:after, .footer:after, .low dd:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }