@charset "utf-8"; /************************************************ 各ページコンテンツ用 ************************************************ */ /* ============================================== ▼TOP =============================================== */ /* ============================================== ▼下層 =============================================== */ /* ============================================== ▼ガイド =============================================== */ /* ◎◎について ----------------------------------------------- */ /* 特定商取引法 ----------------------------------------------- */ /* お問い合わせ ----------------------------------------------- */ div#undercolumn_contact { margin: 0 auto; width: 100%; } .zipimg img { vertical-align: middle; } .LC_Page_Contact table { margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; text-align: left; } .LC_Page_Contact table th { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; } .LC_Page_Contact table td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } /* 姓名分割時の名エラー */ .name02formError, .kana02formError{ margin-left: 150px; } /* ============================================== ▼MYページ =============================================== */ /* 共通設定 ----------------------------------------------- */ div#mypagecolumn { width: 100%; } div#mynavi_area { width: 100%; } div#mycontents_area { width: 100%; } div#mynavi_area .mynavi_list { margin-bottom: 20px; width: 100%; } div#mynavi_area .mynavi_list li { margin: 0 15px 5px 0; padding-left: 15px; float: left; background: url('../img/icon/ico_arrow_01.gif') no-repeat left ; font-size: 120%; } div#mynavi_area div.point_announce { margin-bottom: 30px; padding: 10px; border: solid 1px #ffcc62; background-color: #fffaf0; } div#mynavi_area div.point_announce p { padding-left: 20px; background: url('../img/icon/ico_point.gif') no-repeat left ; } div#mycontents_area p.inforamtion { margin-bottom: 20px; } div#mypagecolumn h4 { margin: 10px auto; border-bottom: 1px solid #999; text-align: left; font-size: 120%; } /* 商品画像 */ div#mycontents_area .listphoto { max-width: 65px; display: inline-block; float: left; margin-right: 10px; } div#mycontents_area .listphoto img { width: 100%; } /* プロフィール画像 */ div#mycontents_area table tr.profile_image td img { width: 70px; } /* MYページメニュー ----------------------------------------------- */ ul#mypage_nav { overflow: hidden; background: #ededed; margin-top: -15px; margin-bottom: 30px; text-align: left; padding: 5px; } #mycontents_area.mypage-top ul#mypage_nav { margin-bottom: 15px; } ul#mypage_nav li { display: inline; border-right: solid 1px #ccc; } ul#mypage_nav li a { padding: 10px 9px; background: #ededed; display: inline-block; color: #2185c5; } ul#mypage_nav li:last-child { border-right: none; } ul#mypage_nav.nav_list_style li{ border: none; } ul#mypage_nav.nav_list_style li a { padding: 10px 9px; } /* MYページトップ ----------------------------------------------- */ #customer_info { border-bottom: solid 1px #ccc; padding-top: 10px; margin: 0 0 40px; overflow: hidden; } /* 登録画像 */ #customer_info .customer_img { float: left; margin: 0 15px 0 0; position: relative; } /* ランクがあれば登録画像にランク画像を重ねる */ #customer_info .customer_img #rank_icon { position: absolute; bottom: 0; left: 37px; } #customer_info .customer_detail { float: left; padding-top: 15px; } /* アカウントメニュー */ #customer_info .customer_detail #account_info { width: 100%; margin: 10px 0 17px; overflow: hidden; } #customer_info .customer_detail #account_info .account_change_bloc { float: left; min-width: 190px; } #customer_info .customer_detail #account_info .account_change_bloc h3 { background: none; color: #333; text-align: left; font-size: 14px !important; margin: 0; font-weight: bold; padding: 5px 0 !important; } /* ランクアップ後の特典等を表示 */ #customer_next_rank_info { width: 498px; margin: 0 auto 30px; border: solid 1px #ccc; clear: both; background: #fcfcf7; padding: 0 40px 10px; } #customer_next_rank_info .customer_rank_img { float: left; margin-right: 15px; position: relative; margin-right: 5px; } #customer_next_rank_info .customer_rank_detail { float: left; padding-top: 15px; padding-top: 12px; } #customer_next_rank_info .customer_rank_detail p.next_rank_service { margin-top: 2px; color: #e64c66; } #customer_next_rank_info .customer_rank_detail p.next_rank_service span { border: solid 1px #ccc; font-size: 11px; font-weight: normal; padding: 2px 5px; background: #fff; color: #333; } /* MYページトップの購入履歴(余白調整) */ #mycontents_area.mypage-top #order_history { margin-top: 5px; margin-bottom: 20px; } #mycontents_area.mypage-top #order_history .order_history_list, #mycontents_area.mypage-top #estimate_history .estimate_history_list { border: solid 1px #ccc; margin: 10px auto; border-radius: 4px; } /* 加盟店ユーザーの場合のみ、お届け先を表示する */ .order_history_list .order_info .order_shipping_wrap, .order_history_list .order_info .order_sender_wrap, .estimate_history_list .estimate_info .estimate_shipping_wrap, .estimate_history_list .estimate_info .estimate_sender_wrap { clear: both; margin-left: 0; float: none; font-size: 13px; overflow: hidden; } .order_history_list .order_info .order_shipping_wrap .order_shipping, .order_history_list .order_info .order_sender_wrap .order_sender, .estimate_history_list .estimate_info .estimate_shipping_wrap .estimate_shipping, .estimate_history_list .estimate_info .estimate_sender_wrap .estimate_sender { border-top: solid 1px #eae8e8; padding-top: 10px; margin-top: 10px; width: 100%; } .order_history_list .order_info .order_shipping_wrap .order_shipping span.icon_ship, .order_history_list .order_info .order_sender_wrap .order_sender span.icon_ship, .estimate_history_list .estimate_info .estimate_shipping_wrap .estimate_shipping span.icon_ship, .estimate_history_list .estimate_info .estimate_sender_wrap .estimate_sender span.icon_ship { font-size: 11px; padding: 2px 6px; background: #666; color: #fff; } /* 購入履歴一覧/詳細 /* 見積履歴一覧/詳細 ----------------------------------------------- */ div#mycontents_area div.mycondition_area { margin: 0 auto 20px 0; padding: 10px; border: solid 1px #ccc; width: 97%; background: #f9f9f9; } div#mycontents_area div.mycondition_area p { float: left; } div#mycontents_area div.mycondition_area .btn { float: right; max-width: 28%; } .add_address { margin-bottom: 20px; } #campaign_info td img { width: 100%; } .order_history_list, .estimate_history_list { /*width: 80%;*/ border: solid 1px #ccc; margin: 30px auto 10px; border-radius: 4px; } /* 注文内容ヘッダー部 */ .order_history_list .order_info, .estimate_history_list .estimate_info { border-bottom: solid 1px #ccc; overflow: hidden; padding: 15px 20px 12px; background: #f5f5f5; border-radius: 4px 4px 0 0; } .order_history_list .order_info div, .estimate_history_list .estimate_info div { float: left; margin-left: 20px; } .order_history_list .order_info div:first-child, .estimate_history_list .estimate_info div:first-child { margin-left: 0; } .order_history_list .order_info p span.mini, .estimate_history_list .estimate_info p span.mini { font-size: 11px; } .order_history_list a.nav_btn, .estimate_history_list a.nav_btn { display: inline-block; float: right; padding: 6px 0; border-radius: 2px; background: #fff; border: solid 1px #ccc; text-align: center; min-width: 200px; color: #2d2d2e; font-size: 13px; } .order_history_list a.nav_btn.deliv_track, .estimate_history_list a.nav_btn.deliv_track { border: solid 1px #008a00; color: #008a00; } /* 注文内容詳細 */ .order_history_list .order_detail_info, .estimate_history_list .estimate_detail_info { padding: 12px 20px 15px; overflow: hidden; } .order_history_list .order_detail_info .order_status, .estimate_history_list .estimate_detail_info .estimate_status { /* ステータスアイコン */ font-size: 11px; } .order_history_list .order_detail_info .order_status p, .estimate_history_list .estimate_detail_info .estimate_status p { color: #fff; padding: 2px 10px; display: inline-block; } .order_history_list .order_detail_info .order_status p.deliv_status_close, .estimate_history_list .estimate_detail_info .estimate_status p.estimate_status_close{ background: #008a00; } .order_history_list .order_detail_info .order_status p.order_status_cancel, .estimate_history_list .estimate_detail_info .estimate_status p.estimate_status_cancel { background: #999; } .order_history_list .order_detail_info .order_status_label, .estimate_history_list .estimate_detail_info .estimate_status_label { /* ステータスアイコン */ font-size: 11px; } .order_history_list .order_detail_info .order_status_label p, .estimate_history_list .estimate_detail_info .estimate_status_label p { padding: 2px 10px; display: inline-block; } /* 見積内容詳細 */ .workflow_attention { color: #f00; } /* 注文内容詳細 - 購入商品表示 */ .order_history_list .order_detail_info .order_item, .estimate_history_list .estimate_detail_info .estimate_item { float: left; width: 67%; } .order_history_list .order_detail_info .order_item .item_bloc { overflow: hidden; margin: 10px auto; display: inline-block; width: 100%; } .estimate_history_list .estimate_detail_info .estimate_item .item_bloc { overflow: hidden; margin-top: 10px; } .order_history_list .order_detail_info .order_item a.item_image, .estimate_history_list .estimate_detail_info .estimate_item a.item_image, .order_history_list .order_detail_info .order_item div.raku2_item_image, .estimate_history_list .estimate_detail_info .estimate_item div.raku2_item_image { float: left; width: 12%; margin-right: 12px; } .order_history_list .order_detail_info .order_item a.item_image img, .estimate_history_list .estimate_detail_info .estimate_item a.item_image img, .order_history_list .order_detail_info .order_item div.raku2_item_image img, .estimate_history_list .estimate_detail_info .estimate_item div.raku2_item_image img { width: 100%; } .order_history_list .order_detail_info .order_item .item_detail, .estimate_history_list .estimate_detail_info .estimate_item .item_detail { float: left; width: 85%; } .order_history_list .order_detail_info .order_item .item_detail p, .estimate_history_list .estimate_detail_info .estimate_item .item_detail p { margin-bottom: 5px; } /* 注文内容詳細 - 各種ナビゲーション */ .order_history_list .order_detail_info .order_nav_area, .estimate_history_list .estimate_detail_info .estimate_nav_area { float: right; width: 30%; padding-top: 10px; } .order_history_list .order_detail_info .order_nav_area a.nav_btn, .estimate_history_list .estimate_detail_info .estimate_nav_area a.nav_btn { margin-bottom: 10px; } .order_history_list .order_detail_info .order_nav_area a.nav_btn:hover, .estimate_history_list .estimate_detail_info .estimate_nav_area a.nav_btn:hover { text-decoration: none; opacity: 0.7; } .estimate2cancel{ margin-top: 5px; } .estimate_pdf_dl{ margin-top: 5px; } .estimate2reestimate{ margin-top: 5px; } /* 定期購入お申し込み履歴一覧 ----------------------------------------------- */ .periodical_history_list { margin-top: 30px; margin-bottom: 60px; } .periodical_history_list .periodical_info { border: solid 1px #ccc; padding: 10px; overflow: hidden; vertical-align: middle; background: #fcfcf7; } .periodical_history_list .periodical_info .periodical_info_detail { float: left; margin-top: 7px; font-size: 13px; } .periodical_history_list .periodical_info .periodical_info_detail p.attention { font-size: 12px; margin-top: 3px; } #mycontents_area.periodical_history .order_status_icon, #mycontents_area.periodical_order_history .order_status_icon { font-size: 11px !important; border: solid 1px #ccc; padding: 2px 8px; display: inline-block; } /* お申し込み確認・変更ボタン */ .periodical_history_list .periodical_info a.nav_btn { display: inline-block; float: right; padding: 6px 0; border-radius: 2px; background: #fff; border: solid 1px #ccc; text-align: center; min-width: 200px; color: #2d2d2e; font-size: 13px; } /* 継続ステータスアイコン */ .periodical_history_list .periodical_info span.periodical_status, #mycontents_area.periodical_order_history .periodical_order_detail_bloc span.periodical_status { background: #008a00; color: #fff; padding: 1px 10px; font-size: 11px; margin-right: 3px; } .periodical_history_list .periodical_info span.periodical_status_stop, #mycontents_area.periodical_order_history .periodical_order_detail_bloc span.periodical_status_stop { background: #F00; color: #fff; padding: 1px 10px; font-size: 11px; margin-right: 3px; } .periodical_history_list .periodical_info span.periodical_status_cancel, #mycontents_area.periodical_order_history .periodical_order_detail_bloc span.periodical_status_cancel { background: #999; color: #fff; padding: 1px 10px; font-size: 11px; margin-right: 3px; } /* 購入商品表示 */ #mycontents_area table.periodicalOrderDetail { margin-top: 10px; } #mycontents_area table.periodicalOrderDetail th, #mycontents_area table.periodicalOrderDetail td, #mycontents_area .order_detail_info table th { text-align: center; } #mycontents_area table.periodicalOrderDetail td .order_status_icon { margin-bottom: 5px; } #mycontents_area table.periodicalOrderDetail td.periodicalProducts { padding: 5px 14px 14px; } #mycontents_area table.periodicalOrderDetail td.periodicalProducts .item_bloc { overflow: hidden; margin: 10px auto; display: inline-block; width: 100%; } #mycontents_area table.periodicalOrderDetail td.periodicalProducts .item_image { float: left; width: 20%; margin-right: 6%; } #mycontents_area table.periodicalOrderDetail td.periodicalProducts .item_detail { float: left; width: 74%; display: inline-block; text-align: left; } /* table */ .periodical_history_list table { margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; text-align: left; } .periodical_history_list table th { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; } .periodical_history_list table td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } .periodical_history_list .periodical_info .periodical_info_detail .teiki_course_cnt, .periodical_order_history .periodical_info .teiki_course_cnt { padding: 3px 0 0 68px; } .periodical_history_list .periodical_info .periodical_info_detail .teiki_course_msg { padding: 3px 0 0 0; } /* 定期購入お申し込み詳細 ----------------------------------------------- */ .periodical_order_history .order_item, div[class^="periodical_order_chg"] .order_item { overflow: hidden; padding: 5px; } .periodical_order_history .item_detail, div[class^="periodical_order_chg"] .item_detail { float: left; width: 76%; margin-left: 12px; } .periodical_order_history a.item_image, .periodical_order_history div.raku2_item_image, div[class^="periodical_order_chg"] a.item_image { float: left; width: 20%; } .periodical_order_history a.item_image img, .periodical_order_history div.raku2_item_image img, div[class^="periodical_order_chg"] a.item_image img { width: 100%; } #mycontents_area.periodical_order_history h4, #mycontents_area.periodical_order_chgstatus h4 { padding-bottom: 3px; border-bottom: solid 3px #ededed; } #mycontents_area.periodical_order_history > h3 + h4 { margin-top: 50px; } #mycontents_area.periodical_order_history .periodical_order_detail_bloc { margin-bottom: 60px; } .periodical_order_history table .raku2_item_bloc_end td, #periodicalDetails table .raku2_item_bloc_end td { background-color: #E0E0E0; } /* 変更ボタン */ #mycontents_area.periodical_order_history a.btn_periodical_change, #mycontents_area .raku2_mypage_order_cancel, #mycontents_area .raku2_mypage_order_image_dl, #mycontents_area .raku2_mypage_change_shipping_date { float: right; padding: 4px 0; border-radius: 2px; background: #ededed; text-align: center; min-width: 200px; margin-top: -50px; font-size: 12px; border: solid 1px #ccc; color: #514c49; } #mycontents_area .raku2_mypage_order_cancel, #mycontents_area .raku2_mypage_order_image_dl, #mycontents_area .raku2_mypage_change_shipping_date { width: 100%; } #mycontents_area.periodical_order_history a.periodical_change_additem div { margin: 0 15px; } #mycontents_area.periodical_order_history .periodical_order_detail_bloc.periodical_info { border: solid 1px #ccc; padding: 10px; vertical-align: middle; background: #fcfcf7; margin-top: 10px; } #mycontents_area.periodical_order_history .periodical_order_detail_bloc table { margin-top: 10px; } /* table */ .periodical_order_history table { margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; text-align: left; } .periodical_order_history table th { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; } .periodical_order_history table td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } /* 定期コース各種変更画面 ----------------------------------------------- */ #mycontents_area.periodical_order_chgstatus ul { overflow: hidden; margin-bottom: 10px; text-align: center; } #mycontents_area.periodical_order_chgstatus ul#chgstatus_list li { float: left; margin-right: 15px; } #mycontents_area.periodical_order_chgitem a.btn_add_item { margin-bottom: 60px; padding: 4px 20px; border-radius: 2px; background: #2185c5; text-align: center; color: #fff; font-size: 12px; display: inline-block; } #mycontents_area.periodical_order_chgitem a.btn_del_item { margin-top: 5px; display: inline-block; padding: 2px 10px; font-size: 11px; background: #999; color: #fff; border-radius: 2px; } #mycontents_area.periodical_order_chgitem a.btn_upd_item { margin-top: 5px; display: inline-block; padding: 2px 10px; font-size: 11px; background: #2185c5; color: #fff; border-radius: 2px; } #mycontents_area.periodical_order_chgitem a.btn_split_set_item { margin-top: 5px; display: inline-block; padding: 2px 10px; font-size: 11px; background: #2185c5; color: #fff; border-radius: 2px; float:right; } /* table */ .periodical_order_chgship table,.periodical_order_chgpayment table { margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; text-align: left; } .periodical_order_chgship table th,.periodical_order_chgpayment table th { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; } .periodical_order_chgship table td,.periodical_order_chgpayment table td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } /* 定期購入お申し込み内容の変更 */ #mycontents_area.periodical_order_chgstatus ul#chgstatus_list li { padding: 0.6em 0; } /* #mycontents_area.periodical_order_chgstatus ul#chgstatus_list li:nth-child(2) { padding: 0; } #mycontents_area.periodical_order_chgstatus ul#chgstatus_list li select { padding: 0.4em 0; } */ /* ポイント履歴一覧 ----------------------------------------------- */ #point_list p { line-height: 1.6; } #point_list .point_name { font-weight: bold; margin: 0 0 5px; } /* 獲得・利用・失効アイコン */ #point_list p.kbn_icon { padding: 3px; margin-top: 5px; color: #fff; font-size: 12px; line-height: 1; } #point_list p.kbn_icon.grant_kbn_get { background: #e64c66; } #point_list p.kbn_icon.grant_kbn_use { background: #2185c5; } #point_list p.kbn_icon.grant_kbn_loss { background: #999; } #point_list p.kbn_icon.grant_kbn_expire { background: #666; } #point_list p.kbn_icon.grant_kbn_cancel { background: #999; } /* ポイント履歴一覧テーブル */ #point_list table th { text-align: center; border: #E3E3E3 solid; border-width: 0 0 1px 1px; line-height: 120%; font-weight: 500; background: #F5F5F5; padding: 10px 5px !important; } #point_list table td { border: #E3E3E3 solid; border-width: 0 0 1px 1px; line-height: 120%; padding: 10px !important; } /* 獲得・利用・失効ポイント数の装飾 */ #point_list p.point_get span, #point_list p.point_use span, #point_list p.point_loss span { font-size: 20px; font-weight: bold; padding-right: 5px; } #point_list p.point_get { color: #e64c66; } #point_list p.point_use, #point_list p.point_loss { color: #2185c5; } #point_list p.point_zero span { font-size: 16px; padding-right: 5px; } #point_list p.point_zero { color: #555; } /* 通常ポイント履歴一覧 ----------------------------------------------- */ .nomar_point_history_tbl { margin: 15px auto 20px auto; border: 1px solid #ccc; width: 100%; border-collapse: collapse; text-align: left; } /* 利用可能クーポン一覧・クーポン取得完了画面 ----------------------------------------------- */ #coupon_list { width: 100%; margin: 0 auto 20px; border-radius: 4px; /*box-shadow: 0 0 6px #ddd;*/ border: solid 1px #ccc; } #coupon_list #coupon_list_inner { padding:0; margin: 0 auto; } #coupon_list #coupon_list_inner #coupon_list_left { float: left; clear: left; width: 20%; text-align: center; } /* クーポン画像 */ #coupon_list #coupon_list_inner #coupon_list_left img { display: block; border: solid #eee 1px; width: 100px; margin: 20px auto; } /* 以下、クーポン内容詳細 */ #coupon_list #coupon_list_inner #coupon_list_right { float: left; width: 80%; } #coupon_list #coupon_list_inner #coupon_list_right #coupon_info { padding: 20px 20px 20px 0; border: none; margin: 0 auto; border-radius: none; } #coupon_list #coupon_list_inner #coupon_list_right #coupon_info dl { overflow: hidden; } #coupon_list #coupon_list_inner #coupon_list_right #coupon_info dl h3 { font-size: 11px; font-weight: normal; margin: 0; padding: 2px 0; background: #999; color: #fff; margin-right: 15px; text-align: center; } /* クーポンコード */ #coupon_list #coupon_list_inner #coupon_list_right #coupon_info p#coupon_code { text-align: right; font-size: 10px; } /* クーポン名 */ #coupon_list #coupon_list_inner #coupon_list_right #coupon_info p#coupon_name { background: #fef9d9; padding: 5px 10px; margin-bottom: 5px; color: #e64c66; font-size: 15px; font-weight: bold; } /* クーポン内容 */ #coupon_list #coupon_list_inner #coupon_list_right #coupon_info dl dt, #coupon_list #coupon_list_inner #coupon_list_right #coupon_info dl dd { float: left; border-bottom: dashed 1px #ccc; padding: 10px 0; height: 20px; font-size: 12px; } #coupon_list #coupon_list_inner #coupon_list_right #coupon_info dl dt { width: 20%; clear: left; } #coupon_list #coupon_list_inner #coupon_list_right #coupon_info dl dd { width: 80%; } /* クーポン発行時メッセージ */ #main_column h2.coupon_msg { text-align: center; font-weight: normal; border: solid 3px #ccc; font-size: 115%; padding: 6px; background: #fcfcf7; } /* お友達紹介 ----------------------------------------------- */ #friend_list { width: 100%; margin: 0 auto 20px; border-radius: 4px; /*box-shadow: 0 0 6px #ddd;*/ border: solid 1px #ccc; } #friend_list #friend_list_inner { padding:0; margin: 0 auto; } #friend_list #friend_list_inner #friend_list_left { float: left; clear: left; width: 20%; text-align: center; } /* お友達紹介画像 */ #friend_list #friend_list_inner #friend_list_left img { display: block; border: solid #eee 1px; width: 100px; margin: 20px auto; } /* 以下、お友達紹介内容詳細 */ #friend_list #friend_list_inner #friend_list_right { float: left; width: 80%; } #friend_list #friend_list_inner #friend_list_right #campaign_info { padding: 20px 20px 20px 0; border: none; margin: 0 auto; border-radius: none; } #friend_list #friend_list_inner #friend_list_right #campaign_info dl { overflow: hidden; } #friend_list #friend_list_inner #friend_list_right #campaign_info dl h3 { font-size: 11px; font-weight: normal; margin: 0; padding: 2px 0; background: #999; color: #fff; margin-right: 15px; text-align: center; } /* お友達紹介コード */ #friend_list #friend_list_inner #friend_list_right #campaign_info p#campaign_code { text-align: right; font-size: 10px; } /* お友達紹介名 */ #friend_list #friend_list_inner #friend_list_right #campaign_info p#campaign_name { background: #fef9d9; padding: 5px 10px; margin-bottom: 5px; color: #e64c66; font-size: 15px; font-weight: bold; } /* お友達紹介内容 */ #friend_list #friend_list_inner #friend_list_right #campaign_info dl dt, #friend_list #friend_list_inner #friend_list_right #campaign_info dl dd { float: left; border-top: dashed 1px #ccc; padding: 10px 0; font-size: 12px; } #friend_list #friend_list_inner #friend_list_right #campaign_info dl dt { width: 20%; clear: left; } #friend_list #friend_list_inner #friend_list_right #campaign_info dl dd { width: 80%; } /* お届け先の追加・変更 */ #window_area p.top span { font-size: 12px; } #window_area p.top input { margin-right: 5px; } #window_area tr.deliv_area input { margin-bottom: 5px; } #window_area p.top br { display: none; } #window_area tr.deliv_area td span { font-size: 12px; display: inline-block; } #window_area td p.zipimg span { display: table-cell; vertical-align: middle; padding-left: 5px; } #window_area tr.deliv_area td span br { display: none; } /* 会員登録内容変更/退会 ----------------------------------------------- */ div#mycontents_area .message_area { margin: 30px auto; padding: 30px; border: 1px solid #ccc; text-align: center; } div#mycontents_area .message_area p { margin-bottom: 20px; } /* プロフィール画像リスト */ ul#profile_image_list li { float: left; width: 70px; position: relative; } ul#profile_image_list li img { width: 100%; } ul#profile_image_list input[type="radio"] { display: none; } #profile_image_list input[type="radio"]:checked + label::after { display: none; } #profile_image_list input[type="radio"]:checked + label::before { content: ""; display: inline-block; position: absolute; left: 0; width: 100%; height: 100%; border: 3px solid #2E2E2E; border-radius: 5px; top: 0; box-sizing: border-box; } #profile_image_list input[type="radio"] + label::before { display: none; } #profile_image_list input[type="radio"] + label { position: initial; padding-left: 0; margin-right: 0; } ul#profile_image_list li label { display: inline-block; } ul#profile_image_list li label img{ pointer-events: none; } /* 退会手続きエリア */ div#mycontents_area .refusal_area { text-align: center; margin-top: 80px; } div#mycontents_area .refusal_area a.btn { background: #999; padding: 10px 0; width: 214px; display: inline-block; color: #fff; border-radius: 5px; margin-top: 10px; } /* 会員変更完了画面 - 定期変更アラートエリア */ #mycontents_area #complete_area #teiki_change_alart { border: solid 2px #f00; padding: 10px 30px 15px; background: #fcfcf7; text-align: center; margin-top: 30px; } #mycontents_area #complete_area #teiki_change_alart h4 { text-align: center; padding-bottom: 8px; border-bottom: solid 1px #ccc; margin-bottom: 10px; } #mycontents_area #complete_area #teiki_change_alart a { display: inline-block; padding: 8px 20px; background: #39c; color: #fff; border-radius: 3px; margin-top: 10px; } /* table */ .LC_Page_AbstractMypage table { margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; text-align: left; } .LC_Page_AbstractMypage table th { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; } .LC_Page_AbstractMypage table td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } /* 売上一覧/詳細 ----------------------------------------------- */ #mycontents_area.member_sales form#search_form #search_price_area input#btn_price_search { float: none; display: inline; } #mycontents_area.member_sales form#search_form #member_list label { margin-bottom: 5px; display: inline-block; } #mycontents_area.member_sales form#search_form #member_list input { width: auto; } /* MYページ一括注文 ----------------------------------------------- */ /*タブ切り替え全体のスタイル*/ .upload_order .tabs { box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); width: 100%; margin: 40px auto; padding-bottom: 30px; } /*タブのスタイル*/ .upload_order .tab_item { width: calc(100%/2); height: 50px; border-bottom: 3px solid #333333; background-color: #d9d9d9; line-height: 50px; font-size: 16px; text-align: center; color: #565656; display: block; float: left; text-align: center; font-weight: bold; transition: all 0.2s ease; } .upload_order .tab_item:hover { opacity: 0.75; cursor: pointer; } /*ラジオボタンを全て消す*/ .upload_order input[name="tab_item"] { display: none; } /*タブ切り替えの中身のスタイル*/ .upload_order .tab_content { display: none; padding: 40px 40px 0; clear: both; overflow: hidden; } .tab_content .tab_content_description a:link { text-decoration: underline; color: #39c; } /*選択されているタブのコンテンツのみを表示*/ #csv_order:checked ~ #csv_order_content, #quick_order:checked ~ #quick_order_content { display: block; } /*選択されているタブのスタイルを変える*/ .upload_order .tabs input:checked + .tab_item { background-color: #333333; color: #fff; } .order_detail_info .bulkorder { overflow: hidden; margin: 20px 0 12px; } .order_detail_info .bulkorder a.item_image, .order_detail_info .bulkorder .item_detail { float: left; } .order_detail_info .bulkorder .item_detail { margin-left: 10px; } /* 確認画面(支払い方法選択画面) */ #mypagecolumn #undercolumn_shopping h3 { font-weight: bold; margin-top: 30px; font-size: 120%; color: #f60; } /* 支払い方法選択画面AmazonPayボタン */ #mypagecolumn div#AmazonPayButton { margin-top: 10px; } /* 受付中の一括注文一覧 */ .order_history_list .order_detail_info .order_data { margin-bottom: 20px; } .order_history_list .order_detail_info .order_data .order_shipping span.icon_ship, .order_history_list .order_detail_info .order_data .order_sender span.icon_ship, .order_history_list .order_detail_info .order_data .order_deliv span.icon_ship { font-size: 11px; padding: 2px 6px; background: #666; color: #fff; } .order_history_list .order_detail_info .order_data .order_sender, .order_history_list .order_detail_info .order_data .order_shipping { margin-bottom: 20px; } p.sender_info, p.shipping_info,p.order_name { margin-top: 5px; } /* MYページキャンセル */ #mycontents_area.raku2_order_cancel textarea[name="cancel_memo"] { width: 100%; } /* キーワード検索 ----------------------------------------------- */ #mycontents_area[class^="customer_"] #search_keyword_area { margin: 10px 0 40px; padding: 15px; background: #f0f0f0; } #mycontents_area[class^="customer_"] #search_keyword_top { overflow: hidden; } #mycontents_area[class^="customer_"] #search_keyword_top select { width: 20%; float: left; } #mycontents_area[class^="customer_"] #search_keyword_top input#search_kw { width: 80%; height: 20px; float: left; } #mycontents_area[class^="customer_"] #search_keyword_top select + input#search_kw { width: 60%; margin-left:10px; } #mycontents_area[class^="customer_"] #search_keyword_top #search_order_date { margin: 5px 0 8px; } #mycontents_area[class^="customer_"] #search_keyword_top input#btn_kwd_search { float: right; border: 1px solid #a6a6a6; background: #fff; width: 15%; height: auto; margin-left: 20px; border-radius: 3px; color: #333; } #mycontents_area[class^="customer_"] #search_keyword_top input#btn_sales_search { border: 1px solid #a6a6a6; background: #fff; width: 15%; height: auto; margin-left: 20px; border-radius: 3px; color: #333; } #mycontents_area.customer_sales #sales_total table#sales_total_detail td.subtotal { text-align: right; } #mycontents_area.customer_sales table#sales_detail { font-size: 12px; } #mycontents_area.customer_sales table#sales_detail td.sales_order_id p img { vertical-align: text-bottom; } /* ============================================== ▼加盟店グループ・加盟店用MYページ =============================================== */ #mycontents_area[class^="member_"] input, #mycontents_area[class^="member_"] select { outline: none; } #mycontents_area[class^="member_"] p.data_cnt_msg { margin-top: 10px; } #mycontents_area[class^="member_"] #member_contents_area { border: solid 1px #ccc; padding: 10px; overflow: hidden; vertical-align: middle; background: #fcfcf7; } #mycontents_area[class^="member_"] #member_contents_area a.ins_btn { display: inline-block; float: right; padding: 6px 0; border-radius: 2px; background: #fff; border: solid 1px #ccc; text-align: center; min-width: 200px; color: #2d2d2e; font-size: 13px; } #mycontents_area[class^="member_"] select { height: 26px; } /* テーブル ----------------------------------------------- */ #mycontents_area[class^="member_"] table { margin: 20px auto; } #mycontents_area.member_list table th, #mycontents_area.member_customer table th, #mycontents_area.member_staff table th { text-align: center; } /* キーワード検索 ----------------------------------------------- */ #mycontents_area[class^="member_"] #search_keyword_area { margin: 10px 0 40px; padding: 15px; background: #f0f0f0; } #mycontents_area[class^="member_"] #search_keyword_top { overflow: hidden; } #mycontents_area[class^="member_"] #search_keyword_top select { width: 20%; float: left; } #mycontents_area[class^="member_"] #search_keyword_top input#search_kw { width: 80%; height: 20px; float: left; } #mycontents_area[class^="member_"] #search_keyword_top select + input#search_kw { width: 60%; margin-left:10px; } #mycontents_area[class^="member_"] #search_keyword_top #search_order_date { margin: 5px 0 8px; } #mycontents_area[class^="member_"] #search_keyword_top input#btn_kwd_search { float: right; border: 1px solid #a6a6a6; background: #fff; width: 15%; height: auto; margin-left: 20px; border-radius: 3px; color: #333; } #mycontents_area[class^="member_"] #search_keyword_top input#btn_sales_search { border: 1px solid #a6a6a6; background: #fff; width: 15%; height: auto; margin-left: 20px; border-radius: 3px; color: #333; } #mycontents_area[class^="member_"] #search_keyword_top.ranking_list_area #search_order_date { margin: 5px 40px 20px 0; display: inline-block; } #search_keyword_top .open-btn { margin-left: 3px; padding-bottom: 10px; } #search_keyword_top .open-btn h3 { background: none; font-size: 15px; } .open-btn h3.active::before{ content:"\f146 "; font-family: FontAwesome; margin-right: 5px; color: #333; } .open-btn h3::before{ content:"\f0fe "; font-family: FontAwesome; margin-right: 5px; color: #333; } #mycontents_area[class^="member_"] #search_keyword_top .search_area_outer { display: flex; justify-content: start; } #mycontents_area[class^="member_"] #search_keyword_top .search_area_outer .open-box { margin-bottom: 15px; } #mycontents_area[class^="member_"] #search_keyword_top .search_area_outer #select_target { margin-right: 40px; } #mycontents_area[class^="member_"] #search_keyword_top .search_area_outer #select_target label { display: block; } #mycontents_area[class^="member_"] #search_keyword_top #rank_search_area { display: flex; justify-content: start; } #mycontents_area[class^="member_"] #search_keyword_top .search_item_outer { margin-right: 40px; } #mycontents_area[class^="member_"] #search_keyword_top p.sub-ttl { font-weight: bold; margin-bottom: 5px; border-bottom: 1px dotted #b5b5b5; padding: 5px 3px 0px; margin-bottom: 7px; letter-spacing: 1px; } .ranking_list_area #btn_sales_search { align-self: flex-end; } #mycontents_area[class^="member_"] #search_keyword_top .search_area_outer input#btn_sales_search { margin-bottom: 3px; } /* 店舗一覧(member.php) ----------------------------------------------- */ #mycontents_area.member_list table td { text-align: center; } /* スタッフ一覧(member_staff.php) ----------------------------------------------- */ #mycontents_area.member_staff table td.staff_code { text-align: center; } /* 売上一覧(member_sales.php) ----------------------------------------------- */ #mycontents_area.member_sales #sales_total table#sales_total_detail td { text-align: right; } #mycontents_area.member_sales table#sales_detail { font-size: 12px; } #mycontents_area.member_sales table#sales_detail td.sales_order_id p img { vertical-align: text-bottom; } #mycontents_area.member_sales table#sales_detail td.item_subtotal, #mycontents_area.member_sales table#sales_detail td.item_gross_profit { text-align: right; } /* 定期一覧(member_periodical_order.php) ----------------------------------------------- */ #mycontents_area.member_periodical_order table#periodical_order_detail { font-size: 12px; } /* 継続ステータスアイコン */ #mycontents_area.member_periodical_order table#periodical_order_detail span.periodical_status { background: #008a00; color: #fff; padding: 1px 10px; font-size: 11px; margin-right: 3px; } #mycontents_area.member_periodical_order table#periodical_order_detail span.periodical_status_stop { background: #F00; color: #fff; padding: 1px 10px; font-size: 11px; margin-right: 3px; } #mycontents_area.member_periodical_order table#periodical_order_detail span.periodical_status_cancel { background: #999; color: #fff; padding: 1px 10px; font-size: 11px; margin-right: 3px; } #mycontents_area.member_periodical_order table#periodical_order_detail span.raku2_periodical_status_end { background: #999; color: #fff; padding: 1px 10px; font-size: 11px; margin-right: 3px; } /* 営業担当者プロフィール ----------------------------------------------- */ #mycontents_area section.profile { padding: 3%; box-shadow: 0 0 6px #cccccc; border-radius: 10px; } #mycontents_area .profile-container { display: flex; flex-direction: row; justify-content: center; align-items: center; } #mycontents_area .profile-image { width: 20%; } #mycontents_area .profile-image img { border-radius: 50%; overflow: hidden; width: 100%; } #mycontents_area .profile-txt { width: 65%; padding-left: 3%; font-size: 13px; line-height: 1.4; } #mycontents_area .profile-txt p { margin-bottom: 10px; } #mycontents_area .profile-txt .name { font-size: 16px; font-weight: bold; margin: 3% 0; } @media (max-width: 600px) { #mycontents_area .profile-container { flex-direction: column; } #mycontents_area section.profile { padding: 6%; box-shadow: none; } #mycontents_area .profile-image { width: 40%; } #mycontents_area .profile-txt { width: 100%; padding-left: 0; text-align: center; } } /* クーポン一覧(member_coupon.php) ----------------------------------------------- */ #mycontents_area[class^="member_"] #search_keyword_top .raku2_search_member_coupon_status { margin-top: 35px; } #mycontents_area[class^="member_"] #search_keyword_top .raku2_search_member_coupon_yuko, #mycontents_area[class^="member_"] #search_keyword_top .raku2_search_member_coupon_orderby { margin-top: 5px; } #mycontents_area[class^="member_"] #search_keyword_top .raku2_search_member_coupon_orderby select{ float: none; width: 30%; } .raku2_member_coupon_detail p:not(:first-child), .raku2_member_coupon_cond p:not(:first-child) { margin-top: 5px; } .raku2_member_coupon_code, .raku2_member_coupon_name { text-decoration:underline; } /* クーポン登録(member_coupon_change.php) ----------------------------------------------- */ p[class^="raku2_attention_coupon"] { color: #008a00; } /* ============================================== ▼会員登録 =============================================== */ div#undercolumn_entry { width: 100%; } div#undercolumn_entry .kiyaku_text { margin: 20px auto; padding: 10px; border: solid 1px #ccc; width: 97%; background: #fff; } .shopping_kiyaku_text { padding: 10px; border: solid 1px #ccc; width: 97%; background: #fff; } /* table */ .LC_Page_Entry table { margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; text-align: left; } .LC_Page_Entry table th { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; } .LC_Page_Entry table td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } /* ============================================== ▼ログイン =============================================== */ div#undercolumn_login { margin: 0 auto; width: 100%; } div#undercolumn_login .login_area { margin-bottom: 30px; } div#undercolumn_login .login_area .inputbox { margin: 15px auto 15px auto; padding: 15px 20px 10px 20px; background: #f0f0f0; } div#undercolumn_login .login_area .inputbox dt { text-align: right; } div#undercolumn_login .login_area .inputbox .btn_area { margin-top: 0; } div#undercolumn_login .raku2_underline { text-decoration: underline } /* 闇市用 */ div#undercolumn_login_yamiichi { margin: 0 auto; width: 500px; } div#undercolumn_login_yamiichi .login_area .inputbox { margin: 15px auto 15px auto; padding: 30px 20px 10px 20px; background: #f0f0f0; } /* ============================================== ▼エラー =============================================== */ div#undercolumn_error .message_area { width: 80%; margin: 30px auto; padding: 30px; border: 1px solid #ccc; text-align: center; } div#undercolumn_error .message_area .error { padding: 120px 0; } /* ============================================== ▼商品一覧 =============================================== */ /* ページ送り ----------------------------------------------- */ .pagenumber_area { padding-bottom: 10px; } .pagecond_area { margin-bottom: 20px; padding: 10px; } .pagenumber_area { margin: 20px 0; } .pagecond_area { border: 1px solid #ccc; } .pagenumber_area .navi { width: 100%; text-align: left; } .pagenumber_area .navi li { display: inline; } .pagenumber_area .change { float: right; text-align: right; white-space: nowrap; } /* レイアウト ----------------------------------------------- */ /* div.list_area { padding: 0 0 30px 0; width: 100%; overflow: auto; } */ /* div.listphoto { float: left; } */ /* メインカラム用 1カラム時*/ /* #main_column.colnum1 div.listrightbloc { float: right; width: 74%; } */ /* メインカラム用 2カラム時*/ /* #main_column.colnum2 div.listrightbloc { float: right; width: 80%; } */ /* メインカラム用 3カラム時*/ /* #main_column.colnum3 div.listrightbloc { float: right; width: 74%; }*/ /* 商品情報 各種設定 ----------------------------------------------- */ /* 商品ステータス */ div.listrightbloc ul.status_icon { margin: 5px 3px 10px; width: 100%; } div.listrightbloc ul.status_icon li { margin-right: 5px; float: left; width: 60px; } div.listrightbloc ul.status_icon li img { width: 100%; } /* 商品名 */ div.listrightbloc h3 { font-weight: normal; font-size: 100%; overflow:hidden; line-height: 1.4; white-space: nowrap; text-overflow: ellipsis; -webkit-text-overflow: ellipsis; /* Safari */ -o-text-overflow: ellipsis; /* Opera */ margin-bottom: 0; } div.listrightbloc h3 a { color: #333333; } /* 商品画像 */ .list_area .listphoto img { width: 100%; margin-bottom: 0; } /* コメント */ div.listrightbloc .listcomment { margin: 0 0 10px 0; text-align: left; } /* 商品詳細を見る */ div.listrightbloc .detail_btn { margin-bottom: 20px; } /* 価格 */ div.listrightbloc .pricebox { margin: 0 0 10px 0; text-align: left; } /* 買い物かご */ div.listrightbloc .cart_area { padding: 10px; border: 1px solid #cef0f4; background-color: #ecf5ff; width: 94%; } /* 規格 */ div.listrightbloc .classlist { margin-bottom: 10px; padding-bottom: 10px; background: url("../img/background/line_dot_02.gif") repeat-x bottom ; } div.listrightbloc dl { width: 100%; } div.listrightbloc dt { display: inline-block; vertical-align: top; } div.listrightbloc dd { padding-bottom: 10px; display: inline-block; } div.listrightbloc dd p.attention { margin-top: 5px; } /* カゴに入れる */ div.listrightbloc .cartin { margin: 0; float :right; } div.listrightbloc .cartin .quantity { padding: 3px 10px 0 0; width: 150px; float :left; text-align: right; } div.listrightbloc .cartin .quantity .box { width: 70px; } div.listrightbloc .cartin_btn { width: 160px; float :left; } /* まとめ割リンク */ .matome_link a{ display: block; width: 100%; padding : 2%; border:1px solid #39c; border-radius: 5px; -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; -ms-transition: 0.3s; transition: 0.3s; } .matome_link a:hover{ background-color: #39c; color: #fff !important; } .matome_link_list a{ display: inline-block; padding : 1%; border:1px solid #39c; border-radius: 5px; -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; -ms-transition: 0.3s; transition: 0.3s; } .matome_link_list a:hover{ background-color: #39c; color: #fff !important; } /* 在庫 */ .sold_out_band { position: absolute; top: 20%; left: 5%; text-align: center; width: 90%; background-color: #c10000; color: #fff; } .sold_out_back { opacity: 0.5; } /* ============================================== ▼商品詳細 =============================================== */ /* レイアウト tplファイルのマークアップが同じ項目 * 1カラム時 * 2カラム時 * 3カラム時 ----------------------------------------------- */ #detailarea, .sub_area { margin-bottom: 20px; width: 100%; } /* レイアウト ----------------------------------------------- */ /* 1カラム用 */ #main_column.colnum1 div#detailphotobloc { width: 37%; float: left; } #main_column.colnum1 #detailleftbloc { float: left; } #main_column.colnum1 #detailrightbloc { width: 70%; float: right; } #main_column.colnum1 div.subtext { margin-bottom: 20px; float: left; width: 69%; } #main_column.colnum1 div.subphotoimg { float: right; width: 25%; text-align: right; } #main_column.colnum1 p.subtext { margin-bottom: 20px; } /* 2カラム用 */ #main_column.colnum2 div#detailleftbloc { float: left; width: 37%; } #main_column.colnum2 #detailrightbloc { float: right; width: 60%; } #main_column.colnum2 div.subtext { margin-bottom: 20px; float: left; width: 73%; } #main_column.colnum2 p.subtext { margin-bottom: 20px; } #main_column.colnum2 div.subphotoimg { float: right; width: 25%; text-align: right; } /* 3カラム用 */ #main_column.colnum3 div#detailleftbloc { float: left; width: 49%; } #main_column.colnum3 #detailrightbloc { float: right; width: 50%; } #main_column.colnum3 div.subtext { margin-bottom: 20px; float: left; width: 63%; } #main_column.colnum3 p.subtext { margin-bottom: 20px; } #main_column.colnum3 div.subphotoimg { float: right; width: 35%; text-align: right; } /* 商品情報 各種設定 ----------------------------------------------- */ #detailarea h2 { margin: 15px 0 0; padding: 0 0 5px; color: #666; border: none; font-weight: bold; font-size: 120%; } #detailarea .point, #detailarea .relative_cat, #detailarea .sale_limit { margin: 0 0 10px 0; padding: 0 0 10px 0; } #detailarea .main_comment { font-size: 12px; line-height: 1.4; margin-bottom: 5px; } div#detailrightbloc.detaildescriptionbloc form { margin-bottom: 50px; } /* 商品画像 */ #detailarea .photo { max-width: 260px; margin-bottom: 20px; } #detailarea .photo, #detailarea .sub_photo, #detail_type_f .sub_photo_upper{ position: relative; } .raku2_product_caption { position: absolute; bottom: 0; left: 1px; background: #666; background: rgba(80, 80, 80, 0.75); width: 100%; text-align: center; display: none; } .raku2_product_caption span { color: #fff; font-family: Arial; display: block; font-size: .85em; padding: 10px; } #detailarea .sub_photo, #detailarea .m_sub_photo { max-width: 260px; margin-top: 20px; } /*テンプレートCの商品画像 */ #main_column #detailarea #detail_type_c #detailleftbloc .photo, #main_column #detailarea #detail_type_c #detailleftbloc .sub_photo, #main_column #detailarea #detail_type_c #detailleftbloc .m_sub_photo { max-width: 100%; } /*テンプレートGの商品画像 */ #main_column #detailarea #detail_type_g #detailleftbloc { width: 80%; } #main_column #detailarea #detail_type_g #detailleftbloc .photo, #main_column #detailarea #detail_type_g #detailleftbloc .sub_photo, #main_column #detailarea #detail_type_g #detailleftbloc .m_sub_photo { max-width: 100%; } #detailarea .photo img, #detailarea .sub_photo img, #detailarea .m_sub_photo img { width: 100%; } /* 規格画像 */ #detailarea .sub_photo p.classcategory_name, #detailarea .m_sub_photo p.classcategory_name { font-size: 11px; line-height: 1.3; margin: 5px 0; } /* 拡大メッセージ */ #detailarea .photo .picture_message a, #detailarea .sub_photo .picture_message a { color: #ffffff; } #detailarea .picture_message { background: #333333; opacity: 0.7; margin-top: -27px; display: block; height: 24px; text-align: center; width: calc(100% + 2px); padding-top: 3px; } /* 商品コード */ #detailarea .product_code { margin: 0 0 10px; padding: 10px 0; border-top: solid 2px #cccccc; } #detailarea .product_code dt, #detailarea .product_code dd { display: inline; } /* 商品ステータス */ #detailarea ul.status_icon { margin-bottom: 10px; width: 100%; } #detailarea ul.status_icon li { width: 60px; margin-right: 5px; margin-bottom: 3px; float: left; display: inline-block; } #detailarea ul.status_icon li img { width: 100%; } /* 通常価格 */ #detailarea .normal_price { margin-bottom: 5px; } #detailarea .normal_price dt, #detailarea .normal_price dd { display: inline; } /* 販売期間 */ #detailarea .sell_kikan { margin-bottom: 15px; } #detailarea .sale_limit_date { color:#c00; font-size: 16px; font-weight: 400; margin-bottom: 10px; } #detailarea .sale_price dt, #detailarea .sale_price dd { display: inline; } /* 販売価格 */ #detailarea .sale_price dd .price02_default, #detailarea .sale_price dd .price02_notax_default, #detailarea .sale_price dd .price02_inctax_default, #detailarea .sale_price dd .price02_notax_dynamic, #detailarea .sale_price dd .price02_inctax_dynamic, #detailarea .sale_price dd .price03_default, #detailarea .sale_price dd .price03_notax_default, #detailarea .sale_price dd .price03_inctax_default, #detailarea .sale_price dd .price03_notax_dynamic, #detailarea .sale_price dd .price03_inctax_dynamic, #detailarea .kaiin_price dd #price03_default, #detailarea .kaiin_price dd #price03_notax_default, #detailarea .kaiin_price dd #price03_inctax_default, #detailarea .kaiin_price dd #price03_notax_dynamic, #detailarea .kaiin_price dd #price03_inctax_dynamic, #detailarea .sale_price table.pricelist #teiki_first_price_notax_default, #detailarea .sale_price table.pricelist #teiki_first_price_notax_dynamic, #detailarea .sale_price table.pricelist #teiki_first_price_inctax_default, #detailarea .sale_price table.pricelist #teiki_first_price_inctax_dynamic, #detailarea .sale_price table.pricelist .price02_notax_default, #detailarea .sale_price table.pricelist .price02_notax_dynamic, #detailarea .sale_price table.pricelist .price02_inctax_default, #detailarea .sale_price table.pricelist .price02_inctax_dynamic, table.layout_kikaku_select-03 dl.sale_price dd span, table.layout_kikaku_select-03 dl.first_price dd span, #detailarea .sale_price table.pricelist #teiki_first_point_default, #point_default, #point_dynamic { font-size: 22px; } table.pricelist td { font-feature-settings: "palt"; } table.pricelist p.price_box { display: inline-block; margin-right: 5px; } .point p.pt_title { display: inline; margin-right: 8px; } /* 個別送料 */ /* 個別送料(金額) */ #detailarea .deliv_fee_price { color: #c00; font-size: 10px; text-align: right; margin-top: 5px; } /* 送料 */ #detailarea .sale_price dd.deliv_fee { margin-top: 5px; margin-bottom: 10px; display: block; } #detailarea .deliv_fee .include { width: 90px; color: #fff; font-weight: 500; background: #FB6083; padding: 1px 3px; text-align: center; } #detailarea .deliv_fee .condition { width: 120px; color: #fff; font-weight: 500; background: #FDA04D; padding: 1px 3px; text-align: center; } #detailarea .deliv_fee .not_include { width: 90px; color: #fff; font-weight: 500; background: #999; padding: 1px 3px; text-align: center; } /* 会員価格 */ #detailarea .kaiin_price_area { padding: 15px 20px; border: solid 1px #dedede; } #detailarea .kaiin_price_area span#price03_title_default { border: solid 1px #F95D6C; border-radius: 2px; color: #F95D6C; font-weight: bold; font-size: 12px; padding: 2px 6px; background: #fcfcf7; } /* 入数 */ /* layout_kikaku_select-03は「表形式2」 */ #detailarea .sale_price + .unit, #detailarea .kaiin_price + .unit { margin: 5px 0; } #detailarea table.pricelist .unit, table.layout_kikaku_select-03 .unit { margin: 2px 0 4px; font-size: 12px; } #detailarea .unit span.lot_area, table.layout_kikaku_select-03 span.lot_area { padding: 2px 8px 2px 0; border: solid 1px #999; } #detailarea .unit span.lot_area span.ttl_lot, table.layout_kikaku_select-03 .unit span.lot_area span.ttl_lot { background: #999; color: #fff; padding: 2px 8px; margin-right: 8px; } /* 発送の目安 */ #detailarea .deliv_date { margin-top: 10px; margin-bottom: 10px; margin: 0 0 10px 0; padding: 0 0 10px 0; color: #008a00; } /* ポイント */ #detailarea .point dt, #detailarea .point dd { display: inline; } #detailarea #point_up { color: #f00; font-size: 12px; } #detailarea #point_up .point_rate { font-size: 16px; } /* レビュー点数、リンク */ #detailarea .review_link_bloc { border: solid 1px #ccc; padding: 7px 15px; border-radius: 3px; overflow: hidden; display: inline-block; } #detailarea .review_link_bloc a { color: #333; } #detailarea .review_link_bloc a:hover div, #detailarea .review_link_bloc a:hover p { filter: alpha(opacity=70); -moz-opacity: 0.7; opacity: 0.7; } #detailarea .review_link_bloc .review_link { float: left; margin-right: 10px; } #detailarea .review_link_bloc .review_link i { color: #39c; } #detailarea .review_link_bloc .ave, #detailarea .review_link_bloc .review_cnt { float: left; } #detailarea .review_link_bloc .ave { margin-right: 4px; } #detailarea .review_link_bloc .ave img { height: 15px; margin-left: -3px; } /* 規格 */ #detailarea div.classlist { margin-bottom: 10px; padding-bottom: 10px; width: 100%; background: url("../img/background/line_dot_02.gif") repeat-x bottom ; } #detailarea .classlist { margin-bottom: 5px; } #detailarea ul { margin-bottom: 10px; width: 100%; } #detailarea ul li { vertical-align: top; float: left; } .plg_Raku2_LC_Page_Products_Detail table.tbl_inventory_type{ width: auto; min-width: 445px; margin: 15px auto 20px 0; } table.tbl_inventory_type.tbl_items th { width: auto; } table.tbl_inventory_type.tbl_items th,table.tbl_inventory_type.tbl_items td { text-align: center; } #detailarea .cart_area_col01 .favorite_btn { padding: 10px 0px 0px; } .add_favorite_readonly { border: 1px solid #AAA; padding: 3px 10px 3px 10px; border-radius: 4px; } #detailarea .cart_area_col01 .ask_btn { padding: 10px 0px 0px; } #detailarea .cart_area_col01 .panf_btn { padding: 10px 0px 0px; } #detailarea .cart_area_col01 .stock_notify_btn { padding: 10px 0px 0px; } .cart_area_col01 .attention { text-align: left; } .cart_area.clearfix.kikaku_select3 { text-align: center; } .cart_area_col01 { width: 50%; display: inline-block; } #detailarea .cart_area.kikaku_select3 { border: none; margin-top: 3%; background: none; border-bottom: 1px solid #ccc; padding: 3% 3% 5%; width: 94%; max-width: initial; } #detailarea .kikaku_select3 .cartin { float: none; } #detailarea .kikaku_select3 .cartin_btn a #cart,#detailarea .kikaku_select3 .cartin_btn a #cart_estimate { width: 100%; } #detailarea .kikaku_select3 .favorite_btn a,#detailarea .kikaku_select3 .ask_btn a,#detailarea .kikaku_select3 .ask_btn a:visited,#detailarea .kikaku_select3 .panf_btn a, #detailarea .kikaku_select3 .panf_btn a:visited { width: calc(100% - 20px); } /* チェックボックス用規格 */ #detailarea .classlist_chkbox { margin-bottom: 20px; padding-bottom: 5px; width: 100%; } #detailarea .classlist_chkbox .option { margin-bottom: 10px; } #detailarea .classlist_chkbox .chk_class_title { font-weight: 400; } #detailarea .classlist_chkbox .option_item { float: left; margin-right:20px; } /*項目選択肢複数オプション */ #detailarea .classlist_chkbox .option_img { width:65px; } /* メーカー */ #detailarea .maker dt, #detailarea .maker dd { display: inline; } /* メーカーURL */ #detailarea .comment1 dt, #detailarea .comment1 dd { display: inline; } /* JanCd(カタログID) */ #detailarea .rcatalog_id dt, #detailarea .rcatalog_id dd { display: inline; } /* 製品番号 */ #detailarea .product_no dt, #detailarea .product_no dd { display: inline; } /* 関連カテゴリ */ #detailarea .relative_cat dd { margin-left: 1em; } /* 買い物かご */ #detailarea .cart_area { max-width: 400px; min-width: 371px; padding: 15px; background-color: #F0F0F0; border: 1px solid #E2E2E2; } #detailarea .quantity { float: left; margin: 15px 15px 0; width: 120px; } #detailarea .quantity dt, #detailarea .quantity dd { display: inline; } #detailarea .cartin { float: left; } #detailarea .cartin_btn { text-align: center; } #cartbtn_default { display: flex; text-align: left; } .kikaku_select3 #cartbtn_default { display: block; text-align: left; } /* カートに入れるボタン */ #cartbtn_default .btn_add_cart,#cartbtn_default .btn_add_cart_estimate { margin-top: 10px; } #cartbtn_default div:first-child { margin-right: 10px; } #detailarea .cartin_btn a #cart { width: 221px; padding: 15px 0 15px 0; color: #FFF; display: block; border-radius: 5px; text-decoration: none; font-size: 120%; letter-spacing:2px; text-align: center; background-color:#F95D6C; } /* 見積依頼ボタン */ #detailarea .cartin_btn a #cart_estimate { width: 221px; padding: 15px 0 15px 0; color: #FFF; display: block; border-radius: 5px; text-decoration: none; font-size: 120%; letter-spacing:2px; text-align: center; background-color:#F95D6C; } .fa-file-alt:before { content: "\f15c"; font-family: 'FontAwesome'; } /* 表形式2,表形式3でのカートに入れるボタン */ .kikaku_select3 #cartbtn_default div:first-child { margin-right: 0; } table.layout_kikaku_select-03 #cart a { width: 132px; padding: 5px 0; color: #FFF; display: block; border-radius: 3px; text-decoration: none; text-align: center; background-color: #F95D6C; margin-top: 10px; } /* オーダーリストでのカートに入れるボタン */ table.layout_orderlist #cart a { width: 132px; padding: 5px 0; color: #FFF; display: block; border-radius: 3px; text-decoration: none; text-align: center; background-color: #F95D6C; margin-top: 10px; } /* 予約するボタン */ #detailarea .cartin_btn a #cart_reserv { width: 216px; padding: 15px 0 15px 0; color: #F95D6C; display: block; border-radius: 5px; text-decoration: none; font-size: 120%; letter-spacing:2px; text-align: center; background-color:#FFF; border: solid 3px #F95D6C; margin-bottom: 5px; } #detailarea .cartin_btn a:hover { text-decoration: none; } #detailarea .cartin_btn a p[id^="cart"]:hover { filter: alpha(opacity=70); /* ie8以下用の透明度を設定 */ -moz-opacity: 0.7; /* Firefox用の透明度を設定 */ opacity: 0.7; /* 透明度を設定 */ text-decoration: none; } #detailarea .favorite_btn { padding: 10px 0px 0px 150px; } #detailarea .raku2_favorite_btn { padding: 10px 0px; } #detailarea .favorite_btn a { width: 200px; padding: 3px 10px 3px 10px; color: #555; border: 1px solid #AAA; background-origin: padding-box; background-attachment: scroll; background-clip: border-box; background-color: #FFF; display: block; cursor: pointer; border-radius: 4px; text-decoration: none; text-align: center; } /* お問い合わせボタン */ #detailarea .ask_btn { padding: 10px 0px 0px 150px; } #detailarea .ask_btn a, #detailarea .ask_btn a:visited { width: 200px; padding: 3px 10px 3px 10px; color: #555; border: solid 1px #AAAAAA; background-origin: padding-box; background-attachment: scroll; background-clip: border-box; background-color: #FFFFFF; display: block; cursor: pointer; border-radius: 4px; box-sizing: content-box; -webkit-box-sizing: content-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; text-decoration: none; text-align: center; } /* 資料請求ボタン */ #detailarea .panf_btn { padding: 10px 0px 0px 150px; } #detailarea .panf_btn a, #detailarea .panf_btn a:visited { width: 200px; padding: 3px 10px 3px 10px; color: #555; border: solid 1px #AAAAAA; background-origin: padding-box; background-attachment: scroll; background-clip: border-box; background-color: #FFFFFF; display: block; cursor: pointer; border-radius: 4px; box-sizing: content-box; -webkit-box-sizing: content-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; text-decoration: none; text-align: center; } /* 再入荷お知らせボタン */ #detailarea .stock_notify_btn { padding: 10px 0px 0px 150px; } #detailarea .stock_notify_btn a, #detailarea .stock_notify_btn a:visited { width: 200px; padding: 3px 10px 3px 10px; color: #555; border: solid 1px #AAAAAA; background-origin: padding-box; background-attachment: scroll; background-clip: border-box; background-color: #FFFFFF; display: block; cursor: pointer; border-radius: 4px; box-sizing: content-box; -webkit-box-sizing: content-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; text-decoration: none; text-align: center; } /* 再入荷お知らせボタン(リスト追加済み時) */ #detailarea .stock_notify_btn #stock_notify_btn_added { width: 200px; padding: 3px 10px 3px 10px; text-align: center; border-radius: 4px; border: solid 1px #AAAAAA; color: #555; } /* お気に入りボタン押下時 */ i.fa.fa-heart.on { color: #ff5983; } /* 在庫数 */ #detailarea .product_stock { color:#FB4F68; margin-bottom: 10px; } /* カートに入れるボタン-オーダーリスト */ #detailarea .cartchange_btn a #orderlist_change0 { width: 221px; padding: 5px 0 5px 0; color: #FFF; display: inline-block; text-decoration: none; font-size: 100%; letter-spacing:2px; text-align: center; background-color:#ff7822; float:right; } #detailarea .cartchange_btn { text-align: center; } #detailarea .cartchange_btn a #orderlist_change1 { width: 221px; padding: 15px 0 15px 0; color: #FFF; display: inline-block; border-radius: 5px; text-decoration: none; font-size: 120%; letter-spacing:2px; text-align: center; background-color:#ff7822; } #detailarea .cartchange_btn a #orderlist_change2 { width: 221px; padding: 15px 0 15px 0; color: #FFF; display: inline-block; border-radius: 5px; text-decoration: none; font-size: 120%; letter-spacing:2px; text-align: center; background-color:#ff7822; } /* ▼定期コース */ .teiki_course_title, .teiki_course_select { margin-bottom: 10px; } .order_item .listdetail .teiki_course p[class^='teiki_course_msg']{ color: #00796B; } .order_item .listdetail .teiki_course .teiki_course_inner{ line-height: 50px; } /* ▲定期コース */ #btn_stock_csvdl { background: #ff7822; color: #fff; border: none; padding: 5px 0; margin-bottom: 10px; width: 221px; text-align: center; } .dlcsv_btn { margin-left: auto; width: 221px; } /* 商品ステータス */ ul.status_icon .status_icon_span { display: none;/* アイコン非表示 */ } .status_icon_span { font-size: 10px; letter-spacing: 0; text-align: center; display: inline-block; width: 60px; border-radius: 2px; color: #fff; line-height: 1.7em; font-feature-settings: "palt"; } li.image_status_noshi span { background-color: #e78780; } li.image_status_new span { background-color: #f5974a; } li.image_status_few span { background-color: #913982; } li.image_status_sale span { background-color: #c6a465; } li.image_status_recommended span { background-color: #7faf20; } li.image_status_limitation span { background-color: #ff5983; } li.image_status_reserve span { background-color: #da3434; } li.image_status_teiki span { background-color: #0467fb; } span.status_icon_span { background-color: #ffa624; } /* 「表形式」でのレイアウト共通 ----------------------------------------------- */ .layout_kikaku_select-03 .classlist_chkbox select, .layout_kikaku_select-03 .orderquantity_box select, .layout_kikaku_select-03 .setQuantity select { padding: 4px; border-radius: 4px; } .layout_kikaku_select-03 .setQuantity select{ border: solid 1px #F95D6C; } table.tbl_inventory_type.tbl_items.layout_kikaku_select-03 .orderquantity_box select { border: 1px solid #F95D6C; } table.tbl_inventory_type.tbl_items.layout_kikaku_select-03 select { margin-bottom: 7px; border: solid 1px #ccc; } table.layout_kikaku_select-03 input[type='text'], .layout_kikaku_select-03 .setQuantity input[type='text'] { border: solid 1px #F95D6C; padding: 4px; border-radius: 4px; } .orderquantity span.chk_class_title { margin-right: 0; display: block; } .layout_kikaku_select-03 td img { border: 1px solid #eee; } @media screen and (min-width: 1500px) { .orderquantity span.chk_class_title { display: inline-block; } .orderquantity_box span.chk_class_title { margin-right: 3px; } } #detailrightbloc .layout_kikaku_select-03 .classlist_chkbox .chk_class { display: inline-block; } /* cart_area */ #detailarea .cart_area.kikaku_select3 { border-bottom: none; width: 50%; } .cart_area_col01 { width: 100%; text-align: center; } .layout_kikaku_select-03 .cartin_btn a { text-decoration: underline; } /* 「表形式2」でのレイアウト ----------------------------------------------- */ table.layout_kikaku_select-03 th { text-align: center; } table.layout_kikaku_select-03 td { padding: 14px; text-align: center; } table.layout_kikaku_select-03 td:nth-child(1) img { /* 規格画像 */ width: 40%; margin-bottom: 2px; } /* normal_price=通常価格 */ table.layout_kikaku_select-03 dl.normal_price { overflow: hidden; } table.layout_kikaku_select-03 dl.normal_price dt { margin-right: 8px; } /* sale_price=販売価格 */ /* 表形式2で定期のとき、初回・2回目以降のタイトルを装飾 */ table.layout_kikaku_select-03 .first_price_area { margin: 10px 0; } table.layout_kikaku_select-03 dl.first_price dt.teiki_ttl, table.layout_kikaku_select-03 dl.sale_price dt.teiki_ttl { padding: 2px 8px 1px; border-left: solid 3px #ccc; background: #f0f0f0; } table.layout_kikaku_select-03 dl.sale_price dt.teiki_ttl, table.layout_kikaku_select-03 dl.sale_price dt.teiki_ttl + dd { display: block !important; } /* original_sale_price=元値 */ table.layout_kikaku_select-03 dl.original_sale_price dt, table.layout_kikaku_select-03 dl.original_sale_price dd { font-size: 12px; display: inline; } table.layout_kikaku_select-03 dl.original_sale_price { margin-top: 8px; } .layout_kikaku_outer02 { margin-bottom: 47px; } .plg_Raku2_LC_Page_Products_Detail .layout_kikaku_outer02 table { clear: both; width: 100%; } table.tbl_inventory_type.tbl_items.layout_kikaku_select-03 th.itemdetail, table.tbl_inventory_type.tbl_items.layout_kikaku_select-03 th.orderquantity { width: 17%; } table.layout_kikaku_select-03 th { width: 14.5%; font-feature-settings: "palt"; line-height: 1.5em; } table.layout_kikaku_select-03 th.stock { width: 8%; } table.layout_kikaku_select-03 th span { display: inline-block; } .layout_kikaku_outer02 table.layout_kikaku_select-03 td:last-child { padding: 15px 5px; } .layout_kikaku_outer02 img { width: 74px; margin-right: 15px; float: left; border: 1px solid #eee; margin-bottom: 15px; } #detailrightbloc .layout_kikaku_outer02 .classlist_chkbox { margin-bottom: 15px; padding-bottom: 0; width: 100%; } #detailrightbloc .layout_kikaku_outer02 .classlist_chkbox .option { margin-bottom: 10px; } .layout_kikaku_outer02 .orderquantity_box span.chk_class_title { margin-right: 2px; } .kikaku_tablelayout_03 .setQuantity span.chk_class_title { margin-right: 3px; } .kikaku_itemdetail { font-size: 12px; text-align: left; margin-top: 10px; display: block; margin-top: 16px; } .kikaku_itemdetail span { display: inline-block; } .kikaku_itemdetail p { display: inline-block; } .kikaku_itemdetail p.list_name { display: block; } .kikaku_itemdetail p:after { content: '/'; margin-left: 5px; } .kikaku_itemdetail p.list_name:after { content: ''; }.kikaku_itemdetail p:last-child:after { content: ''; } .plg_Raku2_LC_Page_Products_Detail .kikaku_tablelayout_02 table { border-left: none; } .plg_Raku2_LC_Page_Products_Detail .kikaku_tablelayout_02 table th { border-right: none; } .plg_Raku2_LC_Page_Products_Detail .kikaku_tablelayout_02 table td { border-right: none; text-align: center; padding: 10px 8px; } .plg_Raku2_LC_Page_Products_Detail .kikaku_tablelayout_02 td.itemdetail { text-align: left; } table.layout_kikaku_select-03 img { min-width: 50px; } #detailrightbloc .kikaku_tablelayout_02 .classlist_chkbox { margin-bottom: 5px; padding-bottom: 0; width: 100%; } #detailrightbloc .kikaku_tablelayout_02 .classlist_chkbox .option { margin-bottom: 5px; } .kikaku_tablelayout_02 { margin-bottom: 100px; } .kikaku_tablelayout_02 .kikaku_itemdetail p:after { content: ''; } #detailarea .kikaku_tablelayout_02 .cartin{ float: none; margin: 5px auto; } .kikaku_tablelayout_02 table.layout_kikaku_select-03 #cart a { display: inline-block; } /* 「表形式3」でのレイアウト ----------------------------------------------- */ .kikaku_tablelayout_03 .layout_kikaku_select-03 { margin-bottom: 54px; } .kikaku_tablelayout_03 .layout_kikaku_select-03 img { width: 90px; margin-bottom: 10px; } .kikaku_tablelayout_03 .layout-left { float: left; width: 30%; margin-right: 5%; } .kikaku_tablelayout_03 .layout-right { float: right; width: 60%; } .kikaku_tablelayout_03 .kikaku_itemdetail { display: block; margin-top: 0; } .kikaku_tablelayout_03 .cart-area { clear: both; display: flex; width: calc(100% - 20px); margin-top: 20px; justify-content: flex-end; align-items: center; background: #eee; padding: 12px 10px; } #detailrightbloc .kikaku_tablelayout_03 .classlist_chkbox { margin-bottom: 0; padding-bottom: 0; width: auto; } .kikaku_tablelayout_03 .setQuantity { text-align: right; margin-left: 5%; } #detailrightbloc .kikaku_tablelayout_03 .classlist_chkbox .option { margin-bottom: 0; } .plg_Raku2_LC_Page_Products_Detail .kikaku_tablelayout_03 table.layout_kikaku_select-03 { min-width: auto; width: 100%; border: none; border-bottom: dotted 1px #eee; } .kikaku_tablelayout_03 table.layout_kikaku_select-03 tr { border-bottom: dotted 1px #ccc; } .kikaku_tablelayout_03 table.layout_kikaku_select-03 th { width: 50%; text-align: left; border: none; background: none; padding: 5px; } .kikaku_tablelayout_03 table.layout_kikaku_select-03 td { width: 50%; border: none; padding: 5px; text-align: right; } .plg_Raku2_LC_Page_Products_Detail .kikaku_tablelayout_03 .layout-right table { display: table; margin: 0; } .kikaku_tablelayout_03 div.layout_kikaku_select-03 #cart a{ width: 132px; padding: 5px 0; color: #FFF; display: block; border-radius: 3px; text-decoration: none; text-align: center; background-color: #F95D6C; } /* 「オーダーリスト」でのレイアウト ----------------------------------------------- */ table.layout_orderlist { border: none; border-top: 1px solid #ccc; } table.layout_orderlist dl.sale_price dd span, table.layout_orderlist dl.first_price dd span { font-size: 22px; } table.layout_orderlist th { font-size: 12px; border: none; border-bottom: 1px solid #ccc; text-align: center!important; } table.layout_orderlist tr { border-bottom: 1px solid #ccc; } table.layout_orderlist td { font-size: 12px; padding: 14px; border: none; } table.layout_orderlist td.line_product { background: #FFFFCC; } table.layout_orderlist td:nth-child(1) img { /* 規格画像 */ width: 40%; margin-bottom: 2px; } table.layout_orderlist td:nth-child(3) { /* 通常価格列 */ text-align: center; } table.layout_orderlist td:nth-child(4) { /* 販売価格列 */ text-align: center; } table.layout_orderlist td:nth-child(5) { /* 在庫列 */ text-align: center; } table.layout_orderlist td:nth-child(6) { /* 注文数 */ text-align: center; } /* 闇市商品の場合は数量欄非表示 */ table.layout_orderlist tr.raku2_limited_product td.raku2_list_product_quantity input { display:none; } table.layout_orderlist tr.raku2_limited_product td.raku2_list_product_quantity select { display:none; } /* normal_price=通常価格 */ table.layout_orderlist dl.normal_price { overflow: hidden; } table.layout_orderlist dl.normal_price dt { margin-right: 9px; } /* sale_price=販売価格 */ /* 表形式2で定期のとき、初回・2回目以降のタイトルを装飾 */ table.layout_orderlist .first_price_area { margin: 10px 0; } table.layout_orderlist dl.first_price dt.teiki_ttl, table.layout_orderlist dl.sale_price dt.teiki_ttl { padding: 2px 8px 1px; border-left: solid 3px #ccc; background: #f0f0f0; } table.layout_orderlist dl.sale_price dt.teiki_ttl, table.layout_orderlist dl.sale_price dt.teiki_ttl + dd { display: block !important; } /* original_sale_price=元値 */ table.layout_orderlist dl.original_sale_price dt, table.layout_orderlist dl.original_sale_price dd { display: inline; } table.layout_orderlist dl.original_sale_price { margin-top: 8px; } table.layout_orderlist .product_image img { max-width:80px; } /* 商品ステータス */ table.layout_orderlist ul.status_icon { margin: 5px 3px 5px; width: 100%; } table.layout_orderlist ul.status_icon li { margin-right: 5px; float: left; width: 60px; } table.layout_orderlist td.out_of_stock { background-color: #ddd; } div.listrightbloc ul.status_icon li img { width: 100%; } form[name^="orderlist_form"] .listrightbloc .icon_member_only { position: absolute; background: #d0ac56; color: #fff; font-size: 11px; padding: 2px 10px; } div.raku2_purchase_limit_message { color: #f00; } /* A => 2019.07.02 KS フェーズ1 */ /* KS「オーダーリスト」でのレイアウト ----------------------------------------------- */ table.layout_orderlist_ks { border: none; border-top: 1px solid #ccc; } table.layout_orderlist_ks th { font-size: 14px; padding: 10px 8px; border: none; border-bottom: 1px solid #ccc; text-align: center!important; } table.layout_orderlist_ks td { font-size: 12px; padding: 20px 6px; border: none; border-bottom: 1px solid #ccc; } table.layout_orderlist_ks td.line_product { background: #FFFFCC; } table.layout_orderlist_ks td:nth-child(1) { /* 材質 */ text-align: center; } table.layout_orderlist_ks td:nth-child(2) { /* 表面加工 */ text-align: center; } table.layout_orderlist_ks td:nth-child(3) { /* 規格・メーカー名 */ text-align: center; } table.layout_orderlist_ks td:nth-child(4) { /* 商品コード・商品名 */ text-align: center; } table.layout_orderlist_ks td:nth-child(5) { /* 入数(価格) */ text-align: center; } table.layout_orderlist_ks td:nth-child(6) { /* 在庫列 */ text-align: center; } table.layout_orderlist_ks td:nth-child(7) { /* 注文 */ text-align: center; } table.tbl_inventory_type.tbl_items.layout_orderlist_ks p { font-size: 14px; } a.orderClick:link { padding: 5px 10px; background: #ffa624; border-radius: 3px; color: #fff; } .modal_biko { display: none; max-width: 680px; max-height: 500px; margin: 0; padding: 25px 40px; background-color: #ffffff; color: #666666; position: fixed; z-index: 2; } #modal-bg { display:none; width:100%; height:100%; background-color: rgba(0,0,0,0.5); position:fixed; top:0; left:0; z-index: 1; } #biko_left { justify-content: space-between; float: left; margin-bottom: 10px; margin-right: 40px; } #main_column #biko_left h2 { padding: 7px 0; } #biko_right { display: flex; justify-content: space-between; float: right; } #detailrightbloc_ks #product_selector { overflow: hidden; } #detailrightbloc_ks #product_selector > select { margin-right:5pt; float: left; } .product_select_list { padding-top:3pt; padding-bottom:3pt; padding-left:3pt; padding-right:3pt; } #detailrightbloc_ks .product_selector2 { position: relative; display: flex; } #detailrightbloc_ks .product_selector2 > select { margin-right:5pt; } #biko_right .favorite_btn { padding: 12px 0px 0px 0px; } #biko_right .favorite_btn a { width: 150px; padding: 3px 10px 3px 10px; color: #555; border: 1px solid #AAA; background-origin: padding-box; background-attachment: scroll; background-clip: border-box; background-color: #FFF; display: block; cursor: pointer; border-radius: 4px; text-decoration: none; text-align: center; } div.modal_biko .biko_close_btn_icon:before { content: ""; position: absolute; display: inline-block; top: 9px; left: 13px; width: 2px; height: 13px; border: 0; margin: 0; padding: 0; background-color: #fff; -moz-transform: #fff; transform: rotate(45deg); } div.modal_biko .biko_close_btn_icon:after { content: ""; position: absolute; display: inline-block; top: 9px; left: 13px; width: 2px; height: 13px; border: 0; margin: 0; padding: 0; background-color: #fff; transform: rotate(-45deg); } div.modal_biko .biko_close_btn { position: absolute; display: inline-block; bottom: 15px; right: 15px; border: 0; color: #FFF; background-color: #666; border-radius: 3px; margin: 0; padding: 5px 8px 5px 26px; cursor: pointer; } div.modal_biko .biko_close_btn:hover { color: #ddd; opacity: 0.9; } #main_column.colnum2 #detail_type_ks div#detailleftbloc_ks { float: none; width: 100%; min-width: 262px; } /* A <= 2019.07.02 KS フェーズ1 */ /* PC用商品説明文 ----------------------------------------------- */ table#item_spec th { width: 25%; } /* お客様の声 ----------------------------------------------- */ div#customervoice_area { clear: both; padding: 35px 0 0 0; } div#customervoice_area h2 { color: #ffffff; margin-bottom: 20px; padding: 5px 0 5px 10px; background-color: #333; border: none; } div#customervoice_area ul li { padding: 0 0 15px; margin-bottom: 15px; border-bottom: dotted 1px #ccc; } div#customervoice_area .voicetitle { margin-bottom: 5px; color: #333; font-weight: bold; } div#customervoice_area .voicedate { margin-bottom: 10px; } .review_bloc > .review_write_ttl { float: left; } #customervoice_area .review_btn { float: right; } #customervoice_area .review_btn a { width: 200px; padding: 10px; color: #555; border: 1px solid #AAA; background-origin: padding-box; background-attachment: scroll; background-clip: border-box; background-color: #FFF; display: block; cursor: pointer; border-radius: 4px; text-decoration: none; text-align: center; } #customervoice_area .review_link { text-align: right; } #customervoice_area .raku2_review_writelogin_flg { text-align: right; } /* 関連商品(商品部分はbloc.cssのおすすめ商品と共通) ----------------------------------------------- */ div#whobought_area { clear: both; padding: 35px 0 0 0; } div#whobought_area h2 { border-top: solid 1px #f90; background: url('../img/background/bg_tit_sub_01.jpg') repeat-x left bottom; padding: 5px 0 8px 10px; font-size: 14px; } /* *********************************************** ▼カートの中 /*********************************************** */ /* 共通 ----------------------------------------------- */ /* 商品画像 */ div#undercolumn .order_item { overflow: hidden; padding: 5px; } div#undercolumn_cart .listphoto, div#undercolumn_shopping .listphoto { max-width: 65px; display: inline-block; } div#undercolumn_cart .listphoto img, div#undercolumn_shopping .listphoto img { width: 100%; } .listphoto.fl-left{ float: left; } div#undercolumn .listdetail { max-width: 100%; margin-left: 8px; padding-left: 65px; } .order_item .listdetail p.rank_label { margin-top: 10px; } .order_item .listdetail strong { display: inline-block; } .order_item .listdetail p { display: block; color: #ff0008; font-size: 14px; font-weight: bold; } div#undercolumn_cart .listdetail .dl-btn, div#undercolumn .raku2_delete_cart_product_file .dl-btn { background: #aeaeae; display: inline-block; padding: 1px 7px; border-radius: 3px; margin: 5px 0; } div#undercolumn_cart .listdetail .dl-btn:before, div#undercolumn .raku2_delete_cart_product_file .dl-btn:before { content: "\f146 "; font-family: FontAwesome; margin-right: 5px; color: #fff; } div#undercolumn_cart .listdetail a:link, div#undercolumn .raku2_delete_cart_product_file a:link{ color:#fff; } div#undercolumn_cart .listdetail a:link:hover, div#undercolumn .raku2_delete_cart_product_file a:link:hover{ color:#fff; opacity: 0.6; } div#undercolumn_cart .listdetail a:visited, div#undercolumn .raku2_delete_cart_product_file a:visited { color:#fff; } /* 単価 ----------------------------------------------- */ div#undercolumn_cart div.form_area .item_price_area, div#undercolumn_shopping .item_price_area{ float: right; } div#undercolumn_cart div.form_area .price_ttl_area, div#undercolumn_shopping .price_ttl_area { float: right; margin-right: 5px; margin-top: 2px; } *[class^="price_ttl_icon"] { padding: 0px 6px; border-radius: 2px; font-size: 13px; display: inline-block; } .price_ttl_icon1 { /* 会員価格、ピンク */ border: solid 1px #F95D6C; color: #F95D6C; } .price_ttl_icon2 { /* 定期初回価格、オレンジ */ border: solid 1px #FF931E; color: #FF931E; } .price_ttl_icon3 { /* 卸価格、ブルー */ border: solid 1px #39c; color: #39c; } /* もともと卸価格(掛け率無しの場合は表示されない) */ div#undercolumn_cart div.form_area p.base_price, div#undercolumn_shopping p.base_price { clear: both; } /* 現在のカゴの中 ----------------------------------------------- */ div#undercolumn_cart p{ margin: 0; } div#undercolumn_cart form p{ line-height: 1.6; } div#undercolumn_cart .point_announce { padding: 20px; margin-bottom: 20px; border: solid 1px #ffcc62; background: #fffaf0; font-size: 120%; text-align: center; line-height: 140%; } div#undercolumn_cart .totalmoney_area { margin-bottom: 20px; } div#undercolumn ul#quantity_level li { padding: 0; display: inline-block; } div#undercolumn ul#quantity_level li a { display: inline-block; } /* 更新ボタン用 */ span.mini.quantity_update { display: block; margin-top: 5px; } span.mini.quantity_update a { color: #fff; padding: 2px 3px; background: #333; display: inline-block; border-radius: 2px; line-height: 1.5em; font-size: 11px; } span.mini.quantity_update a:before { content: url(/user_data/packages/raku2pc/img/icon/update.svg); font-family: FontAwesome; margin-right: 3px; color: #fff; width: 14px; display: inline-block; vertical-align: text-top; } ul#quantity_level { display: block; margin-top: 3px; margin-bottom: 1px; height: 16px; } div#undercolumn .empty { text-align: left; } div#undercolumn_cart div.form_area { margin-bottom: 30px; } div#undercolumn_cart table { margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; } div#undercolumn_cart table th { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; } div#undercolumn_cart table td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } /* ★注意書き ※ご確認ください */ .attention_ttl { border: solid #f00; border-width: 3px 3px 1px; background: #fee; text-align: center; color: #f00; padding: 5px 0px; font-weight: bold; } .attention_outer { border: solid #f00; border-width: 0px 3px 3px; background: #fee; text-align: center; color: #f00; padding: 5px 0px; } div#undercolumn div.raku2_box_quantity { margin-top: 5px; } .raku2_noshi_select span.raku2_noshi_select_title, .raku2_noshi_name span.raku2_noshi_name_title, .raku2_packing span.raku2_packing_title { display: inline-block; width: 25%; } .raku2_noshi_select span.raku2_separator, .raku2_noshi_name span.raku2_separator, .raku2_packing span.raku2_separator { display: inline-block; width: 5%; } .raku2_noshi_select span.raku2_noshi_select_text, .raku2_noshi_name span.raku2_noshi_name_text, .raku2_packing span.raku2_packing_text { width: 70%; } .raku2_noshi_select, .raku2_noshi_name, .raku2_packing { margin-bottom: 3px; } /* お客様情報入力 ----------------------------------------------- */ div#undercolumn_shopping form p { margin: 0; } .flow_area { margin: 0 0 20px 0; text-align: center; } div#undercolumn_customer th em { color: #000; font-weight: bold; } /* お支払い方法・お届け時間等の指定 ----------------------------------------------- */ div#undercolumn_shopping p{ line-height: 1.6; } div#undercolumn_shopping .pay_area { margin: 0 auto 30px; width: 100%; } div#undercolumn_shopping .pay_area02 { margin: 40px auto 30px auto; } div#undercolumn_shopping .pay_area02 .txtarea { margin: 5px 0 0 0; padding: 2px; border: 1px solid #ccc; width: 99%; height: 150px; } div#undercolumn_shopping .pay_area02 .select-msg { margin-bottom: 10px; } div#undercolumn_shopping .point_area, div#undercolumn_shopping .coupon_area, div#undercolumn_shopping .present_area { margin: 40px auto 0 auto; } div#undercolumn_shopping .point_area .point_area_inner, div#undercolumn_shopping .coupon_area .coupon_area_inner { padding: 20px; border: 1px solid #ccc; margin-top: 10px; } div#undercolumn_shopping .point_area .point_area_inner ul, div#undercolumn_shopping .coupon_area .coupon_area_inner ul { margin-top: 10px; } div#undercolumn_shopping .point_area .point_area_inner ul li, div#undercolumn_shopping .coupon_area .coupon_area_inner ul li { margin-bottom: 10px; } div#undercolumn_shopping .point_area .point_area_inner ul li:last-child, div#undercolumn_shopping .coupon_area .coupon_area_inner ul li:last-child { margin-bottom: 0; } div#undercolumn_shopping table { margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; } div#undercolumn_shopping table th { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; } div#undercolumn_shopping table td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } /* 定期サイクルエリア */ div#undercolumn_shopping #periodArea { background-color:#FAFAE6; padding: 25px 30px 5px; } div#undercolumn_shopping #periodArea .raku2_shortest, #calender_area .raku2_shortest { background-color: #FFF99D; } div#undercolumn_shopping #periodArea .raku2_since, #calender_area .raku2_since { background-color: #77ff77; } div#undercolumn_shopping #periodArea h3 { margin-bottom: 0; } div#undercolumn_shopping #periodArea li{ margin:0.5em 0; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #CCC; } div#undercolumn_shopping #periodArea li p{ margin-top:5px; text-indent: 2em; } div#undercolumn_shopping #periodArea p { margin-bottom:10px;} div#undercolumn_shopping #calender_area .firstDate { background-color: #ffff00; } div#undercolumn_shopping #calender_area .nextDate { background-color: #77ff77; } /* カレンダーエリア */ div#undercolumn_shopping #calender_area table { margin: 10px auto; border-top: none; border-left: none; width: auto; text-align: center; } div#undercolumn_shopping #calender_area table td { padding: 1px 3px; border-right: none; border-bottom: 1px dotted #ccc; text-align: center; } div#undercolumn_shopping table .calendar th { padding: 1px 3px; border-right: none; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; text-align: center; } /* 180324 taguchi ins */ div#undercolumn_shopping #periodArea .period { margin: 20px 0 30px; } div#undercolumn_shopping #periodArea .period h4 { float: left; } div#undercolumn_shopping #periodArea .period span.teiki_cycle_set { float: left; } div#undercolumn_shopping #periodArea .period table.table01 { clear: both; } div#undercolumn_shopping #periodArea .period table.table01 .teiki_cycle_item { margin: 5px; } div#undercolumn_shopping #periodArea .period table.table01 .teiki_cycle_item h5 { font-size: 100%; font-weight: normal; } div#undercolumn_shopping #periodArea .period table.table01 .teiki_cycle_item ul { margin-left: 15px; } div#undercolumn_shopping #periodArea .period table.table01 .teiki_cycle_item ul li { margin: 0; border-bottom: none; } div#undercolumn_shopping #periodArea .period table.table01 .confirmArea { margin: 10px 0; text-align: center; } /* お届け先の指定 ----------------------------------------------- */ #address_area { margin-bottom: 10px; width: 100%; } #address_area .information { width: 65%; float: left; } #undercolumn_shopping .information { margin-bottom: 15px; } #address_area .add_multiple { padding: 15px 10px; border: 1px solid #ffcc62; float: right; width: 30%; color: #555; background: #fffaf0; text-align: center; font-weight: bold; } #address_area .add_multiple p { margin-bottom: 10px; } #address_area p.addbtn { font-weight: bold; font-size: 10px; } p.addbtn i { margin-bottom: 5px; padding: 7px 14px; border-radius: 2px; background: #2185c5; text-align: center; color: #fff; font-size: 12px; display: inline-block; } p.addbtn i.fa-plus-square:before { margin-right: 5px; } /* 確認画面 ----------------------------------------------- */ .alart_coupon_select { border: solid 1px #008a00; text-align: center; padding: 10px; margin: 20px 0; color: #008a00; } /* 定期の総合計額表示部 */ table#total_teiki_all th { background: #fcfcf7; } table#total_teiki_all th span { color: #008a00; font-size: 12px; } /* 定期の商品詳細メッセージ 各回の支払金額 */ span[id^="raku2_open"]{ cursor: pointer; width: 200px; border: 1px solid #ccc; border-radius: 4px; text-align: center; margin: 16px auto 0; position: relative; top: 30%; } div[id^="raku2_close"]{ cursor: pointer; width: 200px; border: 1px solid #ccc; border-radius: 4px; text-align: center; margin: 16px 30% 0; position: relative; padding: 5px; top: 30%; } div[id^="raku2_mask"]{ background: rgba(0, 0, 0, 0.4); position: fixed; top: 0; bottom: 0; right: 0; left: 0; z-index: 99; } section[id^="raku2_modal"]{ background: #fff; color: #555; width: 550px; /* padding: 40px; */ padding: 10px; border-radius: 4px; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); margin: 0 auto; z-index: 999; transition: 0.4s; } table.raku2_order_teiki_info li:not(:last-child) { border-bottom: 0.1rem solid #e5e5e5; margin-bottom: 4px; } table.raku2_order_teiki_info li div { width: 50%; display: inline-block; } table.raku2_order_teiki_info .raku2_price { text-align: right; } /* 完了画面 ----------------------------------------------- */ #undercolumn_shopping #complete_payinfo_area { border: solid 1px #ccc; padding: 20px; margin-bottom: 40px; margin-top: 10px; } /* アンケートフォーム ----------------------------------------------- */ #undercolumn_shopping #enquete_area { margin-top: 30px; } /* ============================================== ▼検索結果 =============================================== */ p.condition_area { margin: 0 auto; padding: 5px; border: solid 1px #333; width: 566px; } /* キーワード検索 ----------------------------------------------- */ form#search_form #search_keyword_area { padding: 15px; background: #eaeaea; } form#search_form #search_keyword_area h3 { font-size: 14px; background: #333; margin-bottom: 10px; padding: 4px 10px 3px; color: #fff; } form#search_form #search_keyword_top { overflow: hidden; } form#search_form #search_keyword_top select { height: 27px; width: 150px; float: left; } form#search_form #search_keyword_top input#search_kw { width: 60%; float: left; } form#search_form #search_keyword_top input#btn_kwd_search { background: #FF931E; color: #fff; border: none; height: 27px; width: 15%; float: right; } form#search_form #search_keyword_bottom p#search_no_only { margin-bottom: 6px; font-size: 12px; } form#search_form #search_keyword_bottom input#search_deselect_kw { width: 300px; } /* 価格帯検索 ----------------------------------------------- */ form#search_form #search_price_area { background: #f5f5f5; padding: 10px 15px; overflow: hidden; font-size: 12px; } form#search_form #search_price_area > p { float: left; } form#search_form #search_price_area input { width: 110px; } form#search_form #search_price_area input#btn_price_search { float: left; border: 1px solid #a6a6a6; background: #fff; height: 24px; margin-left: 20px; border-radius: 3px; } /* 絞り込み検索 ----------------------------------------------- */ /* form#search_form #search_status_area { display: none; } */ form#search_form #refine_area { margin: 15px 0 30px; font-size: 12px; } /* チェックボックスをcssで装飾 */ form#search_form #refine_area input[type=checkbox] { display: none; } form#search_form #refine_area .checkbox { box-sizing: border-box; -webkit-transition: background-color 0.2s linear; transition: background-color 0.2s linear; position: relative; display: inline-block; margin-right: 5px; padding: 4px 12px 2px 37px; border-radius: 2px; background-color: #f6f7f8; vertical-align: middle; cursor: pointer; border: solid 1px #eaeaea; } form#search_form #refine_area .checkbox:hover { background-color: #e6f3f9; } form#search_form #refine_area .checkbox:hover:after { border-color: #39c; } form#search_form #refine_area .checkbox:after { -webkit-transition: border-color 0.2s linear; transition: border-color 0.2s linear; position: absolute; top: 50%; left: 15px; display: block; margin-top: -9px; width: 13px; height: 13px; border: 2px solid #bbb; border-radius: 4px; content: ''; } form#search_form #refine_area .checkbox:before { -webkit-transition: opacity 0.2s linear; transition: opacity 0.2s linear; position: absolute; top: 50%; left: 21px; display: block; margin-top: -6px; width: 3px; height: 6px; border-right: 3px solid #39c; border-bottom: 3px solid #39c; content: ''; opacity: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } form#search_form #refine_area input[type=checkbox]:checked + .checkbox:before { opacity: 1; } /* 絞り込み検索(商品ステータス) ----------------------------------------------- */ form#search_form #search_status_area { margin: 15px 0 0px; font-size: 12px; } /* チェックボックスをcssで装飾 */ form#search_form #search_status_area input[type=checkbox] { display: none; } form#search_form #search_status_area .checkbox { box-sizing: border-box; -webkit-transition: background-color 0.2s linear; transition: background-color 0.2s linear; position: relative; display: inline-block; margin-right: 5px; padding: 4px 12px 2px 37px; border-radius: 2px; background-color: #f6f7f8; vertical-align: middle; cursor: pointer; border: solid 1px #eaeaea; } form#search_form #search_status_area .checkbox:hover { background-color: #e6f3f9; } form#search_form #search_status_area .checkbox:hover:after { border-color: #39c; } form#search_form #search_status_area .checkbox:after { -webkit-transition: border-color 0.2s linear; transition: border-color 0.2s linear; position: absolute; top: 50%; left: 15px; display: block; margin-top: -9px; width: 13px; height: 13px; border: 2px solid #bbb; border-radius: 4px; content: ''; } form#search_form #search_status_area .checkbox:before { -webkit-transition: opacity 0.2s linear; transition: opacity 0.2s linear; position: absolute; top: 50%; left: 21px; display: block; margin-top: -6px; width: 3px; height: 6px; border-right: 3px solid #39c; border-bottom: 3px solid #39c; content: ''; opacity: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } form#search_form #search_status_area input[type=checkbox]:checked + .checkbox:before { opacity: 1; } /* 絞り込み検索(メーカー) ----------------------------------------------- */ form#search_form #search_maker_area { margin: 15px 0 0px; font-size: 12px; } /* チェックボックスをcssで装飾 */ form#search_form #search_maker_area input[type=checkbox] { display: none; } form#search_form #search_maker_area .checkbox { box-sizing: border-box; -webkit-transition: background-color 0.2s linear; transition: background-color 0.2s linear; position: relative; display: inline-block; margin-right: 5px; padding: 4px 12px 2px 37px; border-radius: 2px; background-color: #f6f7f8; vertical-align: middle; cursor: pointer; border: solid 1px #eaeaea; } form#search_form #search_maker_area .checkbox:hover { background-color: #e6f3f9; } form#search_form #search_maker_area .checkbox:hover:after { border-color: #39c; } form#search_form #search_maker_area .checkbox:after { -webkit-transition: border-color 0.2s linear; transition: border-color 0.2s linear; position: absolute; top: 50%; left: 15px; display: block; margin-top: -9px; width: 13px; height: 13px; border: 2px solid #bbb; border-radius: 4px; content: ''; } form#search_form #search_maker_area .checkbox:before { -webkit-transition: opacity 0.2s linear; transition: opacity 0.2s linear; position: absolute; top: 50%; left: 21px; display: block; margin-top: -6px; width: 3px; height: 6px; border-right: 3px solid #39c; border-bottom: 3px solid #39c; content: ''; opacity: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } form#search_form #search_maker_area input[type=checkbox]:checked + .checkbox:before { opacity: 1; } /* チェックボックスをcssで装飾 */ form#search_form #search_sales_channel_area input[type=checkbox] { display: none; } form#search_form #search_sales_channel_area .checkbox { box-sizing: border-box; -webkit-transition: background-color 0.2s linear; transition: background-color 0.2s linear; position: relative; display: inline-block; margin-right: 5px; padding: 4px 12px 2px 37px; border-radius: 2px; background-color: #f6f7f8; vertical-align: middle; cursor: pointer; border: solid 1px #eaeaea; } form#search_form #search_sales_channel_area .checkbox:hover { background-color: #e6f3f9; } form#search_form #search_sales_channel_area .checkbox:hover:after { border-color: #39c; } form#search_form #search_sales_channel_area .checkbox:after { -webkit-transition: border-color 0.2s linear; transition: border-color 0.2s linear; position: absolute; top: 50%; left: 15px; display: block; margin-top: -9px; width: 13px; height: 13px; border: 2px solid #bbb; border-radius: 4px; content: ''; } form#search_form #search_sales_channel_area .checkbox:before { -webkit-transition: opacity 0.2s linear; transition: opacity 0.2s linear; position: absolute; top: 50%; left: 21px; display: block; margin-top: -6px; width: 3px; height: 6px; border-right: 3px solid #39c; border-bottom: 3px solid #39c; content: ''; opacity: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } form#search_form #search_sales_channel_area input[type=checkbox]:checked + .checkbox:before { opacity: 1; } /* チェックボックスをcssで装飾 */ form#search_form #search_sales_channel_area2 input[type=checkbox] { display: none; } form#search_form #search_sales_channel_area2 .checkbox { box-sizing: border-box; -webkit-transition: background-color 0.2s linear; transition: background-color 0.2s linear; position: relative; display: inline-block; margin-right: 5px; padding: 4px 12px 2px 37px; border-radius: 2px; background-color: #f6f7f8; vertical-align: middle; cursor: pointer; border: solid 1px #eaeaea; } form#search_form #search_sales_channel_area2 .checkbox:hover { background-color: #e6f3f9; } form#search_form #search_sales_channel_area2 .checkbox:hover:after { border-color: #39c; } form#search_form #search_sales_channel_area2 .checkbox:after { -webkit-transition: border-color 0.2s linear; transition: border-color 0.2s linear; position: absolute; top: 50%; left: 15px; display: block; margin-top: -9px; width: 13px; height: 13px; border: 2px solid #bbb; border-radius: 4px; content: ''; } form#search_form #search_sales_channel_area2 .checkbox:before { -webkit-transition: opacity 0.2s linear; transition: opacity 0.2s linear; position: absolute; top: 50%; left: 21px; display: block; margin-top: -6px; width: 3px; height: 6px; border-right: 3px solid #39c; border-bottom: 3px solid #39c; content: ''; opacity: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } form#search_form #search_sales_channel_area2 input[type=checkbox]:checked + .checkbox:before { opacity: 1; } /* チェックボックスをcssで装飾 */ form#search_form #search_sales_channel_area3 input[type=checkbox] { display: none; } form#search_form #search_sales_channel_area3 .checkbox { box-sizing: border-box; -webkit-transition: background-color 0.2s linear; transition: background-color 0.2s linear; position: relative; display: inline-block; margin-right: 5px; padding: 4px 12px 2px 37px; border-radius: 2px; background-color: #f6f7f8; vertical-align: middle; cursor: pointer; border: solid 1px #eaeaea; } form#search_form #search_sales_channel_area3 .checkbox:hover { background-color: #e6f3f9; } form#search_form #search_sales_channel_area3 .checkbox:hover:after { border-color: #39c; } form#search_form #search_sales_channel_area3 .checkbox:after { -webkit-transition: border-color 0.2s linear; transition: border-color 0.2s linear; position: absolute; top: 50%; left: 15px; display: block; margin-top: -9px; width: 13px; height: 13px; border: 2px solid #bbb; border-radius: 4px; content: ''; } form#search_form #search_sales_channel_area3 .checkbox:before { -webkit-transition: opacity 0.2s linear; transition: opacity 0.2s linear; position: absolute; top: 50%; left: 21px; display: block; margin-top: -6px; width: 3px; height: 6px; border-right: 3px solid #39c; border-bottom: 3px solid #39c; content: ''; opacity: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } form#search_form #search_sales_channel_area3 input[type=checkbox]:checked + .checkbox:before { opacity: 1; } /* ============================================== ▼RAKU2 =============================================== */ /* チェックボックス用規格 2013.07.26 ADD */ div.listrightbloc .classlist_chkbox { margin-bottom: 10px; padding-bottom: 10px; background: url("../img/background/line_dot_02.gif") repeat-x bottom ; } div.listrightbloc .classlist_chkbox .chk_class { margin-bottom: 5px; } /* チェックボックス用規格 2013.07.26 ADD */ #detailrightbloc .classlist_chkbox { margin-bottom: 20px; padding-bottom: 5px; width: 100%; } #detailrightbloc .classlist_chkbox .option { margin-bottom: 10px; } #detailrightbloc .classlist_chkbox .chk_class_title { font-weight: 400; } /* 商品情報 各種設定 (※テンプレート指定時) ----------------------------------------------- */ /*テンプレートA・PC用販売説明文 */ #detail_type_a #ins_display_caption_pc { margin-bottom: 50px; } /*テンプレートA・買い物かご */ #detail_type_a .detaildescriptionbloc .cart_area { margin-bottom: 20px; } /*テンプレートB・PC用販売説明文 */ #detail_type_b #ins_display_caption_pc { margin-bottom: 50px; } /*テンプレートB・PC用商品説明文 */ #detail_type_b #ins_catalog_caption_pc { margin-bottom: 20px; } /*テンプレートC・2カラムレイアウト比率(左右逆転) */ #detail_type_c #detailleftbloc { width: 60% !important; } #detail_type_c #detailrightbloc { width: 37% !important; } /*テンプレートC・1カラムレイアウト比率(左右逆転) */ #main_column.colnum1 #detail_type_c #detailleftbloc { width: 43% !important; } #main_column.colnum1 #detail_type_c #detailrightbloc { width: 54% !important; } /*テンプレートC・PC用販売説明文 */ #detail_type_c #ins_display_caption_pc { margin-bottom: 50px; } /*テンプレートC・送料込・送料別 */ #detail_type_c .detaildescriptionbloc .deliv_fee { display: block; text-align: right; margin-right: 10px; } /*テンプレートC・ステータスアイコン */ #detail_type_c ul.status_icon { margin-top: 30px; } /*テンプレートD・PC用販売説明文 */ #detail_type_d #ins_display_caption_pc { padding-top: 30px; clear: both; } /*テンプレートD・PC用商品説明文 */ #detail_type_d #ins_catalog_caption_pc { margin-bottom: 20px; } /*テンプレートE・PC用販売説明文 */ #detail_type_e #ins_display_caption_pc { margin-bottom: 50px; } /*テンプレートF・PC用販売説明文 */ #detail_type_f #ins_display_caption_pc { margin-bottom: 20px; } /*テンプレートF・PC用商品説明文 */ #detail_type_f #ins_display_caption_pc { margin-bottom: 50px; } /*テンプレートF・商品画像(横並び) */ #detail_type_f #sub_phto_first .sub_photo_upper { width: 48%; float: left; margin-bottom: 4%; } #detail_type_f #sub_phto_first .sub_photo_upper img { width: 100%; } #detail_type_f #sub_phto_first .sub_photo_upper:first-child { margin-right: 4%; } /*テンプレートG・2カラムレイアウト(float解除、商品画像中央寄せ) */ #detail_type_g #detailleftbloc { float: none !important; margin: 0 auto 20px; text-align: center; } #detail_type_g #detailrightbloc { float: none !important; width: 100% !important; } /*テンプレートG・PC用販売説明文 */ #detail_type_g #ins_display_caption_pc { margin-bottom: 50px; } /*テンプレートG・買い物かご */ #detail_type_g .detaildescriptionbloc .cart_area { width: 60%; } /* 商品一覧 ----------------------------------------------- */ form[name^="product_"] { display: inline-block; width: 20%; vertical-align: top; padding: 2.2%; } .listrightbloc .cart_area { display: none; } .listrightbloc .detail_btn { display: none; } .listrightbloc .listcomment { display: none; } div.listrightbloc .raku2_review { margin: 5px 0 0 0; } div.listrightbloc .raku2_review { display: flex; } div.listrightbloc .raku2_review .raku2_ave { display: flex; align-items: center; } div.listrightbloc .raku2_review .raku2_ave img { width: 15px; height: 15px; position: relative; top: -2px; margin-right: 3px; } .raku2_product_list_new .layout_mainimage img { max-width: 100%; margin-bottom: 20px; } #main_column h2.raku2_title { text-align: initial; border-bottom: none; margin-bottom: 20px; padding: 0; font-size: 200%; font-weight: normal; } .raku2_product_list_new .layout_uppertext, .raku2_product_list_new .raku2_message_product_list_upper, .raku2_product_list_new .raku2_breadcrumbs { margin-bottom: 20px; } .raku2_new_order_list { margin-bottom: 100px; } .raku2_product_list_new .raku2_product_list_order, .raku2_new_order_list .raku2_product_list_order, .raku2_new_order_list .raku2_product_order_number { height: 3rem; width: 12rem; } .raku2_product_list_new .product_list_header { display: grid; grid-template-columns: 1fr 9fr; align-items: center; margin-bottom: 20px; } .raku2_product_list_new .product_list_footer { display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; margin-bottom: 20px; } .raku2_product_list_new .product_list_footer .raku2_navi { justify-self: center; } .raku2_product_list_new .raku2_pagenumber_area { justify-self: end; } .raku2_product_list_new .raku2_product_list_container { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 2.0rem; margin-bottom: 20px; } .raku2_product_list_new form[name^="product_"] { width: auto; padding: 0; margin: 0 auto; } .raku2_product_list_new .listphoto { position: relative; width: 280px; height: 280px; } .raku2_product_list_new .listphoto .raku2_sold_out_band { position: absolute; top: 88%; left: 3%; text-align: center; width: 30%; background-color: #444; color: #fff; padding: 3px 0; border-radius: 5px; } .raku2_product_list_new .listphoto .raku2_sold_out_band:empty { display: none; } .raku2_product_list_new .listphoto .sold_out_back { opacity: 1.0; } .raku2_product_list_new .raku2_product_list_container img { width: 100%; height: 100%; object-fit: cover; } .raku2_product_list_new .listrightbloc { width: 280px; } .raku2_product_list_new .list_status_icon { margin: 1em 0; } .raku2_product_list_new .list_status_icon .raku2_status_text, .raku2_new_layout_orderlist .raku2_status_text, .raku2_new_layout_ordergrid .raku2_status_text { display: inline-block; border: solid 1px #F95D6C; border-radius: 2px; padding: 3px 5px; margin: 0 0.3em 0.3em 0; color: #F95D6C; } .raku2_product_list_new ul.list_status_icon li { float: left; } /* 下位カテゴリ */ .raku2_child_categories { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); place-items: center; place-content: center; gap: 2.0rem; margin-bottom: 20px; } .raku2_child_categories a.category_no_image:link, .raku2_child_categories a.category_no_image:visited { display: block; padding: 0.5rem; width: 80%; text-align: center; border: 1px #333 solid; border-radius: 10rem; margin: 0.5rem 0; } .raku2_child_categories a.category_image:link, .raku2_child_categories a.category_image:visited { display: grid; grid-template-columns: 40% 1fr 4%; place-items: center; place-content: center; padding: 1.5rem; width: 85%; height: 65%; background-color: #eee; border-radius: 5px; } .raku2_child_categories a.category_image img { justify-self: start; width: 80px; height: 80px; } .raku2_child_categories a.category_image div { justify-self: start; } /* 商品部 */ .raku2_product_list_new .raku2_list_product_name, .raku2_product_list_new .raku2_listcomment, .raku2_product_list_new .raku2_price_area, .raku2_product_list_new .raku2_stock_quantity_area, .raku2_product_list_new .raku2_sale_time_area, .raku2_product_list_new .raku2_list_rcatalog_id_area { margin-bottom: 0.5em; } .raku2_product_list_new div.listrightbloc h3.raku2_list_product_name { white-space: normal; } .raku2_product_list_new .raku2_price_area .raku2_differ_arrow { margin: 0 0.2em; } .raku2_product_list_new .raku2_price_area .raku2_differ_price ~ .raku2_price_label, .raku2_product_list_new .raku2_price_area .raku2_differ_price ~ .raku2_price, .raku2_product_list_new .raku2_price_area .raku2_differ_price ~ .raku2_price_unit, .raku2_new_layout_orderlist .raku2_price_area .raku2_differ_price ~ .raku2_price_label, .raku2_new_layout_orderlist .raku2_price_area .raku2_differ_price ~ .raku2_price, .raku2_new_layout_orderlist .raku2_price_area .raku2_differ_price ~ .raku2_price_unit, .raku2_new_layout_ordergrid .raku2_price_area .raku2_differ_price ~ .raku2_price_label, .raku2_new_layout_ordergrid .raku2_price_area .raku2_differ_price ~ .raku2_price, .raku2_new_layout_ordergrid .raku2_price_area .raku2_differ_price ~ .raku2_price_unit { color: #f00; } .raku2_product_list_new .raku2_price_area .raku2_differ_price, .raku2_new_layout_orderlist .raku2_price_area .raku2_differ_price, .raku2_new_layout_ordergrid .raku2_price_area .raku2_differ_price { text-decoration: line-through; } /* ページナビゲーション */ .raku2_product_list_new .raku2_navi, .raku2_product_list_new .raku2_navi .fa-angle-left:before, .raku2_product_list_new .raku2_navi .fa-angle-right:before, .raku2_new_order_list .raku2_navi, .raku2_new_order_list .raku2_navi .fa-angle-left:before, .raku2_new_order_list .raku2_navi .fa-angle-right:before { color: #333; } .raku2_product_list_new .raku2_navi p, .raku2_new_order_list .raku2_navi p { display: inline-block; margin-right: 0.5em; } .raku2_product_list_new .raku2_navi a, .raku2_new_order_list .raku2_navi a { padding: 0.8em; margin-right: 0.5em; } /* A => 2019.07.02 KS フェーズ1 */ /* カテゴリー一覧 ----------------------------------------------- */ form[name^="category_"] { display: inline-block; width: 20%; vertical-align: top; padding: 2.2%; } .listrightbloc .cart_area { display: none; } .listrightbloc .detail_btn { display: none; } .listrightbloc .listcomment { display: none; } /* 商品分類一覧 ----------------------------------------------- */ /*テンプレートB・PC用販売説明文 */ #detail_type_ks #ins_display_caption_pc { margin-bottom: 50px; } /*テンプレートB・PC用商品説明文 */ #detail_type_ks #ins_catalog_caption_pc { margin-bottom: 20px; } /* A => 2019.07.02 KS フェーズ1 */ /* レビュー一覧用 ----------------------------------------------- */ .item_spec_area{ overflow: hidden; margin-bottom: 20px; } .item_spec_area .item_photo_link { float: left; } .item_spec_area .listphoto{ margin-bottom: 10px; width: 300px; height: 300px; background: #eee; float: none; } .item_spec_area .listphoto img{ width: 100%; } .item_spec_area p.item_page_btn::before { content: "\f0a9"; font-family: FontAwesome; margin-right: 1px; font-size: 14px; color: #3399cc; } .item_spec_area ul.status_icon { margin: 10px 0 0 5px; } .item_spec_text{ float: right; width: 420px; } .item_spec_area ul.status_icon { display: inline-block; } .item_spec_area ul.status_icon li { float: left; margin-right: 5px; } .item_spec_area .price_area { margin-bottom: 10px; } .item_spec_area .price_area p { font-size: 18px; } .item_spec_area .main_comment { width: 390px; margin-bottom: 15px; display: inline-block; } .item_spec_area .item_spec_box { border: 2px solid #ccc; margin-bottom: 15px; } .item_spec_area .item_spec_box .ave { text-align: center; font-size: 18px; margin-bottom: 5px; margin-right: 0; padding: 5px; border-bottom: 1px solid #ccc; } .ave p { font-size: 12px; } .item_spec_area .item_spec_box .rank img { margin: 0 5px; } .item_spec_area .item_spec_box>div { text-align: left; } .item_spec_area .rank{ padding: 10px 20px; } .item_spec_area dl.product_code { display: none; } div#sort_area { margin: 0 auto; border-radius: 4px; border: solid 1px #ccc; background: #d3e8f2; clear: both; } #sort_area .open-btn { position: relative; text-align: right; margin-top: 10px; } #sort_area h3 { margin: 0 18px 5px; display: inline-block; cursor: pointer; } #sort_area h3.active::before{ content:"\f146 "; font-family: FontAwesome; margin-right: 5px; color: #3399cc; } #sort_area h3::before{ content:"\f0fe "; font-family: FontAwesome; margin-right: 5px; color: #3399cc; } #sort_area .filter_area.open-box { margin-bottom: 20px; } #sort_area .filter_area.open-box p.ttl { width: 642px; margin: 0 auto; display: block; background: #f0f0f0; text-align: center; color: #514c49; font-weight: bold; padding: 6px 0; border: 1px solid #ccc; border-bottom: none; font-size: 14px; letter-spacing: 1px; } div#sort_area table{ width: 644px; margin: 0 auto 20px auto; } div#sort_area p.btn input{ width: 80%; margin: 0 auto; } .sorting_area { background: #fff; width: 644px; margin: 0 auto 16px; border: 1px solid #ccc; text-align: center; } .sorting_area .change{ margin-top: 10px; display: inline-block; } .sorting_area .change p.sort-ttl { display: inline-block; } .sorting_area .change span { vertical-align: top; } .sorting_area .pagenumber_area { width: 490px; margin: 8px 0; padding-bottom: 0; background: none; overflow: hidden; display: inline-block; } .sorting_area .pagenumber_area .navi { width: auto; float: left; } .navi a, .raku2_navi a { background: #eee; padding: 4px 6px; border-radius: 3px; line-height: 24px; } .sorting_area .pagenumber_all { float: right; } #reviews_area div.list_area { overflow: auto; overflow: hidden; float: none; width: 100%; padding: 0; margin: 40px 0; border: 1px solid #ccc; box-sizing: border-box; } #reviews_area .list_area .listphoto { max-width: 50px; margin: 20px 10px 20px 20px; float: left; } /* 会員様限定商品の場合はアイコン表示 */ form[name^="product_form"] .list_area { position: relative; } form[name^="product_form"] .listrightbloc .icon_member_only, form[name^="product_form"] .listrightbloc .icon_member_price { position: absolute; top: 0; left: 0; z-index: 100; background: #d0ac56; color: #fff; font-size: 11px; padding: 2px 10px; } .list_item_box { float: right; width: 160px; font-size: 11px; margin-top: 10px; } /* 会員様限定商品の場合はアイコン表示 */ form[name^="category_form"] .list_area { position: relative; } form[name^="category_form"] .listrightbloc .icon_member_only, form[name^="category_form"] .listrightbloc .icon_member_price { position: absolute; top: 0; left: 0; z-index: 100; background: #d0ac56; color: #fff; font-size: 11px; padding: 2px 10px; } .list_item_box { float: right; width: 160px; font-size: 11px; margin-top: 10px; } #reviews_area .list_area .listrightbloc { display: inline-block; margin: 20px 0; } #reviews_area .list_area .listphoto img.picture { border: none; } #reviews_area .reviewdate { margin-bottom: 3px; } #reviews_area div.listrightbloc ul.status_icon { margin: 10px 3px 10px; width: auto; display: inline-block; } #reviews_area h3 { max-width: 580px; margin-bottom: 5px; font-size: 14px; font-weight: bold; display: inline-block } /* 規格名(非表示可能なようにclass付け) */ #reviews_area p.classcategory_name { font-weight: normal; font-size: 11px; margin-top: -3px; margin-bottom: 5px; } #reviews_area .list-inner-top h3 { display: block } /* 価格 */ #reviews_area .list-inner-top .pricebox { margin: 0; text-align: left; } #reviews_area div.listrightbloc p.item_page_btn,#reviews_area div.listrightbloc p.item_review_btn{ display: inline-block; margin: 5px 10px 4px 1px; } #reviews_area div.listrightbloc p.item_page_btn::before{ content: "\f0a9"; font-family: FontAwesome; margin-right: 1px; font-size: 14px; color: #3399cc; } #reviews_area div.listrightbloc p.item_review_btn::before{ content: "\f0a9"; font-family: FontAwesome; margin-right: 1px; font-size: 14px; color: #3399cc; } #reviews_area .list-inner-sec { border-bottom: 1px solid #ccc; overflow: hidden; } #reviews_area .item_link { margin-bottom: 10px; } #reviews_area .reviewlevel { display: block; border-top: 1px dotted #ccc; overflow: hidden; clear: both; padding: 10px 20px; } #reviews_area .reviewlevel img { vertical-align: top; } #reviews_area .list-inner-top { border-bottom: 1px solid #ccc; display: inline-block; width: 100%; overflow: hidden; margin-bottom: 15px; } #reviews_area .list-inner-bottom { display: table; padding-bottom: 15px; } #reviews_area .list-inner-left { width: 68%; padding: 0 20px; border-right: 1px dotted #ccc; display: table-cell; vertical-align: top; } #reviews_area .list-inner-left .reviewtitle{ font-weight: bold; margin-bottom: 10px; } #reviews_area .list-inner-left .reviewtitle::before { content: "\f27a"; font-family: FontAwesome; margin-right: 4px; font-size: 16px; color: #3399cc; } #reviews_area .list-inner-left .reviewcomment { margin-bottom: 20px; max-width: 420px; word-wrap: break-word; word-break: break-all; } #reviews_area .list-inner-left .reviewcomment.reply { border: 1px dotted #ccc; padding: 10px; } #reviews_area .list-inner-left .reviewcomment.reply p.reply-ttl { font-size: 12px; border-bottom: 1px dotted #ccc; margin-bottom: 5px; font-weight: bold; padding-bottom: 2px; } #reviews_area .list-inner-left .reviewcomment.reply p.reply-ttl::before { content: "\f086"; font-family: FontAwesome; margin-right: 4px; font-size: 16px; color: #3399cc; } #reviews_area .list-inner-right { display: table-cell; width: 30%; } #reviews_area .list-inner-right-top { margin: 0 20px; padding-bottom: 15px; border-bottom: 1px dotted #ccc; overflow: hidden; display: inline-block; font-size: 11px; } #reviews_area .list-inner-right-bottom { width: 217px; margin: 15px 20px; overflow: hidden; } #reviews_area .list-inner-right-bottom p{ font-size: 11px; } #reviews_area .list-inner-right-top .reviewphoto { width: 70px; height: auto; float: left; margin-right: 10px; } #reviews_area .list-inner-right-top .reviewnickname,#reviews_area .list-inner-right-top .reviewnendai,#reviews_area .list-inner-right-top .reviewsex,#reviews_area .list-inner-right-top .reviewrepeat { width: 132px; float: right; } .list-inner-left-bottom a { display: inline-block; padding: 3px 12px; text-decoration: none; color: #ffffff !important; text-shadow: -1px -1px 2px #3885b1; background: #4291b8; background: -moz-linear-gradient(#62b0d7, #4291b8 75%, #4d9ac1); background: -webkit-gradient(linear,left top,left bottom,color-stop(0, #62b0d7),color-stop(.75, #4291b8),color-stop(1, #4d9ac1)); border: 1px solid #2c88b5; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; } .list-inner-left-bottom a:link:hover, a[href]:hover { text-decoration: none; } .list-inner-left-bottom .tbl_review_ref_btn { display: inline-block; } .reviewphoto img { width: 100%; } #reviews_area .list-inner-left-bottom { text-align: center; padding: 10px 20px; border: 1px solid #ccc; border-radius: 5px; margin-top: 20px; overflow: hidden; } #reviews_area .list-inner-right-bottom .list_item { width: 100%; overflow: hidden; } #reviews_area .list-inner-right-bottom .list_item .listphoto { margin: 10px 0; } #reviews_area .list-inner-left-bottom p.ttl { font-size: 12px; margin-bottom: 4px; } #reviews_area .list-inner-left-bottom .reviewrefok { margin-top: 4px; font-size: 12px; } .reviewrefok span { font-size: 15px; font-weight: bold; } /* レビュー関連 ----------------------------------------------- */ h2.title.review { color: #fff!important; } div#completebox { text-align: center; margin: 40px; } #completebox p { line-height: 30px; } .ave img { vertical-align: text-top; } img.profile_img { width: 100px; } .plg_Raku2_LC_Page_Review_List table { margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; text-align: left; } .plg_Raku2_LC_Page_Review_List table th { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; } .plg_Raku2_LC_Page_Review_List table td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } /* 投稿ページ */ .plg_Raku2_LC_Page_Products_Review table { margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; text-align: left; } .plg_Raku2_LC_Page_Products_Review table th { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; } .plg_Raku2_LC_Page_Products_Review table td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } /* ============================================== ▼カートインパーツ =============================================== */ /* 基本スタイル(縦型/幅200px) ----------------------------------------------- */ form[name^="product_"].product_form_cartin { width: 100%; padding: 0; } .cartin_productinfo { font-size: 12px; line-height: 1.6; } .cartin_productinfo p { margin: 0; } /* 商品ステータス */ .cartin_productinfo ul.status_icon li { width: 60px; float: left; line-height: 1; margin: 0 5px 5px 0; } .cartin_productinfo ul.status_icon li img { width: 100%; vertical-align: middle; } .cartin_productinfo .product_photo { width: 100%; } .cartin_productinfo .product_photo img { width: 100%; } .cartin_productinfo .product_detail { width: 100%; } .cartin_productinfo .product_detail p.cartin_productname { margin-top: 5px; } .cartin_productinfo .product_detail p.price_title { display: none; } .cartin_productinfo .product_detail p.price { font-size: 11px; text-align: right; } .cartin_productinfo .product_detail p.price #price02_notax_dynamic, .cartin_productinfo .product_detail p.price #price02_inctax_dynamic { font-size: 15px; } .cartin_productinfo .product_detail .point { text-align: right; font-size: 11px; font-weight: normal; } .cartin_productinfo .product_detail .classlist { margin-top: 10px; } .cartin_productinfo .product_detail select[name^="classcategory"] { font-size: 12px; height: 22px; padding: 0; } .cartin_productinfo .product_detail .cartin_btn { margin-top: 10px; } .cartin_productinfo .product_detail .cartin_btn a { padding: 5px 0; color: #FFF; display: block; border-radius: 4px; text-decoration: none; text-align: center; background-color: #F95D6C; width: 100%; } /* ============================================== ▼加盟店ページ =============================================== */ /* 一覧ページ ----------------------------------------------- */ #members_area #members_area_list { margin: 30px 0 0; } /* タブメニュー */ #members_area #members_area_list ul#area_nav { overflow: hidden; border-left: solid 1px #ccc; display: table; width: 100%; } #members_area #members_area_list ul#area_nav li { display: table-cell; background: linear-gradient(to bottom, #ffffff 0%,#ededed 100%); border-right: solid 1px #ccc; text-align: center; } #members_area #members_area_list ul#area_nav li a { display: block; padding: 10px 20px; } #members_area #members_area_list ul#area_nav li.active a { background: #fff; } /* タブの中身 */ #members_area #members_area_list #area_list { padding: 25px; } #members_area #members_area_list #area_list div { display: none; } #members_area #members_area_list #area_list div.active { display: block; } #members_area #members_area_list #area_list ul { overflow: hidden; margin-bottom: 30px; } #members_area #members_area_list #area_list ul li a { float: left; border-right: solid 1px #ccc; padding: 0 10px; } #members_area #members_area_list #area_list ul li:last-child a { border-right: none; } /* 詳細ページ ----------------------------------------------- */ #members_detail { border: solid 1px #ccc; padding: 25px; overflow: hidden; } #members_detail #members_detail_info { width: 300px; float: left; } #members_detail #members_detail_info .logo_image { width: 300px; height: 150px; display: table-cell; text-align: center; vertical-align: middle; border: solid 1px #247731; padding: 0 20px; } #members_detail #members_detail_info .logo_image img { max-width: 100%; } #members_detail #members_detail_info h2#company_name { color: #247731; font-weight: normal; text-align: left; padding: 0 0 2px; border-bottom: solid 1px #91ba97; margin-bottom: 10px; } #members_detail #members_detail_info .logo_image + h2#company_name { margin-top: 15px; } #members_detail #members_detail_info h3 { font-weight: normal; font-size: 100%; } #members_detail #members_detail_info dt, #members_detail #members_detail_info dd { float: left; } #members_detail #members_detail_info dl { width: 300px; overflow: hidden; } #members_detail #members_detail_info dt { clear: both; width: 70px; } #members_detail #members_detail_info dd { width: 230px; } #members_detail #members_detail_info dd a.site_url { word-break: break-all; } #members_detail #members_detail_info dt h3.member_tel_ttl { margin-top: 12px; } #members_detail #members_detail_info dd span.member_tel { font-size: 28px; font-family: arial; } #members_detail #members_detail_maps { float: right; width: 605px; } #members_detail #members_detail_maps > #maps { margin: 0 !important; width: 100% !important; /* height: 450px !important;*/ } #members_detail #comment_pc { padding-top: 25px; clear: both; } /* まとめ割注意文言 */ .matome_attention_msg { color: #008a00; font-size: 12px; } /* 加盟店ジャンルチェックボックス */ .chk_container, .chk_container24 { display: flex; flex-wrap: wrap; justify-content: flex-start; } .chk_container > label { width: 50%; } .chk_container24 > label { width: 24%; } /* 必須デフォルト */ .required_label { display: inline-block; color: #f00; } .required_label_f_r { float: right; } #entry_input td p { margin-top: 3px; } #entry_input input[name^="zip01"],.delivname input[name^="zip01"] { margin-right: 5px; } #entry_input input[name^="tel01"],.delivname input[name^="tel01"] { margin-right: 5px; } p.zipimg { margin-left: 18px; display: table; } p.zipimg { margin-top: 5px; } .zip_auto_btn { border-radius: 3px; display: inline-block; text-align: center; background: #333; overflow: hidden; text-decoration: none; padding: 4px 5px; font-size: 0.8em; vertical-align: bottom; } a.zip_auto_btn:link, a.zip_auto_btn:visited { color: #fff; } p.zipimg span { display: table-cell; vertical-align: middle; padding-left: 5px; } table#entry_input .mini { font-size: 0.8em; } a#codeAddress,a#mapAddress { border-bottom: 1px solid #333; line-height: 1.2em; display: inline-block; } a#codeAddress:hover, a#mapAddress:hover { border-bottom: 1px solid #c3c3c3; } /* 特定商取引に関する法律に基づく表記 table */ .LC_Page_Order table { margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; text-align: left; } .LC_Page_Order table th { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; } .LC_Page_Order table td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } /* 商品詳細ページ table */ .plg_Raku2_LC_Page_Products_Detail table { margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; text-align: left; } .plg_Raku2_LC_Page_Products_Detail table th { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; } .plg_Raku2_LC_Page_Products_Detail table td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } .plg_Raku2_LC_Page_Products_Detail table.raku2_lotpricetable { width: 300px; margin: 15px auto 20px 4%; } .plg_Raku2_LC_Page_Products_Detail table.raku2_lotpricetable_teiki { width: 400px; margin: 15px auto 20px 4%; } .plg_Raku2_LC_Page_Products_Detail table.raku2_lotratetable { width: 500px; margin: 15px auto 20px 4%; } .plg_Raku2_LC_Page_Products_Detail table.raku2_lotratetable_teiki { width: 600px; margin: 15px auto 20px 4%; } .plg_Raku2_LC_Page_Products_Detail table.raku2_lotpricetable2 { width: 450px; margin: 15px auto 20px 4%; } .plg_Raku2_LC_Page_Products_Detail table.raku2_lotratetable2 { width: 700px; margin: 15px auto 20px 4%; } .plg_Raku2_LC_Page_Products_Detail table.raku2_lotpricetable2_teiki { width: 630px; margin: 15px auto 20px 4%; } .plg_Raku2_LC_Page_Products_Detail table.raku2_lotratetable2_teiki { width: 800px; margin: 15px auto 20px 4%; } .plg_Raku2_LC_Page_Products_Detail table.raku2_lotpricetable_d_none { display: none; } .plg_Raku2_LC_Page_Products_Detail table.raku2_warehousestocktable { width: 500px; margin: 15px auto 20px 4%; } .plg_Raku2_LC_Page_Products_Detail table.raku2_warehousestocktable td:nth-child(n+2) { text-align: right; } .plg_Raku2_LC_Page_Products_Detail table.raku2_warehousestocktable2 { width: 600px; margin: 15px auto 20px 4%; } .plg_Raku2_LC_Page_Products_Detail table.raku2_warehousestocktable2 td:nth-child(n+2) { text-align: right; } .plg_Raku2_LC_Page_Products_Detail table.raku2_warehousestocktable_d_none { display: none; } /* 拠点別在庫 出荷拠点選択 table */ .raku2_warehouse_select_table_area { overflow-x: auto; } #warehouse_select_table { white-space: nowrap; } #warehouse_select_table .raku2_warehouse_select_input { display: inherit; } #warehouse_select_table .raku2_warehouse_select_radio { width: 10%; min-width: 50px; } #warehouse_select_table .raku2_warehouse_select_warehouse { width: 10%; min-width: 50px; } #warehouse_select_table .raku2_warehouse_select_product { min-width: 150px; } #warehouse_select_table .raku2_warehouse_select_disabled td { background-color: #DDDDDD; } /* 購入履歴詳細 table */ .order_history_detail table { margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; text-align: left; } .order_history_detail table th { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; } .order_history_detail table td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } /* お気に入りアイテム table */ .LC_Page_AbstractMypage table.favoriteitems { margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; text-align: left; } .LC_Page_AbstractMypage table.favoriteitems th { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; } .LC_Page_AbstractMypage table.favoriteitems td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } table.favoriteitems td a { display: block; } div#mycontents_area table.favoriteitems .listphoto + a { margin-left: 75px; } /* 再入荷リクエスト */ .LC_Page_AbstractMypage table.restock_list { margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; text-align: left; } .LC_Page_AbstractMypage table.restock_list th { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #333; background-color: #f0f0f0; font-weight: normal; } .LC_Page_AbstractMypage table.restock_list td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } table.restock_list td > { width: auto; margin-left: 75px; } /* オーダーシート固定ボタン */ #order_list_btn{ bottom: 50px; right: 50px; position: fixed; } #order_list_btn.show_btn{ display: block; } #order_list_btn a { background: #ff931f; padding: 20px 20px; border-radius: 40px; color: #fff; font-size: 20px; box-shadow: 0 0 3px rgba(0,0,0,0.3); text-decoration: none; } /* トップページ ----------------------------------------------- */ #main_column.colnum2 { width: 680px; } .idx_cn { width: 680px; margin-bottom: 50px; } .top_page #pickup_item h2,.top_page #recommend_brand h2 { padding: 0px 0px 5px 0px; color: #333; font-size: 150%; font-weight: normal; text-align: left; letter-spacing: 1px; margin-bottom: 15px; border-bottom: none; } .top_page #pickup_item { width: 680px; margin: 0 0 40px; } /*ブランドから選ぶ*/ .top_page #recommend_brand { width: 680px; margin: 0 0 40px; } .top_page #recommend_brand ul { width: 680px; margin: 0; padding: 0; } .top_page #recommend_brand ul li { width: 210px; margin: 0 20px 0 0; padding: 0; display: inline-block; list-style: none; } .top_page #recommend_brand ul li:last-child { margin-right: 0; } .top_page #recommend_brand ul li img { width: 210px; } .top_page #recommend_brand ul li a { font-size: 80%; } .top_page .bnr_area { margin-bottom: 70px; } /* widget-bnr_area */ .widget-bnr_area img { width: 100%; } /* カスタムぺージ ----------------------------------------------- */ /* ご利用ガイド */ .custom_page #guide_area { border: none; margin-bottom: 70px; } .custom_page #guide_area h2 { border-bottom: none; border-left: #999 solid 5px; padding: 5px 10px; } .custom_page #guide_area h3 { margin: 20px auto 5px; } .custom_page #guide_area p { margin-bottom: 10px; } .custom_page #guide_area .contents_outer { margin: 0 auto 75px; } /* よくあるご質問 FAQ */ .custom_page #guide-contents { width: 814px; margin: auto; letter-spacing: 0.1em; line-height: 1.5em; } .custom_page .guideBoxWrap { margin-bottom: 40px; padding-bottom: 1px; overflow: hidden; border-top: 1px solid #ccc; border-right: 1px solid #ccc; } .custom_page .guideBoxWrap .guideBox { float: left; width: 270px; height: 215px; border-left: 1px solid #ccc; border-bottom: 1px solid #ccc; } .custom_page .guideBox h4 { padding: 15px 0 12px 10px; border-bottom: 1px solid #ccc; font-size: 18px; font-weight: bold; } .custom_page .guideBox ul { padding: 10px 0 10px 10px; } .custom_page .guideBox li { margin: 0 0 5px; padding-left: 12px; font-size: 16px; line-height: 25px; font-weight: 200; } .custom_page .guideBoxWrap .guideBoxlast { float: left; width: 225px; height: 215px; border-left: 1px solid #ccc; border-bottom: 1px solid #ccc; border-right: 1px solid #ccc } .custom_page .guideBoxlast h4 { padding: 10px 0 8px 10px; border-bottom: 1px solid #ccc; font-size: 14px; font-weight: bold; } .custom_page .guideBoxlast ul { padding: 10px 0 10px 10px; } .custom_page .guideBoxlast li { margin: 0 0 5px; padding-left: 12px; } .custom_page .guideBox a:link, .custom_page .guideBox a:visited { color: #353535; text-decoration: none; } .custom_page .guideBox a:link, .custom_page .guideBox a:visited { text-decoration: none; } .custom_page .questionetc { width: 820px; margin: auto; text-align: left; } .custom_page .questionetc a:link, .custom_page .questionetc a:visited { color: #353535; text-decoration: none; } .custom_page .questionetc a:link, .custom_page .questionetc a:visited { font-weight: 200; text-decoration: none; } /* ボタン */ .custom_page #gotop { display: block !important; text-align: center; } .custom_page #gotop a { z-index: 9999; position: fixed; bottom: 20px; right: 10px; width: 70px; height: 70px; color: #fff; background: rgba(0, 0, 0, 0.75); font-size: 15px; line-height: 1.2em; padding-top: 12px; box-sizing: border-box; border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; } .custom_page #gotop a:before { font-size: 1rem; font-size: 16px; display: block; font-family: 'FontAwesome'; content: "\f106"; } /* FAQ */ .custom_page #faqarea { position: relative; width: 900px; margin: 0 auto; padding: 0 0 50px; box-sizing: border-box; font-weight: 400; } .custom_page #faqarea .heading { font-size: 28px; text-align: center; margin-bottom: 15px; letter-spacing: 2px; line-height: 35px; } .custom_page #faqarea .heading .small { font-size: 15px; text-align: center; margin-bottom: 15px; letter-spacing: 1px; } .custom_page #faqarea h3 { background-color: #353535; color: #FFFFFF; padding: 8px 0 8px 30px; letter-spacing: 1px; font-size: 18px; font-weight: 400; margin-bottom: 20px; margin-top: 70px; } .custom_page #faqarea h4 { font-size: 18px; font-weight: 600; line-height: 12px; margin: 0; color: #8CB597; } .custom_page #faqarea p.ttl { font-size: 17px; font-weight: 600; margin: 40px 30px 10px; } .custom_page #faqarea .category { width: 850px; margin: 0 auto 20px; font-size: 13px; text-align: center; } .custom_page #faqarea .category a { color: #8CB597; text-decoration: none; } .custom_page #faqarea .answer:before { content: 'A.'; position: absolute; margin-left: -22px; top: 15px; } .custom_page #faqarea .mg-20 { margin: 20px auto; } .custom_page .acMenu { margin: 0 30px 10px; } .custom_page .acMenu dt.check { border-bottom: 1px solid #afafaf; font-size: 17px; } .custom_page .acMenu dt.checked { color: #ff008c; border-radius: 20px; } .custom_page .acMenu dt { display: block; width: 92%; padding: 10px 0 0 10px; cursor: pointer; color: #FFFFFF; } .custom_page .acMenu dd { display: block; padding-left: 0; } .custom_page .acMenu dd .answer { color: #353535; font-size: 17px; padding-left: 44px; padding-top: 15px; padding-bottom: 20px; position: relative; } .custom_page .acMenu dd .answer .small { font-size: 14px; text-indent: -1.5em; } .custom_page .acMenu dd .answer strong { font-size: 23px; font-weight: 500; text-indent: -2.5em; } /* PICKUP */ .custom_page p.page_ttl{ display: block; background: #eee; padding: 5px; margin-bottom: 30px; } .custom_page .main_page{ margin: 10px auto 100px; } .custom_page .main_page .ttl { font-weight: bold; } .custom_page .main_page .detailtext { font-size: 12px; margin-bottom: 20px; } .custom_page .custom_cart_outer{ margin-top: 40px; } .custom_page .custom_cart_area{ width: 300px; margin-right: 40px; float: left; } .custom_page .custom_cart_area img.item_img{ width: 300px; } .custom_page .main_page table{ max-width: 640px; width: 100%; box-sizing: border-box; } /* カートボタン */ .custom_page .cart_in_btn { margin: 25px auto; text-align: center; } .custom_page .cart_in_btn a { display: inline-block; padding: 0.5em 2.3em; text-decoration: none; color: #009ee7; border: solid 2px #009ee7; border-radius: 3px; transition: .4s; } .custom_page .cart_in_btn a:hover { background: #009ee7; color: white; } /* カテゴリーページ ----------------------------------------------- */ /* カテゴリー説明文用 */ .cat_uppertext { margin: 10px auto 15px; } .cat_uppertext .ttl { font-weight: bold; } .cat_uppertext .detailtext { font-size: 12px; } /* フォーム一体型LP ----------------------------------------------- */ .layout_lpmain p.page_ttl{ display: block; background: #eee; padding: 5px; margin-bottom: 30px; } .layout_lpmain .main_page{ margin: 10px auto 100px; } .layout_lpmain .main_page .ttl { font-weight: bold; } .layout_lpmain .main_page .detailtext { font-size: 12px; margin-bottom: 20px; } .layout_lpmain .custom_cart_outer{ margin-top: 40px; } .layout_lpmain .custom_cart_area{ width: 300px; margin-right: 40px; float: left; } .layout_lpmain .custom_cart_area img.item_img{ width: 300px; } .layout_lpmain .main_page table{ max-width: 620px; width: 100%; box-sizing: border-box; margin: 15px auto 20px auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; width: 100%; border-collapse: collapse; text-align: left; } .layout_lpmain .main_page table td { padding: 12px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #fff; } /* まとめ請求書 価格表 ----------------------------------------------- */ table.matome_price th { text-align: center; } table.matome_price td { text-align: right; } /* ローディングアニメーション ----------------------------------------------- */ .spinner { position: absolute; top: calc(50% - 47px); left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transform-origin: center; transform-origin: center; width: 94px; height: 94px; } /* Loading テキスト */ .spinner span { -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); top: 50%; left: 50%; position: absolute; font-size: 12px; } .spinner_wrapper p { position: absolute; top: calc(50% + 47px); left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); font-size: 11px; } .spinner.type1 { border-radius: 50%; border-width: 5px; border-style: solid; border-color: #fff rgba(255, 255, 255, 0.12) rgba(255, 255, 255, 0.12); -webkit-animation: spinner1_1 1.5s infinite linear forwards; animation: spinner1_1 1.5s infinite linear forwards; } .spinner.type1 span { animation: spinner1_1 1.5s infinite linear forwards reverse; } @-webkit-keyframes spinner1_1 { 0% { -webkit-transform: translate(-50%, -50%) rotate(0); transform: translate(-50%, -50%) rotate(0); } 100% { -webkit-transform: translate(-50%, -50%) rotate(360deg); transform: translate(-50%, -50%) rotate(360deg); } } @keyframes spinner1_1 { 0% { -webkit-transform: translate(-50%, -50%) rotate(0); transform: translate(-50%, -50%) rotate(0); } 100% { -webkit-transform: translate(-50%, -50%) rotate(360deg); transform: translate(-50%, -50%) rotate(360deg); } } /* Loading テキストのアニメーション内容 */ @-webkit-keyframes spinner_loading_text { 0% { opacity: 1; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); } 50% { opacity: 0; -webkit-transform: translate(-50%, -50%) rotate(180deg); transform: translate(-50%, -50%) rotate(180deg); } 100% { opacity: 1; -webkit-transform: translate(-50%, -50%) rotate(360deg); transform: translate(-50%, -50%) rotate(360deg); } } @keyframes spinner_loading_text { 0% { opacity: 1; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); } 50% { opacity: 0; -webkit-transform: translate(-50%, -50%) rotate(180deg); transform: translate(-50%, -50%) rotate(180deg); } 100% { opacity: 1; -webkit-transform: translate(-50%, -50%) rotate(360deg); transform: translate(-50%, -50%) rotate(360deg); } } .loading-box.loading{ position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 9999; color: #fff; background-color: #373737; visibility: inherit; pointer-events: inherit; opacity:0.9; } /* ローディング表示を消すための定義 */ .loading-box{ opacity:0; visibility:hidden; pointer-events:none; } /* ローディングアニメーションここまで ----------------------------------------------- */ /* カスタマイズ商品一覧 入数価格表示 */ p[class^="unit0_"] span, p[class^="unit1_"] span, p[class^="unit2_"] span, p[class^="unit3_"] span { display:inline-block; } .inner_unit1 { width: 25%; text-align: right; } .inner_unit2 { width: 25%; text-align: left; } .inner_unit3 { width: 35%; text-align: right; } .separator { width: 5%; } /* カスタマイズ商品一覧 入数価格表示 */ /* お気に入りカスタマイズ */ .raku2_preferable_list { width: 850px !important; } .favoriteitems_tq { font-size: 90% } .raku2_my_favorite_list { display:flex; } .raku2_favorite_left_contents { background: #ffffff; border-width: 1px 1px 1px 1px; border-style: solid; /* 枠線の種類は「実線」 */ border-color: black; /* 枠線の色は「黒」 */ padding: 10px; width: 15%; } .raku2_favorite_left_parts { padding: 5px 5px 5px 10px; font-size: 90% } .raku2_favorite_left_mini { font-size: 80%; padding: 5px 5px 5px 0px; } .raku2_favorite_right_contents { background: #ffffcc; padding: 10px; width: 80%; } .raku2_preferable_list input { display: none; } .raku2_favorite_tab { display: inline-block; /* インラインブロック化 */ border-width: 1px 1px 0px 1px; /* 上側と左右に枠線を引く */ border-style: solid; /* 枠線の種類は「実線」 */ border-color: black; /* 枠線の色は「黒」 */ border-radius: 0.75em 0.75em 0px 0px; /* 左上と右上の角だけを丸くする */ padding: 0.75em 1em; /* 内側の余白量 */ font-weight: bold; /* タブの文字を太字にする */ color: black; /* タブの文字色:黒色 */ background-color: #e0e0e0; /* タブの(非選択状態の)背景色:灰色 */ } /* ▼タブにマウスポインタが載った際の装飾 */ .raku2_favorite_tab:hover { color: green; /* タブの文字色:緑色 */ background-color: #ccffcc; /* タブの背景色:淡い緑色 */ cursor: pointer; /* マウスポインタの形状を「指(指し示す形)」にする */ } /* ▼選択状態のタブ(=チェックが入っているラジオボタンの隣にあるタブの装飾) */ input:checked + .raku2_favorite_tab { color: red; /* タブの文字色:赤色 */ background-color: #ffffcc; /* タブの背景色:淡い黄色 */ } /* ▼チェックが入っているラジオボタンの隣にあるタブの装飾(=選択状態のタブ) */ input:checked + .raku2_favorite_tab { z-index: 10; /* ※2A */ position: relative; /* ※3 */ } /* ▼タブの中身(共通装飾+非選択状態の装飾) */ .raku2_favorite_tab_box { display: none; /* 標準では非表示にする */ border: 1px solid black; /* 枠線を引く:黒色で1ピクセルの実線 */ padding: 1em; /* 内側の余白量 */ background-color: #ffffcc; /* 背景色:淡い黄色(※選択中のタブの背景色と合わせます) */ margin-top: -1px; /* ※1 */ z-index: 0; /* ※2B */ position: relative; /* ※3 */ } #raku2_favo_tabcheck1:checked ~ #raku2_tab_box1 { display: block; } #raku2_favo_tabcheck2:checked ~ #raku2_tab_box2 { display: block; } @media only screen and (max-width: 1125px) { .raku2_preferable_list { width: 100% !important;; } } /* お気に入りカスタマイズ */ /* ツールチップ */ .raku2_tooltip { /* 補足説明するテキストのスタイル */ position: relative; cursor: pointer; /* padding: 0 5px; font-size: 0.9em; */ color: #4682b4; } .raku2_balloon_right { /* ツールチップのスタイル */ width: 400px; /* 横幅 */ position: absolute; top: 50%; left: 80%; /* X軸の位置 */ transform: translateY(-50%); margin-left: 8px; /* テキストとの距離 */ padding: 8px; border-radius: 10px; /* 角の丸み */ background-color: #666; /* font-size: 0.7em; */ color: #fff; text-align: center; visibility: hidden; /* ツールチップを非表示に */ opacity: 0; /*不透明度を0%に */ z-index: 1; transition: 0.5s all; /* マウスオーバー時のアニメーション速度 */ } .raku2_balloon_right::before { /* 吹き出しの「しっぽ」のスタイル */ content: ""; width: 0; height: 0; border: 10px solid transparent; border-right: 12px solid #666; /* 最後の値は「ツールチップの背景色」と合わせる */ position: absolute; top: 50%; right: 99%; transform: translateY(-50%); } .raku2_tooltip:hover .raku2_balloon_right { /* マウスオーバー時のスタイル */ left: 100%; /* X軸の位置 */ visibility: visible; /* ツールチップを表示 */ opacity: 1; /* 不透明度を100%に */ } /* 商品詳細UI改善 --------------------------------------------------------------*/ #detail_type_new_a { margin-top: 20px; } /* 初期非表示 */ #detail_type_new_a .raku2_normal_price, #detail_type_new_a .raku2_price03_area, #detail_type_new_a .point, #detail_type_new_a .relative_cat, #detail_type_new_a .sale_limit { display: none; } #detailarea #detail_type_new_a ul.status_icon li { width: auto; } #detail_type_new_a .status_icon .raku2_status_text { font-size: 1.1rem; font-weight: bold; letter-spacing: 0; text-align: center; display: inline-block; border: solid 1px #F95D6C; border-radius: 2px; line-height: 1.7em; font-feature-settings: "palt"; padding: 3px 8px; color: #F95D6C; } #detail_type_new_a .raku2_product_name { font-size: 1.6em; color: #000; margin: 0; } #detail_type_new_a .product_code { padding: 0; margin: 0; border: none; } #detail_type_new_a #ins_catalog_caption_pc { border-top: 1px solid #666; border-bottom: 1px solid #666; padding: 8px 0; margin: 3% 0; } #detail_type_new_a .point, #detail_type_new_a .deliv_date, #detail_type_new_a .relative_cat, #detail_type_new_a .sale_limit { padding: 0; margin: 0; } #detailarea #detail_type_new_a .raku2_price03_area .kaiin_price_area { border: 0; margin: 10px 0; padding: 0; } #detailarea #detail_type_new_a .raku2_price03_area .kaiin_price { display: flex; align-items: center; } #detailarea #detail_type_new_a .raku2_price03_area .kaiin_price dt, #detailarea #detail_type_new_a .raku2_price03_area .kaiin_price dd { margin-right: 5px; } #detailarea #detail_type_new_a .raku2_price03_area .kaiin_price dd .price03_inctax_default, #detailarea #detail_type_new_a .raku2_price03_area .kaiin_price dd .price03_inctax_dynamic, #detailarea #detail_type_new_a .raku2_price03_area .kaiin_price dd .price03_notax_default, #detailarea #detail_type_new_a .raku2_price03_area .kaiin_price dd .price03_notax_dynamic { font-size: 22px; } #detailarea #detail_type_new_a .raku2_price03_area a { text-decoration: underline; } #detailarea #detail_type_new_a .review_link_bloc .review_link , #detailarea #detail_type_new_a .review_link_bloc .ave, #detailarea #detail_type_new_a .review_link_bloc .review_cnt { float: none; } #detailarea #detail_type_new_a .review_link_bloc { position:relative; display: flex; justify-content: space-between; align-items: center; border: 0; background-color: #fbfcf6; width:45%; margin: 10px 0; } #detailarea #detail_type_new_a .review_link_bloc:hover { opacity: 0.6; } #detailarea #detail_type_new_a .review_link_bloc .ave { display: flex; align-items: center; } #detailarea #detail_type_new_a .review_link_bloc .ave img { width: 20px; height: 20px; position: relative; top: -2px; margin-right:3px; } #detailarea #detail_type_new_a .review_link_bloc .raku2_review_page_link { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #detail_type_new_a .raku2_recommend_level { font-size:30px; padding-left:5px; } #detailarea #detail_type_new_a .product_stock { color: #333; } #detailarea #detail_type_new_a #cart { padding: 15px 0 15px 0; color: #FFF; display: flex; border-radius: 5px; text-decoration: none; font-size: 120%; letter-spacing: 2px; text-align: center; background-color: #F95D6C; align-items: center; justify-content: center; } #detailarea #detail_type_new_a span[class^="material-symbols"] { font-size: 16px; margin-right: 5px; } #detailarea #detail_type_new_a a #cart_reserv { padding: 15px 0 15px 0; color: #F95D6C; display: block; border-radius: 5px; text-decoration: none; font-size: 120%; letter-spacing:2px; text-align: center; background-color:#FFF; border: solid 3px #F95D6C; margin-bottom: 5px; } #detailarea #detail_type_new_a .raku2_notcartin { padding: 15px; color: #FFF; display: flex; border-radius: 5px; text-decoration: none; font-size: 120%; letter-spacing: 2px; text-align: center; background-color: #E0E0E0; align-items: center; justify-content: center; } #detailarea #detail_type_new_a .raku2_notcartin a { color: #FFF; text-decoration: underline; } #detailarea #detail_type_new_a .raku2_btn_area { width: 80%; max-width: 500px; } #detailarea #detail_type_new_a #cartbtn_default { display: block; } #detailarea #detail_type_new_a .raku2_sub_btn { display: flex; justify-content: space-between; margin-top: 2%; } #detailarea #detail_type_new_a .stock_notify_btn, #detailarea #detail_type_new_a .favorite_btn, #detailarea #detail_type_new_a .ask_btn, #detailarea #detail_type_new_a .panf_btn { padding: 0; flex-grow: 1; } #detailarea #detail_type_new_a .raku2_sub_btn div:not(:last-child) { margin-right: 3%; } #detailarea #detail_type_new_a .stock_notify_btn a, #detailarea #detail_type_new_a .favorite_btn a, #detailarea #detail_type_new_a .ask_btn a, #detailarea #detail_type_new_a .panf_btn a { width: 99%; padding: 5px 0; color: #555; border: 1px solid #AAA; background-origin: padding-box; background-attachment: scroll; background-clip: border-box; background-color: #FFF; display: block; cursor: pointer; border-radius: 4px; text-decoration: none; text-align: center; } /* 規格部分 */ #detailarea #detail_type_new_a .raku2_kikaku_nav { margin-top: 10px; } #detailarea #detail_type_new_a .raku2_kikaku_nav ul { display: flex; margin-bottom: 0; flex-wrap: wrap; } #detailarea #detail_type_new_a .raku2_kikaku_nav li { text-align: center; width:100px; } #detailarea #detail_type_new_a .raku2_kikaku_nav .raku2_product_box { position: relative; display: block; width: 110px; text-decoration: none; margin: 0 15px 15px 0; } #detailarea #detail_type_new_a .raku2_kikaku_nav .raku2_product_box img { width: 80px; height: 80px; margin: 7px 0; object-fit: scale-down; } #detailarea #detail_type_new_a .raku2_kikaku_nav .raku2_product_box div.raku2_kikaku_product_name { padding: 7px 5px; font-weight: bold; } #detailarea #detail_type_new_a .raku2_kikaku_nav .raku2_product_box div.raku2_kikaku_product_name .inventory_rest { font-weight: normal; } #detailarea #detail_type_new_a .raku2_kikaku_nav input[type="radio"] { display: none; } #detailarea #detail_type_new_a .raku2_kikaku_nav input[type="radio"]:checked + label { border: 1px solid #28A7E1; background-color: #e6f7ff; border-radius: 5px; width: 102%; height: 102%; box-sizing: border-box; margin-left: -1%; margin-top: -1%; } #detailarea #detail_type_new_a .raku2_kikaku_nav .raku2_product_box label { cursor: pointer; display: block; font-size: .75rem; border: 1px solid #c8c8c8; border-radius: 5px; min-width: 100%; min-height: 100%; } #detailarea #detail_type_new_a .raku2_kikaku_nav .raku2_product_box label.disabled { cursor: not-allowed; opacity: 0.4; } #detailarea #detail_type_new_a .raku2_kikaku_nav .raku2_product_box .raku2_not_selectabled { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); width: 100%; font-size: 12px; font-weight: bold; cursor: not-allowed; } #detailarea #detail_type_new_a .stock_notify_area { width: 80%; max-width: 500px; margin-bottom: 20px; } #detailarea #detail_type_new_a #raku2_stock_notify_btn_default p { padding: 15px 0 15px 0; display: block; border-radius: 5px; text-decoration: none; font-size: 120%; letter-spacing: 2px; text-align: center; background-color: #F95D6C; } #detailarea #detail_type_new_a #raku2_stock_notify_btn_default a { color: #FFF; } #detailarea #detail_type_new_a #raku2_stock_notify_btn_added p { padding: 15px; color: #FFF; display: block; border-radius: 5px; text-decoration: none; font-size: 120%; letter-spacing: 2px; text-align: center; background-color: #E0E0E0; } #detailarea #detail_type_new_a .raku2_product_select_area .raku2_base_product { width: 80%; max-width: 500px; margin: 20px 0; } /* 商品選択エリア */ #detailarea #detail_type_new_a .raku2_product_select_area input[type="radio"] + label { display: block; position: relative; padding: 20px 20px 20px 40px; cursor: pointer; } #detailarea #detail_type_new_a .raku2_product_select_area input[type="radio"] { display: none; } #detailarea #detail_type_new_a .raku2_product_select_area input + label { border: 1px solid #ccc; border-radius: 5px; } #detailarea #detail_type_new_a .raku2_product_select_area input:checked + label { border: 4px solid #fac83a; } #detailarea #detail_type_new_a .raku2_product_select_area input[type="radio"] + label::before{ content: ""; display: block; position: absolute; left: 19px; width: 15px; height: 15px; border: 1px solid #2E2E2E; border-radius: 50%; top: 19px; box-sizing: initial; } #detailarea #detail_type_new_a .raku2_product_select_area input[type="radio"]:checked + label::after{ content: ""; display: block; position: absolute; left: 22px; width: 11px; height: 11px; background: #149de1; border-radius: 50%; top: 21.9px; } #detailarea #detail_type_new_a .raku2_product_select_area .raku2_icon { position: absolute; right: 20px; } .raku2_product_select_area .raku2_icon > .raku2_icon1, .raku2_product_select_area .raku2_icon > .raku2_icon2 { padding: 2px 10px; background: #f00; color:#fff; margin-right: 5px; border-radius: 5px; } #detailarea #detail_type_new_a .raku2_product_select_area .raku2_quantity, #detailarea #detail_type_new_a .raku2_product_select_area .raku2_upper_text, #detailarea #detail_type_new_a .raku2_product_select_area .raku2_lower_text { margin: 20px 0 0 0; } #detailarea #detail_type_new_a .raku2_product_select_area .raku2_price_area { display: flex; justify-content: flex-end; align-items: center; } #detailarea #detail_type_new_a .raku2_product_select_area .raku2_price_area .raku2_price { font-size: 20px; font-weight: bold; } /* 選択による商品情報出し分け */ #detailarea #detail_type_new_a .raku2_product_select_area input[type="radio"] + label .raku2_distribution { display: none; } #detailarea #detail_type_new_a .raku2_product_select_area input[type="radio"]:checked + label .raku2_distribution { display: block; } #detailarea #detail_type_new_a .raku2_product_select_area input[type="radio"] + label .raku2_distribution { height: 0; overflow: hidden; } #detailarea #detail_type_new_a .raku2_product_select_area input[type="radio"] + label .raku2_distribution { padding: 0; height: auto; } #detailarea #detail_type_new_a .raku2_product_select_area .raku2_deliv_fee_area { text-align: right; font-size: 11px; } #detailarea #detail_type_new_a .raku2_product_select_area .raku2_deliv_pref_text { margin-left: 5px; } #detailarea #detail_type_new_a .raku2_product_select_area .raku2_delivfee_text_area { text-align: right; } #detailarea #detail_type_new_a .raku2_product_select_area .raku2_sale_price_area { text-align: right; } #detailarea #detail_type_new_a .raku2_product_select_area .raku2_sale_price_area dd, #detailarea #detail_type_new_a .raku2_product_select_area .raku2_sale_price_area dt { display: inline-block; } #detailarea #detail_type_new_a .raku2_product_select_area span[id^="teiki_first_price_inctax_default2_"], #detailarea #detail_type_new_a .raku2_product_select_area span[id^="teiki_first_price_inctax_dynamic2_"], #detailarea #detail_type_new_a .raku2_product_select_area span[id^="teiki_first_price_notax_default2_"], #detailarea #detail_type_new_a .raku2_product_select_area span[id^="teiki_first_price_notax_dynamic2_"], #detailarea #detail_type_new_a .raku2_product_select_area span[id^="price02_inctax_default2_"], #detailarea #detail_type_new_a .raku2_product_select_area span[id^="price02_inctax_dynamic2_"], #detailarea #detail_type_new_a .raku2_product_select_area span[id^="price02_notax_default2_"], #detailarea #detail_type_new_a .raku2_product_select_area span[id^="price02_notax_dynamic2_"] { font-size: 22px; } #detailarea #detail_type_new_a div#detailrightbloc.detaildescriptionbloc form { margin: 0; } #detailarea #detail_type_new_a div.raku2_error { display: none; margin: 10px 0; background-color: #FFEBEE; padding: 5px 10px; font-size: 1.4em; } #detailarea #detail_type_new_a div.raku2_error span.material-symbols-sharp { color: #f00; } /* 商品レビュー部 */ #customervoice_area .review_link { text-align: center; } #customervoice_area .page_navigation { display: flex; justify-content: center; } #customervoice_area .review_link a { border: 1px solid #ccc; padding: 10px 50px; } #customervoice_area .review_bloc { display: flex; justify-content: space-between; margin-bottom: 20px; } #customervoice_area .raku2_review_sort { display: flex; padding: 0 20px 0; flex-wrap: wrap; width: 100%; } #customervoice_area .raku2_review_sort a { padding: 1% 1.5%; background-color: #ddd; margin: 0 2% 1% 0; width: 7%; text-align: center; font-size: 0.8rem; } _::-webkit-full-page-media, _:future, :root #customervoice_area .raku2_review_sort a { width: 9%; font-size: 0.7rem; } #customervoice_area .raku2_review_sort .raku2_review_sort_active { background-color: #3e81ee; color: #fff; pointer-events: none; } /* 画像部 */ #detailarea .raku2_image_lower_wrapper .photo img { min-width: 350px; min-height: 350px; max-width: 350px; max-height: 350px; object-fit: scale-down; } #detailarea .raku2_image_lower_wrapper .raku2_sub_image_container { max-width: 350px; display: flex; flex-wrap: wrap; } #detailarea .raku2_image_lower_wrapper .raku2_sub_image_container .sub_photo { margin-top: 0; min-width: 80px; min-height: 80px; max-width: 80px; max-height: 80px; } #detailarea .raku2_image_lower_wrapper .raku2_sub_image_container .sub_photo:not(:nth-child(4n)) { margin-right: 10px; margin-bottom: 10px; } #detailarea .raku2_image_lower_wrapper .raku2_sub_image_container .sub_photo img { min-width: 80px; min-height: 80px; max-width: 80px; max-height: 80px; object-fit: scale-down; } /* 闇市 */ #detailarea #detail_type_new_a ul li, #detailarea #detail_type_new_a #undercolumn_login_yamiichi .btn_area.btn_type_def input, #detailarea #detail_type_new_a #undercolumn_login_yamiichi .btn_area { width: 100%; } #detailarea #detail_type_new_a #undercolumn_login_yamiichi .btn_area { max-width: 500px; } /* スライドイン */ .raku2_cart_slidein { position: fixed; display: grid; grid-template-columns: 1fr; grid-template-rows: 1fr 8fr 5fr; height: 100vh; width: 400px; top: 0; right: -120%; transition: all 0.6s; overflow-y: hidden; background-color: #fff; z-index: 10001; padding: 2.0em; } .raku2_cart_slidein.raku2_slide_active { right: 0; } .raku2_cart_slidein .raku2_slidein_header, .raku2_cart_slidein .raku2_slidein_main { border-bottom: 1px solid #666; } .raku2_cart_slidein .raku2_slidein_header { display: grid; grid-template-areas: "close .... cart .... ...." "..... msg msg msg ...." ; grid-template-columns: repeat(5, 1fr); grid-template-rows: 1fr 1fr; width: 100%; height: 100%; } .raku2_cart_slidein .raku2_slidein_close { grid-area: close; align-self: center; justify-self: start; cursor: pointer; } .raku2_cart_slidein .raku2_slidein_cart { grid-area: cart; align-self: center; justify-self: center; position: relative; } .raku2_cart_slidein .raku2_quantity { position: absolute; top: -8px; right: -4px; background: #e64c66; color: #fff; width: 21px; height: 17px; border-radius: 50%; line-height: 1.3; padding-top: 4px; text-align: center; } .raku2_cart_slidein .raku2_slidein_message { grid-area: msg; align-self: center; justify-self: center; } .raku2_cart_slidein .raku2_slidein_main { width: 100%; height: 100%; overflow-x: hidden; overflow-y: auto; } .raku2_cart_slidein .raku2_slidein_detail { display: flex; overflow-y: auto; padding: 2.5em 0; position: relative; right: 0; } .raku2_cart_slidein .raku2_slidein_detail:not(:last-child) { border-bottom: 1px solid #666; } .raku2_cart_slidein .raku2_slidein_detail .raku2_slidein_detail_left { flex-basis: 20%; } .raku2_cart_slidein .raku2_slidein_detail .raku2_slidein_detail_center { flex-basis: 70%; padding: 0 1em 0 1.5em; } .raku2_cart_slidein .raku2_slidein_detail .raku2_slidein_detail_right { flex-basis: 10%; } .raku2_cart_slidein .raku2_slidein_detail .raku2_slidein_detail_image { width: 100px; height: 100px; } .raku2_cart_slidein .raku2_slidein_detail .raku2_slidein_detail_image img { width: 100%; height: 100%; object-fit: cover; } .raku2_cart_slidein .raku2_slidein_detail .raku2_slidein_detail_name { font-size: 1.2em; font-weight: 700; } .raku2_cart_slidein .raku2_slidein_detail .raku2_slidein_detail_class:empty, .raku2_cart_slidein .raku2_slidein_detail .raku2_slidein_detail_option:empty { display: none; } .raku2_slidein_detail_center_footer { display: flex; align-items: center; justify-content: space-between; margin-top: 1.0em; } .raku2_cart_slidein .raku2_slidein_detail .raku2_slidein_detail_name, .raku2_cart_slidein .raku2_slidein_detail .raku2_slidein_detail_class, .raku2_cart_slidein .raku2_slidein_detail .raku2_slidein_detail_option, .raku2_cart_slidein .raku2_slidein_detail .raku2_slidein_detail_center_footer { margin-bottom: 0.5em; } .raku2_cart_slidein .raku2_slidein_detail .raku2_slidein_detail_quantity select { padding: 5px 30px 5px 0; } .raku2_cart_slidein .raku2_slidein_detail .raku2_number_stepper { display: flex; -webkit-box-align: center; align-items: center; border: 2px solid rgb(211, 212, 213); } .raku2_cart_slidein .raku2_slidein_detail .raku2_number_stepper_down { position: relative; display: block; appearance: none; border: none; text-align: center; padding: 0px; margin: 0px; text-indent: -9999em; width: 24px; height: 24px; min-width: 24px; background-color: rgb(255, 255, 255); outline: none; } .raku2_cart_slidein .raku2_slidein_detail .raku2_number_stepper_down::before { height: 2px; width: 10px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; display: block; background-color: rgb(211, 212, 213); transition: background-color 250ms linear 0s; } .raku2_cart_slidein .raku2_slidein_detail .raku2_number_stepper_down::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; display: block; background-color: rgb(211, 212, 213); transition: background-color 250ms linear 0s; } .raku2_cart_slidein .raku2_slidein_detail .raku2_number_stteper_quamtity { width: 100%; min-width: 20px; text-align: center; user-select: none; font-weight: 700; } .raku2_cart_slidein .raku2_slidein_detail .raku2_number_stepper_up { position: relative; display: block; appearance: none; border: none; text-align: center; padding: 0px; margin: 0px; text-indent: -9999em; width: 24px; height: 24px; min-width: 24px; background-color: rgb(255, 255, 255); outline: none; /* align-self: flex-end; */ } .raku2_cart_slidein .raku2_slidein_detail .raku2_number_stepper_up::before { height: 2px; width: 10px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; display: block; background-color: rgb(211, 212, 213); transition: background-color 250ms linear 0s; } .raku2_cart_slidein .raku2_slidein_detail .raku2_number_stepper_up::after { height: 10px; width: 2px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; display: block; background-color: rgb(211, 212, 213); transition: background-color 250ms linear 0s; } .raku2_cart_slidein .raku2_slidein_detail .raku2_number_stepper_down:hover, .raku2_cart_slidein .raku2_slidein_detail .raku2_number_stepper_up:hover { cursor: pointer; } .raku2_cart_slidein .raku2_slidein_detail .raku2_number_stepper_down:hover::before, .raku2_cart_slidein .raku2_slidein_detail .raku2_number_stepper_down:hover::after, .raku2_cart_slidein .raku2_slidein_detail .raku2_number_stepper_up:hover::before, .raku2_cart_slidein .raku2_slidein_detail .raku2_number_stepper_up:hover::after { background-color: #333; } .raku2_cart_slidein .raku2_slidein_detail_delete { cursor: pointer; } .raku2_cart_slidein .raku2_slidein_detail .raku2_slidein_detail_price { font-size: 1.6em; font-weight: 700; } .raku2_cart_slidein .raku2_slidein_detail .raku2_slidein_detail_quantity span { font-size: 1.5em; } .raku2_cart_slidein .raku2_slidein_price { display: grid; grid-template-columns: 1fr 1fr; } .raku2_cart_slidein .raku2_slidein_footer { font-size: 2.0em; width: 100%; height: 100%; } .raku2_cart_slidein .raku2_slidein_btn, .raku2_cart_slidein .raku2_slidein_price { margin-top: 1.5em; } .raku2_cart_slidein .raku2_slidein_btn_buy { color: #FFF; display: flex; border-radius: 5px; text-decoration: none; letter-spacing: 2px; text-align: center; background-color: #F95D6C; align-items: center; justify-content: center; } .raku2_cart_slidein .raku2_slidein_btn_buy a { width: 100%; height: 100%; padding: 0.5em 0; } .raku2_cart_slidein .raku2_slidein_btn_buy:hover { color: #aaaaaa; opacity: 0.7; } .raku2_cart_slidein .raku2_slidein_total, .raku2_cart_slidein .raku2_slidein_matome, .raku2_cart_slidein .raku2_slidein_delivfee { align-self: center; justify-self: end; } .raku2_cart_slidein .raku2_slidein_empty { text-align: center; margin-top: 1.5em; font-size: 2em; } .raku2_cart_slidein .raku2_slidein_close span[class^="material-symbols"], .raku2_cart_slidein .raku2_slidein_cart span[class^="material-symbols"] { font-size: 35px!important; } /* 検索虫眼鏡 */ #gloval_navi ul li div.raku2_search_glass { padding: 10px 41px; } .raku2_search_glass { cursor: pointer; } /* 検索ボックス */ .raku2_search_area { position: fixed; display: none; min-height: 75px; width: 100%; z-index: 1001; background-color: #fff; } .raku2_search_area form { position: relative; display: flex; justify-content: center; margin-top: 1%; } .raku2_search_area button { outline: none; width: 3%; height: 48px; background: #333; border: none; color: #fff; -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer; } .raku2_search_box button { outline: none; width: 40px; height: 30px; background: #333; border: none; color: #fff; -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer; } .raku2_search_box span { font-size: 18px; } .raku2_search_area input { height: 37px; padding: 10px 0 0 6px; border-right: none; } .raku2_search_box input { height: 28px; padding: 0; padding-left: 3px; border-right: none; } .raku2_search_area input:focus, .raku2_search_box input:focus { outline: none; } .raku2_search_box { display: flex; } .raku2_search_area .raku2_cross { display: flex; justify-content: center; align-items: center; padding: 5px 0 5px 15px; cursor: pointer; } /******************************************************************************* /* プレースホルダーフローティング *******************************************************************************/ .raku2_search_area_box { position:relative; overflow: hidden; } .raku2_search_area_box .raku2_search_box_label { position:absolute; top: 12px; left: 7px; font-size: 1.2em; transform-origin: 0 0; transition: all 0.2s ease; } .raku2_search_area_box .raku2_search_box_border { position: absolute; bottom: 0; left: 0; height: 2px; width: 100%; transform: scaleX(0); transform-origin: 0 0; transition: all 0.15s ease; } .raku2_search_area_box input { appearance: none; -webkit-appearance: none; border: 0; font-weight: 500; border-bottom: 1px solid #c8ccd4; background: none; color: #223254; transition: all 0.15s ease; } .raku2_search_area_box input:hover { background: rgba(0, 0, 0, 0.04); } .raku2_search_area_box input:not(:placeholder-shown) + .raku2_search_box_label { transform: translate3d(0, -8px, 0) scale(0.75); } .raku2_search_area_box input:focus { background: rgba(0, 0, 0, 0.05); outline: none; } .raku2_search_area_box input:focus + .raku2_search_box_label { color: #0077FF; transform: translate3d(0, -8px, 0) scale(0.75); } .raku2_search_area_box input:focus + span + .raku2_search_box_border { transform: scaleX(1); } /******************************************************************************* /* バリデーション *******************************************************************************/ .raku2_validate_target { background-color: #ffffe7 !important; } .raku2_validate_error { background-color: #F0DFDF !important; } .raku2_validate_focus { background-color: #e7f7f6 !important; outline: none; border: 2px solid #1cbaa5 !important; } [class^="raku2_validate_bubble"] { color: white; position: absolute; background-color: #c61616; padding: 5px 10px; border-radius: 8px; box-shadow: 0px 2px 3px #888; opacity: 0.9; font-size: 12px; font-weight: bold; letter-spacing: 0.2em; white-space: nowrap; z-index: 9999; } [class^="raku2_validate_bubble"]::before { position: absolute; bottom: -6px; width: 14px; height: 7px; background-color: #c61616; clip-path: polygon(0 0, 100% 0, 50% 100%); content: ''; } .raku2_validate_box { position: fixed; top: 300px; right: 60px; min-width: 215px; background-color: #cd0a0a; border-radius: 20px; } .raku2_validate_box div { /* font-size: 1.5em; */ padding: 10px 20px; margin: 2px 3px; text-align: center; border-radius: 20px 20px 0 0; } .raku2_validate_box .raku2_validate_message { background-color: white; } .raku2_validate_box .raku2_validate_count { background-color: #c61616; color: white; border-radius: 20px; } button.raku2_incomplete { line-height: 1.6em; border-radius: 4px; padding: 10px 20px; margin: 10px; font-size: 133%; min-width: 220px; background: #c61616; color: white; border: none; display: inline-flex; align-items: center; text-align: center; justify-content: center; } button.raku2_incomplete span { margin-right: 5px; font-size: 133%; } table#entry_input span[class^="raku2_valid_circle"], table#entry_input span[class^="raku2_valid_circle"] span.material-symbols-sharp, table.delivname span[class^="raku2_valid_circle"], table.delivname span[class^="raku2_valid_circle"] span.material-symbols-sharp { margin: 0; } span[class^="raku2_valid_circle"] { position: absolute; background-color: #4eb94e; border-radius: 50%; color: #fff; } span[class^="raku2_valid_circle"] span.material-symbols-sharp { font-size: 15px; display: block; } span[class^="raku2_valid_circle"] span.raku2_valid_check { content: ''; width: 7px; height: 3px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg); } /* EFO(一部メディアクエリ) ----------------------------------------------- */ @media (max-width:1240px) { .raku2_validate_box { position: fixed; top: auto; bottom: 0; right: auto; min-width: auto; width: 100%; border-radius: inherit; } .raku2_validate_box div { padding: 10px 20px; margin: 2px 3px; text-align: center; } .raku2_validate_box .raku2_validate_message { border-radius: inherit; } .raku2_validate_box .raku2_validate_count { background-color: #c61616; color: white; border-radius: 20px; } } /******************************************************************************* /* 新オーダーシート *******************************************************************************/ .raku2_new_order_list_sticky { position: fixed; bottom: 0; left: 0; width: 100%; box-sizing: border-box; padding: 15px; margin: 0; background: #ff931f; } .raku2_new_order_list_sticky .raku2_continue_to_checkout { display: flex; justify-content: center; align-items: center; width: 11%; margin: 0 auto; padding: 10px 5px; border: none; border-radius: 20px; font-size: 1.5em; background-color: #A1887F; color: #fff; } .raku2_new_order_list_sticky button:hover { opacity: 0.7; cursor: pointer; } .raku2_new_order_list_upper { margin-bottom: 20px; } .raku2_new_order_list_lower { margin-top: 20px; } .raku2_new_order_list_upper .raku2_checkall_add, .raku2_new_order_list_lower .raku2_checkall_add { display: flex; justify-content: center; align-items: center; padding: 5px 15px; border: none; border-radius: 4px; background-color: #F95D6C; color: #fff; } .raku2_new_order_list_upper .raku2_checkall_add:hover, .raku2_new_order_list_lower .raku2_checkall_add:hover { opacity: 0.7; cursor: pointer; } .raku2_new_order_list .product_list_header, .raku2_new_order_list .product_list_footer { display: grid; grid-template-columns: 20fr 20fr 12fr 6fr 1fr 1fr; align-items: center; margin: 20px 0; gap: 0 10px; } .raku2_new_order_list .raku2_pagenumber_area, .raku2_new_order_list .raku2_dispnumber_area, .raku2_new_order_list .material-symbols-sharp { justify-self: end; } .raku2_new_order_list .raku2_navi { justify-self: center; } .raku2_new_order_list .material-symbols-sharp { justify-self: center; cursor: pointer; } /* リストレイアウト */ .raku2_new_layout_orderlist .raku2_product_image img { max-width: 60px; } .raku2_new_layout_orderlist input[type=checkbox], .raku2_new_layout_ordergrid input[type=checkbox] { inline-size: 1.5rem; block-size: 1.5rem; } .raku2_new_layout_orderlist input.raku2_quantity_text { padding: 5px; border-radius: 6px; width: 40%; } .raku2_new_layout_ordergrid input.raku2_quantity_text { padding: 5px; border-radius: 6px; width: 40%; } .raku2_new_layout_ordergrid input.raku2_quantity_text { width: 85%; } .raku2_new_layout_orderlist select.raku2_quantity_select { padding: 6px 0 6px 20%; text-align: right; border-radius: 6px; } .raku2_new_layout_ordergrid select.raku2_quantity_select { padding: 6px 0 6px 65%; text-align: right; border-radius: 6px; } .raku2_new_layout_orderlist { display: grid; grid-template-areas: "chk code img name price stock quan add " "chk code img name price stock quan listadd" ; grid-template-columns: 1fr 6fr 5fr 15fr 4fr 6fr 4fr 4fr; grid-template-rows: 1fr 1fr; gap: 5px 10px; position: relative; } .raku2_new_layout_ordergrid { display: inline-grid; grid-template-areas: "img img img img " "img img img img " "name name name name " "price price price price" "..... quan add ....." "..... listadd listadd ....." ; grid-template-columns: minmax(10px, 1fr) minmax(10px, 6fr) minmax(10px, 6fr) minmax(10px, 1fr); gap: 5px 10px; margin: 10px; padding: 10px 0; position: relative; } .raku2_new_layout_ordergrid .raku2_product_name, .raku2_new_layout_ordergrid .raku2_product_name a { display: inline-grid; grid-template-areas: "inner_name" "inner_status" "inner_comment" ; } .raku2_new_layout_ordergrid .raku2_product_name .raku2_status_all { grid-area: inner_status; } .raku2_new_layout_ordergrid .raku2_product_name .raku2_main_name { grid-area: inner_name; } .raku2_new_layout_ordergrid .raku2_product_name .raku2_main_list_comment { grid-area: inner_comment; } .raku2_new_layout_order_grid .listrightbloc { display: flex; flex-wrap: wrap; align-items: flex-start; } .raku2_new_layout_orderlist .raku2_check { grid-area: chk; align-self: center; justify-self: center; } .raku2_new_layout_orderlist .raku2_product_code { grid-area: code; align-self: center; } .raku2_new_layout_ordergrid .raku2_product_code { display: none; } .raku2_new_layout_orderlist .raku2_product_image, .raku2_new_layout_ordergrid .raku2_product_image { grid-area: img; align-self: center; justify-self: center; } .raku2_new_layout_orderlist .raku2_product_name, .raku2_new_layout_ordergrid .raku2_product_name { grid-area: name; align-self: center; } .raku2_new_layout_ordergrid .raku2_product_name { font-size: 1.3em; /* justify-self: center; */ } .raku2_new_layout_orderlist .raku2_quantity { grid-area: quan; align-self: center; text-align: center; } .raku2_new_layout_ordergrid .raku2_quantity { grid-area: quan; align-self: center; } .raku2_new_layout_ordergrid .raku2_unit { text-align: right; } .raku2_new_layout_orderlist .raku2_price_area, .raku2_new_layout_ordergrid .raku2_price_area { grid-area: price; align-self: center; justify-self: end; text-align: right; } .raku2_new_layout_ordergrid .raku2_price_area { justify-self: start; } .raku2_new_layout_ordergrid .raku2_price_area .raku2_price, .raku2_new_layout_ordergrid .raku2_price_area .raku2_price_unit { font-size: 1.3em; font-weight: bold; } .raku2_new_layout_orderlist .raku2_price_area .raku2_price_tax_before, .raku2_new_layout_orderlist .raku2_price_area .raku2_price_tax, .raku2_new_layout_orderlist .raku2_price_area .raku2_price_tax_unit, .raku2_new_layout_orderlist .raku2_price_area .raku2_price_tax_after, .raku2_new_layout_orderlist .raku2_price_area .raku2_differ_price, .raku2_new_layout_ordergrid .raku2_price_area .raku2_price_tax_before, .raku2_new_layout_ordergrid .raku2_price_area .raku2_price_tax, .raku2_new_layout_ordergrid .raku2_price_area .raku2_price_tax_unit, .raku2_new_layout_ordergrid .raku2_price_area .raku2_price_tax_after, .raku2_new_layout_ordergrid .raku2_price_area .raku2_differ_price { font-size: 0.6rem; } .raku2_new_layout_orderlist .raku2_price_area .raku2_price_tax_before::before { content: "\A"; white-space: pre; } .raku2_new_layout_orderlist .raku2_stock_quantity_area, .raku2_new_layout_ordergrid .raku2_stock_quantity_area { grid-area: stock; align-self: center; justify-self: end; } .raku2_new_layout_ordergrid .raku2_stock_quantity_area { align-self: end; } .raku2_new_layout_ordergrid .raku2_check, .raku2_new_layout_orderlist .raku2_stock_quantity_instock, .raku2_new_layout_ordergrid .raku2_stock_quantity_instock, .raku2_new_layout_orderlist .raku2_unit2, .raku2_new_layout_ordergrid .raku2_unit, .raku2_new_layout_ordergrid .raku2_unit2, .raku2_new_layout_orderlist .raku2_order_list_fav_add, .raku2_new_layout_ordergrid .raku2_order_list_fav_add, .raku2_new_layout_orderlist .raku2_purchase_limit_message:empty, .raku2_new_layout_ordergrid .raku2_purchase_limit_message:empty { display: none; } .raku2_new_layout_orderlist .raku2_order_list_add, .raku2_new_layout_orderlist [class^="raku2_order_list_stock_notify_undone"], .raku2_new_layout_orderlist [class^="raku2_order_list_stock_notify_done"], .raku2_new_layout_orderlist [class^="raku2_order_list_stock_notify_loading"], .raku2_new_layout_ordergrid .raku2_order_list_add, .raku2_new_layout_ordergrid [class^="raku2_order_list_stock_notify_undone"], .raku2_new_layout_ordergrid [class^="raku2_order_list_stock_notify_done"], .raku2_new_layout_ordergrid [class^="raku2_order_list_stock_notify_loading"] { grid-area: add; align-self: end; padding: 5px; /* リスト登録のborder分上下padding上書き */ } .raku2_new_layout_ordergrid .raku2_order_list_add, .raku2_new_layout_ordergrid [class^="raku2_order_list_stock_notify_undone"], .raku2_new_layout_ordergrid [class^="raku2_order_list_stock_notify_done"], .raku2_new_layout_ordergrid [class^="raku2_order_list_stock_notify_loading"] { width: 100%; margin-left: 0; } .raku2_new_layout_orderlist .raku2_not_purchase_message, .raku2_new_layout_orderlist .raku2_sale_time_area, .raku2_new_layout_ordergrid .raku2_not_purchase_message, .raku2_new_layout_ordergrid .raku2_sale_time_area { grid-area: add; align-self: center; justify-self: center; font-weight: bold; } .raku2_new_layout_orderlist [class^="raku2_order_list_fav_undone"], .raku2_new_layout_orderlist [class^="raku2_order_list_fav_done"], .raku2_new_layout_ordergrid [class^="raku2_order_list_fav_undone"], .raku2_new_layout_ordergrid [class^="raku2_order_list_fav_done"] { grid-area: listadd; align-self: start; justify-self: center; } .raku2_new_layout_ordergrid [class^="raku2_order_list_fav_undone"], .raku2_new_layout_ordergrid [class^="raku2_order_list_fav_done"] { width: 100%; } /* 数量がない場合、文言・ボタンを中央に寄せる */ .raku2_new_layout_ordergrid .raku2_not_purchase_message, .raku2_new_layout_ordergrid .raku2_sale_time_area, .raku2_new_layout_ordergrid [class^="raku2_order_list_stock_notify_undone"], .raku2_new_layout_ordergrid [class^="raku2_order_list_stock_notify_done"], .raku2_new_layout_ordergrid [class^="raku2_order_list_stock_notify_loading"] { grid-column: 2 / span 2; } .raku2_new_layout_ordergrid .raku2_quantity.raku2_partially_hidden { display: none; } .raku2_new_layout_orderlist button, .raku2_new_layout_ordergrid button { width: 90%; margin: 0 auto; border: none; border-radius: 4px; min-height: 26px; } .raku2_new_layout_orderlist button span, .raku2_new_layout_ordergrid button span { vertical-align: middle; } .raku2_new_layout_orderlist .raku2_order_list_add, .raku2_new_layout_orderlist [class^="raku2_order_list_stock_notify_undone"], .raku2_new_layout_orderlist [class^="raku2_order_list_stock_notify_done"], .raku2_new_layout_orderlist [class^="raku2_order_list_stock_notify_loading"], .raku2_new_layout_ordergrid .raku2_order_list_add, .raku2_new_layout_ordergrid [class^="raku2_order_list_stock_notify_undone"], .raku2_new_layout_ordergrid [class^="raku2_order_list_stock_notify_done"], .raku2_new_layout_ordergrid [class^="raku2_order_list_stock_notify_loading"] { background-color: #F95D6C; } .raku2_new_layout_orderlist [class^="raku2_order_list_stock_notify_undone"], .raku2_new_layout_orderlist [class^="raku2_order_list_stock_notify_done"] { font-size: 0.6rem; } .raku2_new_layout_orderlist [class^="raku2_order_list_fav_undone"], .raku2_new_layout_orderlist [class^="raku2_order_list_fav_done"] { background-color: #eee; border: 2px solid #ccc; } .raku2_new_layout_ordergrid [class^="raku2_order_list_fav_undone"], .raku2_new_layout_ordergrid [class^="raku2_order_list_fav_done"] { background-color: #fefefe; border: 2px solid #ccc; } .raku2_new_layout_orderlist [class^="raku2_order_list_fav_done"], .raku2_new_layout_orderlist [class^="raku2_order_list_stock_notify_done"], .raku2_new_layout_ordergrid [class^="raku2_order_list_fav_done"], .raku2_new_layout_ordergrid [class^="raku2_order_list_stock_notify_done"] { opacity: 0.4; } .raku2_new_layout_orderlist .raku2_order_list_fav_not_del, .raku2_new_layout_ordergrid .raku2_order_list_fav_not_del { pointer-events: none; } .raku2_new_layout_orderlist [class^="raku2_order_list_fav_done"] span.material-symbols-sharp, .raku2_new_layout_orderlist [class^="raku2_order_list_stock_notify_done"] span.material-symbols-sharp, .raku2_new_layout_ordergrid [class^="raku2_order_list_fav_done"] span.material-symbols-sharp, .raku2_new_layout_ordergrid [class^="raku2_order_list_stock_notify_done"] span.material-symbols-sharp { font-size: 16px; margin-left: -5px; margin-right: 5px; } .raku2_new_layout_orderlist button:hover, .raku2_new_layout_ordergrid button:hover { opacity: 0.7; cursor: pointer; } .raku2_new_layout_orderlist_header, .raku2_new_layout_orderlist:nth-child(even) { background-color: #f0eae8; } .raku2_new_layout_orderlist { padding: 10px 0; } .raku2_new_layout_orderlist_header { border-top: dashed 1px #ccc; border-bottom: dashed 1px #ccc; } .raku2_new_layout_orderlist .raku2_status_text, .raku2_new_layout_ordergrid .raku2_status_text { padding: 0 3px; font-size: 0.8rem; margin-bottom: 5px; } .raku2_new_layout_orderlist_header .raku2_check, .raku2_new_layout_orderlist_header .raku2_product_image, .raku2_new_layout_orderlist_header .raku2_product_name, .raku2_new_layout_orderlist_header .raku2_quantity, .raku2_new_layout_orderlist_header .raku2_price_area, .raku2_new_layout_orderlist_header .raku2_stock_quantity_area { justify-self: center; } .raku2_new_layout_orderlist_header .raku2_product_code { justify-self: start; } /* サムネイル方式 */ .raku2_new_layout_ordergrid.raku2_new_layout_orderlist_header, .raku2_new_layout_ordergrid .raku2_stock_quantity_area, .raku2_new_layout_ordergrid .raku2_product_name .raku2_main_list_comment { display: none; } .raku2_new_layout_ordergrid { width: 23%; } .raku2_new_layout_ordergrid .raku2_product_image img { width: 100%; } /* チェックボックスがチェックされたときのスタイル */ .raku2_new_layout_ordergrid.raku2_shadowbox { box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); } /* 追加吹き出し */ .raku2_balloon { position: absolute; animation: fade-in 0.5s ease-in-out; } .raku2_balloon .balloon { display: flex; justify-content: center; padding: 5px 18px; border-radius: 5px; background-color: #F95D6C; color: #ffffff; } .raku2_balloon .balloon::before { position: absolute; bottom: -6px; width: 15px; height: 8px; background-color: #F95D6C; clip-path: polygon(0 0, 100% 0, 50% 100%); content: ''; } /* オーダーシートヘッダー、フッター部 */ .raku2_new_layout_order_grid .raku2_new_order_list_upper, .raku2_new_layout_order_grid .raku2_new_order_list_lower, .raku2_new_order_list .product_list_header_hidden, .raku2_new_order_list .raku2_page_info, .raku2_new_order_list .raku2_filter_stock, .raku2_new_order_list .raku2_filter_favorite, #raku2_slidein_search_form { display: none; } @keyframes slide-in { 0% { transform: translate(0, 100%); } 100% { transform: translate(0, 0); } } /* レフトナビ絞り込み */ #raku2_narrowing_area input[type=checkbox] { inline-size: 1.5rem; block-size: 1.5rem; margin: 0 5px 0 0; } #raku2_narrowing_area .raku2_stock, #raku2_narrowing_area .raku2_favorite, #raku2_narrowing_area .raku2_status { display: flex; align-items: center; } #raku2_narrowing_area .raku2_stock, #raku2_narrowing_area .raku2_favorite, #raku2_narrowing_area .raku2_status { margin-bottom: 10px; } /* A => 2024.01.24 プラン改定仕様変更対応 */ .plg_Raku2_LC_Page_Products_List #container { max-width: 1540px; } .raku2_theme01 #header_wrap { border-bottom: none; } .LC_Page_Index #main_column.colnum2, .plg_Raku2_LC_Page_Products_List #main_column.colnum2, .plg_Raku2_LC_Page_Products_CategoryList, .plg_Raku2_LC_Page_Products_ProductsList #main_column.colnum2, .plg_Raku2_LC_Page_Products_Detail #main_column.colnum2 { margin-right: 1%; padding-right: 0; } /* 「商品カテゴリ」見出しと合わせたい */ #raku2_narrowing_area h2 { background-color: transparent;color: var(--main-color); font-size: 140%; font-weight: 600; text-align: left; padding: 10px; margin: 0; border: none; padding-top: 3px; } #container div#raku2_narrowing_area .block_body { padding: 10px; } .raku2_new_order_list .product_list_header { margin: 0 0 20px; } .raku2_product_list_number { font-size: 140%; } select.raku2_product_list_order,.raku2_new_order_list .raku2_product_order_number { height: 2.4rem !important; padding: 2px 6px; border-radius: 3px; border: solid 2px #dddddd; cursor: pointer; } .raku2_new_order_list_upper .raku2_checkall_add { letter-spacing: 1px; color: var(--main-color); font-weight: bold; } .raku2_new_layout_orderlist { padding: 10px 15px; } div.raku2_new_layout_orderlist_header, div.raku2_new_layout_orderlist:nth-child(even) { background: #f8f8f8; } div.raku2_new_layout_orderlist:nth-child(odd) { background: #fcfcfc; } .raku2_new_layout_orderlist button { width: 100%; } /* A <= 2024.01.24 プラン改定仕様変更対応 */