/* ============================================ */ /* === B U T T O N & I C O N - S T Y L E === */ /* ============================================ */ /* - B U T T O N - */ button, input[type="button"], input[type="submit"] { cursor: pointer; border: 0; border-radius: 5px;} .goorder_btn,.veiw_btn,.okiknow_btn,.accept_btn,.okgo_btn { margin-bottom:7px; width: 111px; height: 41px; border: none; background-repeat:no-repeat;} .menu_select_info .veiw_btn {margin-right: 3px;} /* ==== 訂購去 ==== */ .goorder_btn { background-image:url(../images/btn_order.png); background-position: left top;} .goorder_btn:hover {background-image:url(../images/btn_order.png); background-position: left bottom;} /* ==== 確認 ==== */ .okgo_btn { background-image:url(../images/btn_ok.png); background-position: left top;} .okgo_btn:hover {background-image:url(../images/btn_ok.png); background-position: left bottom;} /* ==== 搜尋 ==== */ .searchBtn { width: 280px; height: 41px; display: inline-block; text-indent: -9999px; font-size: 15px; font-weight: bold; line-height: 18px; color: #ffffff; border-radius: 5px; background: url("../images/btn_search.png") no-repeat scroll center 0 / 282px auto;} .searchBtn:hover { background: url("../images/btn_search.png") no-repeat scroll center -53px / 282px auto;} /* ==== G P S ==== */ .gpsBtn { width: 282px; height: 41px; text-indent: -9999px; font-size: 15px; font-weight: bold; line-height: 18px; color: #ffffff; border-radius: 5px; background: #006490 url("../images/btn_gpsbtn.png") no-repeat scroll left top / 282px auto;} .gpsBtn:hover { background: url("../images/btn_gpsbtn.png") no-repeat scroll left -45px / 282px auto;} .mapBtn { width: 282px; height: 41px; text-indent: -9999px; font-size: 15px; font-weight: bold; line-height: 18px; color: #ffffff; border-radius: 5px; background: #006490 url("../images/btn_mapbtn.png") no-repeat scroll left top / 282px auto;} .mapBtn:hover { background: url("../images/btn_mapbtn.png") no-repeat scroll left -45px / 282px auto;} /* ==== G P S t i p ==== */ .gpsBtn_tip { display: inline-block; width: 282px; height: 41px; text-indent: -9999px; font-size: 15px; font-weight: bold; line-height: 18px; color: #ffffff; border-radius: 5px; border: none; cursor: pointer; background: url("../images/btn_gpstip.png") no-repeat scroll left top;} .gpsBtn_tip:hover { background: url("../images/btn_gpstip.png") no-repeat scroll left -45px;} /* ==== 立 即 訂 購 ==== */ .orderNow_btn { width: 171px; height: 41px; text-indent: -9999px; margin-bottom: 20px; margin-top: 20px; border-radius: 5px; background: url(../images/btn_orfernow.png) no-repeat scroll left top / 171px auto;} .orderNow_btn:hover { background: url(../images/btn_orfernow.png) no-repeat scroll left -45px / 171px auto;} .btn_orderCheckout { width: 171px; height: 41px; text-indent: -9999px; margin-bottom: 20px; border-radius: 5px; background: url(../images/btn_orderCheckout.png) no-repeat scroll left top / 171px auto;} .btn_orderCheckout:hover { background: url(../images/btn_orderCheckout.png) no-repeat scroll left -45px / 171px auto;} #mo_bottom > .orderNow_btn { margin: 35px 0; } /* ==== email 登 入 ==== */ .emaillogin_btn{ width: 142px; height: 40.5px; text-indent:-9999px; border-radius: 5px; margin: 0 2px;} .emailintegration_btn { background: url(../images/btn_emailintegration.png) no-repeat scroll left top / 142px auto;} .emailintegration_btn:hover { background: url(../images/btn_emailintegration.png) no-repeat scroll left -40.5px / 142px auto;} /* ==== F B 登 入 ==== */ .fblogin_btn{ width: 142px; height: 40.5px; background: url(../images/btn_fblogin.png) no-repeat scroll left top / 142px auto; text-indent:-9999px; border-radius: 5px; margin: 0 2px;} .fblogin_btn:hover{ background: url(../images/btn_fblogin.png) no-repeat scroll left bottom / 142px auto; } .fbregistered_btn { background: url(../images/btn_fbreg.png) no-repeat scroll left top / 142px auto;} .fbregistered_btn:hover { background: url(../images/btn_fbreg.png) no-repeat scroll left -40.5px / 142px auto;} .fbintegration_btn { background: url(../images/btn_fbintegration.png) no-repeat scroll left top / 142px auto;} .fbintegration_btn:hover { background: url(../images/btn_fbintegration.png) no-repeat scroll left -40.5px / 142px auto;} /* ==== LINE 登 入 ==== */ .linelogin_btn{ width: 142px; height: 40.5px; background: url(../images/btn_linelogin.png) no-repeat scroll left top / 142px auto; text-indent:-9999px; border-radius: 5px; margin: 0 2px;} .linelogin_btn:hover{ background: url(../images/btn_linelogin.png) no-repeat scroll left bottom / 142px auto; } .lineregistered_btn { background: url(../images/btn_linereg.png) no-repeat scroll left top / 142px auto;} .lineregistered_btn:hover { background: url(../images/btn_linereg.png) no-repeat scroll left -40.5px / 142px auto;} .lineintegration_btn { background: url(../images/btn_lineintegration.png) no-repeat scroll left top / 142px auto;} .lineintegration_btn:hover { background: url(../images/btn_lineintegration.png) no-repeat scroll left -40.5px / 142px auto;} /* ==== 登 入 ==== */ .login_btn{ width: 142px; height: 41px; background: url(../images/btn_login.png) no-repeat scroll left top / 142px auto; text-indent:-9999px; border-radius: 5px; margin: 0 2px;} .login_btn:hover { background: url(../images/btn_login.png) no-repeat scroll left -49px / 142px auto;} /* ==== 送 出 ==== */ .send_btn{ width: 108px; height: 41px; font-size: 0; background: url(../images/btn_sendRed.png) no-repeat scroll left top / 108px auto; border-radius: 5px;} .send_btn:hover { background: url(../images/btn_sendRed.png) no-repeat scroll left -48px / 108px auto;} /* ==== 加 入 購 物 車 B L U E ==== */ .addorderBtn{ width: 129px; height: 31px; border-radius: 5px; text-indent: -9999px; background: url(../images/btn_BluaddcarBlu.png) no-repeat left top;} .addorderBtn:hover{ background: url(../images/btn_BluaddcarBlu.png) no-repeat left bottom;} /* ==== 加 入 購 物 車 R E D ==== */ .btn_redaddcar { width: 171px; height: 41px; border-radius: 5px; background: #F60025 url(../images/btn_addcarRed.png) no-repeat scroll left top / 171px auto;} .btn_redaddcar:hover { background: url(../images/btn_addcarRed.png) no-repeat left bottom;} /* ==== 繼 續 購 買 ==== */ .btn_continue { width: 116px; height: 41px; border-radius: 5px; background: url(../images/btn_continue.png) no-repeat;margin-right: 220px; } /* ==== 回 上 一 步 R E D ==== */ .btn_backstep{ width: 98px; height: 41px; border-radius: 5px; background: url(../images/btn_backstep.png) no-repeat;margin-right: 220px;} /* ==== 回 上 一 頁 R E D ==== */ .btn_redbackpage{ width: 118px; height: 41px; border-radius: 5px; background: url(../images/btn_Redbackpage.png) no-repeat scroll left top / 118px auto;} .btn_redbackpage:hover { background: url(../images/btn_Redbackpage.png) no-repeat left bottom / 118px auto;} .orderInfo_bottom_btn > .btn_redbackpage { margin-right: 30px;} /* ==== 重 新 選 擇 ==== */ .btn_reselected{ width: 118px; height: 41px; border-radius: 5px; background: url(../images/btn_Reselected.png) no-repeat scroll left top / 118px auto;} .btn_reselected:hover { background: url(../images/btn_Reselected.png) no-repeat left bottom / 118px auto;} .reselectedBtn{ width: 118px; height: 41px; margin:3px; border-radius: 5px; background: url(../images/btn_Reselected.png) no-repeat scroll left top / 118px auto;} .reselectedBtn:hover { background: url(../images/btn_Reselected.png) no-repeat left bottom / 118px auto;} /* ==== 確 認 送 出 ==== */ .btn_checksned { width: 158px; height: 41px; text-indent: -9999px; border-radius: 5px; background: url(../images/btn_checksned.png) no-repeat scroll left top / 158px auto;} .btn_checksned:hover { background: url(../images/btn_checksned.png) no-repeat scroll left bottom / 158px auto; } .checksnedBtn { width: 158px; height: 41px; margin:3px; text-indent: -9999px; border-radius: 5px; background: url(../images/btn_checksned.png) no-repeat scroll left top / 158px auto;} .checksnedBtn:hover { background: url(../images/btn_checksned.png) no-repeat scroll left bottom / 158px auto; } .btn_orderContinue { margin-right: 220px; width: 158px; margin-right:220px; height: 41px; text-indent: -9999px; border-radius: 5px; background: url(../images/btn_orderContinue.png) no-repeat scroll left top / 158px auto;} .btn_orderContinue:hover { background: url(../images/btn_orderContinue.png) no-repeat scroll left bottom / 158px auto; } /* ==== 返 回 列 表 ==== */ .btn_back_list{ width: 158px; height: 41px; text-indent: -9999px; border-radius: 5px; background: url(../images/btn_back_list.png) no-repeat scroll left top / 158px auto;} .btn_back_list:hover { background: url(../images/btn_back_list.png) no-repeat scroll left bottom / 158px auto; } .btn_back_search2{ width: 158px; height: 41px; text-indent: -9999px; border-radius: 5px; background: url(../images/btn_back_search2.png) no-repeat scroll left top / 158px auto;} .btn_back_search2:hover { background: url(../images/btn_back_search2.png) no-repeat scroll left bottom / 158px auto; } .btn_agree{ width: 114px; height: 41px; text-indent: -9999px; border-radius: 5px; background: url(../images/btn_agree.png) no-repeat scroll left top / 114px auto;} .btn_agree:hover { background: url(../images/btn_agree.png) no-repeat scroll left bottom / 114px auto; } .back_list a{ display:block; text-indent:-1000px; overflow:hidden; width: 161px; height: 41px; text-indent: -9999px; border-radius: 5px; background: url(../images/btn_backTasteco.png) no-repeat scroll left top / 161px auto;} .back_list a:hover { background: url(../images/btn_backTasteco.png) no-repeat scroll left bottom / 161px auto; } /* ==== 搜 尋 ==== */ .btn_school_search { width: 158px; height: 41px; text-indent: -9999px; border-radius: 5px; background: url(../images/btn_school_search.png) no-repeat scroll left top / 158px auto; } .btn_school_search:hover { background: url(../images/btn_school_search.png) no-repeat scroll left bottom / 158px auto; } .btn_back_search{ width: 158px; height: 41px; text-indent: -9999px; border-radius: 5px; background: url(../images/btn_back_search.png) no-repeat scroll left top / 158px auto;} .btn_back_search:hover { background: url(../images/btn_back_search.png) no-repeat scroll left bottom / 158px auto; } /* ==== 現 金 付 款 ==== */ .btn_checkcash { width: 158px; height: 41px; text-indent: -9999px; border-radius: 5px; background: url(../images/btn_checkcash.png) no-repeat scroll left top / 158px auto;} .btn_checkcash:hover { background: url(../images/btn_checkcash.png) no-repeat scroll left bottom / 158px auto; } /* ==== 取 消 訂 單 ==== */ .btn_checkcancel { width: 158px; height: 41px; text-indent: -9999px; border-radius: 5px; background: url(../images/btn_checkcancel.png) no-repeat scroll left top / 158px auto;} .btn_checkcancel:hover { background: url(../images/btn_checkcancel.png) no-repeat scroll left bottom / 158px auto; } /* ==== 儲 存 變 更 ==== */ .member_SnC > .btn_save { margin-right: 35px;} .btn_save { width: 158px; height: 41px; text-indent: -9999px; border-radius: 5px; background: url(../images/btn_save.png) no-repeat scroll left top / 158px auto;} .btn_save:hover { background: url(../images/btn_save.png) no-repeat scroll left bottom / 158px auto;} /* ==== 取 消 變 更 ==== */ .btn_cancel { width: 158px; height: 41px; text-indent: -9999px; border-radius: 5px; background: url(../images/btn_cancel.png) no-repeat scroll left top / 158px auto;} .btn_cancel:hover { background: url(../images/btn_cancel.png) no-repeat scroll left bottom / 158px auto;} /* ==== 外 帶 / 外 送 ==== */ .deliveryOn_btn,.takeoutOn_btn,.delivery_btn,.takeout_btn,.viewpointOn_btn,.viewpoint_btn{ width: 322px; height: 79px; font-size: 0; display: inline-block; background-repeat: no-repeat; margin:0px 2px;} .deliveryOn_btn{ background: url(../images/shop/btn_pickup_mode.png); background-position: left 80px;} .takeoutOn_btn{ background: url(../images/shop/btn_pickup_mode.png); background-position: -322px 80px;} .delivery_btn{ background: url(../images/shop/btn_pickup_mode.png); background-position: left top;} .takeout_btn{ background: url(../images/shop/btn_pickup_mode.png); background-position: -322px top;} .delivery_btn:hover{ background: url(../images/shop/btn_pickup_mode.png); background-position: left 80px;} .takeout_btn:hover{ background: url(../images/shop/btn_pickup_mode.png); background-position: -322px 80px;} .viewpointOn_btn{ background: url(../images/shop/btn_pickup_mode.png); background-position: -644px 80px;} .viewpoint_btn{ background: url(../images/shop/btn_pickup_mode.png); background-position: -644px top;} .viewpoint_btn:hover{ background: url(../images/shop/btn_pickup_mode.png); background-position: -644px 80px;} /* ==== 管 理 ==== */ .btn_set{ width: 90px; height: 30px; background: url(../images/btn_set.png) no-repeat scroll left top / 90px auto; text-indent: -9999px; border-radius: 5px;} /* ==== 活 動 門 市 ==== */ .store_btn{ width: 134px; height: 41px; margin-bottom:7px; background-repeat:no-repeat; background-color:#FFF3DE; background-position: left top; background-image:url(../images/btn_store.png);} .store_btn:hover{ background-position: left bottom; } /* ==== 查 詢 門 市 ==== */ .search-store_btn{ width: 102px; height: 41px; margin-bottom:7px; background-repeat:no-repeat; background-color:#FFF3DE; background-position: left top; background-image:url(../images/btn_search-store.png);} .search-store_btn:hover{ background-position: left bottom; } /* ==== 活 動 詳 情 ==== */ .act-details_btn{ width: 102px; height: 41px; margin-bottom:7px; background-repeat:no-repeat; background-color:#FFF3DE; background-position: left top; background-image:url(../images/btn_act-details.png);} .act-details_btn:hover{ background-position: left bottom; } /* ==== 加 入 常 用 地 址 ==== */ .addaddress_btn { width: 122px; height: 27px;background-color:#FFFFFF; vertical-align: middle; background-repeat:no-repeat; background-position: left top; background-image:url(../images/btn_search-store.png);margin-bottom:6px;} .addaddress_btn:hover { background-position: left bottom; } /* ==== 加 入 常 用 門 市 ==== */ .addstore_btn { width: 122px; height: 27px;background-color:#FFFFFF; vertical-align: middle; background-repeat:no-repeat; background-position: left top; background-image:url(../images/btn_addstore.png);margin-bottom:6px;} .addstore_btn:hover { background-position: left bottom; } /* ==== 刪 除 ==== */ .trashcan_btn { width: 13px; height: 17px; background-image:url(../images/icon_delete.png); background-repeat:no-repeat; background-size: contain; border-radius: 0px;} .trashcan_icon { width: 13px; height: 17px; background-image:url(../images/icon_delete2.png); background-repeat:no-repeat; background-size: contain; border-radius: 0px;display: inline-block;padding-right: 5px;} .deleteimg { margin-top:50px; background-color:rgba(0, 0, 0, 0); color:#FFFFFF; font-size:15px; font-family:Microsoft JhengHei; } .Del{ width: 13px; height: 17px; display: inline-block; margin-right: 5px; background-image: url(../images/icon_delete.png); background-repeat: no-repeat; background-size: contain; vertical-align: text-top; border-radius: 0px;} /* ==== O K ， 我 知 道 了 ==== */ .okiknow_btn{ width:161px; background-image:url(../images/btn_okiknow.png); background-position: left top; background-repeat: no-repeat;} .okiknow_btn:hover { background-position: left bottom;} /* ==== 檢 視 ==== */ .veiw_btn{ background-position: left top; background-image:url(../images/btn_menu_veiw.png);} .veiw_btn:hover { background-position: left bottom;} /* ==== 看 更 多 ==== */ .lookmore_btn{ width: 128px; height: 41px; background: url(../images/btn_lookmore.png) no-repeat; background-size: contain;} /* ==== 送出訂購資料 ==== */ .btn_senddata { width:183px; height:41px; background:url(../images/btn_senddata.png) center center no-repeat;background-size:contain;} /* ==== 下一步 ==== */ .btn_nextstep { width:218px; height:41px; background:url(../images/btn_nextstep.png) center center no-repeat;background-size:contain;} /* ==== 同意並進入網站 ==== */ .accept_btn {width: 161px; background-image: url(../images/btn_accept.png); background-position: left top; background-repeat: no-repeat;} .accept_btn:hover {background-position: left bottom; } /* I C O N */ /* ==== 麵包 ==== */ #breadcrumbs-one img {width: 17px; height: 15px;} /* ==== 限外帶 ==== */ .takeout { position: absolute; width:55px; height:44px; background-image:url(../images/icon_menu_takeout.png); background-size: contain; background-repeat: no-repeat;} /* ==== PAGETOP ==== */ .pagetop_btn{ position:fixed; height:52px; bottom:10px;right:20px;} .pagetop_btn img{cursor: pointer; width: 52px; height: 52px;} /* ==== retracted ICON ==== */ .redarch_title > span {margin-right: 10px;} .icon_Whitehouse{ display: inline-block; width: 27px; height: 30px; vertical-align: text-top; background: url(../images/icon_shopname_white.png) no-repeat; background-size: contain;} .icon_Blackhouse{ display: inline-block; width: 27px; height: 30px; vertical-align: text-bottom; background: url(../images/icon_shopname.png) no-repeat; background-size: contain;} .icon_orderinfo{ display: inline-block; width: 30px; height: 30px; vertical-align: text-top; background: url(../images/icon_orderinfo.png) no-repeat; background-size: contain;} .icon_orderform{ display: inline-block; width: 31px; height: 33px; vertical-align: text-top; background: url(../images/icon_orderform.png) no-repeat; background-size: contain;} .icon_ordergift{ display: inline-block; width: 27px; height: 31px; vertical-align: text-top; background: url(../images/icon_ordergift.png) no-repeat; background-size: contain;} .icon_ordertickets{ display: inline-block; width: 27px; height: 31px; vertical-align: text-top; background: url(../images/icon_ordertickets.png) no-repeat; background-size: contain;} .icon_orderdone{ display: inline-block; width: 31px; height: 35px; vertical-align: text-top; background: url(../images/icon_orderdone.png) no-repeat; background-size: contain;} .icon_orderadd{ display: inline-block; width: 38px; height: 33px; vertical-align: text-top; background: url(../images/icon_orderadd.png) no-repeat; background-size: contain;} .icon_love{ display: inline-block; width: 34px; height: 29px; vertical-align: text-top; background: url(../images/icon_menu_select.png) no-repeat; background-size: contain;} .icon_pizza{ display: inline-block; width: 36px; height: 32px; vertical-align: text-top; background: url(../images/icon_pizza.png) no-repeat; background-size: contain;} .icon_singup{ display: inline-block; width: 42px; height: 34px; vertical-align: text-bottom; background: url(../images/icon_singup.png) no-repeat; background-size: contain;} .icon_question{ display: inline-block; width: 28px; height: 28px; vertical-align: text-top; background: url(../images/icon_question.png) no-repeat; background-size: contain;} /* ==== Small ICON ==== */ .shop_open{ width: 20px; height: 20px; background-image: url(../images/icon_search.png); background-repeat: no-repeat; background-size: contain; display: inline-block; vertical-align: text-top;} .icon_mapadd{ width: 29px; height: 22px; display: inline-block; background-image: url(../images/icon_garymap.png); background-size: contain; background-repeat: no-repeat; vertical-align: text-top;} .non-frychicken{ width: 30px; height: 32px; display: inline-block; background-image: url(../images/icon-non-frychicken.png); background-size: contain; background-repeat: no-repeat; vertical-align: middle;} .icon_garytel{ width: 15px; height: 15px; display: inline-block; vertical-align: top; background:url(../images/icon_garytel.png) no-repeat; background-size: contain; margin-top:3px;} .icon_garyadd{ width: 15px; height: 15px; display: inline-block; vertical-align: top; background:url(../images/icon_garyadd.png) no-repeat; background-size: contain; margin-top:3px;} .icon_garytime{ width: 15px; height: 15px; display: inline-block; vertical-align: top; background:url(../images/icon_garytime.png) no-repeat; background-size: contain; margin-top:3px;} .arrowLeft_blue{ color: #05678c; padding-left: 25px; background-image: url(../images/icon_backlist.png); background-repeat: no-repeat; background-position: left; background-size: contain;} .icon_menu_6{ width: 28px; height: 28px; display: inline-block; background:url(../images/icon_menu_6.png) no-repeat; background-size: contain;} .icon_menu_xbig{ width: 28px; height: 28px; display: inline-block; background: url(../images/icon_menu_xbig.png) no-repeat; background-size: contain;} .icon_menu_small{ width: 28px; height: 28px; display: inline-block; background: url(../images/icon_menu_small.png) no-repeat; background-size: contain;} .icon_menu_big{ width: 28px; height: 28px; display: inline-block; background: url(../images/icon_menu_big.png) no-repeat; background-size: contain;} .icon_menu_i{ width: 19px; height: 19px; display: inline-block; margin-left: 5px; vertical-align: text-top; background: url(../images/icon_menu_i.png); background-size: contain;} .icon_menu_food{ width: 42px; height: 22px; display: inline-block; background: url(../images/icon_menu_food.png); background-size: contain;} .menu_pizza_title td img{ width: 38px; height: 34px;} /* ==== footer Q&A ==== */ .faq .q img {width:32px;height:26px;} .faq .a img {width:32px;height:25px;} /* ==== 加價 ==== */ .Increase {width:55px;height:44px;position: absolute; background-image:url(../images/menu_Increase2_icon.png); background-size: contain; background-repeat: no-repeat;} .Increase2 {width:40px;height:39px;padding-left:5px;} /* ==== 價格 ==== */ .menu_pizza_price img {width:28px;} /* ==== 單選取方塊 radio ==== */ .radio input[type="radio"] { display:none;} .radio input[type="radio"] + label{ cursor: pointer;} .radio input[type="radio"] + label span { display:inline-block; width:22px; height:22px; margin:-2px 4px 0 0; vertical-align:middle; background:url(../images/radio.png) -28px top no-repeat;} .radio input[type="radio"]:checked + label span{ background:url(../images/radio.png) left top no-repeat;} /* ==== 多選取方塊 checkbox ==== */ .checkbox{ text-align: left;} .checkbox input[type="checkbox"] { display: none;} .checkbox input[type="checkbox"] + label{ cursor: pointer;} .checkbox input[type="checkbox"] + label span { display:inline-block; width:20px; height:17px; margin:-2px 4px 0 0; vertical-align:middle; background:url(../images/checkbox_red.png) left top no-repeat;} .checkbox input[type="checkbox"]:checked + label span{ background:url(../images/checkbox_red.png) -25px top no-repeat;} .checkbox > span { margin-left: 40px;} .checkbox ul{display: inline-table; width: 85%;} /* ==== 觀 看 B L U E ==== */ .viewBtn{ width: 85px; height: 31px; border-radius: 5px; text-indent: -9999px; background: url(../images/btn_joinus_view.png) no-repeat left top;} .viewBtn:hover{ background: url(../images/btn_joinus_view.png) no-repeat left bottom;} /* ==== 應 徵 B L U E ==== */ .applyBtn{ width: 85px; height: 31px; border-radius: 5px; text-indent: -9999px; background: url(../images/btn_apply.png) no-repeat left top;} .applyBtn:hover{ background: url(../images/btn_apply.png) no-repeat left bottom;} /* ==== 線上報名 B L U E ==== */ .signBtn{ width: 85px; height: 31px; border-radius: 5px; text-indent: -9999px; background: url(../images/btn_sign.png) no-repeat left top;} .signBtn:hover{ background: url(../images/btn_sign.png) no-repeat left bottom;} .signBtn1{ width: 85px; height: 31px; border-radius: 5px; text-indent: -9999px; background: url(../images/btn_sign1.png) no-repeat left top;} .signBtn1:hover{ background: url(../images/btn_sign1.png) no-repeat left bottom;} .signBtn2{ width: 85px; height: 31px; border-radius: 5px; text-indent: -9999px; background: url(../images/btn_sign2.png) no-repeat left top;} .signBtn2:hover{ background: url(../images/btn_sign2.png) no-repeat left bottom;} /* ==== 滿額 B L U E ==== */ .endBtn{ width: 85px; height: 31px; border-radius: 5px; text-indent: -9999px; background: url(../images/btn_end.png) no-repeat left top;} /* ==== 重新輸入 ==== */ .resetBtn { margin: 3px; width: 158px; height: 41px; border-radius: 5px; text-indent: -9999px; background: url(../images/btn_reset.png) no-repeat left top; } .resetBtn:hover { background: url(../images/btn_reset.png) no-repeat left bottom; } /* ==== 不要統編，直接訂購 ==== */ .subscribeBtn { margin:3px; width: 253px; height: 41px; border-radius: 5px; text-indent: -9999px; background: url(../images/btn_subscribe.png) no-repeat left top; } .subscribeBtn:hover { background: url(../images/btn_subscribe.png) no-repeat left bottom; } /* MEDIA */ @media (max-width: 900px){ /* ==== 加 入 常 用 門 市 / 地 址 ==== */ .addaddress_btn,.addstore_btn{margin:0 0 10px 0px; width:100% ; background-size: cover;} .addaddress_btn:hover,.addstore_btn:hover { background-position: left top; } /* ==== 刪 除 ==== */ trashcan_icon { width: 19px; height: 27px;} .deleteimg { font-size: 20px; } } @media (max-width: 1096px){ /* ==== 外 帶 / 外 送 ==== */ .deliveryOn_btn,.takeoutOn_btn,.delivery_btn,.takeout_btn{ width: 120px; height: 80px;} .deliveryOn_btn{background: url(../images/shop/btn_delivery_on_mo120.png); background-size: contain;} .takeoutOn_btn{background: url(../images/shop/btn_takeout_on_mo120.png); background-size: contain;} .delivery_btn{background: url(../images/shop/btn_delivery_off_mo120.png); background-size: contain;} .takeout_btn{background: url(../images/shop/btn_takeout_off_mo120.png); background-size: contain;} .delivery_btn:hover{background: url(../images/shop/btn_delivery_on_mo120.png); background-size: contain;} .takeout_btn:hover{background: url(../images/shop/btn_takeout_on_mo120.png); background-size: contain;} .viewpointOn_btn{background: url(../images/shop/btn_viewpoint_on_mo120.png); background-size: contain;} .viewpoint_btn{background: url(../images/shop/btn_viewpoint_off_mo120.png); background-size: contain;} .viewpoint_btn:hover{background: url(../images/shop/btn_viewpoint_on_mo120.png); background-size: contain;} .deliveryOn_btn,.takeoutOn_btn,.delivery_btn,.takeout_btn,.viewpointOn_btn,.viewpoint_btn{ width: 97px; height: 72px; background-repeat: no-repeat; background-size: contain;} } @media (max-width: 750px){ /* ==== 搜 尋 ==== */ .searchBtn { width: 100%; height: 50px; background: #e31836 url("../images/btn_search_m.png") no-repeat scroll center center / 100% auto;} .searchBtn:hover { background: #e31836 url("../images/btn_search_m.png") no-repeat scroll center center / 100% auto;} /* ==== G P S ==== */ .gpsBtn { width: 100%; height: 50px; background: #006490 url("../images/btn_gpsbtn_m.png") no-repeat scroll center center / 100% auto;} .gpsBtn:hover { background: #006490 url("../images/btn_gpsbtn_m.png") no-repeat scroll center center / 100% auto;} .mapBtn { width: 100%; height: 50px; background: #006490 url("../images/btn_mapbtn_m.png") no-repeat scroll center center / 100% auto;} .mapBtn:hover { background: #006490 url("../images/btn_mapbtn_m.png") no-repeat scroll center center / 100% auto;} /* ==== G P S t i p ==== */ .gpsBtn_tip { width: 100%; height: 50px; background: #006490 url("../images/btn_gpstip_m.png") no-repeat scroll center center / 100% auto;} .gpsBtn_tip:hover { background: #006490 url("../images/btn_gpstip_m.png") no-repeat scroll center center / 100% auto;} /* ==== 立 即 訂 購 ==== */ #mo_bottom > .orderNow_btn { margin: 0; } .orderNow_btn { background: url(../images/btn_orfernow_m.png) no-repeat scroll; background-size: contain;} .orderNow_btn:hover { background: url(../images/btn_orfernow_m.png) no-repeat scroll; background-size: contain;} .btn_orderCheckout { background: url(../images/btn_orderCheckout_m.png) no-repeat scroll; background-size: contain;} .btn_orderCheckout:hover { background: url(../images/btn_orderCheckout_m.png) no-repeat scroll; background-size: contain;} /* ==== 刪 除 ==== */ trashcan_icon { width: 13px; height: 17px;} .deleteimg { font-size: 15px; } } @media (max-width: 640px){ /* ==== 訂購去 ==== */ .goorder_btn { width:86px; height:32px; padding-bottom:0px; background-image:url(../images/btn_order_mo.png); background-size:contain;} .goorder_btn:hover { background-image:url(../images/btn_order_mo.png); background-size:contain; background-position: top left;} .OrigSize_btn { width:111px; height:41px; background-image:url(../images/btn_order_mo.png); background-position: left;} .OrigSize_btn:hover { background-image:url(../images/btn_order_mo.png); background-position: left ;} /* ==== 確認 ==== */ .okgo_btn {width:86px; height:32px; padding-bottom:0px; background-image:url(../images/btn_ok_mo.png); background-size:contain;} .okgo_btn:hover { background-image:url(../images/btn_ok_mo.png); background-size:contain; background-position: top left;} /* ==== 下一步 ==== */ .btn_nextstep { width:175px; height:33px; margin-top: 35px;background-size:contain;} /* ==== PAGETOP ==== */ .pagetop_btn{ height:40px;} .pagetop_btn img{width: 40px; height: 40px;} /* ==== 送 出 ==== */ .send_btn { background: url(../images/btn_sendRed_m.png) no-repeat; background-size: contain;} .send_btn:hover { background: url(../images/btn_sendRed_m.png) no-repeat; background-size: contain;} /* ==== 加 入 購 物 車 B L U E ==== */ .addorderBtn { background: url(../images/btn_BluaddcarBlu_m.png) no-repeat; background-size: contain;} .addorderBtn:hover { background: url(../images/btn_BluaddcarBlu_m.png) no-repeat; background-size: contain;} /* ==== 加 入 購 物 車 R E D ==== */ .btn_redaddcar { background: #F60025 url(../images/btn_addcarRed_m.png) no-repeat; background-size: contain;} .btn_redaddcar:hover { background: url(../images/btn_addcarRed_m.png) no-repeat; background-size: contain;} /* ==== 回 上 一 步 R E D ==== */ .btn_backstep{width: 79px; height: 33px;margin-right: 10px;background-size: contain;} /* ==== 回 上 一 頁 R E D ==== */ .btn_redbackpage { background: #F60025 url(../images/btn_Redbackpage_m.png) no-repeat; background-size: contain;} .btn_redbackpage:hover { background: url(../images/btn_Redbackpage_m.png) no-repeat; background-size: contain;} /* ==== 重 新 選 擇 ==== */ .btn_reselected { background: #F60025 url(../images/btn_Reselected_m.png) no-repeat; background-size: contain;} .btn_reselected:hover { background: url(../images/btn_Reselected_m.png) no-repeat; background-size: contain;} .reselectedBtn { background: #F60025 url(../images/btn_Reselected_m.png) no-repeat; background-size: contain;} .reselectedBtn:hover { background: url(../images/btn_Reselected_m.png) no-repeat; background-size: contain;} /* ==== 繼 續 購 買 ==== */ .btn_continue { width: 94px; height: 33px; margin-right: 20px;background-size: contain;} /* ==== 確 認 送 出 ==== */ .btn_checksned { background: #F60025 url(../images/btn_checksned_m.png) no-repeat; background-size: contain;} .btn_checksned:hover { background: url(../images/btn_checksned_m.png) no-repeat; background-size: contain;} .checksnedBtn { background: #F60025 url(../images/btn_checksned_m.png) no-repeat; background-size: contain;} .checksnedBtn:hover { background: url(../images/btn_checksned_m.png) no-repeat; background-size: contain;} .btn_orderContinue { margin-right:0px; background: #F60025 url(../images/btn_orderContinue_m.png) no-repeat; background-size: contain;} .btn_orderContinue:hover { background: url(../images/btn_orderContinue_m.png) no-repeat; background-size: contain;} /* ==== 返 回 列 表 ==== */ .btn_back_list { background: #F60025 url(../images/btn_back_list_m.png) no-repeat; background-size: contain;} .btn_back_list:hover { background: url(../images/btn_back_list_m.png) no-repeat; background-size: contain;} /* ==== 返 回 列 表 ==== */ .back_list a{ background: #F60025 url(../images/btn_backTasteco_m.png) no-repeat; background-size: contain;} .back_list a:hover { background: url(../images/btn_backTasteco_m.png) no-repeat; background-size: contain;} /* ==== 搜 尋 ==== */ .btn_school_search { background: #F60025 url(../images/btn_school_search_m.png) no-repeat; background-size: contain;} .btn_school_search:hover { background: url(../images/btn_school_search_m.png) no-repeat; background-size: contain;} /* ==== 搜 尋 ==== */ .btn_back_search { background: #F60025 url(../images/btn_back_search_m.png) no-repeat; background-size: contain;} .btn_back_search:hover { background: url(../images/btn_back_search_m.png) no-repeat; background-size: contain;} /* ==== 現 金 付 款 ==== */ .btn_checkcash { background: #F60025 url(../images/btn_checkcash_m.png) no-repeat; background-size: contain;} .btn_checkcash:hover { background: url(../images/btn_checkcash_m.png) no-repeat; background-size: contain;} /* ==== 取 消 訂 單 ==== */ .btn_checkcancel { background: #F60025 url(../images/btn_checkcancel_m.png) no-repeat; background-size: contain;} .btn_checkcancel:hover { background: url(../images/btn_checkcancel_m.png) no-repeat; background-size: contain;} /* ==== 儲 存 變 更 ==== */ .btn_save { background: url(../images/btn_save_m.png) no-repeat; background-size: contain;} .btn_save:hover { background: url(../images/btn_save_m.png) no-repeat; background-size: contain;} /* ==== 取 消 變 更 ==== */ .btn_cancel { background: url(../images/btn_cancel_m.png) no-repeat; background-size: contain;} .btn_cancel:hover { background: url(../images/btn_cancel_m.png) no-repeat; background-size: contain;} /* ==== 管 理 ==== */ .btn_set{background: url(../images/btn_set_m.png) no-repeat; background-size: contain;} /* ==== 活 動 門 市 ==== */ .store_btn { background: url(../images/btn_store_m.png) no-repeat; background-size: contain;} .store_btn:hover { background: url(../images/btn_store_m.png) no-repeat; background-size: contain;} /* ==== 查 詢 門 市 ==== */ .search-store_btn{ width: 80px; height: 32px; margin-bottom:7px; background-image:url(../images/btn_search-store-m.png); background-size:contain;} .search-store_btn:hover{ background-image:url(../images/btn_search-store-m.png); background-size:contain; background-position: top left; } /* ==== 活 動 詳 情 ==== */ .act-details_btn{ width: 80px; height: 32px; margin-bottom:7px; background-image:url(../images/btn_act-details-m.png); background-size:contain;} .act-details_btn:hover{ background-image:url(../images/btn_act-details-m.png); background-size:contain; background-position: top left; } /* ==== 加 入 常 用 地 址 ==== */ .addaddress_btn { background: url(../images/btn_address_m.png) no-repeat; background-size: contain;} .addaddress_btn:hover { background: url(../images/btn_address_m.png) no-repeat; background-size: contain;} /* ==== 加 入 常 用 門 市 ==== */ .addstore_btn { background: url(../images/btn_addstore_m.png) no-repeat; background-size: contain;} .addstore_btn:hover { background: url(../images/btn_addstore_m.png) no-repeat; background-size: contain; } /* ==== O K ， 我 知 道 了 ==== */ .okiknow_btn { background: url(../images/btn_okiknow_m.png) no-repeat; background-size: contain;} .okiknow_btn:hover { background: url(../images/btn_okiknow_m.png) no-repeat background-size: contain;} /* ==== 同意並進入網站 ==== */ .accept_btn { background: url(../images/btn_accept_m.png) no-repeat; background-size: contain;} .accept_btn:hover { background: url(../images/btn_accept_m.png) no-repeat background-size: contain;} /* ==== 檢 視 ==== */ .veiw_btn { width:86px; height:32px; padding-bottom:0px; background: url(../images/btn_menu_veiw_m.png) no-repeat top; background-size: contain; } .veiw_btn:hover { width:86px; height:32px; padding-bottom:0px; background: url(../images/btn_menu_veiw_m.png) no-repeat top; background-size: contain;} /* ==== 刪 除 ==== */ .deleteimg { margin-top:10%;} /* ==== 送出訂購資料 ==== */ .btn_senddata { width: 147px; height: 33px; background-size: contain;} /* ==== 觀 看 B L U E ==== */ .viewBtn { background: url(../images/btn_joinus_view_m.png) no-repeat; background-size: contain;} .viewBtn:hover { background: url(../images/btn_joinus_view_m.png) no-repeat; background-size: contain;} /* ==== 應 徵 B L U E ==== */ .applyBtn { background: url(../images/btn_apply_m.png) no-repeat; background-size: contain;} .applyBtn:hover { background: url(../images/btn_apply_m.png) no-repeat; background-size: contain;} /* ==== 線上報名 B L U E ==== */ .signBtn { background: url(../images/btn_sign_m.png) no-repeat; background-size: contain;} .signBtn:hover { background: url(../images/btn_sign_m.png) no-repeat; background-size: contain;} /* ==== 滿額 B L U E ==== */ .endBtn { background: url(../images/btn_end_m.png) no-repeat; background-size: contain;} /* ==== 重新輸入 ==== */ .resetBtn { background: url(../images/btn_reset_m.png) no-repeat; background-size: contain; } .resetBtn:hover { background: url(../images/btn_reset_m.png) no-repeat; background-size: contain; } /* ==== 不要統編，直接訂購 ==== */ .subscribeBtn { background: url(../images/btn_subscribe_m.png) no-repeat; background-size: contain; } .subscribeBtn:hover { background: url(../images/btn_subscribe_m.png) no-repeat; background-size: contain; } } @media (max-width: 620px){ /* ==== 外 帶 / 外 送 ==== */ } @media (max-width: 560px){ .Increase2 {width:30px;height:30px;padding-left:5px;} } @media (max-width: 550px){ /* ==== 回 上 一 頁 R E D ==== */ .orderInfo_bottom_btn > .btn_redbackpage { margin-right: 10px;} } @media (max-width: 480px){ /* ==== 搜 尋 ==== */ .searchBtn { width: 100%; height: 41px;} /* ==== G P S ==== */ .gpsBtn { width: 100%; height: 41px;} .mapBtn { width: 100%; height: 41px;} /* ==== G P S t i p ==== */ .gpsBtn_tip { width: 100%; height: 41px;} /* ==== email 登 入 ==== */ .emailintegration_btn { background: url(../images/btn_emailintegration_m.png) no-repeat; background-size: contain;} .emailintegration_btn:hover { background: url(../images/btn_emailintegration_m.png) no-repeat scroll; background-size: contain;} /* ==== F B 登 入 ==== */ .fblogin_btn { background: url(../images/btn_fblogin_m.png) no-repeat; background-size: contain;} .fblogin_btn:hover { background: url(../images/btn_fblogin_m.png) no-repeat scroll; background-size: contain;} .fbregistered_btn { background: url(../images/btn_fbreg_m.png) no-repeat; background-size: contain;} .fbregistered_btn:hover { background: url(../images/btn_fbreg_m.png) no-repeat scroll; background-size: contain;} .fbintegration_btn { background: url(../images/btn_fbintegration_m.png) no-repeat; background-size: contain;} .fbintegration_btn:hover { background: url(../images/btn_fbintegration_m.png) no-repeat scroll; background-size: contain;} /* ==== LINE 登 入 ==== */ .linelogin_btn { background: url(../images/btn_linelogin_m.png) no-repeat; background-size: contain;} .linelogin_btn:hover { background: url(../images/btn_linelogin_m.png) no-repeat scroll; background-size: contain;} .lineintegration_btn { background: url(../images/btn_lineintegration_m.png) no-repeat; background-size: contain;} .lineintegration_btn:hover { background: url(../images/btn_lineintegration_m.png) no-repeat scroll; background-size: contain;} .lineregistered_btn { background: url(../images/btn_linereg_m.png) no-repeat; background-size: contain;} .lineregistered_btn:hover { background: url(../images/btn_linereg_m.png) no-repeat scroll; background-size: contain;} /* ==== 登 入 ==== */ .login_btn { background: url(../images/btn_login_m.png) no-repeat; background-size: contain;} .login_btn:hover { background: url(../images/btn_login_m.png) no-repeat; background-size: contain;} /* ==== 儲 存 / 取 消 變 更 ==== */ .btn_save, .btn_cancel {width: 45%; max-width: 158px;} .member_SnC > .btn_save { margin-right: 10px;} /* ==== 外 帶 / 外 送 ==== */ /* ==== 限外帶 ==== */ .takeout { width: 48px; height: 38px;} /* ==== 加價 ==== */ .Increase {width:40px;height:39px;} } @media (max-width: 400px){ /* ==== F B 登 入 ==== */ .fblogin_btn { margin: 10px 0 ;} /* ==== LINE 登 入 ==== */ .linelogin_btn { margin: 10px 0 ;} /* ==== 登 入 ==== */ .login_btn { margin: 0 0 0 0px;} } @media (max-width: 390px){ /* ==== 外 帶 / 外 送 ==== */ } @media (max-width: 380px){ /* ==== 回 上 一 頁 R E D ==== */ .orderInfo_bottom_btn > .btn_redbackpage { margin: 0 20px 10px;} } @media (min-width: 370px){ /* ==== 外 帶 / 外 送 ==== */ .deliveryOn_btn,.takeoutOn_btn,.delivery_btn,.takeout_btn,.viewpointOn_btn,.viewpoint_btn{ width: 108px; height: 72px;} .deliveryOn_btn{background: url(../images/shop/btn_delivery_on_mo120.png); background-size: contain;} .takeoutOn_btn{background: url(../images/shop/btn_takeout_on_mo120.png); background-size: contain;} .delivery_btn{background: url(../images/shop/btn_delivery_off_mo120.png); background-size: contain;} .takeout_btn{background: url(../images/shop/btn_takeout_off_mo120.png); background-size: contain;} .delivery_btn:hover{background: url(../images/shop/btn_delivery_on_mo120.png); background-size: contain;} .takeout_btn:hover{background: url(../images/shop/btn_takeout_on_mo120.png); background-size: contain;} .viewpointOn_btn{background: url(../images/shop/btn_viewpoint_on_mo120.png); background-size: contain;} .viewpoint_btn{background: url(../images/shop/btn_viewpoint_off_mo120.png); background-size: contain;} .viewpoint_btn:hover{background: url(../images/shop/btn_viewpoint_on_mo120.png); background-size: contain;} }