/* ************************************************ * all * ************************************************ */ * { margin: 0px; padding: 0px; } html { overflow-y: scroll; height: 100%; } body { text-align:left; font-size: 12px; font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'MS Pゴシック', 'MS PGothic', sans-serif; color: #000; } a { outline: none; color: #000; } a:visited,:link { text-decoration: none; } a:hover { text-decoration:none; color:#999; } br.clear { clear: both; font: 0pt/0pt sans-serif; line-height: 0; } hr { clear: left; margin: 10px 0; border: 0; } img { border: none; vertical-align: middle; } /* ************************************************ * clearfix * ************************************************ */ .clearfix { *zoom: 1; } .clearfix:before, .clearfix:after { display: table; content: ""; } .clearfix:after { clear: both; } /* ************************************************ * padding margin * ************************************************ */ .mt05 {margin-top:5px;} .mt10 {margin-top:10px;} .mt20 {margin-top:20px;} .mt30 {margin-top:30px;} .mt40 {margin-top:40px;} .mb05 {margin-bottom:5px;} .mb10 {margin-bottom:10px;} .mb15 {margin-bottom:15px;} .mb20 {margin-bottom:20px;} .mb25 {margin-bottom:25px;} .mb30 {margin-bottom:30px;} .ml10 {margin-left:10px;} .ml20 {margin-left:20px;} .ml30 {margin-left:30px;} .mr10 {margin-right:10px;} .mr20 {margin-right:20px;} .mr30 {margin-right:30px;} .pb05 {padding-bottom:5px;} .pb10 {padding-bottom:10px;} .pb15 {padding-bottom:15px;} /* ************************************************ * font * ************************************************ */ .textC { text-align:center; } .red {color:#fe0000} /* ************************************************ * layout * ************************************************ */ /*ページ全体の幅、レイアウトをセンタリング*/ #container { margin:0px auto; width:1000px; text-align:left; } #top_line{ margin: 0 0 15px; width: 100%; height: 3px; background: transparent url("https://img.shop-pro.jp/tmpl_img/67/border_bottom.png") repeat-x left top; } /*ヘッダー*/ #header { clear:both; padding: 20px 0; width:100%; } /*サイド*/ #side { float: left; width: 250px; } /*メイン*/ #main { float: right; width: 730px; } /*フッター(コピーライト)*/ #footer { clear:both; padding: 30px 0 20px; width:100%; border-top: 1px solid #ccc; color: #666; text-align: center; } /*スライダー*/ .slider{ margin: 0 0 70px; } /* ************************************************ * header * ************************************************ */ #header .header_link { float: right; margin-bottom: 15px; } #header .header_link ul { } #header .header_link ul li { float: left; margin-left: 20px; list-style-type: none; line-height: 16px; } #header .header_link ul li i { display: block; float: left; margin-right: 5px; width: 16px; height: 16px; } #header .header_link ul li a { text-decoration: none; } #header .header_link ul li.my_account { } #header .header_link ul li.my_account i.account { background: url(https://img.shop-pro.jp/tmpl_img/67/icons16.png) no-repeat left -97px; } #header .header_link ul li.member_login_btn i.login { background: url(https://img.shop-pro.jp/tmpl_img/67/icons16.png) no-repeat left -225px; } #header .header_link ul li.member_regist_btn i.regist { background: url(https://img.shop-pro.jp/tmpl_img/67/icons16.png) no-repeat 0px -193px; } #header .header_link ul li.member_logout_btn i.logout { background: url(https://img.shop-pro.jp/tmpl_img/67/icons16.png) no-repeat left -210px; } #header .member_login_name{ float: right; clear: right; margin: 0 0 13px; } #header .header_link ul li.view_cart { } #header .header_link ul li.view_cart i.cart { background: url(https://img.shop-pro.jp/tmpl_img/67/icons16.png) no-repeat 0px 0px; } #header .header_link ul li.view_cart span.count { margin-left: 5px; padding: 5px 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #ff3355; color: #fff; font-weight: bolder; } #header .header_delivery_price { float: right; clear: right; margin: 0 0 17px; padding: .5em 1em .3em; border: solid 1px #aaa; list-style: none; line-height: 1.5; } #header .search { float: right; clear: right; margin-bottom: 40px; } #header h1.logo { max-width: 50%; word-wrap: break-word; font-size: 40px; } #header h1.logo a { text-decoration: none; } #header h1.logo img { max-width: 100%; } /* ************************************************ * account * ************************************************ */ .account_link { float: right; margin-bottom: 15px; } .account_link ul { } .account_link ul li { float: left; margin-left: 20px; list-style-type: none; line-height: 16px; } .account_link ul li i { display: block; float: left; margin-right: 5px; width: 16px; height: 16px; } .account_link ul li a { text-decoration: none; } .account_link ul li.my_account { } .account_link ul li.my_account i.account { background: url(https://img.shop-pro.jp/tmpl_img/67/icons16.png) no-repeat left -97px; } .account_link ul li.member_login_btn i.login { background: url(https://img.shop-pro.jp/tmpl_img/67/icons16.png) no-repeat left -225px; } .account_link ul li.member_regist_btn i.regist { background: url(https://img.shop-pro.jp/tmpl_img/67/icons16.png) no-repeat 0px -193px; } .account_link ul li.member_logout_btn i.logout { background: url(https://img.shop-pro.jp/tmpl_img/67/icons16.png) no-repeat left -210px; } .member_login_name{ float: right; clear: right; margin: 0 0 13px; } .account_link ul li.view_cart { } .account_link ul li.view_cart i.cart { background: url(https://img.shop-pro.jp/tmpl_img/67/icons16.png) no-repeat 0px 0px; } .account_link ul li.view_cart span.count { margin-left: 5px; padding: 5px 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #ff3355; color: #fff; font-weight: bolder; } .account_delivery_price { float: right; clear: right; margin: 0 0 17px; padding: .5em 1em .3em; border: solid 1px #aaa; list-style: none; line-height: 1.5; } /* ************************************************ * footer * ************************************************ */ #footer a { color: #fff; } #footer .footer_menu { clear: both; margin-bottom: 10px; } #footer .footer_menu li { display: inline; margin: 0 5px; } .copyright { clear: both; padding: 1em 0; text-align: center; font-size: 76.923%; } .powered { display: inline; margin-left: 1em; text-align: center; line-height: 18px; } .powered a { color: #777; text-decoration: none; } .powered img { margin-left: .3em; width: 200px; height: 18px; } .foot_policy{ margin: 0 0 30px; padding: 0 0 20px; border-bottom: 1px solid #ccc; } .foot_sk_box{ float: left; padding: 0 25px; width: 200px; text-align: left; } .foot_sk_box h3{ margin: 0 0 1em; } .foot_sk_box h4{ font-size: 13px; } .foot_sk_box dt{ margin: 0 0 .5em; } .foot_sk_box dd{ margin: 0 0 1.5em; } #mobile{ width: 145px; } /* ************************************************ * main * ************************************************ */ #main .box { clear: both; overflow: hidden; margin-bottom: 60px; border-top: solid 1px #999; width: 100%; } #main .box h3 { font-size: 13px; vertical-align: middle; } .header_block{ clear: both; padding: 1.1em 0; background: transparent url("https://img.shop-pro.jp/tmpl_img/67/border_bottom.png") repeat-x left bottom; } .header_block .icon{ float: left; margin: 0 14px 0 0; width: 20px; height: auto; text-align: center; } .header_block .icon img{ max-width: 100%; } .header_block .title{ float: left; text-align: left; } .header_block h3{ padding: 0; border: none; text-align: left; } .header_block p{ margin-top: 4px; color: #999; } #main .header_block{ margin: 0 0 30px; } #main .header_block .icon{ padding: 0; } /* ************************************************ * item_box * ************************************************ */ .item_box { display:inline-block; float: left; margin: 0 41px 45px 0; width: 206px; vertical-align:top; text-align: center; /display:inline; /zoom:1; } .item_box .item_image { margin: 0px; } .item_box .item_image img.item { max-width: 100%; border: solid 1px #ddd; box-sizing: border-box; } .item_box .item_detail { margin: 15px 0 0; padding-left: 10px; border-left: solid 1px #ddd; } .item_box .item_detail p{ overflow: hidden; width: 100%; text-overflow: ellipsis; white-space: nowrap; -o-text-overflow: ellipsis; } .item_box .item_detail p.item_name { margin-bottom: 5px; font-size: 15px; } .item_box .item_detail p.item_description{ text-overflow: initial; overflow: visible; white-space: normal; } p.item_regular_price, p.item_price, p.item_discount { margin-bottom: 10px; font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif; } .item_box2 { display:inline-block; float: left; margin: 0 41px 45px 0; width: 206px; vertical-align:top; text-align: center; /display:inline; /zoom:1; } .item_box2 .item_image { margin: 0px; } .item_box2 .item_image img.item { max-width: 100%; border: solid 1px #ddd; box-sizing: border-box; } .item_box2 .item_detail { margin: 15px 0 0; padding-left: 10px; border-left: solid 1px #ddd; } .item_box2 .item_detail p{ overflow: hidden; width: 100%; text-overflow: ellipsis; white-space: nowrap; -o-text-overflow: ellipsis; } .item_box2 .item_detail p.item_name { margin-bottom: 5px; font-size: 15px; } .item_box2 .item_detail p.item_description{ text-overflow: initial; overflow: visible; white-space: normal; } p.item_regular_price, p.item_price, p.item_discount { margin-bottom: 10px; font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif; } .box_last{ margin-right: 0; } .box_small .item_box { display:inline-block; margin: 0 33px 45px 0; width: 113px; vertical-align:top; text-align: left; /display:inline; /zoom:1; } .box_small p { overflow: hidden; width: 100%; text-overflow: ellipsis; white-space: nowrap; -o-text-overflow: ellipsis; } .box_small .item_box .item_detail a { margin-bottom: 5px; font-size: 13px; } .box_small .box_last { margin-right: 0; } .stock_error{ display:none; padding:10px 0; color:#DA5858; font-weight:bold; } /* ************************************************ * Top_Page * ************************************************ */ #main #box_info p { line-height: 20px; } #main #box_free { padding: 20px; border: #aaa solid 1px; } #main #box_free p { line-height: 20px; } #main #box_news .header_block{ margin-bottom: 0; } #main #box_news ul{ margin-left: 0; list-style: none; } #main #box_news ul li{ border-top:#ddd solid 1px; } #main #box_news ul li:first-child{ border-top:none; } #main #box_news ul li div{ padding: 1.6em 0 1.4em; } #main #box_news p.news_date{ float: left; margin-right: 20px; width: 70px; } #main #box_news p.news_message{ float: left; } /* ************************************************ * product_detail_page * ************************************************ */ h2.product_name { margin-bottom: 0.8em; padding-bottom: 0.6em; background: transparent url("https://img.shop-pro.jp/tmpl_img/67/border_bottom.png") repeat-x left bottom; font-size: 18px; } .product_form{ margin: 0 0 62px; } .product_detail_area { position: relative; width: 100%; } .product_images { display: inline-block; float: left; width: 400px; } .product_images div img { max-width: 100%; max-height: 100%; width: auto; height:auto; border: 1px solid #ddd; } .product_images div p.detail { margin-top: 10px; line-height: 20px; } .add_cart { clear: right; float: right; overflow: hidden; width: 270px; } table.add_cart_table { margin-bottom: 10px; width: 100%; border-left: solid 1px #ccc; table-layout:fixed; font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif; } table.add_cart_table th { display: inline-block; overflow: hidden; padding: 12px 4px 12px 18px; width: 35%; text-align: left; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; } table.add_cart_table td { display: inline-block; overflow: hidden; padding: 10px 0; width: 55%; text-align: left; text-overflow: ellipsis; white-space: nowrap; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; } table.add_cart_table td input { padding: 0 4px; width: 38px; height: 26px; font-size: 15px; line-height: 26px; vertical-align: middle; } table.add_cart_table td strong.price { font-size: 14px; } table#option_tbl { margin-bottom: 20px; width: 100%; } table#option_tbl th, table#option_tbl td.none { background: whiteSmoke; } table#option_tbl th, table#option_tbl td { padding: 10px; border: 1px solid #ccc; text-align: center; } table#option_tbl th { background: whiteSmoke; } table#option_tbl td div input { margin-bottom: 5px; } ul.option_price { margin: 0 0 20px 0; } ul.option_price li { list-style-type: none; } .option_box{ clear: both; width: 100%; overflow: hidden; } table td.pur_block{ margin: 0 5px 0 0; width: auto; white-space: normal; } .button_area input { width: 100%; } .product_description { clear: both; margin-bottom: 20px; word-wrap: break-word; font-size: 12px; line-height: 22px; } .simple_explain { clear: both; margin-bottom: 20px; word-wrap: break-word; font-size: 12px; line-height: 22px; } .product_image_extra { margin-bottom: 20px; text-align: center; } .product_image_extra img.item { margin-bottom: 20px; } .product_link_area { margin: 20px 0 0; padding: 20px 0 0; border-top: #ccc solid 1px; } .product_link_area div.twitter { float: left; width: 100px; } .product_link_area div.pinterest { float: left; margin-right: 30px; } .product_link_area div.fb-like { float: left; width: 200px; } .product_link_area ul.other_link { clear: both; margin-top: 20px; margin-left: 20px; } .product_link_area ul.other_link li { margin-bottom: 10px; } .share{ margin: 15px 0 0; list-style: none; } .share li{ display: inline-block; float: left; margin: 0 10px 10px 0; max-width: 125px; } .calamel-link{ margin-top: 10px; } #tb_cap_tb{ margin-top: 20px; } .tb { padding-top: 10px; padding-bottom: 10px; border-top: 1px solid #CCC; } #tb_stitle { margin-bottom: 20px; } .tb_date, .tb_title, .tb_body, .tb_state { margin-bottom: 5px; } /* ************************************************ * cloud_zoom * ************************************************ */ /* This is the moving lens square underneath the mouse pointer. */ .cloud-zoom-lens { margin:-4px; /* Set this to minus the border thickness. */ border: 4px solid #888; background-color:#fff; cursor:move; } /* This is for the title text. */ .cloud-zoom-title { position:absolute !important; top:0px; padding:3px; width:100%; background-color:#000; color:#fff; text-align:center; font-weight:bold; font-size:10px; font-family:Arial, Helvetica, sans-serif; } /* This is the zoom window. */ .cloud-zoom-big { overflow:hidden; border: 4px solid #c86464; } /* This is the loading message. */ .cloud-zoom-loading { padding:3px; border:1px solid #000; background:#222; color:white; } /* Feature section in ZoomEngine page */ .zoom-section { clear:both; } * html .zoom-section { display:inline; clear:both; } .zoom-small-image { float: left; margin-top: 4px; width: 400px; } .zoom-small-image #wrap { position: relative; top: 0px; z-index: 9999; } .cloud-zoom { margin-bottom: 20px; } .zoom-small-image .mousetrap { position: absolute; top:0px; left:0px; z-index:999; width: 100%; } /* Feature descriptions in ZoomEngine page */ .zoom-desc { clear: left; width: 100%; } a.cloud-zoom-gallery { display: block; float: left; margin: 0 22px 20px 0; width: 82px; height: 82px; cursor: pointer; } .zoom-tiny-image { padding: 3px; width: 100%; height: auto; border: 1px solid #ccc; background: #efefef; } .zoom-tiny-image.selected { border: 1px solid #c86464; background: #c86464; } .zoom-tiny-image:hover { border: 1px solid #c86464; } a.gallery_last{ margin-right: 0; } /* ************************************************ * product_option_window * ************************************************ */ #product_option { margin: 20px; padding: 20px; background: #fff; } #product_option h2 { margin-bottom: 20px; } table.table_option { margin-bottom: 20px; border-top: 1px solid #ccc; border-right: 1px solid #ccc; background: #fff; } table.table_option th { padding: 10px; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; background: #f5f5f5; } table.table_option td { padding: 10px; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; } /* ************************************************ * product_list_page * ************************************************ */ .sub_category_area, .sub_group_area { margin-bottom: 20px; padding: 10px 10px 0px 10px; height: 100%; border: solid 1px #ccc; } .sub_category_area div.sub_category, .sub_group_area div.sub_group { float: left; margin: 0 20px 10px 0; } .sub_category_area div.sub_category img, .sub_group_area div.sub_group img { margin-right: 10px; border: solid 1px #ccc; } /* ************************************************ * search_page * ************************************************ */ .search_result { margin: 20px 0; padding: 10px 0; background: #ddd; text-align: center; } .none { margin: 50px 0; text-align: center; } /* ************************************************ * policy * ************************************************ */ #policy { line-height: 1.8; font-size: 14px; } #policy h2 { margin-bottom: 30px; } .policy_box, #policy_lead{ margin-bottom: 30px; } .sk_box { margin-bottom: 70px; } .sk_box h3 { margin-bottom: 1em; font-size: 16px; } .sk_box table { width: 100%; border-top: 1px solid #ccc; border-collapse: separate; empty-cells:show; } .sk_box th { padding: 20px 40px 20px 0; width: 170px; text-align: left; } .sk_box th img.poricy_img { margin-bottom: 5px; } .sk_box td { padding: 20px 0; zoom: 1; content: ' '; } .sk_box th, .sk_box td { vertical-align: top; line-height: 1.8; position: relative; border-bottom: solid 1px #ccc; } #payment_method { margin-top: 40px; } #payment_method table.table { width: 100%; } #payment_method table.table th { width: 200px; text-align: center; } #shipping_method { margin-top: 40px; } #shipping_method table.table { width: 100%; } #shipping_method table.table th { width: 200px; text-align: center; } /* ************************************************ * side * ************************************************ */ #side .box { clear: both; margin-bottom: 60px; border-top: solid 1px #999; border-bottom: solid 1px #999; word-wrap: break-word; position: relative; } #side .box h3 { text-align: left; font-weight: normal; font-size: 16px; } #side .box ul { margin-left: 0px; list-style: none; } #side .box ul li { border-top:#838383 dotted 1px; } #side .box ul li:first-child { border-top:none; } #side #side_nav { padding: 0; border-top: none; border-right: solid 2px #ccc; border-bottom: none; } #side #side_nav ul{ margin-right: 10px; } #side #side_nav ul li { margin: 0; } #side #side_nav .nav_item{ clear: both; padding: .9em 0 .9em; cursor: pointer; } #side #side_nav .nav_item .nav_icon{ float: left; padding: inherit; width: 20px; height: auto; } #side #side_nav .nav_item .nav_icon img{ max-width: 100%; } #side #side_nav .nav_item .nav_title{ float: right; text-align: right; } #side #side_nav .nav_item h3{ margin-bottom: 4px; padding: 0; border: none; text-align: right; } #side #side_nav .nav_item p{ color: #999; } .box_default ul li div{ position: relative; padding: 1.2em 0 1em; text-align: left; } .box_default ul li div img{ border: solid #ddd 1px; } .box_default ul li div p{ line-height : 1.6; } #side #box_cart { } #side #box_cart .cart_button { text-align: right; } #side #box_owner .inner{ padding: 1.2em 0 1em; } #side #box_owner .owner_photo{ margin: 0 0 10px; width: 100px; max-width: 100%; height: auto; border: solid #ddd 1px; } #side #box_owner p.name { font-size: 14px; } #side #box_owner p.memo { font-size: 11px; line-height: 18px; } #side #box_owner p.website { padding-left: 20px; } #qr_code{ padding: 20px 0; } #box_sellers .seller_box{ padding: 2.2em 0; } #box_sellers li{ position: relative; display: block; } #box_sellers .top_seller:before{ position: absolute; top: 18px; left: -6px; content: url(https://img.shop-pro.jp/tmpl_img/67/rank1.png); } #box_sellers .rank_2:before{ content: url(https://img.shop-pro.jp/tmpl_img/67/rank2.png); } #box_sellers .rank_3:before{ content: url(https://img.shop-pro.jp/tmpl_img/67/rank3.png); } #box_sellers .seller_image{ float: left; margin: 0 10px 0 0; width: 80px; border: solid #ddd 1px; } #box_sellers .seller_detail{ float: right; width: 104px; } #box_sellers .seller_rank{ margin: 0 0 10px; font-size: 12px; } #box_sellers .seller_rank > strong{ font-size: 15px; } #box_sellers .seller_name{ font-size: 13px; } #box_sellers .seller_teika{ float: left; font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif; } #box_sellers .more_seller{ display: none; } .more_btn{ padding: 8px 0; border-top: solid 1px #999; text-align: center; cursor: pointer; } .updown{ display: inline-block; margin: 0 3px 0 0; width: 13px; height: 8px; background: url(https://img.shop-pro.jp/tmpl_img/67/down_icon.png); background-repeat: no-repeat; } .more_up{ background: url(https://img.shop-pro.jp/tmpl_img/67/up_icon.png); } /* ************************************************ * Common Elements * ************************************************ */ /* @group Common Elements */ table { border-spacing: 0; border-collapse: collapse; } table.table { margin-bottom: 20px; border-top: 1px solid #ccc; border-right: 1px solid #ccc; } table.table th { padding: 5px; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; background: #f5f5f5; } table.table td { padding: 5px; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; } .footstamp { margin-bottom: 15px; padding-bottom: 10px; border-bottom: 1px solid #ddd; } .footstamp span { margin: 0 5px; color: #999; } .sort { float: right; margin-bottom: 20px; text-align: right; } .sort strong { margin-right: 5px; } .sort a { margin-right: 5px; text-decoration: underline; } .sort span { margin-right: 5px; background: #eee; text-decoration: none; font-weight: bolder; } .pager { clear: both; margin: 20px 0; text-align: center; } .pager a{ margin: 15px; } .none { clear: both; margin: 50px 0; text-align: center; } .sold_out { color: #DA5858; font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif; } .to_top{ float: right; clear: both; text-align: center; margin: 0 0 20px; padding: 1.3em 1em; border: solid 1px #aaa; font-size: 14px; color: #888; } .to_top:hover { text-decoration: none; color: #c86464; border-color: #c86464; } .tbl_calendar { margin: 20px 0; width: 100%; border: none !important; border-spacing: 0 !important; border-collapse: collapse !important; } .tbl_calendar th, .tbl_calendar td { padding: 4px !important; border-bottom: 1px solid #ccc !important; text-align: center !important; } /* @group button */ .btn { display: block; margin-top: 1em; border: none; border-radius: 0; color: #fff; text-align: center; font-weight: bold; font-size: 15px; font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif; line-height: 1; cursor: pointer; -webkit-appearance:none; } .btn:link, .btn:visited, .btn:hover, .btn:active{ color: #fff; text-decoration: none; } .btn-primary { margin: 1.2em 0 .9em; padding: 1.4em 0; background-color: #c86464; } .btn-contact { margin: 0.5em 0.3em; padding: 1.3em 0; background-color: #a0a0a0; font-weight: normal; font-size: 13px; } .btn-quick { margin: 0.9em 0; padding: 1.3em 0; background-color: #64b4c8; font-size: 13px; } /* ---------------------------------------------------- 追加:ここからサイズ適用パッチ ---------------------------------------------------- */ /** オンマウス ===================================*/ a:hover img { filter: alpha(opacity=75); /*IE用*/ -moz-opacity:0.75; /*Firefox用*/ opacity:0.75; /*Chrome・Safari・Opera用*/ } /** 全体をwrap(firefox対応) ===================================*/ #wrap-all { overflow: hidden; min-width:1020px; /*実際の幅+20px*/ } /** 背景除去 ===================================*/ body { background: none; background-color: #fff; /* background-image: url(); */ } /** font-family指定 ===================================*/ body { font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'MS Pゴシック', 'MS PGothic', sans-serif; } /** ページ全体サイズ調整 ===================================*/ #container { width: 1000px; } #side { width:250px; margin-top:60px; } #main { width: 730px; margin-top:60px; } .wrapper { /* width: 970px; */ padding: 0 10px; margin: auto; } .container { margin:0px auto; width:1000px; text-align:left; } /** 背景画像調整 ===================================*/ .head-bg { /* background-image: url(); */ background-color: #1d2088; background-repeat: repeat-x; border-bottom:3px solid #fff; padding-bottom:20px; } .foot-bg { /* background-image: url(); */ background-color: #fff; background-repeat: repeat-x; clear: both; } /** ヘッダー:全体調整 ===================================*/ #header { padding: 0; margin-bottom: 20px; } /** サイド:ランキング商品サイズ調整 ===================================*/ #box_sellers .seller_image { width: 78px; } /** サイド検索:配置 ===================================*/ #search { padding: 17px 25px; border: 0px solid #ccc; margin-bottom: 15px; background:#1d2088; } /** TOP:おすすめ商品サイズ調整 ===================================*/ .item_box { margin: 0 52px 45px 0; width: 206px; } .box_last { margin-right: 0px; } /** 商品詳細ページ:画像サイズ調整 ===================================*/ .product_images { display: inline-block; float: left; width: 424px; } .zoom-small-image { width: 424px; } a.cloud-zoom-gallery { display: block; float: left; margin: 0px 22px 20px 0px; height: 88px; cursor: pointer; width: 88px; } a.gallery_last { margin-right: 0px; } .mousetrap { width: 424px !important; /* height: 424px !important; */ } /** 商品詳細ページ:おすすめ商品サイズ調整 ===================================*/ .box_small .item_box { display: inline-block; margin: 0px 33px 45px 0px; width: 119px; vertical-align: top; text-align: left; } .box_small .box_last { margin-right: 0px; } /** フッター:特定商部分のボックスサイズ指定 ===================================*/ .foot_sk_box{ width: 266px; } /* ---------------------------------------------------- 追加:ここからサイト適応 ---------------------------------------------------- */ /** ヘッダー:背景・高さ指定(head-cont高さ合計=h1+table) ===================================*/ #head-cont { /* background-image: url(); */ background-repeat: no-repeat; /* height: 125px; */; margin-bottom: 15px } #head-cont table{ height: px; } /** ヘッダー:h1 ===================================*/ h1{ color: #fff; font-size: 14px; font-weight: normal; text-align: right; line-height: 30px; } /** アカウントリンクエリア:配置 ===================================*/ #account-area { height: 36px; } .account_link { float: right; margin-bottom: 20px; } /** グローバルナビ:配置 ===================================*/ #g-nav { text-align: center; } #g-nav ul{ list-style: none; } #g-nav li{ display: inline-block; } /* #g-nav li:lastchild{ margin-right: 0; } */ hr.sept { border-top: 1px solid #888; width: 100%; margin: 24px 0 15px 0; } /** サイド上部バナー ===================================*/ .side-top-bnr { margin-bottom:26px; } .side-top-bnr img{ margin-bottom: 15px; } /** カテゴリー(バナー化) ===================================*/ .ctg-bnr { margin-bottom: 10px; } .ctg-bnr img{ margin-bottom: 0px; } .ctg-bnr .ctg-title { margin-bottom: 18px; } .ctg-bnr hr{ margin: 15px 0 20px; border-top: 1px solid #ccc; width: 100%; } .ctg-bnr ul{ list-style: none; } .ctg-bnr li{ text-align: center; padding: 8px 0px; } /** サイド下部バナー:配置 ===================================*/ .side-bottom-bnr { margin-bottom: 24px; } .side-bottom-bnr img{ margin-bottom: 0px; } .side-bottom-bnr li{ text-align: center; padding: 8px 0px; } .side-bottom-bnr li:first-child{ text-align: center; padding: 0px 0px 8px 0px; } .side-bottom-bnr li:last-child{ text-align: center; padding: 8px 0px; } /** フッター:背景色 ===================================*/ .foot-bg { background-color: #1d2088; } /** フッター:ボーダー削除/文字色 ===================================*/ #footer { border: none; color: #fff; } /** フッター:ボックスサイズ・パディング制御 ===================================*/ /*3列*/ .foot_sk_box { width: 31%; padding: 0 1%; } /** フッター:リンク色 ===================================*/ #footer { } #footer a:visited{ } .foot-ctg { list-style: none; } .foot-ctg li{ color: #888; line-height: 22px; } .foot-ctg li a{ color: #888; } .foot-ctg li a:visited{ color: #888; } .foot-ctg li:first-child{ color: #fff; } .foot-ctg li:first-child a{ color: #fff; } .foot-ctg li:first-child a:visited{ color: #fff; } .foot-link { list-style: none; } .foot-link li{ color: #fff; line-height: 22px; } .foot-link li a{ color: #fff; } .foot-link li a:visited{ color: #fff; } /** フッター:背景のマージン調整 ===================================*/ .foot_policy { margin: 0; padding: 0 0 20px; border-bottom: 0px solid #ccc; } /** フッター:フッターメニュー横並び ===================================*/ .f-menu { text-align: center; } .footer_menu { clear: both; margin: 10px 0; } .footer_menu li { display: inline; margin: 0 5px; } /** 商品ページ:カートに入れるボタン ===================================*/ /* .btn-primary { margin: 1.2em 0 .9em; padding: 1.4em 0; background-color: #02BE03; } */ /** コンテンツ:BOXパディング変更 ===================================*/ #main .box { margin-bottom: 40px; } /** コンテンツ:バナー上部エリア ===================================*/ .bnr-top { margin-bottom: 30px; } /** コンテンツ:NEWS ===================================*/ .news { } hr.sept2 { border-bottom: 1px solid #999; margin: 15px 0 25px; } /** コンテンツ:PR ===================================*/ .pr-box { margin: 10px 0 30px; } .pr-box img{ margin-bottom: 10px; } .pr-box p { margin-bottom: 10px; } .pr-box table td { vertical-align: top; } /** 商品表示枠:4列仕様 ===================================*/ .item_box { margin: 0 20px 10px 0; width: 167px; } .item_box2 { margin: 0 20px 10px 0; width: 155px; } .box_last { margin-right: 0px; } /** 商品表示枠:商品名デザイン ===================================*/ .item_box .item_detail p.item_name { margin-bottom: 5px; font-size: 13px; font-weight: bold; } .item_box .item_detail { margin: 15px 0 0; padding-left: 0px; border-left: none; } .item_box .item_detail p { overflow: visible; width: 100%; text-overflow: ellipsis; white-space: normal; -o-text-overflow: ellipsis; } .item_box2 .item_detail p.item_name { margin-bottom: 5px; font-size: 13px; font-weight: bold; } .item_box2 .item_detail { margin: 15px 0 0; padding-left: 0px; border-left: none; } .item_box2 .item_detail p { overflow: visible; width: 100%; text-overflow: ellipsis; white-space: normal; -o-text-overflow: ellipsis; } /** facebook likebox:マージン ===================================*/ .fb-likebox { margin-bottom: 30px; } /** フリーページ: ===================================*/ .free-page h2 { background: url(https://img14.shop-pro.jp/PA01301/816/etc/line.gif?2156) repeat-x bottom left; padding-bottom: 15px; margin-bottom:20px; } .free-page table { margin-bottom:30px; } .free-page .fp-box { margin-bottom:30px; } /**フリーページ:店舗紹介用tableクラス ===================================*/ .company th{ background-color: #F1F3F2; border: 1px solid #CCCCCC; font-weight: normal; padding: 8px 15px 6px; white-space: nowrap; width: 100px; } .company td { border: 1px solid #CCCCCC; padding: 8px 10px 6px; } .company{ margin-bottom:30px; margin-top:10px; width:726px; } /* ************************************************ * 追記 * ************************************************ */ .h1bg { border-bottom:2px solid #fff; } h1 { width:1000px; margin:0 auto; text-align:left; } #head-cont { margin-top:35px; } #head-cont a:link, #head-cont a:visited { color:#fff; } #head-cont a:hover{ color:#ccc; } #head-cont .logo-area { font-size:14px; width:860px; } #head-cont .head-right { text-align:right; width:140px; } #g-nav ul{ font-size: 14px; font-weight:bold; text-align:right; } #g-nav ul li { border-left:1px solid #fff; line-height:1; padding:0 20px; } #g-nav ul li:last-child { border-right:1px solid #fff; } #g-nav ul li a:link, #g-nav ul li a:visited { color:#fff; } #g-nav ul li a:hover { color:#8182a8; } #mainImg { width:100%; margin:0 auto; border-bottom:10px solid #1d2088; } #mainImg img { width:100%; height:auto; } .ctg-bnr ul { list-style:none; border-bottom:5px solid #1d2088; border-right:5px solid #1d2088; border-left:5px solid #1d2088; padding-top:17px; } .ctg-bnr ul li { background:url(images/side/kokkai11.jpg) no-repeat center left; margin:0 20px 17px 25px; text-align:left; padding:0 0 0 23px; font-size:16px; } #box_category { margin-bottom:27px; } #box_category ul { list-style:none; border-bottom:5px solid #1d2088; border-right:5px solid #1d2088; border-left:5px solid #1d2088; padding-top:17px; } #box_category ul li { background:url(https://img21.shop-pro.jp/PA01348/519/etc/kokkai11.jpg?cmsp_timestamp=20160311105242) no-repeat center left; margin:0 20px 17px 25px; text-align:left; padding:0 0 0 23px; font-size:16px; } #box_side_info { margin-bottom:30px; } #box_side_info .infoBox { border-bottom:5px solid #1d2088; border-right:5px solid #1d2088; border-left:5px solid #1d2088; padding:17px 9px 15px; } #box_side_info .infoBox p { margin-bottom:20px; } #footer .foot_sk_box h3 { background:#fff; color:#1d2088; font-size:12px; padding:5px; font-weight:bold; } #footer .foot_sk_box .f_box { margin-bottom:15px; } #footer a:link, #footer a:visited { color:#fff; } #footer .foot_sk_box p { margin-bottom:10px; line-height:1.5em; } #footer .foot_sk_box p .f_box a:hover{ color:#ccc; } #footer .footer_menu li { border-left:1px solid #fff; line-height:1; font-size:12px; display:inline-block; padding:0 20px 0 23px; margin:0; } #footer .footer_menu li:last-child { border-right:1px solid #fff; } #footer .footer_menu li a:link, #footer .footer_menu li a:visited { color:#fff; } #footer .footer_menu li a:hover{ color:#ccc; } #top1 { margin-bottom:55px; } #top1 ul { list-style: none; margin-bottom:45px; } #top1 ul li { width:350px; margin-right:30px; float:left; } #top1 ul li:last-child { margin-right:0; } #top1 ul li h3 { font-size:15px; font-weight:bold; margin-bottom:8px; } #top1 ul li .top1text { background:url(https://img21.shop-pro.jp/PA01348/519/etc/kokkai14.jpg) repeat-y top center; padding:10px 27px; } #box_new_item { margin-bottom:65px; } #seller { margin-bottom:100px; } .p-runk-num { text-align:center; margin-bottom:10px; } .p-runk-num img { width: 45px; height: 38px; } .topBox { border-bottom:8px solid #1d2088; border-right:8px solid #1d2088; border-left:8px solid #1d2088; padding:30px 17px 30px; }