@charset "utf-8"; /****************************************************************************** common ******************************************************************************/ html, body { font-family:var(--font-text); font-size:14px; color:var(--pic-color-grey-100); line-height:24px; min-width: 1200px;} /******************************* 中間元件 *******************************/ .flexbox{ position: fixed; top: 0; z-index: 99; box-shadow: 0 0px 1.3px rgba(0, 0, 0, 0.27), 0 0px 10px rgba(0, 0, 0, 0.135);} .flexbox .coldshop_hide{ display: block!important;} /* 中間元件名稱 */ .C_Box{margin:0 10px; margin-bottom:10px; } .C_item_name{ width:100%; height:42px; border-bottom:#d7d7d7 3px solid; background:url(icon_bag.png) left center no-repeat; border-bottom:#d7d7d7 3px solid;} .C_item_name h3{ font-size:15px; line-height:45px; color:var(--pic-color-grey-100); font-weight:bold; margin-left:40px;} /* 中間內文內距 */ .C_Box .C_padding{padding:10px 15px;} /* 中間標題 */ .C_title { font-size:14px; line-height:26px; color:var(--pic-color-grey-100); text-decoration: none; } /* 中間副標題 */ .C_subtitle { font-size:14px; line-height:26px; color:var(--pic-color-grey-100); text-decoration: none;} /* 中間內文 */ .C_article { font-size:13px; line-height:24px; color:var(--pic-color-grey-100);} /* 中間標題(連結) */ a.C_title_a:link { font-size:13px; line-height:26px;color:var(--pic-color-grey-100); text-decoration: none;} a.C_title_a:visited { font-size:13px; line-height:26px;color:var(--pic-color-grey-100); text-decoration: none;} a.C_title_a:hover { font-size:13px; line-height:26px;color:#444; text-decoration: underline;} a.C_title_a:active { font-size:13px; line-height:26px;color:var(--pic-color-grey-100); text-decoration: underline;} /******************************* 左邊元件 *******************************/ /* 左邊元件名稱 */ .L_Box{ width:200px; margin-bottom:10px;} h3.L_item_name{ width:160px; height:42px; border-bottom:#d7d7d7 3px solid; background:url(icon_bag.png) left center no-repeat; border-bottom:#d7d7d7 3px solid; font-size:15px; line-height:45px; color:var(--pic-color-grey-100); font-weight:bold; padding-left:40px; } /* 左邊內文內距 */ .L_Box .L_padding{ padding:0;} /* 左邊標題 */ .L_title { font-size:14px; line-height:26px; color:var(--pic-color-grey-100);} /* 左邊副標題 */ .L_subtitle { font-size:14px; line-height:26px; color:var(--pic-color-grey-100);} .L_bottom{ height:17px; background:#fff url(left_bg03.gif) no-repeat top left;} /* 左邊內文 */ .L_article { font-size:13px; line-height:24px;; color:var(--pic-color-grey-100);} /* 左邊標題(連結) */ a.L_title_a:link { font-size:13px; line-height:24px; color:var(--pic-color-grey-100); text-decoration: none;} a.L_title_a:visited { font-size:13px; line-height:24px; color:var(--pic-color-grey-100); text-decoration: none;} a.L_title_a:hover { font-size:13px; line-height:24px; color:var(--pic-color-grey-100); text-decoration: underline;} a.L_title_a:active { font-size:13px; line-height:24px; color:var(--pic-color-grey-100); text-decoration: underline;} /******************************* 右邊元件 *******************************/ /* 右邊元件名稱 */ .R_Box{ width:200px; margin-bottom:10px;} h3.R_item_name{ width:160px; height:42px; border-bottom:#d7d7d7 3px solid; background:url(icon_bag.png) left center no-repeat; border-bottom:#d7d7d7 3px solid; font-size:15px; line-height:45px; color:var(--pic-color-grey-100); font-weight:bold; padding-left:40px; } /* 右邊標題 */ .R_title { font-size:14px; line-height:26px; color:var(--pic-color-grey-100); text-decoration: none;} /* 右邊副標題 */ .R_subtitle { font-size:14px; line-height:26px; color:var(--pic-color-grey-100); text-decoration: none;} /* 右邊內文 */ .R_article { font-size:13px; line-height:24px; color:var(--pic-color-grey-100);} /* 右邊標題(連結) */ a.R_title_a:link { font-size:13px; line-height:24px; color:var(--pic-color-grey-100); text-decoration: none;} a.R_title_a:visited { font-size:13px; line-height:24px; color:var(--pic-color-grey-100); text-decoration: none;} a.R_title_a:hover { font-size:13px; line-height:24px; color:var(--pic-color-grey-100); text-decoration: underline;} a.R_title_a:active { font-size:13px; line-height:24px; color:var(--pic-color-grey-100); text-decoration: underline;} /******************************* 表格 *******************************/ /* 表格抬頭 */.table_title {background-color: #ededed;font-size: 13px;color:#808080;font-weight: bold;} /* 表格外框線顏色 */.table_exo_bordercolor {background-color: #d4d4d4;} /* 表格內框線顏色 */.table_bordercolor {background-color: #d4d4d4;} /* 表格欄位 */.table_column {background-color: #fff;font-size: 15px;line-height:30px;color:var(--pic-color-grey-100);padding:7px 5px;} /* 表格欄位內容 */.table_column_desc {background-color: #FFFFFF;font-size: 15px;line-height:25px;color:var(--pic-color-grey-100);} /* 表格欄位內容 onMouseOver */.table_column_desc_over {background-color: #ededed;font-size: 12px;color: var(--pic-color-grey-100)333;} /* 數字 */.number {font-size: 12px;color: #e94741;font-weight: bold;} /******************************* 表單 *******************************/ .FormTxt, .FormTxt100 {font-size: 11px;color:#999;background-color: #ffffff;border:solid #dadada 1px;padding:2px;} .FormTxt100, .FormTxtMark100 {width: 90%;} .FormTxtMark, .FormTxtMark100 {font-size: 12px;background-color: #fffbdd;} /* 表單註解 */.form_gloss {color: #e94741;font-size: 12px;} /* 表單必填欄位(*)樣式 */.form_star {color:#e94741;font-size:15px;font-weight:normal;} /******************************* 商品 *******************************/ /* 商品名稱 */ .prod_name {font-size:13px; line-height:24px; color:var(--pic-color-grey-100);} /* 商品名稱 */ a.prod_name:link { font-size:13px; line-height:24px; color:var(--pic-color-grey-100); text-decoration: none; } a.prod_name:visited { font-size:13px; line-height:24px; color:var(--pic-color-grey-100); text-decoration: none; } a.prod_name:hover { font-size:13px; line-height:24px; color:var(--pic-color-grey-100); text-decoration: underline; } a.prod_name:active { font-size:13px; line-height:24px; color:var(--pic-color-grey-100); text-decoration: underline; } /* 商品售價 */ .prod_price { font-size:20px; line-height:24px; color:#ff427f; font-weight:bold;} /******************************* 延伸選單 *******************************/ /* 延伸選單 */.menu_extended {color: var(--pic-color-grey-100);background-color: #ffffff;font-size: 12px;padding:8px 2px;} /* 延伸選單 onMouseOver */.menu_extended_over {color: #6d3049;background-color: #f1b6cf;font-size: 12px;padding:8px 2px;} /* 延伸選單 邊線 */.menu_extended_border {background-color: #cccccc;} /******************************* 表頭選單 *******************************/ a.top_menu:link { font-size: 13px;color: #eaeaea; text-decoration:none; } a.top_menu:visited { font-size: 13px;color: #eaeaea; text-decoration:none; } a.top_menu:hover { font-size: 13px;color: #abb43d; text-decoration:none;} a.top_menu:active { font-size: 13px;color: #abb43d;text-decoration:none;} /******************************* 語系 *******************************/ a.lang_menu:link { font-size: 12px;color: var(--pic-color-grey-100); text-decoration: none; } a.lang_menu:visited { font-size: 12px;color: var(--pic-color-grey-100); text-decoration: none; } a.lang_menu:hover { font-size: 12px;color: var(--pic-color-grey-100); text-decoration: underline; } a.lang_menu:active { font-size: 12px;color: var(--pic-color-grey-100); text-decoration: underline; } .lang_menu {font-size: 12px;color:var(--pic-color-grey-100);} /******************************* 通用 *******************************/ /* 成功訊息 */ .hd_alert {color: #e94741;font-size: 12px;font-weight: bold;} /* 錯誤訊息 */ .err_alert {color: #e94741;font-size: 12px;font-weight: bold;} /* 一般鏈結 */ a:link { font-size:13px; line-height:24px; color:var(--pic-color-grey-100); text-decoration: none;} a:visited { font-size:13px; line-height:24px; color:var(--pic-color-grey-100); text-decoration: none;} a:hover { font-size:13px; line-height:24px; color:#444; text-decoration: none;} a:active { font-size:13px; line-height:24px; color:var(--pic-color-grey-100); text-decoration: none;} /* 網站主內容架構 */ .FOR_web_W{ width:990px; margin-top:20px;} .FOR_TOP{ width:100%; height:auto; background: #fff; position: relative; z-index: 99;} .FOR_MAIN{ margin:0 auto; width:1200px; padding: 10px 0;} #index .FOR_MAIN{ width: 100%; padding-top: 0;} .main_content_left{ width:260px; float:left; } .main_content_l_center{ float: left; width: calc(100% - 260px); padding-left: 15px;} .main_content_center{ margin-left:220px; margin-right:220px; padding:0 10px;} .main_content_no_center{ width:100%;} /* 網站名稱簡介 */ .STORE_NAME{ font-size:15px; line-height:26px; color:var(--pic-color-grey-100); font-weight:bold;} .STORE_EXP{ font-size:13px; line-height:24px; color:var(--pic-color-grey-100);} /* 麵包屑 */ .m_breadCrumbs{border-bottom: 0; margin-bottom: 0;} /* 元件間隔 */ .table_margin{ margin-bottom:5px;} /* 元件外框 */ .L_border{ border:solid 2px #e1e1e1; padding:1px;} /*=================== 版頭 (PIC商店街主網站) ===================*/ .iopen_header{ width:100%; height:auto; background:#FFF; color:var(--pic-neutral-100);} .iopen_header a{ color:var(--pic-neutral-100);} .container{max-width:1200px;width:100%;height:100%;margin: 0 auto;position: relative;} /* 展開的AD */ .gh_TopAD01,.gh_TopAD02{ width:1200px; height:605px; position:absolute; top:44px; left:50%; margin-left:-600px; z-index:999; display:none;} .gh_TopAD01 span,.gh_TopAD02 span{ position:absolute; right:4px; top:4px; display:block; width:66px; height:18px; background:url(gh_Top_icon_close.gif) 2px 3px no-repeat #FFF; font-size:12px; line-height:18px; color:#555; padding-left:15px; cursor:pointer;} /* (區塊1)header_top */ .header_top{ width:100%; height:28px; margin: 0 auto;background: var(--pic-neutral-50); position: relative; display: none;} .header_top .container{ display: -ms-box; display: -moz-webkit-flex; display: -webkit-flex; display: -ms-flexbox; display: flex; -ms-flex-align: center; -webkit-align-items: center; align-items: center;} /* header_top - 賣家中心 */ .header_top .open_seller a{ height: 24px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;; display: -ms-box; display: -moz-webkit-flex; display: -webkit-flex; display: -ms-flexbox; display: flex; -ms-flex-align: center; -webkit-align-items: center; align-items: center; -ms-flex-pack: center; -webkit-justify-content: center;-webkit-box-pack: center; -moz-box-pack: center; justify-content: center; -ms-flex-wrap: wrap; -moz-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; text-align: center; padding: 0 8px; background-color:var(--center-primary); display: block; color:#fff; font-size: 14px; line-height: 24px;} /* header_top - Logo標誌 */ .header_top .logo_box{height: auto; display: -ms-box; display:-moz-webkit-flex; display: -webkit-flex; display: -ms-flexbox; display: flex; -ms-flex-align: center; -webkit-align-items: center; align-items: center; display: none;} .header_top .logo_box > a{display: block; max-width:100%; width:100%; height: auto; position: relative;} .header_top .logo_box > a img {max-width: 100%;width:auto;height: 20px;vertical-align: top; margin-top: 2px;} /* header_top - 分館 */ .header_top .branch_library{display: -ms-box; display: -moz-webkit-flex; display: -webkit-flex; display: -ms-flexbox; display: flex;} .header_top .branch_library a{ padding:0 15px;width:auto;height:100%;display: inline-block;line-height: 28px; position: relative;font-size: 14px;} .header_top .branch_library a.myship{ width: 105px; height: 28px;background-image: url(myship_logo.png); background-position: center center; background-size: 90px; background-repeat: no-repeat;} .header_top .branch_library a:first-of-type{padding-left: 0;} .header_top .branch_library.branch_logo a:not(:last-of-type):after{ content:none;} .header_top .branch_library a img{width: 100%; height: auto; position: relative; top: 3px;} .header_top .branch_library.branch_logo{ display: none; } .header_top .branch_library.branch_logo a{ padding: 0 5px;} .header_top .branch_library a:not(:last-of-type):after{content:''; background-color:#acacac; width: 1px; height: 12px; display: block; position:absolute; right: 0; top: 50%; transform: translateY(-50%);} /* header_top - 會員功能 */ .header_top .user_func{ display: -ms-box; display: -moz-webkit-flex; display: -webkit-flex; display: -ms-flexbox; display: flex; height: 100%; position: absolute; right: 0; display: none;} .header_top .user_func > li{ padding: 0 16px 0 28px; font-size: 14px; position: relative; background-repeat: no-repeat; line-height: 28px;} .header_top .user_func > li.cart{ padding-right: 0;} .header_top .user_func > li:not(:last-of-type):after{content:''; background-color:#acacac; width: 1px; height: 12px; display: none; position: absolute; right: 0; top: 50%; transform: translateY(-50%);} .header_top .user_func > li a {display: inline-block; line-height: 28px;} .header_top .user_func > li span{ color:var( --pic-light-red-80);} .header_top .user_func > li.member_center{background-image: url(user.svg); background-position: 5px -6px; background-size: 20px;} .header_top .user_func > li.logout { background-image: url(logout.svg); background-position: 5px -6px; background-size: 20px;} .header_top .user_func > li.login { background-image: url(login.svg); background-position: 5px -6px; background-size: 20px;} .header_top .user_func > li.trace { background-image: url(trace.svg); background-position: 7px -6px; background-size: 20px;} .header_top .user_func > li.noti { background-image: url(noti.svg); background-position: 7px -6px; background-size: 20px;} .header_top .user_func > li.cart { background-image: url(cart.svg); background-position: 5px -6px; background-size: 20px; display: -ms-box; display: -moz-webkit-flex; display: -webkit-flex; display: -ms-flexbox; display: flex; -ms-flex-align: center; -webkit-align-items: center; align-items: center;} .header_top .user_func > li:hover{ background-position-y: -46px;} .header_top .user_func > li.header_cart{cursor: pointer;} .header_top .user_func > li.header_cart{ position:relative;height: 100%; line-height: 28px; } .header_top .user_func > li.header_cart > a.go_to_cart{ padding:0 10px;background-color:var( --pic-light-red-80);color:#fff; font-size: 14px; line-height: 20px; display: inline-block; height: 20px; border-radius: 10px; margin-left: 5px;} /* header_top - 購物車展開 */ .header_cart_box{ position:absolute; right:12px; top:28px; width:350px; height:auto; z-index:3; display:none; box-sizing: content-box; background: #fff; border:2px solid var(--pic-green);} .header_cart_box:after{content: ''; width: 0; height: 0; border-style: solid; border-width: 0 10px 10px 10px; border-color: transparent transparent var(--pic-green) transparent; display: block; position: absolute; top: -10px; right:66px;} .header_cart_box ul:hover{ background:#f5f5f5;} .header_cart_box ul li{ float:left; display:block; font-size:13px; line-height:40px; color:var(--pic-color-grey-100);} .header_cart_box ul{ border-bottom:1px solid #bbb; display: flex; align-items: center;} .header_cart_box ul li.cartOpen_name{ width:128px; padding:0 5px;} .header_cart_box ul li.cartOpen_name a{ display:block; width:100%; height:40px; font-size:13px; line-height:40px; color:var(--pic-color-grey-100); text-align:left; overflow:hidden;} .header_cart_box ul li.cartOpen_num{ width:30px; text-align:center;} .header_cart_box ul li.cartOpen_price{ width:90px; padding:0 5px; text-align:right;} .header_cart_box ul li.buy_cart { padding:0 5px; } .header_cart_box ul li.buy_cart a{ display: block; width: 45px; background:var(--pic-orange); font-size: 13px; color: #fff; text-align: center;} .header_cart_box ul li.buy_cart a:hover{ background: var(--pic-light-orange);} .header_cart_box ul li.delete_cart { padding:0 5px; } .header_cart_box ul li.delete_cart a{ display: block; width: 45px; background: var(--pic-color-grey-100); color: #fff; text-align: center;} .header_cart_box .cartOpen_btn{margin-right: 3px;} .header_cart_box .cartOpen_btn a{display: inline-block; width: 70px; height: 30px; line-height: 30px; font-size: 15px; color: #fff; text-align: center;} .header_cart_box .cartOpen_btn.cartOpen_normal a{background-color: #ef901a;} .header_cart_box .cartOpen_btn.cartOpen_fridge a{background-color: #02B347;} .header_cart_box .cartOpen_btn.cartOpen_freeze a{background-color: #0cb4f0;} .header_cart_box .cartOpen_btn.cartOpen_delete a{background-color: var(--pic-color-grey-100); width: 45px; font-size: 13px;} .gh_Top_viewOpen ul li{ float:left; margin:0 5px;} .gh_Top_viewOpen ul li a{ display:block; width:60px; height:60px; border:1px solid #a6a6a6; margin-top:0; transition:0.5s;} .gh_Top_viewOpen ul li a:hover{ margin-top:-3px; border-color:#FFF;} .gh_Top_viewOpen ul li a img{ width:100%; height:auto;} /* header_top - 搜尋欄 / 關鍵字 */ .header_top .search_box { display: none; width: 300px; height: 24px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; border: solid 1px #eaeaea; background-color: #fff; overflow: hidden; position: relative; left:30px;} .header_top .search_box select { vertical-align: top; width: 90px; height: 100%; line-height:17px; padding-left: 10px; border: 0; font-size: 14px; color: var(--pic-color-grey-100); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; appearance:none; background:linear-gradient(45deg, transparent 50%, var(--pic-color-grey-100) 50%),linear-gradient(135deg, var(--pic-color-grey-100) 50%, transparent 50%),transparent; background-position:calc(100% - 6px) calc(1em + -6px),calc(100% - 0px) calc(1em + -6px); background-size:6px 6px,6px 6px; background-repeat: no-repeat;} .header_top .search_box select:focus {outline: none!important;-webkit-box-shadow: 0;box-shadow: 0;} select:-moz-focusring {color: transparent;text-shadow: 0 0 0 #000;} .pretty-select::-ms-expand { display: none; } .header_top .search_box input.search_bar_txt2 { vertical-align:top; width: calc(100% - 150px); height: 100%; border: 0; padding: 3px 0 3px 10px; font-size: 14px; letter-spacing: 0.75px; color: var(--pic-color-grey-100); } .header_top .search_box input.search_bar_submit2 { vertical-align: top; width: 50px; height: 100%; background-image: url(search.svg); background-color: transparent; background-size: 44px; background-repeat: no-repeat; background-position: center -8px; border: 0; cursor: pointer; } .header_top .search_box input.search_bar_submit2:focus{outline: none!important;-webkit-box-shadow: 0;box-shadow: 0;} .header_top .keywoard{ position: absolute; left: 435px; display: flex; width: 400px; overflow: hidden; height: 16px; text-overflow: ellipsis; white-space: nowrap;} .header_top .keywoard span{ display: inline-block; font-size:12px; margin-right: 10px; line-height:16px; background-color: var(--pic-light-red-80); color: #fff; padding: 0 3px; border-radius: 3px;} .header_top .keywoard a { font-size: 12px; line-height: 16px; color: var(--pic-light-red-80); vertical-align: top; margin-right: 10px;} .header_top .open_store a{ position: absolute; right:0; top:2px; width: 78px; height: 24px; border-radius: 8px; text-align: center; color: var(--pic-neutral-0); font-size: 12px; font-weight: 500; line-height: 24px; background: url(open.svg) 6px center no-repeat var(--pic-light-red-80); background-size: 13px; padding-left: 24px; padding-right: 6px;} /* (區塊2)header_center */ /* header_center - Logo標誌 */ .header_center .logo_box{height: 100%; display: -ms-box; display:-moz-webkit-flex; display: -webkit-flex; display: -ms-flexbox; display: flex; -ms-flex-align: center; -webkit-align-items: center; align-items: center; width:200px;} .header_center .logo_box > a{display: block; max-width:100%; width:100%;} .header_center .logo_box > a img {width: 100%;height: auto;vertical-align: top;image-rendering: auto;} .header_center .logo_slogn{ padding-left: 15px; border-left:1px solid var(--pic-color-grey-30); color:var(--pic-color-grey-100); font-size: 17px; font-weight: 600; position: absolute;left: 215px;top: 50%;transform: translateY(-50%);} /* header_center - search */ .header_center{ height:85px; background: #f2f2f2;} .header_center .search_box{position: absolute;left: 365px;top: 50%;transform: translateY(-50%);} .header_center .search_box .search_bar { width: 400px; height: 40px; border-radius: 20px; border: solid 1px var(--pic-neutral-grey3); background-color: #fff; overflow: hidden; } .header_center .search_box .search_bar select { vertical-align: top; width: 94px; height: 40px; line-height: 38px; padding-left: 10px; border: 0; font-size: 15px; letter-spacing: 0.6px; color: var(--pic-color-grey-100); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; appearance:none; background:linear-gradient(45deg, transparent 50%, var(--pic-color-grey-100) 50%),linear-gradient(135deg, var(--pic-color-grey-100) 50%, transparent 50%),transparent; background-position:calc(100% - 6px) calc(1em + 2px),calc(100% - 0px) calc(1em + 2px); background-size:6px 6px,6px 6px; background-repeat: no-repeat; } .header_center .search_box .search_bar select:focus { outline: none!important; -webkit-box-shadow: 0; box-shadow: 0; } .header_center select:-moz-focusring { color: transparent; text-shadow: 0 0 0 #000; } .header_center .pretty-select::-ms-expand { display: none; } .header_center .search_box .search_bar input.search_bar_txt { vertical-align: top; width: calc(100% - 152px); height: 100%; border: 0; padding:3px 15px; font-size: 15px; letter-spacing: 0.75px; color: var(--pic-color-grey-100); } .header_center .search_box .search_bar input.search_bar_submit { vertical-align: top; width: 50px; height: 100%; background-image: url(search.svg); background-color: transparent; background-size: 50px; background-repeat: no-repeat; background-position: right -3px; border: 0; cursor: pointer; } .header_center .search_box .search_bar input.search_bar_submit:focus{ outline: none!important; -webkit-box-shadow: 0; box-shadow: 0; } .header_center .keywoard{ display: flex; width: 400px; overflow: hidden;height: 16px;text-overflow: ellipsis;white-space: nowrap; margin-top: 5px;} .header_center .keywoard span{font-size:12px; margin-right: 10px; line-height:16px; background-color: var(--pic-light-red-80); color: #fff; padding: 0 3px; border-radius: 3px;} .header_center .keywoard a{font-size:12px; line-height:16px; color: var(--pic-light-red-80); vertical-align: top; margin-right: 10px;border-right: 1px solid var(--pic-neutral-grey4);} .header_center .keywoard a:last-child{border-right:0;} .header_center .keywoard a:hover{color:var(--pic-light-red-60);text-decoration: underline;} .header_center .df_Keyword{width: 530px;padding-left:10px; overflow: hidden;height: 26px;text-overflow: ellipsis;white-space: nowrap;} .header_center .df_Keyword span {color: #e94741;font-size:13px; line-height:30px;margin-right:15px;} .header_center .df_Keyword a{font-size:13px; line-height:30px; color: #999; margin-right: 6px;border-right: 1px solid #aaa;padding-right: 6px;} .header_center .df_Keyword a:last-child{border-right:0;} .header_center .df_Keyword a:hover{color:var(--pic-color-grey-100);} /* header_center - 我要開店 */ .header_center .open_link{position: absolute;right: 0;top: 50%; transform: translateY(-50%); display: -ms-box; display: -moz-webkit-flex; display: -webkit-flex; display: -ms-flexbox; display: flex; -ms-flex-pack: end; -webkit-justify-content: flex-end;-webkit-box-pack: end; -moz-box-pack: end; justify-content: flex-end; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } .header_center .open_link a{ width: 70px; height: 75px;border-bottom-right-radius: 35px; border-bottom-left-radius: 35px; display: -ms-box; display: -moz-webkit-flex; display: -webkit-flex; display: -ms-flexbox; display: flex; -ms-flex-align: center; -webkit-align-items: center; align-items: center; text-align: center; padding: 10px 0;} .header_center .open_link a img{ width:62px; height:auto;} .header_center .open_link a span{-webkit-box-flex: 100%; -moz-box-flex: 100%; -webkit-flex: 100%; -ms-flex: 100%; flex: 100%; color: var(--pic-green); font-size: 14px; font-weight: 500; line-height: 20px;} .header_center .open_store{ margin-left: 12px;} .header_center .open_store a{ background-color: var(--pic-light-red-80); font-size: 13px; margin-top: -10px;} .header_center .open_store a span{ margin-top: -10px; color: #fff; background-size: 18px; padding-top: 24px; animation-duration: 3s; animation-name: bgchange; animation-iteration-count: infinite;} /* header_center - banner廣告 */ .header_center .open_link .header_ad{width: 300px; height: 68px;} .header_center .open_link .header_ad a{width:100%;height: 100%;display: block;padding: 0;} .header_center .open_link .header_ad a img{width:100%;height: 100%;display: block;object-fit: contain;} @keyframes bgchange { 0% { background: url(open.svg) center top no-repeat; background-size: 18px; } 50% { background: url(open.svg) center 5px no-repeat; background-size: 18px; } 100% { background: url(open.svg) center top no-repeat; background-size: 18px; } } /* (區塊3)top_menu */ .top_menu_list_top{ border-left: 2px solid #02888a; position: relative; width: 200px; font-size: 16px; font-weight: 500; line-height: 36px;text-align: center; background: #008e90; color: #fff;} .top_menu_list_top::after{ content: ''; position: absolute; right: -36px; top:0; display: block; width: 0; height: 0; border: 18px solid; border-color: transparent transparent transparent #008e90;} /* 主選單-第一層 */ .top_menu_list_all { background-color: var(--pic-green); width: 100%; height: 36px;} .top_menu_list_all .top_menu_list_all_inner{ height:36px; margin: 0 auto; max-width: 1200px; display: flex; justify-content: space-evenly;} .top_menu_list_all .top_menu_list{ -webkit-box-flex: 1; -moz-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; text-align: center;} .top_menu_list_all .top_menu_list > a{ position: relative; display: block; font-size:16px; line-height:36px; color:#fff; text-align: center; transition: all .25s;} .top_menu_list.active > a::before{ position: absolute; display: block; content: ''; bottom: 0; left: 50%; margin-left: -3px; width: 0; height: 0; border: 6px solid; border-color: transparent transparent #f8f8f8 transparent; } /* 主選單-第二層-選單 */ ul.top_menu_sec{ max-width:1200px; width:100%; height:0; padding: 20px 50px; background-color: #f8f8f8; position:absolute; left: 50%; transform: translateX(-50%); z-index:21; display: block; opacity: 0; transition: opacity 0.25s; visibility: hidden; overflow-y: scroll;} .top_menu_list.active ul.top_menu_sec{ display: flex; -ms-flex-wrap: wrap; -moz-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; height: 340px; opacity: 1; z-index: 999; visibility: visible;} ul.top_menu_sec > li{ display: -ms-box; display: -moz-webkit-flex; display: -webkit-flex; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; -moz-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap;} ul.top_menu_sec > li.top_menu_sec_sort{-webkit-box-flex: 0 60%; -moz-box-flex: 0 60%; -webkit-flex: 0 60%; -ms-flex: 0 60%; flex: 0 60%;} ul.top_menu_sec > li.top_menu_sec_logo{-webkit-box-flex: 0 40%; -moz-box-flex: 0 40%; -webkit-flex: 0 40%; -ms-flex: 0 40%; flex: 0 40%; align-content: baseline;} .sec_sort_item{-webkit-box-flex: 0 25%; -moz-box-flex: 0 25%; -webkit-flex: 0 25%; -ms-flex: 0 25%; flex: 0 25%; margin-bottom: 25px; text-align: left; padding-right: 15px;} .sec_sort_item > a{font-size:16px; line-height:16px; color: var(--pic-orange); overflow:hidden; text-align: left; display: inline-block; margin-bottom: 8px;} .sec_sort_item > a:hover{ box-shadow: inset 0 -2px 0 var(--pic-orange);} /* 主選單-第三層-選單 */ .top_menu_thi { width: 100%;} .top_menu_thi > a{ display: block; width: 100%; color: var(--pic-color-grey-100); font-size: 13px; line-height: 16px; text-align: left;} .top_menu_thi > a:not(:last-of-type){margin-bottom: 8px;} .top_menu_thi > a:hover{ color: #000;} /* 主選單-第二層-LOGO */ .top_menu_sec_logo > a{ display: block; max-width: 90px; width: 100%; height: 90px; margin: 0 10px 10px 0;} .top_menu_sec_logo > a > img{ width: 100%; height: 100%; object-fit: contain;border: solid 1px #eaeaea; border-radius: 10px; overflow: hidden;} /* 版頭分類fiexd */ .header_top.top_fixed{ width: 100%; position: fixed; top:0; z-index: 22; display: block;} .header_top.top_fixed .logo_box{display: block; border-right: 1px solid #acacac; padding-right: 10px;} .header_top.top_fixed .branch_library.branch_logo{ display: none;} .header_top.top_fixed .branch_library.branch_txt{ display: none;} .header_top.top_fixed .search_box{display: block;} .header_top.top_fixed .user_func > li.member_info{display: none;} .top_menu_list_all.top_fixed{ width: 100%; position: fixed; top:28px; z-index: 21;} .header_top.top_fixed .open_seller{ display: none;} .it_GHTitleL_BOX{background: #4e3b32;} /*it256*/ .it256_pagination li,.it306_pagination li,.it307_pagination li,.it308_pagination li,.it309_pagination li{color:#FFF;background-color: var(--pic-green);border: 1px solid var(--pic-green);} .it256_pagination li.current,.it306_pagination li.current,.it307_pagination li.current,.it308_pagination li.current,.it309_pagination li.current{color:#4e3b32} .it256_btn_next{background: rgba(187, 187, 187, 0.6) url(next.png) no-repeat 11px!important;background-size: 16px!important;height: 50px;border-radius: 5px 0 0 5px;} .it256_btn_prev{background: rgba(187, 187, 187, 0.6) url(prev.png) no-repeat 11px!important;background-size: 16px!important;height: 50px;border-radius: 0 5px 5px 0;} .it295_BOX a{color:#888!important;} .it295_BOX a:hover{color:var(--pic-color-grey-100)!important;} .it295_BOX h5.it295_title{color:#e94741;font-size:14px; line-height:38px; font-weight:bold;} /* 元件111 會員中心-取消訂單 */ .it111_pickuptext, .it111_pickuptitle{display:none;} /* 元件112 會員中心-退貨 */ .successInfo .leadin { text-align:center; font-weight:500; font-size:15px;} .successInfo .leadin span { color:var(--pic-orange); } .successInfo .infoTable { font-size:15px; padding:20px 0;} .successInfo .infoTable .head { background-color:#f6f6f6; color:var(--pic-orange); padding:10px 0; text-align:center; border-top:1px solid #d8d8d8; border-bottom:1px solid #d8d8d8; background-color:#fff;} .successInfo .infoTable table { width:100%; } .successInfo .infoTable .table_v1 { background-color:#fff;} .successInfo .infoTable .table_v1 td { border-bottom:1px solid #eaeaea;padding:10px 10px 10px 50px;} .successInfo .infoTable .table_v1 td:first-child { width:20%; padding:10px 10px 10px 50px;} .successInfo .infoTable .table_v2 { background-color:#fff;} .successInfo .infoTable .table_v2 td { text-align:center; border-bottom:1px solid #eaeaea; padding:10px;} .successInfo .infoTable .table_v2 thead td {color:var(--pic-color-grey-70);} .successInfo .infoTable .table_v2 td:first-child { text-align:left; padding:10px 10px 10px 50px;} .successInfo .infoTable td.aliLeft { text-align:left; } .return_partial_btn{margin-right:5px;} .return_all_btn input, .return_partial_btn input{display: block; width: 150px; height: 45px; cursor: pointer;} .notice { padding: 20px; border-bottom: 1px solid #eaeaea; } .userInfo p { text-align: center; font-size: 22px; margin: 15px 0; } .btn_back_cart a { display: block; height: 45px; width: 150px; text-align: center; line-height: 45px;} .number { font-size: 15px; color: var(--pic-orange); font-weight: 500; } /*it298~it301*/ .it298_BOX{margin-bottom: 10px;} .it298_BOX .it_GHTitle_BOX{border-bottom-width: 0;background: url(ewindline_BG2.jpg);border-radius: 5px 5px 0 0;} .it298_BOX .it_GHTitle_BOX .it_GHTitle span{background: var(--pic-green)!important;font-weight:bold; font-size:16px; line-height:30px;;margin: 7px 10px 7px 15px;} .it298_BOX .it_GHTitle_BOX .it_GHLink{background: var(--pic-green)!important;} .it298_BOXin{border-radius: 0 0 5px 5px;} .it_GHTitle_BOX h3.it_GHTitle{color:#fff;} .it_GHTitle_BOX ul.it_GHad li{padding-top: 13px;} .it_GHTitle_BOX ul.it_GHad li a{color:#fff;} .it298_PBox .it298_Pword .it298_Pother02{color:#e94741;} .it298_PBox .it298_Pword .it298_Pactivity{color:var(--pic-green);margin-bottom: 3px;text-overflow : ellipsis; white-space : nowrap;} .it298_PBox .it298_Pword .it298_Pname{text-overflow : ellipsis; white-space : nowrap;} .it298_PBox .it298_Pword .it298_Pname a{color:var(--pic-color-grey-100);font-size:15px; line-height:15px;} .it298_PBox .it298_Pword .it298_Pname a:hover{color:#444;} .it299_BOX{margin-bottom: 10px;} .it299_BOX .it_GHTitle_BOX{border-bottom-width: 0;background: url(ewindline_BG2.jpg);border-radius: 5px 5px 0 0;} .it299_BOX .it_GHTitle_BOX .it_GHTitle span{background: var(--pic-green)!important;font-weight:bold; font-size:16px; line-height:30px;;margin: 7px 10px 7px 15px;} .it299_BOX .it_GHTitle_BOX .it_GHLink{background: var(--pic-green)!important;} .it299_BOXin{border-radius: 0 0 5px 5px;} .it300_BOX{margin-bottom: 10px;} .it300_BOX .it_GHTitle_BOX{border-bottom-width: 0;background: url(ewindline_BG2.jpg);border-radius: 5px 5px 0 0;} .it300_BOX .it_GHTitle_BOX .it_GHTitle span{background: var(--pic-green)!important;font-weight:bold; font-size:16px; line-height:30px;;margin: 7px 10px 7px 15px;} .it300_BOX .it_GHTitle_BOX .it_GHLink{background: var(--pic-green)!important;} .it300_BOXin{border-radius: 0 0 5px 5px;height: 365px;} .it300_Pname{height:35px;} .it300_Pname a{font-size:15px; line-height:19px;} .it300_Pother01 a{color:#999;} .it300_Pother02{color:#e94741;font-size:24px; line-height:28px; font-weight:bold;} .it301_BOX{margin-bottom: 10px;} .it301_BOX .it_GHTitle_BOX{border-bottom-width: 0;background: url(ewindline_BG2.jpg);border-radius: 5px 5px 0 0;} .it301_BOX .it_GHTitle_BOX .it_GHTitle span{background: var(--pic-green)!important;font-weight:bold; font-size:16px; line-height:30px;;margin: 7px 10px 7px 15px;} .it301_BOX .it_GHTitle_BOX .it_GHLink{background: var(--pic-green)!important;} .it301_BOXin{border-radius: 0 0 5px 5px;border: 1px solid #eaeaea;} .it301_PBox .it301_Pword .it301_Pactivity{color:#929e4f;} .it301_PBox .it301_Pword .it301_Pname a{font-size:15px; line-height:19px;color:var(--pic-color-grey-100);} .it301_PBox .it301_Pword .it301_Pname a:hover{color:#444;} .it301_PBox .it301_Pword .it301_Pother02{color:#e94741;} .it301_PBox{width:305px;} .it301_Content{padding-top: 10px; padding-left: 10px;} /*it302-瀏覽商品輪播*/ .it302_Title{background: url(ewindline_BG2.jpg);border-radius: 5px 5px 0 0;color:#fff;font-size:18px; line-height:40px; font-weight:bold;height:40px;padding-left: 15px;} .it302_Pprice{color:#e94741;} h2.it302_Pname{height:35px;} h2.it302_Pname a{color:var(--pic-color-grey-100);font-size:15px; line-height:19px;} h2.it302_Pname a:hover{color:#444;} /*it303-新進店家*/ .it303_BOX{margin-bottom: 10px;} .it_303Title_BOX{background: url(ewindline_BG3.jpg);border-bottom-width:0;border-radius: 5px 5px 0 0;} .it_303Title_BOX h3.it_303Title{color:#fff;background: none;padding-left: 15px;} .it_303Title_BOX ul.it_303ad li{padding-top: 13px;} .it_303Title_BOX ul.it_303ad li a{color:#fff;} .it_303Title_BOX h5.it_303Link{width:95px;} .it_303Title_BOX h5.it_303Link a{background:#D89A36;border-bottom: 1px solid #d9d9d9;} .it303_BOXin{border-radius: 0 0 5px 5px;border: 1px solid #eaeaea;} .it303_BOXin ul li{border-bottom: 0;} .it303_BOXin ul li .it303_store p a{color:var(--pic-color-grey-100);font-size:15px; line-height:19px; height: 16px;text-align: center; margin-top: 15px;} .it303_BOXin ul li .it303_store p a:hover{color:#444;} /*it309*/ .it309_BOXin ul li .it309_store a{text-align: center;color:var(--pic-color-grey-100);} .it309_BOXin ul li .it309_store:hover p a{color:#444!important;} /*廣告*/ .SB_WitemBOX{margin-bottom: 10px;} /* 首頁 - 左側欄*/ .it254_btn_prev,.it256_btn_prev,.it298_prev,.it299_prev,.it300_prev,.it301_prev,.it302_prev,.it306_btn_prev,.it307_btn_prev,.it308_btn_prev,.it309_btn_prev{background: rgba(187, 187, 187, 0.6) url(prev.png) no-repeat 11px;background-size: 16px;height: 50px;border-radius: 0 5px 5px 0;} .it254_btn_next,.it256_btn_next,.it298_next,.it299_next,.it300_next,.it301_next,.it302_next,.it306_btn_next,.it307_btn_next,.it308_btn_next,.it309_btn_next{background: rgba(187, 187, 187, 0.6) url(next.png) no-repeat 11px;background-size: 16px;height: 50px;border-radius: 5px 0 0 5px;} .it254_pagination li.current,.it256_pagination li.current{color: #4e3b32!important;background: #fff!important;border:0!important;} .it254_pagination li,.it256_pagination li{color: #FFF;background-color: var(--pic-green)!important;border: 1px solid var(--pic-green)!important;} .it254_btn_next{background: rgba(187, 187, 187, 0.6) url(next.png) no-repeat 11px!important;background-size: 16px!important;height: 50px;border-radius: 5px 0 0 5px;} .it254_btn_prev{background: rgba(187, 187, 187, 0.6) url(prev.png) no-repeat 11px!important;background-size: 16px!important;height: 50px;border-radius: 0 5px 5px 0;} .it301_prev, .it301_next{top:37%;} /*it310*/ .it310_RankBox li.it310_Rank_img .it310_Rank_numA{background: url(it310_Rankbg.jpg) left top no-repeat;} .it310_RankBox_after li span{background-color: #fe8d38;} .it310_RankBox li.it310_Rank_word h5{color:#e94741;} .it310_RankBox li.it310_Rank_word h2 a{color:var(--pic-color-grey-100);} .it310_RankBox li.it310_Rank_word h2 a:hover{color:#444;} .it310_RankBox_after li h2 a{color:var(--pic-color-grey-100);} .it310_RankBox_after li h2 a:hover{color:#444;} .it310_RankBox_after li{border-top: 1px dotted #cccccc;} /*280*/ .item280_box .item280_title{ border-bottom: 1px solid rgba(0,0,0,.1);} .item280_box .item280_title h3.item280{ background: none; padding-left: 35px; position: relative; height: 40px; line-height: 40px; letter-spacing: 0.5px; color: #000000; margin-bottom: 15px; font-size:18px; line-height:40px; font-weight:bold; } .item280_box .item280_title h3.item280:before { left: 0; position: absolute; content: ''; width: 26px; height: 6px; border-radius: 3px; background-color: #aacf64; top: 50%; margin-top: -3px; } .item280_box .item280_title h3.item280_Minor:after,.item280_box .item280_title h3.item280_Minor:before{display: none;} .item280_box .item280_bottom{ border-top: none;border: none; } .item280_box .item280_title .item280_titletab ul li a{ font: unset; padding: 0 20px; color: #777777; font-size: 16px; } .item280_box .item280_title .item280_titletab ul li.selected3 a{ background-color: var(--pic-green); font-size: 16px; font-weight: bold; border-radius: 5px 5px 0 0; padding: 0 20px;} .item280_box .item280_title .item280_titletab ul li a span{ transform: translateY(7px)rotate(180deg); border-bottom: 7px solid var(--pic-green); } .item280_bottomR ul li .item280_product{ display: flex; flex-direction: column; border: none; padding: 10px; } .item280_bottomR ul li .item280_product:hover{border: none;} .item280_product .item280_productmoney{ order: 3; padding: 0; margin: 0; text-align: left; display: flex; align-items: flex-start; flex-direction: column; color: #e94741; font-size: 15px; font-weight: bold; height: auto;} .item280_product .item280_productmoney span{ color: #bbbbbb; text-decoration: line-through; line-height: 1; } .item280_product .item280_producttitle{ text-align: left; padding: 0; height: 25px; margin-top: 5px;} .item280_bottomR ul li .item280_product .item280_photo{overflow: hidden; width: 100%; height: auto; border-bottom: none;} .item280_product:hover .item280_add { bottom: 0; transition: all .8s; } .item280_product .item280_add{ width: 100%; display: -ms-box; display: -moz-webkit-flex; display: -webkit-flex; display: flex; align-items: center; height: 50px; position: absolute; left: 0; bottom: -50px; z-index: 99; transition: all .8s;} .item280_product .item280_add a.add_car{ background: url(it683_bag.svg) center no-repeat rgba(0,140,214,.7); text-indent: -9999px; display: block; width: 100%; height: 100%; margin-right: 0px; } .item280_product .item280_add a.add_like{ background: url(it683_heart.svg) top center no-repeat rgba(0,160,65,.7); background-size: 26px; text-indent: -9999px; display: block; width: 100%; height: 100%; margin-right: 0px; } .item280_product .item280_add a.add_like.active{background-position: bottom center;} .item280_product .item280_add a.add_like.active:hover{background-position: bottom center;} .item280_product .item280_add a.add_like:hover{ background-position: top center; } .item280_product .item280_add a.add_car:hover{background-position: center center;} .item280_product .item280_productmoney li.productmoney_M{ text-align: left; font-family: 'Montserrat', sans-serif; font-size: 15px; font-weight: bold; letter-spacing: 0.6px; color: #e94741; padding-right: 5px; } .item280_product .item280_productmoney li.productmoney_L,.item280_product .item280_productmoney li.productmoney_R{display: none;} .item280_product .item280_producttitle a,.item280_product .item280_producttitle a:hover{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; font-size: 15px; line-height: 21px; width: 100%; height: 23px; overflow: hidden; color: #1e1e1e; font-weight: bold; } .item280_product .item280_producttitle a:hover{text-decoration: none;} .item280_product .item280_productmoney li.productmoney_M,.item280_product .item280_productmoney li.productmoney_M span.icon{ text-align: left; font-family: 'Montserrat', sans-serif; font-size: 15px; font-weight: bold; letter-spacing: 0.6px; color: #e94741; } .item280_bottomR ul li .item280_product .item280_photo img{ width: 100%; height: auto; } .item280_product .item280_productmoney li.productmoney_M{border-bottom: none;border-top: none; height: auto; background-color: transparent;} .item280_bottom .item280_bottomL .item280_bottomL_logo ul li img:hover{border: 1px solid #ddd;} .item280_bottomR>ul { display: flex; flex-wrap: wrap; } .item280_box .item280_bottom .item280_bottomR ul li.product{flex: 18%; background-color: white; border-radius: 5px; margin: 5px;} .item280_bottom .item280_bottomL .item280_bottomL_banner{height: 414px;} .item280_bottom .item280_bottomL .item280_bottomL_banner .Index_ADbanner{ height: 414px;} .item280_bottom .item280_bottomL .item280_bottomL_list{height: 0; display: none;} .item280_box .item280_title .item280_titletab ul li a:hover{background-color: transparent; color: #777777;} .item280_box .item280_title .item280_titletab ul li.selected3 a:hover{background-color: var(--pic-green); color: white;} .item280_box .item280_title .item280_titletab ul li a:hover span{display: none;;} .item280_box .item280_title .item280_titletab ul li.selected3 a:hover span{ display: block;} .item280_bottom .item280_bottomL .item280_bottomL_banner .flex-control-nav li{ height: auto; } .item280_bottom .item280_bottomL .item280_bottomL_banner .flex-control-nav{ height: auto; top: unset; bottom: 0; } /*281*/ .item281_box{ max-width: 1200px; width: auto; border: none;display: flex; justify-content: space-between; align-items: center; margin: 20px 0;} .item281_box-middle{ margin: 0; width: 330px; height: 310px; border: 10px solid #aacf64; overflow: hidden; border-radius: 10px;} .item281_box-right{width: 664px!important; margin-top: 0; width: auto; height: 315px; background-color: white; padding: 10px; border-radius: 5px;} .item281_box-right .item280_product:nth-child(3){margin-right: 0;} .item281_box .item280_product{border: none; display: flex; flex-direction: column; border: none; margin-right: 10px; height: 290px;} .item281_box .item280_product:hover{border: none;} .item281_box .item280_product .item280_photo{border-bottom: none; overflow: hidden;} .item281_box .item280_product .item280_add{ width: 100%; display: -ms-box; display: -moz-webkit-flex; display: -webkit-flex; display: flex; align-items: center; height: 50px; position: absolute; left: 0; bottom: -50px; z-index: 99; transition: all .8s; top: unset;} .item281_box .item280_product:hover .item280_add{bottom: 0; transition: all .8s; } .item281_box .item280_product .item280_add a.add_car{background: url(it683_bag.svg) center no-repeat rgba(0,140,214,.7); text-indent: -9999px; display: block; width: 100%; height: 100%; margin-right: 0px; order: 2; } .item281_box .item280_product .item280_add a.add_like{ background: url(it683_heart.svg) top center no-repeat rgba(0,160,65,.7); background-size: 26px; text-indent: -9999px; display: block; width: 100%; height: 100%; margin-right: 0px; } .item281_box .item280_product .item280_add a.add_like.active{background-position: bottom center;} .item281_box .item280_product .item280_add a.add_like.active:hover{background-position: bottom center;} .item281_box .item280_product .item280_add a.add_like:hover{ background-position: top center; } .item281_box .item280_product .item280_add a.add_car:hover{background-position: center center;} .item281_box .item280_product .item280_producttitle a,.item281_box .item280_product .item280_producttitle a:hover{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; font-size: 15px; line-height: 21px; width: 100%; height: 23px; overflow: hidden; color: #1e1e1e; font-weight: bold;} .item281_box .item280_product .item280_productmoney li.productmoney_M{text-align: left; font-family: 'Montserrat', sans-serif; font-size: 15px; font-weight: bold; letter-spacing: 0.6px; color: #e94741; padding-right: 5px; } .item281_box .item280_product .item280_productmoney li.productmoney_R,.item281_box .item280_product .item280_productmoney li.productmoney_L {display: none;} .item281_box .item280_product .item280_productmoney li.productmoney_M span.icon{text-align: left; font-family: 'Montserrat', sans-serif; font-size: 15px; font-weight: bold; letter-spacing: 0.6px; color: #e94741;} .item281_box .item280_product .item280_productmoney li.productmoney_M{border-bottom: none;border-top: none; height: auto; background-color: transparent;} .item281_box .item280_product .item280_productmoney{ margin: 0; text-align: left; height: auto;} .item281_box .item280_product .item280_producttitle{ text-align: left; padding: 0; height: 23px; margin-top: 5px;} /*720*/ .it720_downbox ul li a p{display: none;} /*721*/ .it721_default .tabTit{ background-color: transparent;} .it721_default .swiper-container .it721_product_bg{ background: transparent!important; } .it721_default .it721_title{ background: none; padding-left: 35px; position: relative; height: 40px; line-height: 40px; letter-spacing: 0.5px; color: #000000!important; margin-bottom: 15px; font-size:18px; line-height:40px; font-weight:bold;} .it721_default .it721_title:before { left: 0; position: absolute; content: ''; width: 26px; height: 6px; border-radius: 3px; background-color: #cc5496; top: 50%; margin-top: -3px;} .it721_default .tabTit .swiper-pagination-bullet{ font: unset; padding: 0 20px; color: #777777; font-size: 16px; background: transparent!important; opacity: 1;} .it721_default .tabTit .swiper-pagination-bullet.swiper-pagination-bullet-active{background:var(--pic-green)!important; color: white; font-weight: bold; border-radius: 5px 5px 0 0;} .it721_default .tabTit .swiper-pagination-bullet.swiper-pagination-bullet-active:after{ transform: translateX(-50%); border-left: 8px solid transparent; border-bottom: 8px solid transparent; border-right: 8px solid transparent; border-top: 8px solid var(--pic-green); border-width: 8px; bottom: -16px; } .it721_default .swiper-container-horizontal>.swiper-pagination-bullets, .it721 .swiper-pagination-custom, .swiper-pagination-fraction{ margin: 0 auto 20px auto; border-bottom: 1px solid rgba(0,0,0,.1); padding-bottom: 0; } .it721_default .swiper-button-next{right: -20px; background: url(arrow-r.svg) no-repeat;} .it721_default .swiper-button-prev{left: -20px; background: url(arrow-l.svg) no-repeat;} .it721_default .swiper-button-prev,.it721 .swiper-button-next{ width: 40px; height: 40px; position: absolute; text-indent: -9999px; z-index: 2; top: 50%; margin-top: 13px; } .it721_default .it721_item{ margin-right: 10px; margin-bottom: 10px; padding: 0; width: calc(((100% - 40px)/5)); flex: initial; float: unset; background-color: #fff;border-radius: 5px;} .it721_default .it721_item:nth-of-type(5n){margin-right: 0;} .it721_default .swiper-container .it721_morebtn{ text-align: center; padding: 10px;} .it721_default .swiper-container .it721_morebtn a{ text-decoration: none; font-size: 15px; border: 1px solid var(--pic-green); padding: 10px 70px; display: inline-block; background: var(--pic-green); color: #fff!important;} .it721_default .swiper-container .it721_morebtn a:hover{ text-decoration: none; font-size: 15px; border: 1px solid var(--pic-green); padding: 10px 70px; display: inline-block;background: #fff; color: var(--pic-green)!important;} .it721_default .swiper-container-autoheight, .it721_default .swiper-container-autoheight .swiper-slide{ align-items: stretch; } /* 會員中心 */ .newmember_box{margin:0 auto 40px auto;} .main_content_left{margin-bottom:40px;} .it49 ul.it49_tabbox li.active{background-color: var(--pic-green);} .it49 ul.it49_tabbox li.active a::after{border-color: var(--pic-green) transparent transparent transparent;} .it425_comments_button>input{ width: 100%;} .AF_Member_Login_R_left{ padding: 0;} /* 頁碼 */ .gh_PageNumber{ width:100%; height:80px; text-align:center;} .gh_PageNumber ul{ display:inline-block;} .gh_PageNumber ul li{ float:left;} .gh_PageNumber ul li.dis{ display:block; padding:0 15px; font-size:13px; line-height:35px; color:#555; border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; border-right:1px solid #e5e5e5; background:#e5e5e5;} .gh_PageNumber ul li a{ display:block; padding:0 15px; font-size:13px; line-height:35px; color:#555; border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; border-right:1px solid #e5e5e5; background:#FFF; text-decoration:none;} .gh_PageNumber ul li.pre a,.gh_PageNumber ul li.next a{ font-size:13px; line-height:35px;} .gh_PageNumber ul li.pre a{ border-left:1px solid #e5e5e5; border-right:1px solid #e5e5e5;} .gh_PageNumber ul li.next a{ border-right:1px solid #e5e5e5;} /* 店家搜尋頁 */ .gh_ShopSearchTOP{ width:100%; margin:0 auto; border:1px solid #eeeeee;} .gh_ShopSearchTOP_list{ width:100%; height:auto; background:#f7f7f7; display:flex;} .gh_ShopSearchTOP_list > div{ float:left; padding:5px 15px 10px 15px;} .gh_ShopSearchTOP_list > div.gh_ShopList_L{ width:150px;} .gh_ShopSearchTOP_list > div.gh_ShopList_L h5{ font-size:15px; line-height:30px;} .gh_ShopSearchTOP_list > div.gh_ShopList_R{ width:100%; height:auto; background:#FFF;} .gh_ShopSearchTOP_list > div.gh_ShopList_R > ul > li{ float:left; width:20%;} .gh_ShopSearchTOP_list > div.gh_ShopList_R > ul > li > a{ display:block; width:100%; font-size:14px; line-height:30px; color:var(--pic-color-grey-100);} .gh_ShopSearchTOP_list > div.gh_ShopList_R > ul > li > a > span{ color:#bbbbbb; margin-left:5px;} .gh_ShopSearchTOP_list > div.gh_ShopList_R > ul > li > a:hover{color:#444;} .gh_ShopSearchTOP_array{ width:100%; height:40px; margin:0 auto; padding:5px 15px; background:#FFF; border-top:1px solid #eeeeee;} .gh_ShopSearchTOP_array_L{ float:left;} .gh_ShopSearchTOP_array_L li{ color:var(--pic-color-grey-100); float:left; font-size:15px; line-height:30px; padding:0 10px;} .gh_ShopSearchTOP_array_L li a{ display:block; background:url(/iopen/css/images/it74_down.svg) no-repeat bottom right; background-size: 10px; color: #000; font-size:15px; line-height:30px; padding:0 20px 0 10px;} .gh_ShopSearchTOP_array_L li a:hover{ background:url(/iopen/css/images/it74_down.svg) no-repeat top right; background-size: 10px; color:#000; font-weight: bold; text-decoration:none;} .gh_ShopSearchTOP_array_L li.moshover a{ background:url(/iopen/css/images/it74_down.svg) no-repeat top right; background-size: 10px; color:#000; font-weight: bold; text-decoration: none;} .gh_ShopSearchTOP_array_L li span{ color:#e94741; margin:0 5px;} .gh_ShopSearchTOP_array_L01{ border-right:1px solid #eeeeee; padding-right:15px;} .gh_ShopSearchTOP_array_L02{ padding:0 10px 0 15px;} .gh_ShopSearchTOP_array_R{ float:right;} .gh_ShopSearchTOP_array_R span{ font-size:15px; line-height:30px; font-weight:bold; margin:0 5px;} .gh_ShopSearchTOP_array_R li{ float:left;} .gh_ShopSearchTOP_array_R01{ padding-right:10px;} .gh_ShopSearchTOP_array_R02{ padding:0 0 0 10px;} .gh_ShopSearchTOP_array_R02 select{ width:70px; height:25px; font-size:15px; line-height:25px; color:var(--pic-color-grey-100);} .gh_ShopSearchBox{ width:100%; height:auto; margin:0 auto; padding-top:25px; padding-bottom:30px;} .gh_ShopSearchBox > ul{ display:flex; -ms-flex-wrap: wrap; -moz-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap;} .gh_ShopSearchBox > ul > li{ -webkit-box-flex: 0 20%; -moz-box-flex: 0 20%; -webkit-flex: 0 20%; -ms-flex: 0 20%; flex: 0 20%;; padding:10px;} .gh_ShopBox{ width:100%; height:auto; margin:0 auto; background:#fff; border:1px solid var(--pic-color-grey-10); position:relative; padding:10px 0;} .gh_ShopView{ display:block; width:60px; height:22px; position:absolute; right:0; bottom:0;} .gh_ShopView a{ display:block; width:60px; height:22px; font-size:13px; line-height:22px; color:#fff; text-align:center; background:var(--primary); position:relative;} .gh_ShopView a:before{ content:''; display:block; width:10px; height:22px; border-bottom:22px solid var(--primary); border-left:10px solid transparent; position:absolute; left:-10px; bottom:0; z-index:1;} .gh_ShopView a:hover{ background:var(--primary-dark);} .gh_ShopView a:hover:before{ border-bottom:22px solid var(--primary-dark);} .gh_ShopLogo{ padding: 0 10px;} .gh_ShopLogo a{ display:flex; max-width:100%; width:100%; height:198px; align-items: center; overflow: hidden;} .gh_ShopLogo a img{ display:block; width:100%; height:100%; object-fit: contain;} .gh_ShopName { padding: 5px 10px; } .gh_ShopName a{ display:block; width:100%; height:40px; margin:0 auto; font-size:14px; line-height:20px; color:var(--pic-color-grey-100); font-weight:bold; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;} .gh_ShopDetail{ width:200px; height:40px; margin:0 auto; overflow:hidden; font-size:13px; line-height:20px; margin-bottom:10px;} .gh_ShopOther{ width:100%; margin:0 auto; padding:10px 10px 0 10px; border-top:1px solid #eee;} .gh_ShopOther li{ float:left; width:50%; height:20px; font-size:12px; line-height:20px;} .gh_ShopOther span{ color:var(--danger); padding-left:5px;} /*風獅爺瘋數位-置頂按鈕*/ .go_to_top {margin: 0 auto;width:50px;height:50px;background:url(go-to-top.svg) rgba(204,204,204,0.8) center no-repeat;background-size:40px;cursor: pointer;position: fixed;right: 3%;bottom: 3%;z-index: 999;border:0;display:none;} /* common */ .AF_Member_LoginBox_left .AF_Member_Input100,.AF_attest_number input{padding:5px 10px;font-size: 14px;} /* 4 */ .normal_item4BOX img{max-width: 100%;height: auto;} /* 263 */ .it263_ADbanner_box{border: 0; margin-bottom:15px;} .it263_ADbanner_box .nextBtn,.it263_ADbanner_box .prevBtn{display: none;} .it263_ADbanner_box .box01{cursor: default;} .jsNav {background: rgba(255,255,255,.5); height: 50px;} .jsNav a{height: 50px;background-color: transparent;color:#999;line-height: 50px; font-size: 14px; font-weight: 600; letter-spacing: 0.5px;border-bottom: 3px solid transparent;} .jsNav .imgSelected{color: #000000;background-color: rgba(255,255,255,1);border-color:#e94741;} /* 264 */ .it264_ADbanner_box{padding:0;margin-bottom:15px;} .it264_ADbanner_box .slide_nav{top: 50%;width: 50px;height: 100px;} .it264_ADbanner_box .slide_nav.prev{left: 0;background: url(arrow_l_xl.svg) no-repeat;} .it264_ADbanner_box .slide_nav.next{right: 0;background: url(arrow_r_xl.svg) no-repeat;} /* 320 */ .productItem320_BOX{padding: 15px 30px;margin:0 auto 15px auto;background-color: #fff;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;} /* .productItem320_BOX .owl-carousel{padding: 15px 30px;} */ .productItem320_list a img:hover {border-color: transparent;} .productItem320_BOX .owl-theme .owl-nav{margin: -15px auto 0 auto;} .productItem320_BOX .owl-carousel .owl-nav .owl-prev, .productItem320_BOX .owl-carousel .owl-nav .owl-next{width: 40px;height: 40px;} .productItem320_BOX .owl-carousel .owl-nav .owl-prev, .productItem320_BOX .owl-carousel .owl-nav .owl-prev:hover{left: -50px;background: url(arrow-l.svg) no-repeat;} .productItem320_BOX .owl-carousel .owl-nav .owl-next, .productItem320_BOX .owl-carousel .owl-nav .owl-next:hover{right: -50px;background: url(arrow-r.svg) no-repeat;} .productItem320_BOX .owl-carousel .owl-nav .owl-prev, .productItem320_BOX .owl-carousel .owl-nav .owl-next{ transform: translateY(-50%);} /* 334 */ .item334box{margin-bottom: 0;} .Product_Recommendbox334 h2{ margin: 5px 0;} .Product_Recommendbox334 h2 a,.Product_Recommendbox334 h2 a:hover{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-size: 15px; line-height: 20px; width: 100%; height: 40px; overflow: hidden; color: #1e1e1e; font-weight: bold;} .Product_Recommendbox334 .price{text-align: left;font-family: 'Montserrat', sans-serif; font-size: 15px; font-weight: bold; letter-spacing: 0.6px; color: #e94741;} .Product_Recommendbox334 .price span{ display: block; color: #bbb; font-size: 15px; font-weight: bold;} .index_RecommendBox334 { width: 772px; border: none} .index_RecommendBox334 h2.title{position: relative;;background: none;border-bottom:1px solid rgba(0,0,0,.1);padding-left: 35px; position: relative; height: 40px; line-height: 40px; letter-spacing: 0.5px; color: #000000; font-weight: bold; margin-bottom: 10px;} .index_RecommendBox334 h2.title:before { left: 0; position: absolute; content: ''; width: 26px; height: 6px; border-radius: 3px; background-color: #fac03d; top: 50%; margin-top: -3px; } .index_RecommendBox334 .swiper-container{width: 772px;height: 280px;padding: 20px 0;background-color: #fff;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;} .item334box .item334box-right{width: 394px; margin-left: 14px;} .item334box .item334box-right a, .item334box .item334box-right img{ height: 338px;} .Product_Recommendbox334{max-width:180px;} .index_RecommendBox334 .arrow-left, .index_RecommendBox334 .arrow-right{top:190px;width: 40px;height: 40px;border:0;} .index_RecommendBox334 .arrow-left{left:-20px;background: url(arrow-l.svg) no-repeat;} .index_RecommendBox334 .arrow-right{right:-20px;background: url(arrow-r.svg) no-repeat;} .Product_Recommendbox334 .imgbox{overflow: hidden;max-width: 100%;margin-bottom: 0;} .Product_Recommendbox334 .imgbox img{width:100%;} .Product_Recommendbox334 .imgbox .it334_btnbox {width: 100%; display: -ms-box; display:-moz-webkit-flex; display: -webkit-flex; display: flex;; align-items: center; height: 50px; position: absolute; left: 0; bottom: -50px; z-index: 99; transition: all .8s;} .Product_Recommendbox334 .imgbox:hover .it334_btnbox{ bottom:0;} .index_RecommendBox334 .swipe-wrap > .swiper-slide .product_box .it334_btnbox > li{width:50%;height: 50px;text-align: center;} .Product_Recommendbox334 .imgbox .it334_btnbox a{ text-indent:-9999px; display: block; width:100%; height:100%;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;} .Product_Recommendbox334 .imgbox .it334_btnbox a:last-of-type{ background: url(cart_icon.svg) center no-repeat rgba(0,140,214,.7);} .Product_Recommendbox334 .imgbox .it334_btnbox a:first-of-type{ background: url(it683_heart.svg) top center no-repeat rgba(0,160,65,.7); background-size: 26px;} .Product_Recommendbox334 .imgbox .it334_btnbox a:first-of-type.gh_Pbtn_heart_on{ background-position: bottom center;} .Product_Recommendbox334 .imgbox .it334_btnbox li.gh_Pbtn_heart a.gh_Pbtn_heart_on{background-image: url(heart_on_icon.svg);background-size: 26px;} .Product_Recommendbox334 .imgbox .it334_icon {position: absolute; left: 0; top:0; z-index: 99; max-width: 60px; max-height:60px; width:100%; height: auto;} .Product_Recommendbox334 .imgbox .it334_icon img{width:100%;height:auto;} #it334_pbox { background: #fff; padding: 10px; border-radius: 5px; display: flex; align-items: center; } .item334box .owl-theme .owl-nav{margin: -15px auto 0 auto;} .item334box .owl-carousel .owl-nav .owl-prev, .item334box .owl-carousel .owl-nav .owl-next{width: 40px;height: 40px;position: absolute; text-indent: -9999px; z-index: 99; top: 50%; margin-top: -20px; } .item334box .owl-carousel .owl-nav .owl-prev, .item334box .owl-carousel .owl-nav .owl-prev:hover{left: -20px;background: url(arrow-l.svg) no-repeat;} .item334box .owl-carousel .owl-nav .owl-next, .item334box .owl-carousel .owl-nav .owl-next:hover{right: -20px;background: url(arrow-r.svg) no-repeat;} /* 瀏覽記錄 */ .history_sidebar { width: 130px; position: fixed; right: -103px; top: 200px; z-index: 999; transition: all .8s } .history_sidebar.history_sidebar_open{right: 0;transition: all .8s;} .history_sidebar .history_title { float: left; background-color: var(--pic-green); font-size: 14px; text-align: center; color: #fff; line-height: 23px; border-radius: 5px 0 0 5px; height: 100px; width: 30px; padding: 5px 5px; cursor: pointer;} .history_sidebar .history_box { width: 100px; background-color: #fff; box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.2); -webkit-border-radius: 0 0 0 5px; -moz-border-radius: 0 0 0 5px; border-radius: 0 0 0 5px; overflow: hidden;} .history_box .history_box_inner{ width:80%; height:300px; margin: 0 auto; position:relative; padding: 25px 0;} .history_sidebar .swiper-button-up{background-image: url(arrow_up_XL.svg)!important;position: absolute; top:0!important; left: 50%!important; transform: translateX(-50%)!important;width: 30px!important;height: 15px!important;bottom: inherit !important;} .history_sidebar .swiper-button-down{background-image: url(arrow_down_XL.svg)!important;position: absolute; bottom:16px!important; left: 50%!important; transform: translateX(-50%)!important;width: 30px!important;height: 15px!important;top: inherit !important;} .df_Back_top{ margin:0 auto; width:42px; height:21px; background:url(cp_top.png) left top no-repeat; cursor:pointer;} .history_sidebar .slick-prev{background-image: url(/iopen/css/images/history_arrow_u.svg);position: absolute; top:5px; left: 50%; transform: translateX(-50%);width: 30px;height: 15px;bottom: inherit ; z-index: 55;cursor: pointer; text-indent: 1000px; overflow: hidden; border: none; background-color: transparent;} .history_sidebar .slick-next{background-image: url(/iopen/css/images/history_arrow_d.svg);position: absolute; bottom:5px; left: 50%; transform: translateX(-50%);width: 30px;height: 15px;top: inherit; z-index: 55;cursor: pointer; text-indent: 1000px; overflow: hidden; border: none; background-color: transparent;} .history_box .history_box_inner .slick-slider { position: static; overflow: hidden; height: 100%; } .history_box .history_box_inner .slick-slide img { width: 100%; height: auto; } /* 回到頂部 */ #gototop { position: fixed; right: 10px; bottom:10px; width: 100px; height: 50px; background-color: #fff; box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.2); -webkit-border-radius: 5px 0 0 5px; -moz-border-radius: 5px 0 0 5px; border-radius: 5px 0 0 5px; overflow: hidden; margin-top: 10px; cursor: pointer; display: none; z-index: 4; margin-left: 30px; } .history_sidebar.totopfixed {top: initial;bottom:20px;} #gototop button{width:100%;height:100%;border:0;background-color: #fff;cursor: pointer;} #gototop span { font-size: 14px; font-weight: 600; text-align: center; color: #999999; padding-top: 22px; display: block; } #gototop:before { content: ''; position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-style: solid; border-width: 0 8px 11px 8px; border-color: transparent transparent #dddddd transparent; line-height: 0px; _border-color: #000000 #000000 #dddddd #000000; _filter: progid: DXImageTransform.Microsoft.Chroma(color='#000000'); } /* 684 */ .it684_box{margin-bottom:15px;} /* 會員中心-詢問紀錄 */ .status_result{ margin-bottom:30px;} .member_norespond{ text-align: center; font-size: 26px; padding: 20px;} .status_result .head{ width:100%; height:33px; padding-top:3px; font-size:16px; color:#002a65; text-align:center; background-color:#f6f6f6; font-size:15px; border-top:1px solid #d8d8d8; border-bottom:1px solid #d8d8d8; } .status_result table.status_result_info { width:100%; margin:0 auto; } .status_result table.status_result_info td { text-align:left; vertical-align:top; padding:15px 3%; border-bottom:1px solid #eaeaea; } .status_result table.qa_record { width:100%;line-height: 24px;} .status_result table.qa_record td { vertical-align:top; padding:10px; text-align:left; border-bottom:1px solid #eaeaea; } .status_result table.qa_record td table { width:100%; } .status_result table.qa_record td table td:first-child { width:50px; } .status_result table.qa_record td td { border:none; } /* 110 QA */ .q-time, .a-time{padding:3px 0; color:var(--pic-color-grey-30); font-size:13px;} .it110_img_q{background: url(img_question.png) left top no-repeat;width:110px;height:30px;background-size: 100%;} .it110_img_q2{background: url(img_question2.png) left top no-repeat;width:110px;height:30px;background-size: 100%;display: inline-block;text-indent: -9999px;text-align: left;} .it110_img_a{background: url(img_answer.png) left top no-repeat;width:110px;height:30px;background-size: 100%;} .it110_img_a2{background: url(img_answer2.png) left top no-repeat;width:110px;height:30px;background-size: 100%;display: inline-block;text-indent: -9999px;text-align: left;} .btnArea { width: 100%; margin: 0 auto 30px auto; display: -ms-box; display: -moz-webkit-flex; display: -webkit-flex; display: -ms-flexbox; display: flex; -ms-flex-pack: end; -webkit-justify-content: flex-end;-webkit-box-pack: end; -moz-box-pack: end; justify-content: flex-end; -ms-flex-align: center; -webkit-align-items: center; align-items: center;} .btnArea a { line-height: 46px;} .btnArea > div:not(:last-of-type){ margin-right: 10px;} .btn_ask_question { width: 150px; height: 45px; } /* reply */ .extraBox{position:relative;width:99.8%;margin-bottom:15px;padding-bottom:10px;font-size:15px;border-right:1px solid #ccc;border-left:1px solid #ccc;border-bottom:1px solid #ccc;background-color:#fff;} .extraBox .receiverSame{position:absolute;top:20px;left:270px;display:inline-block;width:300px;} .extraBox .head{height:50px;font-size:16px;color:var(--pic-color-grey-100);padding-top:10px;background:#f6f6f6;border-top:3px solid var(--pic-orange);padding-left:15px;} .extraBox .title{display:inline-block;position:relative;margin-left:20px;line-height:1em;} .extraBox .title span{position:absolute;display:block;right:-105px;top:5px;width:91px;height:8px;} .userInfo table{width:100%;} .userInfo td{padding:10px;vertical-align:middle;} .userInfo td:first-child{padding:10px 20px 10px 45px;width:18%;} .userInfo td:first-child{padding:10px 20px 10px 25px;width:20%;} .userInfo td td:first-child{padding:0;width:auto;} .col_bg td {background-color: #fbfbfb;} input[type="text"], input[type="password"], select {border: 1px solid var(--pic-color-grey-10);height: 40px;font-size:15px; line-height:30px;-moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;color: var(--pic-color-grey-100);padding: 0 22px 0 10px;} select{color: var(--pic-color-grey-100); height:40px; box-sizing: border-box; line-height: 30px; border: 1px solid var(--pic-color-grey-10); -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; padding: 0 22px 0 10px; font-size: 15px; appearance: none; background-color: transparent; background-image: url("data:image/svg+xml;utf8,"); background-repeat: no-repeat; background-position-x: 100%; background-position-y: center;} textarea {height: 80px;font-size:15px; line-height:30px;border: 1px solid var(--pic-color-grey-10);color: var(--pic-color-grey-100);padding: 0 22px 0 10px;-moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;} .btn_prev{width:150px;height:46px;} .btn_prev a{display:block;width:150px;height:46px;} .btn_prev a:hover{background-position:bottom;} /* 會員中心-取消訂單 */ .coldark{color:#e94741 !important;} .h3-return{color:#fff;height:34px;line-height:34px;padding:0 0 0 20px;margin:20px 0;} .list-return ul{list-style-type:decimal;padding:0 66px;line-height:24px;margin-bottom:20px;} .mR10 { margin-right: 10px !important; } /* 會員中心-抵用金查詢 */ #emoney_mem .chk_coins01 { width: 100%; } .chk_coins01 td{text-align: center;} .chk_coins01 tr td{border-left: 1px solid #ddd;} .chk_coins01 tr td:first-of-type { border-left: 0; } .chk_coins01 tbody tr:nth-child(odd) { background-color: #fff; } /* 表單 */ textarea:focus, input:focus{outline: none;} /* 調整首頁元件間距 */ #index .item_668{ max-width:1200px; margin: 0 auto; margin-bottom: 15px;} .it683_box_R{ margin-bottom:0;} .it684_box .owl-theme .owl-nav{ margin: 0;} .it685_box,.item334box{ max-width:1200px; margin: 0 auto; margin-bottom: 15px;} .it685_p{ margin:0 auto 15px auto; height: 100%;} .item280_box .item280_bottom{ padding:0;} .item280_box{ margin-bottom:0;} .item281_box{ margin:0 auto 15px auto;} .it721{ padding-bottom:15px;margin-bottom:0;} .it720{ margin-bottom:5px;} .it721 .it721_title{ margin-top:0; margin-bottom:0;} .it683_box{ margin-bottom: 15px; } .it685_box{ margin-bottom:0;} /* 店家 */ .gh_ShopDetail{ display:none;} .coldshop_hide_logo{ padding-top:2px;} .coldshop_hide{ display:none;} .it684_pbox .it684_p .it684_p_shop li:nth-child(1) a{ display: none;} .it684_pbox .it684_p .it684_p_shop li:nth-child(2){ margin-left: 0;} .gh_SearchBox{ padding: 10px 0 20px 0;} .gh_ProductSearchTOP_array_L01{ display: none;} /* .gh_ProductBox{ width: calc(100% - 10px); margin: 5px; height: 100%;} .gh_Pimg{height: auto;} */ .it40_menuL li input{ height: 30px;} .it40_menuR li select{ height: 30px;} /* 514 */ .it514_box,.it499_discuss_list{ background: #fff;} .it514_detail{ max-width: 100%;} .it514_related_product .owl-controls .owl-prev, .it514_related_product .owl-controls .owl-next{ text-indent: -9999px;} .it514_tag a:link,.it514_tag a:visited{ background:rgba(0, 140, 214, 1);} .it514_tag a:hover,.it514_tag a:active{ background:rgba(0, 140, 214, .9);} .it514_othernews_product .owl-controls{ height: 100%;} .it514_othernews_product .owl-controls .owl-prev, .it514_othernews_product .owl-controls .owl-next{ height: 444px;} .it514_related_product .owl-controls .owl-prev, .it514_related_product .owl-controls .owl-next, .it499_discuss .owl-controls .owl-prev, .it499_discuss .owl-controls .owl-next, .it514_othernews_product .owl-controls .owl-prev, .it514_othernews_product .owl-controls .owl-next{width: 40px;height: 40px;position: absolute; text-indent: -9999px; z-index: 99; top: 50%; margin-top: -20px; } .it514_related_product .owl-controls .owl-prev, .it514_related_product .owl-controls .owl-prev:hover, .it499_discuss .owl-controls .owl-prev, .it499_discuss .owl-controls .owl-prev:hover, .it514_othernews_product .owl-controls .owl-prev, .it514_othernews_product .owl-controls .owl-prev:hover{left: -20px;background: url(arrow-l.svg) no-repeat;} .it514_related_product .owl-controls .owl-next, .it514_related_product .owl-controls .owl-next:hover, .it514_othernews_product .owl-controls .owl-next, .it514_othernews_product .owl-controls .owl-next:hover, .it499_discuss .owl-controls .owl-next, .it499_discuss .owl-controls .owl-next:hover{right: -20px;background: url(arrow-r.svg) no-repeat;} .it514_othernews_product,.it514_related_product{ overflow: unset;} .it514_related_product{ background: #fff;} .it514_othernews_product .owl-controls,.it514_related_product .owl-controls{ height: 40px; top: 50%; margin-top: -20px;} .it514_related_product .owl-controls .owl-prev, .it514_related_product .owl-controls .owl-next{ opacity: 1;} /* 元件594 */ .it594_bottom_btn.fami_item_joo_rule{margin-bottom:20px;} .it594_bg.fami_item_joo_rule .it594_right ul.it594_p_word textarea{resize:none} .it594_bg.fami_item_joo_rule .it594_right .it594_p_name li:nth-child(2) span.it594_red{display:none;} .it594_bg .it594_joo{display:none;} .it594_bg .it594_haofresh{display:block !important;} /*要改的部分如下*/ /*價格顏色*/ .jooshop_price_color{ color: #d50000 !important;font-weight: 600;} /*按鈕*/ a.MemberLogin_newInput05,a.MemberLogin_newInput06,a.MemberLogin_newInput07{-webkit-transition:all 0.2s;-moz-transition:all 0.2s;-ms-transition:all 0.2s;-o-transition:all 0.2s;transition:all 0.2s;} .jooshop_btn_color > input, .jooshop_btn_color > a{ display: block; text-align: center; font-size: 17px; line-height: 46px; padding: 0 16px; height: 48px; background-color:var(--pic-green); color:#FFF; border: 1px solid var(--pic-green);-webkit-transition:all 0.2s;-moz-transition:all 0.2s;-ms-transition:all 0.2s;-o-transition:all 0.2s;transition:all 0.2s; border-radius: 3px;} .jooshop_btn_color > input:hover, .jooshop_btn_color > a:hover{ background-color:var(--pic-light-green-80);border: 1px solid var(--pic-light-green-80);} .jooshop_btn_color2 > input, .jooshop_btn_color2 > a{ display: block; text-align: center; font-size: 17px; border: 1px solid var(--pic-orange); line-height: 46px; padding: 0 16px; height: 48px; background-color:#fff; color:var(--pic-green); -webkit-transition:all 0.2s;-moz-transition:all 0.2s;-ms-transition:all 0.2s;-o-transition:all 0.2s;transition:all 0.2s; border-radius: 3px;} .jooshop_btn_color2 > input:hover, .jooshop_btn_color2 > a:hover{ background-color:var(--pic-light-green-20);} .jooshop_btn_diabled > input, .jooshop_btn_diabled > a{ display: block; text-align: center; font-size: 17px; border: 1px solid var(--pic-color-grey-30); line-height: 46px; padding: 0 16px; height: 48px; background-color:var(--pic-color-grey-30); color:#fff; -webkit-transition:all 0.2s;-moz-transition:all 0.2s;-ms-transition:all 0.2s;-o-transition:all 0.2s;transition:all 0.2s; border-radius: 3px;} .jooshop_btn_diabled > input:hover, .jooshop_btn_diabled > a:hover{ background-color:var(--pic-color-grey-50);} .jooshop_btn_color > input, .jooshop_btn_color2 > input{cursor: pointer;} #product_search .jooshop_btn_color > input{padding:5px 10px;} /* 791 */ .SB_MemberWitemSay{letter-spacing: .3px;} .SB_MemberWitemSay span { margin: 0 10px; color: var(--pic-orange); font-weight: 500; vertical-align: -2px; font-size: 20px;} .SB_MemberWitemBOX{ width:100%; height: auto; margin-bottom: 15px; background-color: #fff; color: #222; font-size: 1rem;} .ygg_MemberW100p{ width:100%;} .SB_MemberWitemTitle03 { border-top: #ddd 1px solid; border-left: #ddd 1px solid; border-right: #ddd 1px solid; position: relative; background-color: #f7f7f7; } .SB_MemberWitemTitle03 p { display: block; height: 40px; border-bottom: #ddd 1px solid; font-size:15px; line-height:40px;; color: #222; padding-left: 15px; } .SB_MemberWitemContent03 { position: relative; border-left: #ddd 1px solid; border-right: #ddd 1px solid; border-bottom: #ddd 1px solid; padding:5px 0 0;} .SB_MemberWitemContent03 > table > tbody > tr:last-of-type td.SB_tablelineb07{padding: 10px 0;} .SB_tableW110{ width:110px;} .SB_tableW130 { width: 130px; } .SB_tableW270 { width: 200px; } .SB_tablelineb06 tr{border-top: #eee 1px solid;} .SB_MemberOrder_title.SB_MemberOrder_w01{background-color: #f8f8f8;} .SB_MemberOrder_w01 {color: #aaa; text-align: center; font-size:.8125rem; line-height:34px;} .SB_MemberOrder_w03 { font-size:.8125rem; line-height:34px; color:#aaa; text-align: center;} .SB_tablelineb07 { border-right: #ddd 1px dotted; } .it53_orderinfo .SB_tablelineb07 { border-right: #eee 1px solid;} .MemberOrder_Deal { text-align: center; padding: 5px 0; } .MemberOrder_Deal a { color: #222; text-decoration:none; border-bottom-width:1px; border-bottom-style: solid; font-size: .9375rem; margin-bottom: 5px; display: inline-block; line-height: 1;} .MemberOrder_Deal a:hover,.SB_MemberOrder_w02 a:hover{color:var(--pic-orange);} .SB_tableW107 { width: 107px; background: #fbfbfb; border-right: #eee 1px solid; } #order_detail .SB_MemberOrder_w02,#visitor_order .SB_MemberOrder_w02{width:387px; font-size:.9375rem; padding-left: 10px;} .SB_MemberOrder_w02 a{font-size:.9375rem; line-height:34px; border-bottom-width:1px; border-bottom-style: solid;} #order_detail .SB_MemberOrder_w02 .form_gloss,#visitor_order .SB_MemberOrder_w02 .form_gloss{ color:var(--pic-orange);} .MemberOrder_Price{text-align: center;} .SB_MemberWitemContent03 .SB_tablelineb06 .SB_tablelineb07.MemberOrder_Name{padding:10px; line-height: 20px; font-size: 14px;} .SB_tablelineb07 a{display: block; width: auto; height: auto; text-align: center;} .SB_tablelineb07 a img{width: 100px; height:100px;} .SB_MemberOrder_btn { width: 150px; height: 45px; margin: 0 auto; margin-bottom: 30px; } .SB_MemberOrder_btn input { display: block; width: 150px; height: 45px; border: none; cursor: pointer; font-size: 15px;} /* 商品分類頁 */ #store_product_sort .main_content_no_center{ display: -ms-box; display: -moz-webkit-flex; display: -webkit-flex; display: -ms-flexbox; display: flex;} #store_product_sort .main_content_no_center .it913_default{ width: 225px;} #store_product_sort .main_content_no_center .it951-default{ width: calc(100% - 225px); padding-left: 18px;} /* 商品搜尋頁 */ #store_product_search .main_content_no_center{ display: -ms-box; display: -moz-webkit-flex; display: -webkit-flex; display: -ms-flexbox; display: flex;} #store_product_search .main_content_no_center .it913_default{ width: 225px;} #store_product_search .main_content_no_center .it952-default{ width: calc(100% - 225px); padding-left: 18px;} /* 340 購物清單 */ .it340_BOX{ width:100%; margin:0 auto; margin-bottom:20px;} .it340_BOX .it_GHTitle_BOX .it_GHTitle{ background:url(images/it340_Cart.svg) left center no-repeat; background-size: 35px 35px; padding-left:40px;} .it340_BOXin{ border:1px solid #eaeaea; border-top:0; background:#fff;} .it340_BOX ul:hover{ background:#eaeaea;} .it340_BOX ul li{ float:left; display:block; min-height:auto; font-size:15px; padding:10px ;} .it340_box_title > ul > li{ line-height: 50px;} .it340_BOX ul{ border-bottom:1px dotted #eaeaea; display: flex; align-items: center;} .it340_BOX ul:last-child{ border:0;} .it340_BOX ul li.it340_img{padding:0 10px;width:10%;text-align: center;} .it340_BOX ul li.it340_img > img{ display: block; max-width: 100%; width: auto!important; max-height: 50px;} .it340_BOX ul li.it340_name{ width:60%; padding:0 10px;} .it340_BOX ul li.it340_name a{ display:block; width:100%; font-size:15px; line-height:20px; text-align:left;} .it340_BOX ul li.it340_num{ width:15%; text-align:center;} .it340_BOX ul li.it340_price{ width:30%; padding:0 10px; text-align:right;} .it340_BOX ul li.it340_go {width: 17.5%;padding:10px 2px;} .it340_BOX ul li.it340_go a{display: block;width:100%;height:40px;line-height: 40px;font-size: 16px;color:#fff;text-align: center;text-indent: inherit; padding: 0 12px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;background-color: var(--pic-orange);} .it340_BOX ul li.it340_go.it340_normal a{background-color: #ef901a;} .it340_BOX ul li.it340_go.it340_fridge a{background-color: #02B347;} .it340_BOX ul li.it340_go.it340_freeze a{background-color: #0cb4f0;} .it340_BOX ul li.it340_delete {width: 17.5%;padding:10px 10px 10px 5px;} .it340_BOX ul li.it340_delete a{display: block;width:100%;height:40px;line-height: 40px;font-size: 16px;color:#fff;text-align: center;background: var(--pic-color-grey-100);text-indent: inherit; padding: 0 12px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;} .it340_box_title,.it340_BOX .it340_box_title ul:hover{border:0;background: var(--pic-color-grey-10); height: 50px;} .it340_box_title ul li{ height: 50px; padding: 0; } .it_GHTitle_BOX{width: 100%;height: 40px;background: none;border-bottom: #e7e7e7 1px solid;} .it_GHTitle_BOX h3.it_GHTitle{height:40px;} .it340_BOX ul li.it340_num{width:10%;} .it340_BOX ul li.it340_name{padding: 0 10px 0 20px;} .it340_BOX .it_GHTitle_BOX .it_GHTitle{background: none;font-size:15px; line-height:50px;color: var(--pic-green);padding-left: 16px;padding-left:0;} .it340_BOX ul:hover{background: #f5f5f5;} /* 808 */ .it808_content{ background-color:var(--pic-light-green-10)!important; border: solid 2px var(--pic-green)!important;} .it808_more a{ background-color: var(--pic-green)!important;} /* 429 */ .it429-todayNotShow span::after{ background: var(--pic-green) url(addCartBtnCheak.png) no-repeat center / 80%!important;} .pic-BgText-color-orange{ background-color: var(--pic-green)!important;} /* 850 */ .it850_share_box{ bottom: 190px!important;} /* 913 */ .it913-first .it913-sort-li .it913-li-title{ background-color: var( --pic-light-green-20)!important;} .it913-second .it913-sort-li .it913-li-title{ background-color: var(--pic-light-green-10)!important;} /* 74 */ .it74_result .it74_num,.it952_result .it952_num{ color: var(--pic-light-red-80)!important;} .gh_ProductSearchTOP_array_L li.moshover a{ background-color: var(--pic-green)!important;} /* 商品樣式 */ .pic-pds-default01 .pic-pds-imgbox .pic-pds-btn .pic-pds-addlist a, .pic-pds-default02 .pic-pds-btn .pic-pds-addlist a{ background: url(pic-pd-addlist.svg) left top no-repeat #fff; background-size: 50px; border-color: var(--pic-light-red-80);} .pic-pds-default01 .pic-pds-imgbox .pic-pds-btn .pic-pds-addlist a:hover, .pic-pds-default01 .pic-pds-imgbox .pic-pds-btn .pic-pds-addlist.active a, .pic-pds-default02 .pic-pds-btn .pic-pds-addlist a:hover, .pic-pds-default02 .pic-pds-btn .pic-pds-addlist.active a{ background: url(pic-pd-addlist.svg) left -50px no-repeat #fff; background-size: 50px; border-color: var(--pic-light-red-80);} .pic-pds-default01 .pic-pds-imgbox .pic-pds-btn .pic-pds-addcart a, .pic-pds-default02 .pic-pds-btn .pic-pds-addcart a{ background: url(pic-pd-addcart.svg) left top no-repeat; background-size: 50px; background-color:var(--pic-light-red-80); border-color: var(--pic-light-red-80);} .pic-pds-default01 .pic-pds-imgbox .pic-pds-btn .pic-pds-addcart a:hover, .pic-pds-default02 .pic-pds-btn .pic-pds-addcart a:hover{ background: url(pic-pd-addcart.svg) left -50px no-repeat; background-size: 50px; background-color:var(--pic-light-red-80); border-color: var(--pic-light-red-80);} /* 版尾 */ .FOR_FOOTER{ background-color: #f6f6f6;} .footer_box,.footer_cr .footer_cr_content{ width:1200px; height: auto; margin: 0 auto;} .footer_box{ display: flex; justify-content: space-between; align-items: center; padding: 20px 0;} .footer_box .footer_box_left{ width:26%;} .footer_box .footer_box_left > ul > li{ font-size: 14px; color: #333; line-height: 25px; font-weight: 500;} .footer_box .footer_box_left > ul > li > span{ margin-left: 30px;} .footer_box .footer_box_left .footer_logo{ margin-bottom:10px;} .footer_box .footer_box_left .footer_logo a{ display: block; width:240px; height:75px;} .footer_box .footer_box_left .footer_logo a img{ display: block; width: 100%; height: auto;} .footer_box .footer_box_center{ display: flex; width:24%; padding: 0 10px;} .footer_box .footer_box_center img{ display: block; width: 100%; max-width: 115px; height: auto; margin: 0 5px;} .footer_box .footer_box_right{ width:40%; display: flex; justify-content: space-between; align-items: flex-start;} .footer_box .footer_box_right .footer_box_list > h4, .footer_box .footer_box_right .footer_box_list > .footer_box_list_title{ margin-bottom: 10px; color:var(--pic-green); font-size: 16px; font-weight: 600;} .footer_box .footer_box_right .footer_box_list > h4 > a, .footer_box .footer_box_right .footer_box_list > .footer_box_list_title a{ display:block; width: 100%; font-size: 15px; color: #313131; text-align: center;} .footer_box .footer_box_right .footer_box_list > ul > li{ margin-bottom: 5px;} .footer_box .footer_box_right .footer_box_list > ul > li > a{ display:block; width: 100%; font-size: 15px; color:var( --pic-color-grey-90); text-align: center;} .footer_box .footer_box_right .footer_box_list > ul.footer_flex{ display: flex;} .footer_box .footer_box_right .footer_box_list > ul.footer_flex > li{ margin: 0 3px;} .footer_box .footer_box_right .footer_box_list > ul > li.footer_phone a, .footer_box .footer_box_right .footer_box_list > ul > li.footer_line a{ display: block; width: 30px; height: 30px; text-indent: -9999px;} .footer_box .footer_box_right .footer_box_list > ul > li.footer_phone a{ background: url(phone-call.svg) center no-repeat; background-size: 30px;} .footer_box .footer_box_right .footer_box_list > ul > li.footer_line a{ background: url(line.svg) center no-repeat; background-size: 30px;} .footer_cr{ width: 100%; height:30px; background-color: var(--pic-green); position: relative; font-size: 14px; color: var(--pic-neutral-0); line-height: 30px;} .footer_cr_content ul{ display: flex; justify-content: space-between; align-items: center;} .footer_cr_content ul li{ width: 50%;} .footer_cr_content ul li:nth-child(1){ text-align: left;} .footer_cr_content ul li:nth-child(2){ text-align: right;} /*! =================== 新色系 START =================== */