/******************************** FUNCTION ********************************/ .clearfix:before,.clearfix:after{content:"";display:table} .clearfix:after{clear:both} .clearfix{zoom:1;display:block} .hide{display:none;} /******************************** BODY ********************************/ ::-moz-selection{ background:#ccc; color:#000;} ::selection{ background:#ccc; color:#000; text-decoration:none;} *:focus { outline: 0;} a{ color:#969696; text-decoration:none; } a:hover{ color:#CCC;} html{ width:100%; } body{ overflow-y:scroll; font-family: 'PingFang', 'STHeiTi', "微軟正黑體"; font-size:14px; line-height:1.5; width:100%; color:#555; background:#fff;} /******************************** INDEX ********************************/ #wrap{ width:100%; position:relative; margin-top:135px;} .w990{ width:70%; margin:0 auto;} #g_header{ width:100%; position:fixed; top:0; z-index:10; background:#fff; z-index: 99; border-bottom: 1px solid #fff; background: #ededed; -webkit-box-shadow: 0 3px 5px -3px rgba(0,0,0,.35); -moz-box-shadow: 0 3px 5px -3px rgba(0,0,0,.35); box-shadow: 0 3px 5px -3px rgba(0,0,0,.35); background: -moz-linear-gradient(top,#ededed 0,#fff 30%,#fff 70%,#ededed 100%); background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#ededed),color-stop(30%,#fff),color-stop(70%,#fff),color-stop(100%,#ededed)); background: -webkit-linear-gradient(top,#ededed 0,#fff 30%,#fff 70%,#ededed 100%); background: -o-linear-gradient(top,#ededed 0,#fff 30%,#fff 70%,#ededed 100%); background: -ms-linear-gradient(top,#ededed 0,#fff 30%,#fff 70%,#ededed 100%); background: linear-gradient(to bottom,#ededed 0,#fff 30%,#fff 70%,#ededed 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ededed', GradientType=0);} ._scroll_mode{border-bottom:1px solid #efefef;} #g_header._scroll_mode h1{ width:250px; margin-top:19px;} #g_header._scroll_mode h3{ width:250px; margin-top:19px;} #g_header._scroll_mode #g_nav>ul{ margin-top:18px;} /* #loader.active { top:100%;} #loader { width:100%; height: 100%; position:fixed; top:0; left:0; background: #fff url(../img/loader.gif) center no-repeat; z-index:9999; transition:.7s;} */ .center{ text-align:center;} .margin{ margin:0 auto;} .mt10{ margin-top:10px;} .mt20{ margin-top:20px;} .mt40{ margin-top:40px;} .mb10{ margin-bottom:10px;} .mb20{ margin-bottom:20px;} .mb40{ margin-bottom:40px;} .mr20{ margin-right:20px;} ._m_show{ display:none;} /*top*/ #top{ position:fixed; top:10px; right:5%; transition:.5s; z-index:1;} .quickBox{ float:right; background-color:#aqua;} .quickBox li{ display:inline-block; padding:0 10px; position:relative; vertical-align:top; border-left:1px solid #ccc;} .quickBox li.last,.quickBox li.lang{ border:none;} .quickBox li.last{ padding-left:0;} .quickBox li a{ display:block; background:url(../img/quick_20x20.png) no-repeat; height:20px;} .quickBox li a:hover{} .quickBox li a span{ text-indent:-9999px; display:block; } .quickBox li i#q_cart_num,#g_nav li a i#_m_q_cart_num{ background:#F90; border-radius:15px; width:15px; height:15px; position:absolute; top:-8px; right:-8px; color:#fff; font-style:normal; font-size:12px; text-align:center; line-height:1.2; transition:.2s;} #g_nav li a i#_m_q_cart_num{ top:5px; right:5px;} .quickBox li:hover i#q_cart_num{ transform:scale(1.2);} .quickBox li a.icon_01{ background-position:0px 0px;} .quickBox li a.icon_02{ background-position:-20px 0px;} .quickBox li a.icon_03{ background-position:-40px 0px;} .quickBox li.lang a{ background:none; width:auto; height:auto;} .quickBox li.lang a span{ text-indent:0;} .quickBox li.lang ul{ visibility:hidden; opacity:0; max-height:0; position:absolute; top:150%; left:0; z-index:10; transition:.2s; width:100%; box-shadow:0 1px 6px rgba(0,0,0,.2); width:100px; margin-left:-15px;} .quickBox li.lang:hover ul{ visibility:visible; opacity:1; max-height:100px; top:130%;} .quickBox li.lang>a{ color:#333;} .quickBox li.lang ul li{ background:rgba(255,255,255,.9); text-align:center; display:block; margin-right:0;} .quickBox li.lang ul li a{ display:block; padding:5px 0; width:100%; border-bottom:1px dashed #ddd; color:#000; transition:.2s;} .quickBox li.lang ul li:last-child a{ border-bottom:0;} .quickBox li.lang ul li:hover a{ background:#0376bc; color:#fff;} .quickBox li.member ul{ visibility:hidden; opacity:0; max-height:0; position:absolute; top:150%; left:0; z-index:10; transition:.2s; width:100%; box-shadow:0 1px 6px rgba(0,0,0,.2); width:120px; margin-left:-15px;} .quickBox li.member:hover ul{ visibility:visible; opacity:1; max-height:100px; top:130%;} .quickBox li.member>a{ color:#333;} .quickBox li.member ul li{ background:rgba(255,255,255,.9); text-align:center; display:block; margin-right:0;} .quickBox li.member ul li a{ display:block; padding:5px 0; width:100%; border-bottom:1px dashed #ddd; color:#000; transition:.2s; background:none;} .quickBox li.member ul li:last-child a{ border-bottom:0;} .quickBox li.member ul li:hover a{ background:#0376bc; color:#fff;} /*SEARCH*/ #search_bar{ /*display:inline-block; text-align:right; width:70%;*/ float:right; margin-top:-20px; margin-bottom:20px;} #search_bar .hide{ display:none} #search_bar form { position:relative; top:0; left:0;} #search_bar label { position:absolute; top:3px; left:10px; color:#99CCCC; font-size:12px;} #search_bar #qs_text { padding:10px; width:200px; background-color:#eee; border:0;} #search_bar #qs_submit{ position:absolute; top:7px; right:5px; background: url(../img/icon_01.png) no-repeat; width:15px; height:17px; border:0; text-indent: -9999px;} /*placeholder*/ ::-webkit-input-placeholder{ color:#666; font-weight:normal;} :-moz-placeholder { font-weight:normal;} ::-moz-placeholder { font-weight:normal;} :-ms-input-placeholder { font-weight:normal;} /*logo*/ #g_header h1 { display:inline-block; float:left; width:250px/*30%*/; margin:28px 0 10px; text-indent:-9999px; transition:1s;} #g_header h3 { display:inline-block; float:left; width:250px/*30%*/; margin:28px 0 10px; text-indent:-9999px; transition:1s;} #g_header img{ float:left; width:100%;} /*#g_header h1:hover img{ transform:scale(1.1);}*/ /*g_nav*/ #g_nav{ float:right; transition:.5s; position:relative; z-index:0;} #g_nav>ul{ margin-top:28px; transition:1s; float:right;} #g_nav>ul>li{ float:left; margin-right:10px; text-align:center; position:relative;} #g_nav>ul>li>a{ display:block; height:105px; margin:0 7px; color:#063f69; font-size:14px;} #g_nav>ul>li>a:hover{} #g_nav>ul>li>a span{ display:block; font-size:12px;} #g_nav li ul{ visibility:hidden; opacity:0; max-height:0; position:absolute; top:100%; left:0; z-index:10; transition:.2s; width:100%; box-shadow:0 1px 6px rgba(0,0,0,.2); width:140px; margin-left:0px;} #g_nav>ul>li:hover ul{ visibility:visible; opacity:1; max-height:200px; top:90%;} #g_nav li ul li{ background:rgba(255,255,255,.9); text-align:center;} #g_nav li ul li a{ display:block; padding:5px 0; width:100%; border-bottom:1px dashed #ddd; color:#000; transition:.2s;} #g_nav li ul li:last-child a{ border-bottom:0;} #g_nav li ul li:hover a{ background:#0376bc; color:#fff;} #g_nav li a i{ display:block; margin:0 auto; background:url(../img/menu_105x105.png); width:40px; height:40px;} #g_nav li a i.i1{ margin-bottom:5px; transition:.2s;} #g_nav li a.menu_01 i{ display:block; margin:0 auto; background:url(../img/hicon-05.png); width:50px; height:50px;} #g_nav li a.menu_02 i{ display:block; margin:0 auto; background:url(../img/hicon-01.png); width:50px; height:50px;} #g_nav li a.menu_03 i{ display:block; margin:0 auto; background:url(../img/hicon-02.png); width:50px; height:50px;} #g_nav li a.menu_04 i{ display:block; margin:0 auto; background:url(../img/hicon-04.png); width:50px; height:50px;} #g_nav li a.menu_05 i{ display:block; margin:0 auto; background:url(../img/hicon-06.png); width:50px; height:50px;} #g_nav li a.menu_06 i{ display:block; margin:0 auto; background:url(../img/hicon-06.png); width:50px; height:50px;} #g_nav li a.menu_01 i.i1{ background:url(../img/hicon-05.png);} #g_nav li a.menu_02 i.i1{ background:url(../img/hicon-01.png);} #g_nav li a.menu_03 i.i1{ background:url(../img/hicon-02.png);} #g_nav li a.menu_04 i.i1{ background:url(../img/hicon-04.png);} #g_nav li a.menu_05 i.i1{ background:url(../img/hicon-06.png);} #g_nav li a.menu_06 i.i1{ background:url(../img/hicon-06.png);} #g_nav li a.menu_07 i.i1{ background-position:-360px 0px;} #g_nav li a.menu_08 i.i1{ background-position:-320px 0px;} #g_nav li a.menu_09 i.i1{ background-position:-240px 0px;} #g_nav li a.menu_08, #g_nav li a.menu_09{ display:none;} #g_nav li a i.i2{ opacity:0; transition:.2s; position:absolute; top:0; left:50%; margin-left:-20px;} #g_nav li:hover a i.i2{ opacity:1;} /*#g_nav li:hover a i.i1{ margin-bottom:0;} #g_nav li:hover>a{ color:#063f69;} */ #g_nav li a.menu_01 i.i2{ background:url(../img/hicon-05.png); margin-left:-25px;} #g_nav li a.menu_02 i.i2{ background:url(../img/hicon-01.png); margin-left:-25px;} #g_nav li a.menu_03 i.i2{ background:url(../img/hicon-02.png); margin-left:-25px;} #g_nav li a.menu_04 i.i2{ background:url(../img/hicon-04.png); margin-left:-25px;} #g_nav li a.menu_05 i.i2{ background:url(../img/hicon-06.png); margin-left:-25px;} #g_nav li a.menu_06 i.i2{ background:url(../img/hicon-06.png); margin-left:-25px;} #g_nav li a.menu_07 i.i2{ background-position:-360px -40px;} #g_nav li a.menu_08 i.i2{ background-position:-320px -40px; margin-left:-15px;} #g_nav li a.menu_09 i.i2{ background-position:-240px -40px; margin-left:-15px;} /*banner*/ #banner{ } #idx_banner{ width:100%;} #idx_banner img{ width:100%; transition:0s;} /*#idx_banner img:hover{ opacity:.8;}*/ #idx_banner .owl-item { /*-webkit-transform: scale(1);*/} #idx_banner .owl-item{ /*transform:scale(.9); opacity:.6;*/ transition:0s;} #idx_banner .owl-item.active.center{ /*transform:scale(1); opacity:1;*/} .owl-item{ transform: translate3d(0, 0, 0);} .owl-theme .owl-controls{ margin-top: 10px; text-align: center; -webkit-tap-highlight-color: transparent; position: absolute; bottom:0; width: 100%;} /* #idx_banner .owl-controls .owl-nav{ } #idx_banner .owl-controls .owl-nav .owl-prev{ width:14px; height:28px; background:red; position:absolute; left:0; top: 50%; background:url(../img/pre_01.png) 50% 50% no-repeat; text-indent:-9999px; z-index:9;} #idx_banner .owl-controls .owl-nav .owl-next{ width:14px; height:28px; background:blue; position:absolute; right:0; top: 50%; background:url(../img/pre_02.png) 50% 50% no-repeat; text-indent:-9999px; z-index:9;} */ #banner{ position:relative;} #idxb_bt_prev,#rpi_bt_prev{ background:url(../img/pre_01.png) no-repeat center; width:38px; height:78px; position:absolute; top:45%; left:5%; z-index:1; cursor:pointer; transition:.2s; padding:0 20px;} #idxb_bt_next,#rpi_bt_next{ background:url(../img/pre_02.png) no-repeat center; width:38px; height:78px; position:absolute; top:45%; right:5%; z-index:1; cursor:pointer; transition:.2s; padding:0 20px;} #idxb_bt_prev:hover,#rpi_bt_prev:hover{ left:4%;} #idxb_bt_next:hover,#rpi_bt_next:hover{ right:4%;} .parallax { perspective: 1px; min-height: 350px; max-height: 620px; overflow-x: hidden; overflow-y: auto; background: url(../img/PVBACK.jpg) center ; } .parallax h3{text-align:center; display:block; color:#88d2ff; font-size:32px; padding:50px 0 20px 0; } .parallax p{text-align:center; color:#ffffff; font-size:16px; line-height:30px;} .parallax__layer { position: absolute; top: 0; right: 0; bottom: 0; left: 0; } .parallax__layer--base { transform: translateZ(0); } .parallax__layer--back { transform: translateZ(-1px); } .parallax2 { perspective: 1px; min-height: 350px; max-height: 620px; overflow-x: hidden; overflow-y: auto; background: url(../img/PVBACK2.jpg) center ; } .parallax2 h3{text-align:center; display:block; color:#88d2ff; font-size:32px; padding:50px 0 20px 0; } .parallax2 p{text-align:center; color:#ffffff; font-size:16px; line-height:30px;} /*container*/ #wrap,#container{ overflow:visible; clear:both;} .fl{ float:left;} /*4+circle*/ #circleBox{ width:100%; display:block; overflow:hidden;} .f12_gray{ color:#797979; line-height:1.8;} .f13_gray{ color:#666;} .f13_gray_left{ margin-top:5px; text-align:left; line-height:25px; color:#666;} .f13_left_orange{ color:#FF7F00; font-weight:bold; text-align:left;} .f15_gray{ font-size:15px; color:#666;} .f18_gray_left{ font-size:18px; color:#333; text-align:left;} .f20_gray{ font-size:20px; color:#333;} .f20_gray_left{ font-size:20px; color:#333; text-align:left;} .f24_gray{ font-size:24px; color:#333;} .f24_left_orange{ font-size:24px; color:#FF7F00; font-weight:bold; text-align:left; margin:20px 0;} .f30_gray{ font-size:30px; color:#545454;} .brown_line{ display:block; margin:10px 0; width:50px; height:6px; background-color:#0376bc;} .cirPic{ width:100%; text-align:center;} .cirPic li{ display:inline-block; width:29%; margin-right:1.6%; vertical-align:top; text-align:left; border:1px solid #efefef; margin-bottom:20px;} .cirPic li ._m_title{ display:none;} /*.cirPic li:last-child{ margin-right:0;}*/ .cirPic li a{ display:block;} .cirPic li a:hover{} .cirPic img{ width:100%; transition:.2s;} .cirPic li{ /*width:100%; margin-right:0;*/ position:relative;} .cirPic li a{ color:#000; font-weight:bold;} .cirPic li:hover img{ opacity:.8;} .cirPic li p.mt20{ display:none;} .cirPic li p._m_title{ display:block; font-size:15px; position:absolute; bottom:7px; left:0; width:100%; text-align:center;} .cirPic li p._m_title span{ display:inline-block; background:#fff; background:rgba(255,255,255,.9); border-top-left-radius:10px; border-top-right-radius:10px; padding:10px 20px; letter-spacing:2px;} .cirPic li .brown_line{ display:none;} /* .cirPic i{display:block; background:url(../img/form_200x200.png) no-repeat; width:200px; height:200px;} .cirPic i.cir_01{ background-position:0px 0px;} .cirPic i.cir_02{ background-position:-200px 0px;} .cirPic i.cir_03{ background-position:-400px 0px;} .cirPic i.cir_04{ background-position:-600px 0px;} */ /*news*/ .newsBox{ width:100%; overflow:hidden;} .newsBox ul{ width:100%; text-align:center;} .newsBox li{ display:inline-block; width:32%; margin-right:1.6%; margin-bottom:5%; vertical-align:top; text-align:left;} .newsBox li:last-child{ margin-right:0;} .newsBox li img{ width:100%; transition:.2s;} .newsBox li a{ display:block;} .newsBox li a:hover{} .newsBox li:hover img{ opacity:.8;} #newsBox>ul.owl-theme .owl-controls{ position:static;} .ck_zone{ clear:both; margin-bottom:5%;} .ck_zone h2,.ck_zone h3,.ck_zone h4,.ck_zone h5{ font-size:20px; font-weight:normal; color:#000; margin-bottom:10px;} .ck_zone img{ max-width:100%; height:auto !important;} .ck_zone .fb-post{ display:block; text-align:center;} .f20_black{ font-size:20px; color:#000;} .more{ width:200px; line-height:40px; clear:both;} .more a{ display:block; background:url(../img/r.png) 95% center #fff no-repeat; border:1px solid #0376bc; font-size:14px; color:#0367a4; text-align:center; } .more a:hover{ background-color:#0376bc; color:#FFF;} .more2{ width:200px; line-height:40px; clear:both;} .more2 a{ display:block; border:1px solid #ffffff; font-size:14px; color:#ffffff; text-align:center; } .more2 a:hover{ color:#ffffff; border:1px solid #ffffff;} .more_L{ width:200px; line-height:40px; } .more_L a{ display:block; background:url(../img/l.png) 5% center #fff no-repeat; border:1px solid #0376bc; font-size:14px; color:#0367a4; text-align:center; } .more_L a:hover{ background-color:#0376bc; color:#FFF;} #fb-root{ clear:both;} .photo_list{ width:100%; float:left;} .photo_list a{ float:left; width:15%; max-width:100px; margin:0 10px 10px 0; transition:.2s;} .photo_list a:hover{ opacity:.8;} .photo_list a img{ width:100%;} /*cook*/ .cookBox{ width:100%; overflow:hidden;} .cooklist{ width:100%; float:left; /*display:inline-block; margin-bottom:10px;*/} .fl_78{ width:65.7%; float:left;/* margin-right:1.4%;*/} .fl_78 a{ display:block;} .fl_78 a:hover{} .fl_78 a img{ width:100%; float:left;} /*滑鼠滑過出現字*/ .cooklist{ perspective: 500px;} .cooklist a{ position:relative; overflow:hidden; } /*滑鼠滑過會出現 灰底+文字*/ .cooklist a .black{ width:100%; height:100%; background:rgba(0,0,0,.6); position:absolute; left: 0; top: 0; z-index:1; transition:.5s; opacity:0; visibility:hidden; text-align:center; display:table; /*transform: rotateY(90deg);*/} .cooklist a:hover .black{ opacity:1; visibility:visible; /*transform: rotateY(0deg);*/} /*滑鼠滑過圖片會放大*/ .cooklist a .img{ float:left; width:100%;} .cooklist a img{ transform:scale(1); transition:4s;} .cooklist a:hover img{ transform:scale(1.1); transition:2s;} .cooklist .text{ display:table-cell; vertical-align:middle;} .cooklist .text h2{ color:#369ddc; font-size:30px;} .cooklist .text p{ color:#fff; width:50%; margin:0 auto;} /*******************************/ #shop_banner{ perspective: 500px;} #shop_banner a{ overflow:hidden; } #shop_banner a .img{ overflow:hidden; height:0; padding-bottom:56%;} /*滑鼠滑過會出現 灰底+文字*/ #shop_banner a .black{ width:100%; height:100%; background:rgba(0,0,0,.6); position:absolute; left: 0; top: 0; z-index:1; transition:.5s; opacity:0; visibility:hidden; text-align:center; display:table; /*transform: rotateY(90deg);*/} #shop_banner a:hover .black{ opacity:1; visibility:visible; /*transform: rotateY(0deg);*/} /*滑鼠滑過圖片會放大*/ #shop_banner a img{ transform:scale(1); transition:4s;} #shop_banner a:hover img{ transform:scale(1.1); transition:2s;} #shop_banner .text{ display:table-cell; vertical-align:middle;} #shop_banner .text h2{ color:#369ddc; font-size:30px;} /*******************************/ .mr14{ margin-right:1.4%;} .fr_20{ width:32.9%; float:left;/* margin-right:0%;*/} .fr_20 a{display:block;} .fr_20 a:hover{} .fr_20 a img{width:100%; float:left;} /*online*/ .onlineBox{ width:100%; overflow:hidden;} .sizer{ width:22%; margin-left:2%; padding:5px;} .online{ display:block; width:100%;} .online li{ display:inline-block; width:22%; margin-right:2%; margin-bottom:30px; padding:8px; vertical-align:top;} .online li:last-child{ margin-right:0;} .online li a{ display:block; text-align:center;} .online li a img{ display:block; width:100%; transition:.2s;} .online li a:hover img{ opacity:.8;} .f13_cen{ margin-top:5px; line-height:25px; color:#777;} .f13_cen_orange{ color:#FF7F00; font-weight:bold;} /*salesBox*/ .salesBox{ width:100%; width:100%; overflow:hidden;} .taiwan{ display: block; overflow: hidden; padding-bottom: 20px; margin-bottom: 20px;} .fl_tai{ display:block; float:left; width:16.2%; margin-right:1.2%;} .fr_tai_list{ display:block; float:right; width:82.5%;} .fr_tai_list .info_1{ border-bottom:1px solid #ddd; float: left; margin-bottom: 20px;} .fr_tai_list .info_1:last-child, .fr_tai_list .info_1.noline{ border-bottom:0;} /*online_3*/ .online_3 .sizer{ width:100%; margin-left: 1%;} .online_3{ display:block; width:100%;} .online_3 li{ display:inline-block; width:100%; margin-right:1%; margin-bottom:30px; vertical-align:top;} .online_3 li:last-child{ margin-right:0;} .online_3 li a{ display:block; text-align:center;} .online_3 li a img{ display:block; width:100%;} .online_3 li a img:hover{ opacity:.6;} /*台灣三個按鈕*/ .btn34{ width:100%; margin-top:20px;} .btn34 li{ width:100%; display:inline-block; margin-bottom:10px;} .btn3,.btn4,.btn5,.btn6{ display:block; width:80px; line-height:80px; text-align:center; border-radius:50px; font-size:16px; color:#0367a4; font-weight:600;border: 2px solid #0376bc;} .btn3:hover,.btn4:hover,.btn5:hover,.btn6:hover,.btn3.active,.btn4.active,.btn5.active,.btn6.active{ background-color:#0376bc; color:#fff; opacity:1;} /* #tab3{ display:block;} #tab4,#tab5,#tab6{ display:none;} */ /*台灣列表*/ .info_1{ width:100%; margin-top:20px; /*transition:.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);*/ } .salesList{ display:block; width:100%;} .salesList li{ float:left; width:47%; margin-right:5%; margin-bottom:45px;} .salesList li:nth-child(2n){ margin-right:0;} .salesList li .f12_gray{ font-size:14px;} .brown_line_s{ display:block; margin:0 20px 91px 0; width:30px; height:6px; background-color:#0376bc;} .salePic{ display:block; width:150px; clear: left; margin-left: 50px; margin-top:10px;} /*海外*/ .overseas{ display:block; width:100%; overflow:hidden;} .info_2{ display:block; width:100%; margin-top:20px; transition:.6s cubic-bezier(0.230, 1.000, 0.320, 1.000); } /*footer*/ #foot{margin-top:3%; background-color:#F7F7F7; overflow:hidden;} #areaBox{ display:block; width:100%; width:90%; margin:20px auto;} #areaBox .areaBox_s{ display:inline-block; width:19%; vertical-align:top; text-align:center; } .f_brown{ font-size:15px; color:#0367a4; font-weight:bold; margin-bottom:10px;} .f_12gray{ color:#666; line-height:2.6;} .areaList{ display:block; width:100%; text-align:center;} .areaList li{ display:inline-block; width:100%; margin-bottom:5px;} .areaList li a{ color:#666;} .areaList li a:hover{color:#C79601; } .areaList._cp{} .areaList._cp li a{ border:1px solid #ccc; transition:.2s; display:block; width:70%; margin:0 auto;} .areaList._cp li:hover a{ border:1px solid #0376bc;} /******************************** ABOUT ********************************/ #s_banner{ width:100%;} #s_banner img{ width:100%;} .f_12666 { color: #666; line-height:20px;} .textWrap{ padding:30px 0 20px 0;} .manyPic{ display:block; width:100%;} .manyPic img{ display:block; width:100%;} .salesList_2{ display:block; width:100%;} .salesList_2 li{ display:inline-block; width:47.3%; margin-right:3%; margin-bottom:50px; vertical-align:top;} .salesList_2 li:nth-child(2n){ margin-right:0;} .brown_line_s2{ display:block; margin:10px 0; width:30px; height:6px; background-color:#0376bc; clear:both;} .about_pic{ display:block; width:100%; margin:20px 0;} .about_pic img{ display:block; width:100%;} /******************************** NEWS ********************************/ .newWrap{ display:block;} .newWrap li{ display:inline-block; width:100%; margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #f1f1f1;} .newWrap li a{ display:block;} .newWrap li a:hover{ } .newWrap li:hover img{ opacity:.8;} .newWrap li time{ display:none;} .newWrap li time.lunarDate{ position:relative; line-height:1.2; clear:both; display:block; color:#333; width:135px; margin-left:30px; float:left;} .newWrap li time.lunarDate span{ width:10px; word-wrap:break-word; display:block; float:left; margin-right:10px;} .newWrap li time.lunarDate span.l1{ position:absolute; top:0; left:-30px;} .newWrap li time.lunarDate span.l2{ word-wrap:normal; font-family: 'Vollkorn', serif; font-size:80px; width:auto; margin-bottom:10px; margin-top:-20px;} .newWrap li time.lunarDate span.l3{ font-size:30px; clear:left; width:30px; height:1px; font-weight:bold;} .newsPic{ display:block; width:315px; margin-right:20px; float:left;} .newsPic img{ display:block; width:100%; transition:.2s;} .newText{ padding-left:525px;} .newText:hover{color:#fff; } .salesList_3{ display:block; width:100%; border-bottom:1px solid #DDD; overflow: hidden; padding-bottom: 20px;} .salesList_3 li{ display:inline-block; width:100%; margin-bottom:20px;} .f30_black{ font-size:30px; color:#000; font-weight:500;} .other_article{ margin-bottom:-20px; margin-top:5%;} .other_article li{ border-top:1px solid #ddd; padding:20px 0 20px 200px; position:relative; margin-bottom:0;} .other_article li .label{ font-size:20px; position:absolute; left:0; top:14px;} .other_article li a{} /******************************** LINK ********************************/ .link_list{ display:block;} .link_list li{ display:inline-block; width:100%; margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #f1f1f1;} .link_list li a{ display:block;} .link_list li a:hover{ } .link_list li:hover img{ opacity:.8;} .link_list .img{ width:315px; float:left;} .link_list .img img{ width:100%;} .link_list .txt{ padding-left:350px;} .media_list{ display:block;} .media_list li{ float:left; width:30%; margin:1.6%;} .media_list li:nth-child(3n+1){ clear:both;} .media_list li a{ display:block;} .media_list li a:hover{ } .media_list li:hover img{ opacity:.8;} .media_list .img{ width:100%; } .media_list .img img{ width:100%;} .media_list .txt{ } /*ALL按鈕*/ .tag_wrap{ width:100%; text-align:center; clear:both;} .tag_wrap button{ display:inline-block; margin:10px 0 10px 5px; padding:0 10px; text-align:center; line-height:30px; background-color:#fff; border:1px solid #0376bc; color:#0367a4; /*font-size:15px; font-weight:bold;*/ cursor:pointer;} .tag_wrap button:hover, .tag_wrap button.current{ background-color:#0376bc; color:#fff; border:1px solid #0376bc;} .tag_wrap .current2{ background-color:#0376bc; color:#fff; border:1px solid #0376bc;} /*--頁碼--------------------*/ .pager{ margin:10px auto; width:100%; text-align:center; clear:both;} .pager a.current{ background-color:#0376bc; color:#FFF; font-weight:bold; cursor:default;} .pager span{ display:inline-block; padding:0 2px; line-height:18px; margin:25px 0 0 10px;} .pager a{ display:inline-block; text-align:center; line-height:30px; background-color:#fff; border:1px solid #0376bc; color:#0367a4; font-size:15px; font-weight:bold; width:30px; margin:10px 0 10px 5px;} .pager a:hover{ background-color:#0376bc; color:#FFF; font-weight:bold;} /******************************** SHOP-DETAILS ********************************/ #B_img{ width:50%; position:relative; float:left; margin-top:5%;} #B_txt{ width:45%; margin-left:5%; position:relative; float:left; margin-top:5%;} #B_img #pdi_img img{ width:100%;} #R_img{ width:100%; position:relative;} #R_img #rpi_img,#R_img #rpi_img img{ width:100%;} #R_txt .fl_78_shop{ width:55%; border-bottom:0;} #R_txt .fr_20_shop{ width:40%; margin-left:5%;} #control{ float:left; display:inline-block; width:100%; float:left; margin-top:10px;} #control img{ float:left; width:80px; margin-right:10px;} /*#control img:last-child{ margin-right:0;}*/ #control img.point{ opacity:.6; cursor:pointer;} #prod_intro{ width:100%; clear:both;} #prod_intro h3{ margin-top:10px; border-bottom: #D6D6D6 1px solid; font-size:18px; font-weight:500; color:#414151;} .prod_text1{ margin:2% 0;} .prod_text1 li{ display:inline-block; width:47%; margin-right:5.5%; vertical-align:top; margin-bottom:4%;} .prod_text1 li:nth-child(2n){ margin-right:0;} .prod_text1 h6{ font-size:14px; color:#414151; font-weight:500;} .prod_text1 p{ font-size:15px; color:#92929F;} .owl-theme .owl-controls{ margin-top: 10px; text-align: center; -webkit-tap-highlight-color: transparent; position: absolute; bottom:0; width: 100%;} #B_img .owl-controls .owl-nav{ position:absolute; width:100%; bottom: 0;} #B_img .owl-controls .owl-nav .owl-prev{ width:14px; height:28px; background:red; position:absolute; left: 50%; margin-left: -68px; bottom: -9px; background:url(../img/pre_01.png) 50% 50% no-repeat; text-indent:-9999px; z-index:9;} #B_img .owl-controls .owl-nav .owl-next{ width:14px; height:28px; background:blue; position:absolute; bottom: -10px; left: 50%; margin-left: 39px; background:url(../img/pre_02.png) 50% 50% no-repeat; text-indent:-9999px; z-index:9;} /*產品簡介*/ .shopWrap{ display:block; width:100%; overflow:hidden; border-bottom:1px solid #DDD; padding-bottom:20px;} /*left*/ .fl_78_shop{ width:100%; float:left; border-bottom:1px solid #ddd;} .fl_78_shop a{ display:block;} .fl_78_shop a:hover{} .fl_78_shop a img{ width:100%; float:left;} .fr_20 .big{ display:none;} .fl_78 .small{ display:none;} .salesList_4{ display:block; width:100%; overflow: hidden; } .salesList_4 li{ display:inline-block; width:100%; margin-bottom:20px;} /*right*/ .fr_20_shop{ width:100%; float:left;/* margin-right:0%;*/} .fr_20_shop a{display:block;} .fr_20_shop a:hover{} .fr_20_shop a img{width:100%; float:left;} .priceBox{ float:left; display:block; width:100%; margin:20px 0;} .f20_oran{ font-size:20px; color:#FF7F00; font-weight:500;} .f20_oran span{ font-size:45px; margin-left:10px;} .f20_oran span.dollar{ font-size:20px;} .num{ float:right;} .f18_gray{ font-size:18px; color:#444; line-height:40px; font-weight:500; margin-right:10px;} .pd_qty{ padding-left:10px; width:135px; height:40px;/* box-shadow:inset 2px 2px 10px rgba(20%,20%,40%,0.2)*/; border:0; background-color:#EEE; font-size:18px; color:#333; font-weight:500;} .join_1{ float:left; width:49%; margin-top:2%; display:block; background-color:#ccc; line-height:65px; text-align:center; color:#fff; font-size:15px;} .join_1:hover { background-color:#CCC; color:#fff;} .join_1 span { display:block; background:url(../img/list_icon.png) 5% 50% no-repeat; text-indent:50px;} .join_2{ float:left; width:49%; margin-top:2%; margin-right:2%; display:block; background-color:#0088cc; line-height:65px; text-align:center; color:#fff; font-size:15px;} .join_2:hover { background-color:#CCC; color:#fff;} .join_2 span { display:block; background:url(../img/shop_icon.png) 5% 50% no-repeat; text-indent:50px;} .join_3{ width:100%; margin-top:2%; margin-right:2%; display:block; background-color:#0088cc; line-height:65px; text-align:center; color:#fff; font-size:20px;} .join_3:hover { background-color:#CCC; color:#fff;} .join_3 span { display:block; background:url(../img/shop_icon.png) 5% 50% no-repeat; text-indent:50px;} .join_4{ width:100%; margin-top:2%; display:block; background-color:#ccc; line-height:65px; text-align:center; color:#fff; font-size:20px;} .join_4:hover { background-color:#CCC; color:#fff;} .join_4 span { display:block; background:url(../img/shop_icon.png) 5% 50% no-repeat; text-indent:50px;} .join_5{ width:100%; margin-top:2%; display:block; background-color:#0088cc; line-height:65px; text-align:center; color:#fff; font-size:20px;} .join_5:hover { background-color:#CCC; color:#fff;} .join_5 span { display:block; background:url(../img/list_icon.png) 5% 50% no-repeat; text-indent:50px;} /*introduce*/ .introduce{ display:block; width:100%; border-bottom: 1px solid #DDD; padding-bottom:40px;} .picBox{ display:inline-block; width:100%; vertical-align:top;} .fl_pic{ display:inline-block; width:49%; margin-right:1%; } .fl_pic img{ width:100%;} .picBox p{ display:inline-block; width:49%;} .related{ display:block; width:100%; padding-bottom:60px; border-bottom: 1px solid #DDD; } #same_banner{ float:left; display:block; width:100%; margin-top:10px; } #shop_banner{ display:block; width:100%; } #shop_banner a{} #shop_banner a img{ width:100%;} #shop_banner a:hover{} #shop_banner .owl-controls{ margin-top: 10px; text-align: center; -webkit-tap-highlight-color: transparent; position: absolute; bottom:-40px; width: 100%;} #shop_banner .owl-controls .owl-nav{ position:absolute; width:100%; bottom:0px;} #shop_banner .owl-controls .owl-nav .owl-prev{ width:14px; height:28px; background:red; position:absolute; left: 50%; margin-left: -68px; bottom: -9px; background:url(../img/pre_01.png) 50% 50% no-repeat; text-indent:-9999px; z-index:9;} #shop_banner .owl-controls .owl-nav .owl-next{ width:14px; height:28px; background:blue; position:absolute; bottom: -10px; left: 50%; margin-left: 39px; background:url(../img/pre_02.png) 50% 50% no-repeat; text-indent:-9999px; z-index:9;} #relate_shop{} #relate_shop li{ text-align:center;} #relate_shop .img{ position:relative; overflow:hidden;} #relate_shop .hover{ position:absolute; top:100%; left:0; transition:.3s cubic-bezier(0.250, 0.460, 0.450, 0.940); background:rgba(0,0,0,.5); width:100%; height:100%; color:#fff; text-align:center;} #relate_shop .hover span{ height:48px; width:1px; background:#fff; display:inline-block; vertical-align:middle; margin-top:39%;} #relate_shop .img:hover .hover{ top:0;} #relate_shop .toInfo{ width:48px; height:50px; display:inline-block; background:url(../img/icon_10.png) -48px 0; text-indent:-9999px; vertical-align:middle; margin:0 5%; margin-top:39%; transition:.2s;} #relate_shop .toCart{ width:48px; height:50px; display:inline-block; background:url(../img/icon_10.png); text-indent:-9999px; vertical-align:middle; margin:0 5%; margin-top:39%; transition:.2s;} #relate_shop .toInfo:hover{ margin-top:30%;} #relate_shop .toCart:hover{ margin-top:30%;} #relate_shop.owl-theme .owl-controls{ position:static;} /******************************** RECIPE-DETAILS ********************************/ .clear{ clear:both;} .menuList{ display:block; width:100%; background-color:#F7F7F7; overflow:hidden; padding:2%;} .timeicon{ display:block;} .oran_time{ display:block; float:right; font-size:15px; color:#444; background:url(../img/time.png) left center no-repeat; text-indent:32px; margin-right:4%;} .service{ float:right; margin-right:20px;} .cookitem{ display:block; width:100%; } .cookitem li{ display:inline-block; width:96%; padding:5px 0; border-bottom:1px solid #DDD;} .cookitem li:last-child{ border-bottom:0;} .f15_gray{ font-size:15px; color:#444;} .f15_gray span{ float:right; } /*料理秘訣*/ .secretBox{ display:inline-block; width:100%; border-bottom:1px solid #DDD; padding-bottom:40px;} .secretList{ display:block; width:100%; } .secretList li{ float:left; width:32%; margin-right:2%; margin-bottom:30px; vertical-align:top;} .secretList li:nth-child(3n){ margin-right:0;} .se_Pic{ display:block; width:100%;} .se_Pic img{ display:block; width:100%;} .step{ width:62px; font-size:16px; color:#0376bc; font-weight:500; transform: skewX(-12deg);} .step span{ font-size:30px;} .f12_666{ /*width:85%; float:left;*/ padding-left:62px; margin-top:14px; font-size:12px; color:#666; } .little_secret{ display:block; width:96%; background-color:#F7F7F7; overflow:hidden; padding:2%;} /******************************** FAQ ********************************/ .faqBox{ display:block; width:100%;} .faqBox li{ display:inline-block; width:100%; margin-bottom:50px;} .fl_Q{ float:left; display:inline-block; width:65px; margin-right:20px;} .fl_Q img{ width:100%;} .fr_text{ padding-left:83px;} .w1000 { float:left; width:96%;} .brown_line_s3{ float:left; margin:10px 10px 10px 0; width:30px; height:6px; background-color:#0376bc; /* clear:both; */} .faqBox .sizer{ width:100%; margin-left: 1%;} /******************************** CONTACT-DETAILS ********************************/ .page{ width:/*40%*/600px; background-color:#fff; position:relative; margin:0 auto;} .page p{ font-size:13px; color:#000; margin:20px auto 20px auto; width:84%;} ul.s_form_1{ margin:0 auto; width:84%; overflow:hidden;} .s_form_1 li{ margin:1% auto; background-color:#EEE; width:100%; float:left; line-height:34px; color:#000; text-indent:10px;} .s_form_1 li label{ width:70px; display:block; float:left;} .s_form_1 li input#email,.s_form_1 li input#tel{ width:65%;} .s_form_1 li input#captcha{ /*width:30%;*/} .s_form_1 li input{ background-color:#EEE;} .s_form_1 li input[type=text]{ border:0; width:30%; float:left; margin:8px 0;} .s_form_1 li textarea{ border:0; width:90%; height:50px; background-color:#EEE;} .s_form_1 li label.comment{/*width:80px;*/} .s_form_1 li select{ border:1px solid #ccc; width:20%; height:27px;} .s_form_1 label.s_1{ width:auto; float:left; display:inline-block;} .s_form_1 li a img.vode{ float:right; display:inline-block; position:relative; width:100px; height:34px; margin-left:2px;} .align_right{ display:block;} .align_right a{ display:block; overflow:hidden;} /***點了打開***/ /*----大灰底-----*/ .cover_bk{ position:fixed; left:0; top:0; z-index:999999; width:100%; height:100%; background-color:rgba(0,0,0,.6); visibility:hidden; opacity:0; transition:.2s;} .cover_bk.active{ visibility:visible; opacity:1;} div.bt_open_contact{cursor:pointer; transition:.2s; display: block; background: url(../img/r.png) 95% center #fff no-repeat;border: 1px solid #0376bc;font-size: 14px;color: #0367a4;text-align: center;} div.bt_open_contact:hover{ background-color:#0376bc; color:#FFF;} div.bt_open_contact span{ cursor: pointer;font-size: 15px;color: #FFF;border: #FFF 1px solid;padding: 8px;} .cover_bk .bt_close{ position: absolute;top: 2%;right: 2%; z-index:1; background:url(../img/icon_12.png) no-repeat #333; border-radius:40px; width:40px; height:40px; text-indent:-9999px; cursor:pointer; transition:.2s;} .cover_bk .bt_close:hover{ transform:rotate(90deg); background-color:#0376bc;} .page{ max-height:100%; z-index:9; transition:.2s; overflow:auto;} /*.page span{ cursor:pointer; font-size:15px; color:#FFF; border:#FFF 1px solid; padding:8px;}*/ .page .video_close{ position:absolute; top:2%; right:5%; background:rgba(0,0,0,0.6); width: 20px; height: 20px; border-radius: 40px; text-align: center;} /******************************** MEMBER-LOGIN ********************************/ .if_wrap_a{ width:960px; margin:0 auto;} .if_wrap_b{ padding:0 10px; border-bottom: 1px dashed #CCC;} .if_wrap_b a{ text-decoration:underline;} .s_form_1 a{ text-decoration:underline;} .if_wrap_b h3{ font-size:15px; line-height:35px;} .btn{ width:100%; margin-bottom:20px; text-align:center;} .btn a{ display:inline-block; margin:10px 0 10px 5px; padding:0 10px; text-align:center; line-height:30px; background-color:#fff; border:1px solid #0376bc; color:#0367a4; font-size:15px; font-weight:bold; } .btn a:hover{ background-color:#0376bc; color:#fff; border:1px solid #0376bc;} .btn .current2{ background-color:#0376bc; color:#fff; border:1px solid #0376bc;} .fbl { display:inline-block; background:#3A5795; padding:10px 20px;color:#fff;font-size:15px;transition:.2s;border-radius:5px;} .fbl:hover{ background:#DDD; color:#fff;} .fb_member{ display:block; width:100%; margin-bottom:10px; text-indent:25px; line-height:27px; color:#903; font-size:15px;} /******************************** CART 購物車 ********************************/ .mini_cart{ position:absolute; top:50px; right:0; z-index:200; background:#fff; border:1px solid #eee; box-shadow:2px 5px 5px rgba(205, 213, 213, 0.5); border-radius:3px; width:350px; display:none;} .mini_cart table{ width:90%; margin:15px auto 10px;} .mini_cart th{ font-weight:bold; padding:5px 0; text-align:center; background:#000; color:#FFF;} .mini_cart td{ padding:5px 0; text-align:center; border-bottom:1px dashed #CCC; vertical-align:middle;} .mini_cart td i{ width:60px; height:60px; overflow:hidden; display:block;} .mini_cart td img{ width:100%;} .mini_cart tr:last-child td{ border-bottom:none;} .mini_cart .sbt_1{ float:right;} #cart_sum{ width:49%; float:right; min-width:300px;} #cart_sum li{ padding:10px 0; clear:both;} #cart_sum li.last{ border-top:1px dashed #ccc;} #cart_sum li b{ float:left; font-weight:bold; color:#333; width:70px;} #cart_sum li a.edit{ background:url(../img/icon_13.png) no-repeat right center; padding-right:20px; text-decoration:underline;} #cart_sum li .price{ float:right; font-size:12px; color:#999;} #cart_sum li .price span{ font-size:14px; margin-left:5px; display:inline-block;color:#666;} #cart_sum li .price span.s_t1{ color:#FF6666;} #coupon_box{ display:none;} #coupon_box.active{ display:inline-block;} #coupon_box a{ background: #0376bc; color: #fff; padding: 0px 10px; border: 0; border-radius: 0px; display: inline-block; text-align: center; transition:.2s;} #c_coupon{ border:1px solid #ccc;} #bt_coupon_open.unactive{ display:none;} #credit_total{ background:#f7f7f7; padding:20px 3%; margin-bottom:20px; text-align:center;} #credit_total span{ color:#ff6666; font-size:30px;} /*ibox*/ .ibox_bg{ margin: 5% 0; position:relative;width:100%; height:100%; } .ibox{ background:#fff; min-height:340px; display:block; border:#ECE7DB solid 2px; margin:0 auto; position:relative;} .ibox_epaper{} .ibox_login{} .ibox_forgotPsw{ width:400px;} .heigh{ margin-top:167px;} .side_l,.side_r,.side_a,.side_b{ float:left; padding:3% 8%; margin:2% 0; width:33.9%;} .side_l{ border-right:1px solid #ECE7DB;} .side_c{ padding:3% 8%; margin:11% auto; width:68%;} .side_a{} .side_b{ border-right: 1px solid #ccc;} .ibox h2{ font-size:20px;} .ibox li{ position:relative; margin:10px 0;} .ibox label{ position:absolute; top:5px; left:10px; color:#CCC;} .ibox input[type=text],.ibox input[type=password]{border:1px solid #CCC; width:94%; height:27px; padding:0 10px;} #ftpsw_captcha, #m_captcha, #edm_captcha, #edm_un_captcha{ width:55%;} /*Product Detail*/ .pd_info{} .pd_img{ width:47.5%; float:left; border:1px solid #eee; overflow:hidden;} .pd_img a{ display:block;} .pd_img img{ width:100%;} .pd_img_pager { position:absolute; right:6px; bottom:7px; z-index:200;} .pd_img_pager a{ width:12px; height:12px; background:#99CCCC; display:block; display:inline-block; margin:0 3px; transition:all .2s;} .pd_img_pager a.cycle-pager-active,.pd_img_pager a:hover{ background:#ccc;} .pd_details{ float:left; margin-left:2%; width:50%;} .pd_name{ float:left;} .pd_title{} .pd_title h2{ font-size:20px; font-weight:bold; padding-bottom:5px;} .pd_title .pd_no{} .pd_title .sale_txt{ color:#FF6666;} .pd_price{ float:right;} .pd_title .pd_ori_price{ font-size:15px; font-weight:bold; float:right; padding-bottom:15px;} .pd_title .pd_now_price{ font-size:55px; font-weight:bold; color:#FF6666; clear:right; float:right;} .pd_title .pd_now_price .s_1{ font-size:12px; position:relative; top:-30px;} .pd_title .pd_now_price .s_2{} .pd_details select{ border:1px solid #99CCCC; width:40%; height:27px; } .pd_intro{ clear:both; border-top:1px solid #eee; padding-top:20px; margin-top:20px;} .pd_style{ clear:both; border-top:1px solid #eee; padding-top:20px; margin-top:20px; padding-bottom:10px;}/*select*/ .pd_qty{ padding-bottom:10px;}/*select*/ .pd_addCart{} .pd_share{ clear:both; border-top:1px solid #eee; padding-top:20px; margin-top:20px; } .pd_des{ clear:both; padding-top:20px; margin-bottom:20px;} .ck_zone{ width:100%;} .s_tb_1{ width:100%;} .s_tb_1 thead th,.s_tb_2 thead th{ height:44px; line-height:44px; border-bottom:1px solid #bbb; text-align:center; padding:0; background-color: #ECE7DB;} .s_tb_1 td{ padding:10px; border-bottom:1px dashed #CCC; } .s_tb_1 td.s_1{ padding:10px; text-align:center;} .s_tb_2{ width:100%; } .s_tb_2 tbody td{ padding:5px 0; border-bottom:1px dashed #CCC; text-align:center; vertical-align:middle;} .s_tb_2 tfoot td{ padding:5px 10px;} .s_tb_2 img{ display:inline-block;} .s_tb_2 .s_4{ float:left; width:100%;} .s_tb_2 .s_4 i{ width:60px; height:60px; overflow:hidden; display:block; float:left;} .s_tb_2 .s_4 i img{ width:100%;} .s_tb_2 .s_4 img{ display:inline-block;} .s_tb_2 .s_4 .txt{ padding-left:70px; text-align:left;} .s_tb_1 .s_2,.s_tb_2 .s_1{ text-align:left; padding-left:10px;} .s_tb_2 .s_3{ border-top:1px dashed #ccc;} .s_tb_1 a,.s_tb_2 a{ text-decoration:underline;} .s_tb_2 .s_4 a{ text-decoration:none;} .chk_lay{position: relative; top: -32px; left: 200px; margin-bottom: -20px;} .single{} .single h2 {text-align:left; padding-left: 10px;} .single .title{ background:#ECE7DB; height: 44px;line-height: 44px; border-bottom: 1px solid #bbb;} .if_wrap_a{ width:960px; margin:0 auto;} .if_wrap_b{ padding:0 10px; border-bottom: 1px dashed #CCC;} .if_wrap_b a{ text-decoration:underline;} .s_form_1 a{ text-decoration:underline;} .if_wrap_b h3{ font-size:15px; line-height:35px;} ul.order_steps{ text-align:center;} .order_steps li { display:inline-block; margin:0 20px; padding-right:67px; background:url(../img/icon_7.png) no-repeat right 50%;} .order_steps li.last { padding-right:0; background:none;} .order_steps li div{ width:100px; height:100px;} .order_steps li.current div{ } .order_steps li.current span.s_1{ color:#0376bc;} .order_steps li span.s_1{ font-size:25px; color:#ccc; display:block; width:100%; padding-top:16px;} .order_steps li span.s_2{ color:#333; font-size:15px; font-weight:bold; display:block;} ul.s_form_001{} .s_form_001 li{ border-bottom:1px dashed #CCC; padding:10px 0;} .s_form_001 li label{ width:200px; display:block; float:left; text-indent:25px; line-height:27px;} .s_form_001 li input[type=text],.s_form_001 li input[type=password]{ border:1px solid #CCC; width:30%; height:27px; padding:0 10px;} .s_form_001 li input[type=text].w10{ width:10%;} .s_form_001 li input[type=text].w15{ width:15%;} .s_form_001 li input[type=text].w25{ width:25%;} .s_form_001 li textarea{ border:1px solid #CCC; width:56%; height:100px; padding:0 10px;} .s_form_001 li input[type=file]{} #store_name{ border:1px solid #CCC; width:10%; height:27px; padding:0 10px;} .s_form_001 li select{ border:1px solid #CCC; width:20%; height:27px;} .s_form_001 label.s_1{ width:auto; float:none; display:inline-block; } .s_form_001 li label.add{ /*padding-bottom:27px;*/} .s_form_001 label.s{ display:block; width:auto; margin-right:6px;} .store{ margin-top:10px; line-height:27px;} .store span{ display:inline-block; line-height:27px; margin:0 5px; color:#666; font-weight:bold;} .store .inquire{ display:inline-block; background-color:#999; padding:0 15px; color:#FFF; font-weight:bold;} .s_form_2{} .s_form_2 li{ margin:5px 0;} .s_form_2 input[type=text]{ border:none; border-bottom: 1px solid #99CCCC; padding:0 5px;} .s_form_3{} .s_form_3 li {padding:15px 0 0; border-top:1px dashed #99CCCC; border-bottom:0;} .s_form_3 li label{ width:20%; text-indent:0;} .s_form_3 li textarea{ border:1px solid #CCC; width:77.5%; padding:1%; min-height:100px;} .s_form_4{} .s_form_4 li { position:relative;} .s_form_4 li>label{ width:auto; position:absolute; top:0; left:0;} .s_form_4 li>input[type=text]{ width:100%; border:0; padding:10px; margin:0;} .s_form_4 li textarea{ width:100%; float:left; padding:10px;} .s_form_4 .align_right{ position:absolute; top:0; right:0; width:auto;} .s_tab{ background:url(../img/icon_8.png); height:44px; border-bottom:1px solid #bbb; text-align:center; padding:0 5px; overflow:hidden;} .s_tab ul{} .s_tab li a{ display:block; float:left; margin-top:6px; border:1px solid #ccc; border-top-left-radius:5px; border-top-right-radius:5px; background:#eee; margin-right:1px; padding:10px 15px;} .s_tab li a.current{ border:1px solid #aaa; background:#fff;} .sep_1{ padding-left:200px;} .sep_1 div{ width:38%;} .sep_1 div label{ text-indent:0;} .sep_1 div input[type=text]{ width:100%; float:left;} /*Dishes*/ #dishes_list{ clear:both;} #dishes_list li{ width:100%; margin:0 1% 20px 0; float:left;} #dishes_list.no_owl li{ width:15%;} #dishes_list.no_owl li:nth-child(6n+1){ clear:both;} #dishes_list li img{ width:100%; transition:.2s;} #dishes_list li p{ color:#999;} #dishes_list li span{ color:#666;} #dishes_list li:hover img{ opacity:.8;} #bt_upload_dishes{} #bt_upload_dishes,.s_bt_1{ width:200px; display:inline-block; margin:0 auto; background-color:#0376bc; line-height:40px; text-align:center; color:#fff; font-size:15px;} #bt_upload_dishes:hover ,.s_bt_1:hover{ background-color:#CCC; color:#fff;} #bt_upload_dishes span { display:block; background:url(../img/icon_11.png) 10% 50% no-repeat; text-indent:40px;} #show_dishes_page .w990{ width:90%;} #show_dishes_page.page{ width:900px;} #dishes_share_page .fl_78_shop a{ display:inline-block; color:#0376bc;} #dishes_share_page p{ clear:both;} #dishes_share_page time{ display:block; color:#999; margin:10px 0;} #dishes_share_page #B_img{ margin-bottom:5%; width:65%;} #dishes_share_page #B_txt{ margin-bottom:5%; width:30%;} /*bts*/ .brown{color:#0376bc} .sbt_10{background:#F90;color:#fff; padding:5px 15px; font-weight:bold; border:0; border-radius:0px; display:inline-block; text-align:center; transition: all .2s;} .sbt_20{background:#0376bc;color:#fff; padding:5px 15px; font-weight:bold; border:0; border-radius:0px; display:inline-block; text-align:center; transition: all .2s;} .sbt_10:hover,.sbt_20:hover{ opacity:.8; filter:alpha(opacity=80); color:#fff;} .sbt_10:active,.sbt_20:active{ position:relative; top:1px;} .sbt_big{ padding:8px 50px; font-size:15px;} .sbt_1{ display:inline-block; background:#0376bc; padding:10px 20px; color:#fff; font-size:15px; transition:.2s; border-radius:5px; margin-bottom:10px;} .sbt_1:hover{background:#DDD; color:#fff;} .sbt_2{ background:#FF4D4D; display:block; width:84%; padding:10px 0; color:#fff; font-size:15px; transition:.2s; clear:both; margin-bottom:10px;} .sbt_2:hover{ opacity:.8; color:#fff;} .sbt_3{ display:block; text-align:center; background:#CCC; padding:10px 20px; color:#fff; font-size:15px; transition:.2s; border-radius:5px; margin-bottom:10px;} .sbt_3:hover{ background:#FF4D4D; color:#fff;} .sec_bt_1{ margin-bottom:3%; text-align:center;} .sec_bt_1 a{ margin:0 auto;} .join{ margin:38px 10px 38px 0;} .f_left{float: left; margin-right: 10px;} .simpcont {margin-top:5px; text-align:left; line-height:25px; color:#666;} .titlecont,.titlecont p { font-size: 24px; text-align:center;} /*reuse*/ .float_left{ float:left;} .float_right{ float:right;} .text_right{ text-align:right;} .s_t1{ color:#FF6666;} .s_t2{ text-decoration:underline;} .s_h1{ font-size:16px; font-weight:bold; clear:both; margin-bottom:20px; line-height:35px; background-color:#ECE7DB; color:#000; text-indent:20px;} .s_h2{ font-size:16px; font-weight:bold; clear:both; background:#ECE7DB; height:44px; line-height:44px; text-indent:20px; border-bottom:1px solid #bbb;} a.no_deco{ text-decoration:none;} .s_note_1{ background:#F1f1f1; border-radius:3px; padding:10px 15px;} .pop_count{ position:relative; display:inline-block;} .pop_count span{ background:#99CCCC; border-radius:4px; display:inline-block; padding:3px; position:absolute; top:0; right:-30px; width:15px; height:15px; color:#fff; line-height:16px; text-align:center;} .s_ul_1{ padding-left:20px;} .s_ul_1>li{ list-style-type:decimal; line-height:2;} .s_ul_2{ padding-left:20px;} .s_ul_2>li{ list-style-type:disc; line-height:2;} /*mobile*/ ._m_gheader{ position:fixed; width:100%; height:40px; background:#99CCCC; z-index:999; /*box-shadow:0px 5px 5px rgba(153, 204, 204, 0.5);*/ border-bottom:1px solid #fff; text-align:center; display:none; opacity:.9;} ._m_gheader .logo{display:inline-block; color:#fff; font-size:20px; line-height:40px;} ._m_gheader .first{ background: center center no-repeat transparent; background-image: url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADhJREFUeNpi/P//PwOtARMDHQBdLGFBYtMq3BiHT3DRPU4YR4NrNAmPJuHRJDyahEeT8Ii3BCDAAF0WBj5Er5idAAAAAElFTkSuQmCC ); display: block; width: 40px; height: 40px; position: absolute; top: 0; left: 0;} ._m_gfooter{ display:none; text-align:center; color:#99CCCC; font-size:10px; padding:20px 0 10px; clear:both;} ._m_gfooter .sep_line{ margin:0 0 10px;} #_m_gnav_pds { background-color: #E0EFEF;} #_m_gnav_more { background-color: #E0EFEF;} .mm-menu.mm-light .mm-list li.mm-label{ background:rgba(0, 0, 0, 0.1); padding:5px 0; font-size:14px;} .mm-menu.mm-light .mm-list > li > a.mm-subopen:after, .mm-menu.mm-light .mm-list > li > a.mm-subclose:before{ border-color: rgba(0, 0, 0, .5);} .mm-menu.mm-light .mm-list > li > a.mm-subclose{ border-bottom:1px solid #fff; color: rgba(0, 0, 0, .5);} ._m_idx_banner{ display:none; margin-bottom:13px;} ._m_idx_banner a,._m_idx_banner img{ width:100%;} ._m_crumb{ position:fixed; background:#fff; top:40px; width:100%; height:40px; box-shadow:0 0 5px rgba(0,0,0,.5); z-index:998; line-height:40px; overflow:hidden; display:none;} ._m_crumb a{ height:40px; display:block;} ._m_crumb li{ float:left; padding-left:15px; padding-right:5px; position:relative;} ._m_crumb li:before{content: '';border: 2px solid #ccc;border-left:transparent;border-top:transparent;display: block;width: 7px;height: 7px;margin-bottom: -5px;position: absolute;bottom: 50%;right:-8px;-webkit-transform: rotate(-45deg);-ms-transform: rotate(-45deg);transform: rotate(-45deg);} ._m_crumb li.first{ text-indent:-9999px; background:url(../img/icon_1.png) no-repeat 50% 50%; width:15px; height:40px; margin-left:5px;} ._m_pdl_banner{ display:none; width:105%; margin-left:-2.5%;} ._m_pdl_banner img{ width:100%;} ._m_s_h2{ display:none;} ._m_cart_tb_1{ background:#f7f7f7; margin-bottom:20px; display:none;} ._m_cart_tb_1 li{ border-bottom:1px dashed #ccc; padding:10px 0;} ._m_cart_tb_1 .label{width:25%; float:left; padding-left:10px;} ._m_cart_tb_1 span{} ._m_faq_subnav{ display:none;} ._m_faq_subnav ul{ border-left:1px solid #ddd;} ._m_faq_subnav li{ border-right:1px solid #ddd; border-bottom:1px solid #ddd; width:45.6%; float:left; padding:1% 2%;} ._m_faq_subnav li.current{ background:#E0EFEF;} ._m_faq_subnav li a{ padding:5px 10px; display:block;} .rwd_table{ width:100%;} .rwd_table .label{ display:none; width:25%; float:left; padding-left:3%;} /*Service Talk*/ .s_msg_wrap{} .s_msg{} .s_msg .msg_author{ display: inline-block; vertical-align: top; margin: 0; padding: 0; line-height: 18px; width: 20%;} .s_msg .msg_comment{ position: relative; display: inline-block; width: 76.3%; vertical-align: top; padding: 1.5%; background: #eee; margin-bottom: 15px; margin-left: 0;} .s_msg .msg_comment:after{ content: ""; position: absolute; top: 5px; left: -15px; border-style: solid; border-width: 10px 15px 10px 0; border-color: transparent #eee; display: block; width: 0; z-index: 1;} .s_msg .msg_admin .msg_comment{ background:#f7f7f7;} .s_msg .msg_admin .msg_comment:after{ border-color: transparent #f7f7f7;} .s_msg .msg_comment img{ max-width:100%; height:auto !important;} .s_msg .msg_comment time{ color:#999;} /*回到最上面*/ #top_control{ position:fixed; right:3%; bottom:-10%; z-index:999; transition:.3s;}/*先在下方-10%*/ #top_control.active{ bottom:2%;}/*執行active 會從下方的-10%來到2%*/ #top_control a{ display:block; transition:.2s; position:relative; top:0;}/*這邊的top 0 點選這按鈕會微微的 往上小跳一下*/ #top_control a:hover{ top:-5px;}/*從top0 跳到top-5*/ #top_control img{ width:100%;} /*MSG BOX*/ .msg_box{ background:rgba(0,0,0,.6); position:fixed; top:0; left:0; width:100%; height:100%; opacity:0; visibility:hidden; transition:.2s; z-index:10; transform:scale(1);} .msg_box.active{ opacity:1; visibility:visible;} .msg_box .msg_wrap{ background:#fff; width:90%; height:90%; max-width:600px; max-height:940px; margin:0 auto; box-shadow:0 0 10px rgba(0,0,0,.5); padding:20px; transform:translateY(0px); transition-delay:.5s; transition:.5s; opacity:0; visibility:hidden;} .msg_box.active .msg_wrap{ /*transform:translateY(0);*/ opacity:1; visibility:visible;} .msg_box .close{ position: absolute;top: 2%;right: 2%; z-index:1; background:url(../img/icon_12.png) no-repeat #333; border-radius:40px; width:40px; height:40px; text-indent:-9999px; cursor:pointer; transition:.2s;} .msg_box .close:hover{ transform:rotate(90deg); background-color:#0376bc;} .msg_box header{ font-size: 30px; color: #545454; margin-bottom: 10px; margin-top: 40px; text-align:center;} .msg_box .msg_content{ overflow-y: auto; overflow-x: hidden; height:87%; text-align:left; line-height:2;} .msg_box .msg_content img{ max-width:100%;} .msg_box .msg_content .brown_line_s3{ float:none;} /*手機選單開關鈕*/ #c-hamburger { display: none; position: relative; margin: 0; padding: 0; width: 80px; height: 60px; font-size: 0; text-indent: -9999px; appearance: none; box-shadow: none; border-radius: none; border: none; cursor: pointer; transition: background 0.3s; margin:0 auto; transform: scale(.5); transition:.2s; } #c-hamburger:focus { outline: none; } #c-hamburger span { display: block; position: absolute; top: 30px; left: 18px; right: 18px; height: 3px; background: #0088cc; border-radius:1px; } #c-hamburger span::before, #c-hamburger span::after { position: absolute; display: block; left: 0; width: 100%; height: 3px; background-color: #0088cc; content: ""; border-radius:1px; } #c-hamburger span::before { top: -15px; } #c-hamburger span::after { bottom: -15px; } #c-hamburger { background-color: #fff; } #c-hamburger span { transition: background 0s 0.3s; } #c-hamburger span::before, #c-hamburger span::after { transition-duration: 0.3s, 0.3s; transition-delay: 0.3s, 0s; } #c-hamburger span::before { transition-property: top, transform; } #c-hamburger span::after { transition-property: bottom, transform; } /* active state, i.e. menu open */ #c-hamburger.active { /*background-color: #cb0032;*/ height:96px; } #c-hamburger.active span { background: none; } #c-hamburger.active span::before { top: 0; transform: rotate(45deg); } #c-hamburger.active span::after { bottom: 0; transform: rotate(-45deg); } #c-hamburger.active span::before, #c-hamburger.active span::after { transition-delay: 0s, 0.3s; } .ul-btn-style { text-align: center; } .li-btn-style { list-style: none; position: relative; display: inline-block; width: 100px; height: 100px; margin-right:10px; } @-moz-keyframes rotate { 0% {transform: rotate(0deg);} 100% {transform: rotate(-360deg);} } @-webkit-keyframes rotate { 0% {transform: rotate(0deg);} 100% {transform: rotate(-360deg);} } @-o-keyframes rotate { 0% {transform: rotate(0deg);} 100% {transform: rotate(-360deg);} } @keyframes rotate { 0% {transform: rotate(0deg);} 100% {transform: rotate(-360deg);} } .round { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; /*padding-top: 8px; */ text-decoration: none; text-align: center; font-size: 25px; text-shadow: 0 1px 0 rgba(255,255,255,.7); letter-spacing: -.065em; font-family: "Hammersmith One", sans-serif; -webkit-transition: all .25s ease-in-out; -o-transition: all .25s ease-in-out; -moz-transition: all .25s ease-in-out; transition: all .25s ease-in-out; /*box-shadow: 2px 2px 7px rgba(0,0,0,.2);*/ box-shadow: inset 0 -3px 0 0 rgba(0, 0, 0, 0.15); border-radius: 300px; z-index: 1; border-width: 4px; border-style: solid; } .round:hover { width: 130%; height: 130%; left: -15%; top: -15%; /*font-size: 33px;*/ padding-top: 8px; -webkit-box-shadow: 5px 5px 10px rgba(0,0,0,.3); -o-box-shadow: 5px 5px 10px rgba(0,0,0,.3); -moz-box-shadow: 5px 5px 10px rgba(0,0,0,.3); box-shadow: 5px 5px 10px rgba(0,0,0,.3); z-index: 2; border-size: 10px; -webkit-transform: rotate(-360deg); -moz-transform: rotate(-360deg); -o-transform: rotate(-360deg); transform: rotate(-360deg); } a.blue, .blue { background-color: #0088cc; border-color: #dddcd6; } a.red, .red { background-color: #da4f49; border-color: #dddcd6; } a.purple, .purple { background-color: #A041BA; border-color: #dddcd6; } a.pink, .pink { background-color: #D24AAC; border-color: #dddcd6; } a.green, .green { background-color: #5bb75b; border-color: #dddcd6; } .img-width90{ width:90%; } .height500{ height:500px; } .list-group { padding-left: 0; margin-bottom: 20px; } .list-group-item { position: relative; display: block; padding: 10px 15px; margin-bottom: -1px; background-color: #fff; border: 1px solid #ddd; font-size:16px; } .list-group-item:first-child { border-top-left-radius: 4px; border-top-right-radius: 4px; } .list-group-item:last-child { margin-bottom: 0; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; } a.list-group-item { color: #555; } a.list-group-item .list-group-item-heading { color: #333; } a.list-group-item:hover, a.list-group-item:focus { color: #555; text-decoration: none; background-color: #f5f5f5; } .list-group-item.disabled, .list-group-item.disabled:hover, .list-group-item.disabled:focus { color: #777; cursor: not-allowed; background-color: #eee; } .list-group-item.disabled .list-group-item-heading, .list-group-item.disabled:hover .list-group-item-heading, .list-group-item.disabled:focus .list-group-item-heading { color: inherit; } .list-group-item.disabled .list-group-item-text, .list-group-item.disabled:hover .list-group-item-text, .list-group-item.disabled:focus .list-group-item-text { color: #777; } .list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus { z-index: 2; color: #fff; background-color: #337ab7; border-color: #337ab7; } .list-group-item.active .list-group-item-heading, .list-group-item.active:hover .list-group-item-heading, .list-group-item.active:focus .list-group-item-heading, .list-group-item.active .list-group-item-heading > small, .list-group-item.active:hover .list-group-item-heading > small, .list-group-item.active:focus .list-group-item-heading > small, .list-group-item.active .list-group-item-heading > .small, .list-group-item.active:hover .list-group-item-heading > .small, .list-group-item.active:focus .list-group-item-heading > .small { color: inherit; } .list-group-item.active .list-group-item-text, .list-group-item.active:hover .list-group-item-text, .list-group-item.active:focus .list-group-item-text { color: #c7ddef; } .list-group-item-success { color: #3c763d; background-color: #dff0d8; } a.list-group-item-success { color: #3c763d; } a.list-group-item-success .list-group-item-heading { color: inherit; } a.list-group-item-success:hover, a.list-group-item-success:focus { color: #3c763d; background-color: #d0e9c6; } a.list-group-item-success.active, a.list-group-item-success.active:hover, a.list-group-item-success.active:focus { color: #fff; background-color: #3c763d; border-color: #3c763d; } .list-group-item-info { color: #31708f; background-color: #d9edf7; } a.list-group-item-info { color: #31708f; } a.list-group-item-info .list-group-item-heading { color: inherit; } a.list-group-item-info:hover, a.list-group-item-info:focus { color: #31708f; background-color: #c4e3f3; } a.list-group-item-info.active, a.list-group-item-info.active:hover, a.list-group-item-info.active:focus { color: #fff; background-color: #31708f; border-color: #31708f; } .list-group-item-warning { color: #8a6d3b; background-color: #fcf8e3; } a.list-group-item-warning { color: #8a6d3b; } a.list-group-item-warning .list-group-item-heading { color: inherit; } a.list-group-item-warning:hover, a.list-group-item-warning:focus { color: #8a6d3b; background-color: #faf2cc; } a.list-group-item-warning.active, a.list-group-item-warning.active:hover, a.list-group-item-warning.active:focus { color: #fff; background-color: #8a6d3b; border-color: #8a6d3b; } .list-group-item-danger { color: #a94442; background-color: #f2dede; } a.list-group-item-danger { color: #a94442; } a.list-group-item-danger .list-group-item-heading { color: inherit; } a.list-group-item-danger:hover, a.list-group-item-danger:focus { color: #a94442; background-color: #ebcccc; } a.list-group-item-danger.active, a.list-group-item-danger.active:hover, a.list-group-item-danger.active:focus { color: #fff; background-color: #a94442; border-color: #a94442; } .list-group-item-heading { margin-top: 0; margin-bottom: 5px; } .list-group-item-text { margin-bottom: 0; line-height: 1.3; } .content-text-setting{font-size: 16px;} .title-text-setting{font-size:20px; font-weight:bold;} .panel { margin-bottom: 20px; background-color: #fff; border: 1px solid transparent; border-radius: 4px; -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05); box-shadow: 0 1px 1px rgba(0, 0, 0, .05); } .panel-body { padding: 15px; } .panel-heading { padding: 10px 15px; border-bottom: 1px solid transparent; border-top-left-radius: 3px; border-top-right-radius: 3px; } .panel-heading > .dropdown .dropdown-toggle { color: inherit; } .panel-title { margin-top: 0; margin-bottom: 0; font-size: 16px; color: inherit; } .panel-title > a, .panel-title > small, .panel-title > .small, .panel-title > small > a, .panel-title > .small > a { color: inherit; } .panel-footer { padding: 10px 15px; background-color: #f5f5f5; border-top: 1px solid #ddd; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .panel > .list-group, .panel > .panel-collapse > .list-group { margin-bottom: 0; } .panel > .list-group .list-group-item, .panel > .panel-collapse > .list-group .list-group-item { border-width: 1px 0; border-radius: 0; } .panel > .list-group:first-child .list-group-item:first-child, .panel > .panel-collapse > .list-group:first-child .list-group-item:first-child { border-top: 0; border-top-left-radius: 3px; border-top-right-radius: 3px; } .panel > .list-group:last-child .list-group-item:last-child, .panel > .panel-collapse > .list-group:last-child .list-group-item:last-child { border-bottom: 0; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .panel-heading + .list-group .list-group-item:first-child { border-top-width: 0; } .list-group + .panel-footer { border-top-width: 0; } .panel > .table, .panel > .table-responsive > .table, .panel > .panel-collapse > .table { margin-bottom: 0; } .panel > .table caption, .panel > .table-responsive > .table caption, .panel > .panel-collapse > .table caption { padding-right: 15px; padding-left: 15px; } .panel > .table:first-child, .panel > .table-responsive:first-child > .table:first-child { border-top-left-radius: 3px; border-top-right-radius: 3px; } .panel > .table:first-child > thead:first-child > tr:first-child, .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child, .panel > .table:first-child > tbody:first-child > tr:first-child, .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child { border-top-left-radius: 3px; border-top-right-radius: 3px; } .panel > .table:first-child > thead:first-child > tr:first-child td:first-child, .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:first-child, .panel > .table:first-child > tbody:first-child > tr:first-child td:first-child, .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:first-child, .panel > .table:first-child > thead:first-child > tr:first-child th:first-child, .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:first-child, .panel > .table:first-child > tbody:first-child > tr:first-child th:first-child, .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:first-child { border-top-left-radius: 3px; } .panel > .table:first-child > thead:first-child > tr:first-child td:last-child, .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:last-child, .panel > .table:first-child > tbody:first-child > tr:first-child td:last-child, .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:last-child, .panel > .table:first-child > thead:first-child > tr:first-child th:last-child, .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:last-child, .panel > .table:first-child > tbody:first-child > tr:first-child th:last-child, .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:last-child { border-top-right-radius: 3px; } .panel > .table:last-child, .panel > .table-responsive:last-child > .table:last-child { border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .panel > .table:last-child > tbody:last-child > tr:last-child, .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child, .panel > .table:last-child > tfoot:last-child > tr:last-child, .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child { border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .panel > .table:last-child > tbody:last-child > tr:last-child td:first-child, .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:first-child, .panel > .table:last-child > tfoot:last-child > tr:last-child td:first-child, .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:first-child, .panel > .table:last-child > tbody:last-child > tr:last-child th:first-child, .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:first-child, .panel > .table:last-child > tfoot:last-child > tr:last-child th:first-child, .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:first-child { border-bottom-left-radius: 3px; } .panel > .table:last-child > tbody:last-child > tr:last-child td:last-child, .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:last-child, .panel > .table:last-child > tfoot:last-child > tr:last-child td:last-child, .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:last-child, .panel > .table:last-child > tbody:last-child > tr:last-child th:last-child, .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:last-child, .panel > .table:last-child > tfoot:last-child > tr:last-child th:last-child, .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child { border-bottom-right-radius: 3px; } .panel > .panel-body + .table, .panel > .panel-body + .table-responsive, .panel > .table + .panel-body, .panel > .table-responsive + .panel-body { border-top: 1px solid #ddd; } .panel > .table > tbody:first-child > tr:first-child th, .panel > .table > tbody:first-child > tr:first-child td { border-top: 0; } .panel > .table-bordered, .panel > .table-responsive > .table-bordered { border: 0; } .panel > .table-bordered > thead > tr > th:first-child, .panel > .table-responsive > .table-bordered > thead > tr > th:first-child, .panel > .table-bordered > tbody > tr > th:first-child, .panel > .table-responsive > .table-bordered > tbody > tr > th:first-child, .panel > .table-bordered > tfoot > tr > th:first-child, .panel > .table-responsive > .table-bordered > tfoot > tr > th:first-child, .panel > .table-bordered > thead > tr > td:first-child, .panel > .table-responsive > .table-bordered > thead > tr > td:first-child, .panel > .table-bordered > tbody > tr > td:first-child, .panel > .table-responsive > .table-bordered > tbody > tr > td:first-child, .panel > .table-bordered > tfoot > tr > td:first-child, .panel > .table-responsive > .table-bordered > tfoot > tr > td:first-child { border-left: 0; } .panel > .table-bordered > thead > tr > th:last-child, .panel > .table-responsive > .table-bordered > thead > tr > th:last-child, .panel > .table-bordered > tbody > tr > th:last-child, .panel > .table-responsive > .table-bordered > tbody > tr > th:last-child, .panel > .table-bordered > tfoot > tr > th:last-child, .panel > .table-responsive > .table-bordered > tfoot > tr > th:last-child, .panel > .table-bordered > thead > tr > td:last-child, .panel > .table-responsive > .table-bordered > thead > tr > td:last-child, .panel > .table-bordered > tbody > tr > td:last-child, .panel > .table-responsive > .table-bordered > tbody > tr > td:last-child, .panel > .table-bordered > tfoot > tr > td:last-child, .panel > .table-responsive > .table-bordered > tfoot > tr > td:last-child { border-right: 0; } .panel > .table-bordered > thead > tr:first-child > td, .panel > .table-responsive > .table-bordered > thead > tr:first-child > td, .panel > .table-bordered > tbody > tr:first-child > td, .panel > .table-responsive > .table-bordered > tbody > tr:first-child > td, .panel > .table-bordered > thead > tr:first-child > th, .panel > .table-responsive > .table-bordered > thead > tr:first-child > th, .panel > .table-bordered > tbody > tr:first-child > th, .panel > .table-responsive > .table-bordered > tbody > tr:first-child > th { border-bottom: 0; } .panel > .table-bordered > tbody > tr:last-child > td, .panel > .table-responsive > .table-bordered > tbody > tr:last-child > td, .panel > .table-bordered > tfoot > tr:last-child > td, .panel > .table-responsive > .table-bordered > tfoot > tr:last-child > td, .panel > .table-bordered > tbody > tr:last-child > th, .panel > .table-responsive > .table-bordered > tbody > tr:last-child > th, .panel > .table-bordered > tfoot > tr:last-child > th, .panel > .table-responsive > .table-bordered > tfoot > tr:last-child > th { border-bottom: 0; } .panel > .table-responsive { margin-bottom: 0; border: 0; } .panel-group { margin-bottom: 20px; font-size:16px; } .panel-group .panel { margin-bottom: 0; border-radius: 4px; } .panel-group .panel + .panel { margin-top: 5px; } .panel-group .panel-heading { border-bottom: 0; } .panel-group .panel-heading + .panel-collapse > .panel-body, .panel-group .panel-heading + .panel-collapse > .list-group { border-top: 1px solid #ddd; } .panel-group .panel-footer { border-top: 0; } .panel-group .panel-footer + .panel-collapse .panel-body { border-bottom: 1px solid #ddd; } .panel-default { border-color: #ddd; } .panel-default > .panel-heading { color: #333; background-color: #f5f5f5; border-color: #ddd; } .panel-default > .panel-heading + .panel-collapse > .panel-body { border-top-color: #ddd; } .panel-default > .panel-heading .badge { color: #f5f5f5; background-color: #333; } .panel-default > .panel-footer + .panel-collapse > .panel-body { border-bottom-color: #ddd; } .panel-primary { border-color: #337ab7; } .panel-primary > .panel-heading { color: #fff; background-color: #337ab7; border-color: #337ab7; } .panel-primary > .panel-heading + .panel-collapse > .panel-body { border-top-color: #337ab7; } .panel-primary > .panel-heading .badge { color: #337ab7; background-color: #fff; } .panel-primary > .panel-footer + .panel-collapse > .panel-body { border-bottom-color: #337ab7; } .panel-success { border-color: #d6e9c6; } .panel-success > .panel-heading { color: #3c763d; background-color: #dff0d8; border-color: #d6e9c6; } .panel-success > .panel-heading + .panel-collapse > .panel-body { border-top-color: #d6e9c6; } .panel-success > .panel-heading .badge { color: #dff0d8; background-color: #3c763d; } .panel-success > .panel-footer + .panel-collapse > .panel-body { border-bottom-color: #d6e9c6; } .panel-info { border-color: #bce8f1; } .panel-info > .panel-heading { color: #31708f; background-color: #d9edf7; border-color: #bce8f1; } .panel-info > .panel-heading + .panel-collapse > .panel-body { border-top-color: #bce8f1; } .panel-info > .panel-heading .badge { color: #d9edf7; background-color: #31708f; } .panel-info > .panel-footer + .panel-collapse > .panel-body { border-bottom-color: #bce8f1; } .panel-warning { border-color: #faebcc; } .panel-warning > .panel-heading { color: #8a6d3b; background-color: #fcf8e3; border-color: #faebcc; } .panel-warning > .panel-heading + .panel-collapse > .panel-body { border-top-color: #faebcc; } .panel-warning > .panel-heading .badge { color: #fcf8e3; background-color: #8a6d3b; } .panel-warning > .panel-footer + .panel-collapse > .panel-body { border-bottom-color: #faebcc; } .panel-danger { border-color: #ebccd1; } .panel-danger > .panel-heading { color: #a94442; background-color: #f2dede; border-color: #ebccd1; } .panel-danger > .panel-heading + .panel-collapse > .panel-body { border-top-color: #ebccd1; } .panel-danger > .panel-heading .badge { color: #f2dede; background-color: #a94442; } .panel-danger > .panel-footer + .panel-collapse > .panel-body { border-bottom-color: #ebccd1; } .embed-responsive { position: relative; display: block; height: 0; padding: 0; overflow: hidden; } .embed-responsive .embed-responsive-item, .embed-responsive iframe, .embed-responsive embed, .embed-responsive object, .embed-responsive video { position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; border: 0; } .embed-responsive.embed-responsive-16by9 { padding-bottom: 56.25%; } .embed-responsive.embed-responsive-4by3 { padding-bottom: 75%; } /******************************** RWD ********************************/ #_m_banner{ display:none; height:0; overflow:hidden;} #_m_banner{ width:100%;} #_m_banner img{ width:100%;} @media screen and (max-width: 1600px){ #areaBox .areaBox_s{ display:inline-block; width:15%; vertical-align:top; text-align:center; } #areaBox .areaBox_s:nth-child(1){ width:30%;} } @media screen and (max-width: 1440px){ .w990{ width:85%;} } @media screen and (max-width: 1200px){ .if_wrap_a { width: 100%;} .w990{ width:95%;} #top_control{ right:1%;} #g_header._scroll_mode #g_nav>ul{ margin-top:38px;} #g_nav>ul>li{width:90px;} #g_nav>ul>li>a{ height:135px;} #g_nav{ margin-right:-40px;} #g_header h1{ width:220px;} #g_header h3{ width:220px;} #g_header._scroll_mode h1{ width:220px; margin-top:35px;} #g_header._scroll_mode h3{ width:220px; margin-top:35px;} } @media screen and (max-width: 1060px){ .newsBox li{ width:48%;} #show_dishes_page.page{ width:90%;} .cirPic li{ width:31%;} } @media screen and (max-width: 990px){ #g_nav li{ margin-right:0;} .online li{ width:32%;} } @media screen and (max-width: 880px) { #g_header{ border-bottom:1px solid #ddd;} #g_header h1 { float:none; display:block; margin: 10px auto; width:250px;} #g_header h3 { float:none; display:block; margin: 10px auto; width:250px;} #g_header._scroll_mode h1{ margin-top:-100px;} #g_header._scroll_mode h3{ margin-top:-100px;} #g_header._scroll_mode #c-hamburger{ height: 50px;} #g_header._scroll_mode #c-hamburger.active{ height: 50px;} #wrap{ margin-top:192px;} #top{ width:100%; text-align:center; max-height:0; padding:0; opacity:0; visibility:hidden; position:relative; top:0; left:0;} .quickBox{ float:none;} #g_nav { float: none; text-align: center; max-height:0; opacity:0; visibility:hidden; width:291px; margin:0 auto;} #g_nav>ul>li{ margin:0;} #g_nav>ul{ max-height:0;} #top.active{ max-height:150px; opacity:1; visibility:visible;} #g_nav.active{ max-height:300px; opacity:1; visibility:visible; margin-bottom:5%;} #g_nav.active ul{ max-height:500px;} #g_nav.active ul ul{ display:none;} .quickBox li{ margin:0; text-align:center; position:relative;} .quickBox li a{display:block; width:90px; height:105px; color:#000; font-size:14px; background:none;} .quickBox li a i.i1{ display:block; margin:0 auto; background:url(../img/menu_105x105.png); width:40px; height:40px; margin-bottom:5px; transition:.2s;} .quickBox li a.icon_01 i.i1{ background-position:-240px 0px;} .quickBox li a.icon_02 i.i1{ background-position:-280px 0px;} .quickBox li a.icon_03 i.i1{ background-position:-320px 0px;} .quickBox li a span.t1{ text-indent:0;} .quickBox li a span.t2{ display:block; font-size:12px; text-indent:0;} .quickBox li i#q_cart_num{ top:0px; right:10px;} #g_nav li a.menu_01 i.i2{ background:url(../img/hicon-05.png); margin-left:-19px;} #g_nav li a.menu_02 i.i2{ background:url(../img/hicon-01.png); margin-left:-19px;} #g_nav li a.menu_03 i.i2{ background:url(../img/hicon-02.png); margin-left:-19px;} #g_nav li a.menu_04 i.i2{ background:url(../img/hicon-04.png); margin-left:-19px;} #g_nav li a.menu_05 i.i2{ background:url(../img/hicon-06.png); margin-left:-19px;} #g_nav li a.menu_06 i.i2{ background:url(../img/hicon-06.png); margin-left:-19px;} /* #g_nav li a i.i2{ opacity:0; transition:.2s; position:absolute; top:0; left:50%; margin-left:-20px;} #g_nav li:hover a i.i2{ opacity:1;} #g_nav li:hover a i.i1{ margin-bottom:0;} #g_nav li:hover>a{ color:#063f69;} #g_nav li a.menu_01 i.i2{ background-position:0px -40px;} #g_nav li a.menu_02 i.i2{ background-position:-40px -40px;} #g_nav li a.menu_03 i.i2{ background-position:-80px -40px;} #g_nav li a.menu_04 i.i2{ background-position:-120px -40px;} #g_nav li a.menu_05 i.i2{ background-position:-160px -40px;} #g_nav li a.menu_06 i.i2{ background-position:-200px -40px;} */ #search_bar{ display:none;} #g_nav ul{ margin-top:0;} #c-hamburger{ display:block; clear:both;} .newsPic{ width:252px;} .newText{ padding-left:426px;} .secretList li{ width:48%; margin-right:4%;} .secretList li:nth-child(3n) { margin-right: 4%;} .secretList li:nth-child(2n) { margin-right: 0;} .newWrap li time{ width:115px;} .link_list .img{ width:30%;} .link_list .txt{ width:65%; margin-left:5%; float:left; padding-left:0;} #idxb_bt_prev,#rpi_bt_prev{ left:0%; top:40%;} #idxb_bt_next,#rpi_bt_next{ right:0%; top:40%;} #idxb_bt_prev:hover,#rpi_bt_prev:hover{ left:-2%;} #idxb_bt_next:hover,#rpi_bt_next:hover{ right:-2%;} #g_nav li ul li{ background:#fff;} #g_nav li ul{ width:100px;} .quickBox li.lang{ width: 100px; display: block; border: 1px solid #ccc; margin: 0 auto; padding: 4px 0 7px; margin-bottom: 20px;} .quickBox li.lang:hover ul{ top:104%;} .quickBox li.lang ul{ margin-left:0;} .quickBox li.lang a i{ background:url(../img/quick_20x20.png) -60px 0; width:20px; height:20px; float:right;} #g_header._scroll_mode #g_nav>ul{ margin-top:0;} #g_nav li a{ width:87px;} .quickBox li a{ width:87px;} ._m_show{ display:block;} .quickBox li{ border-left:0;} .quickBox li.last{ display:none;} #g_nav li a.menu_08, #g_nav li a.menu_09{ display:block;} .quickBox li{ display:none;} .quickBox li.lang{ display:block;} } @media screen and (max-width: 770px) { .cooklist a .black { position:static; opacity:1; visibility:visible; transform:rotateY(0); background:#fff; text-align:left;} .cooklist a .text{ display:block;} .cooklist a .text h2{ font-size:17px; font-size: 22px; margin: 5px 0 10px;} .cooklist a .text p{ color:#333; width:100%; height:60px;} #shop_banner a .black { position:static; opacity:1; visibility:visible; transform:rotateY(0); background:#fff; text-align:left;} #shop_banner a .text{ display:block;} #shop_banner a .text h2{ font-size:17px; font-size: 22px; margin: 5px 0 10px;} #relate_shop .hover{ position:static; background:#0376bc;} #relate_shop .hover span{ margin-top:0%; transform:scale(.8);} #relate_shop .toInfo{ margin-top:0%; transform:scale(.8);} #relate_shop .toCart{ margin-top:0%; transform:scale(.8);} #relate_shop .toInfo:hover{ margin-top:0%;} #relate_shop .toCart:hover{ margin-top:0%;} #B_img{ width:100%;} #B_txt{ width:100%; margin-left:0;} #dishes_share_page #B_img{ width:100%;} #dishes_share_page #B_txt{ width:100%;} } @media screen and (max-width: 750px) { #areaBox .areaBox_s{ width:49%; margin-bottom:5%;} #areaBox .areaBox_s:nth-child(1){ width:100%;} } @media screen and (max-width: 700px) { /* #g_header{ display:none;} */ .online li{ width:48.6%;} #isIdx .online li{ display:none;} #isIdx .online li:nth-child(1), #isIdx .online li:nth-child(2), #isIdx .online li:nth-child(3), #isIdx .online li:nth-child(4), #isIdx .online li:nth-child(5), #isIdx .online li:nth-child(6){ display:block; float:left;} .fl_tai{ width:100%; text-align:center;} .fl_tai .btn34 li{ width:auto; margin:0 1%;} .fr_tai_list{ width:100%;} /* #isIdx .fr_tai_list .salesList li .f12_gray{ display:none;} #isIdx .salePic{ display:none;} */ .page{ width:90%;} .newsPic { width: 173px; } .newText { padding-left: 145px;} #dishes_list.no_owl li{ width:24%;} #dishes_list.no_owl li:nth-child(6n+1){ clear:none;} #dishes_list.no_owl li:nth-child(4n+1){ clear:both;} .media_list li{ width:46.8%;} .media_list li:nth-child(3n+1){ clear:none;} .media_list li:nth-child(2n+1){ clear:both;} } @media screen and (max-width: 650px) { #fb_foot{ display:none;} .newsBox li{ width:100%;} .fl_78{ width:100%; margin-bottom:5%;} .fr_20{ width:100%; margin-bottom:5%;} .cooklist a .img{ height:0; padding-bottom:45%; overflow:hidden;} .cooklist.mt10:nth-child(4){ display:none;} .fr_20 .big{ display:block;} .fr_20 .small{ display:none;} .f30_gray{ font-size:24px;} .f20_black{ font-size:18px;} .cooklist a .text h2{ font-size:18px;} #control{ display:none;} .fl_78_shop{ width:100%;} .fr_20_shop{ width:100%;} .join_1{ line-height:60px; font-size:17px;} .join_2{ line-height:60px; font-size:17px;} .fl_pic{ width:100%;} .picBox p{ width:100%;} .num { clear: both; float: left;} /* #pdi_img{ height:0; overflow:hidden;} #_m_pdi_img{ height:auto; overflow:hidden;} */ .cirPic li{ width:100%; margin-right:0; /*position:relative;*/} /* .cirPic li p.mt20{ display:none;} .cirPic li p._m_title{ display:block; background:#fff; font-size:20px; position:absolute; top:50%; right:0; padding:10px;} .cirPic li .brown_line{ display:none;} */ } /* @media screen and (max-width: 640px) { #_m_banner{ display:block; height:auto;} #idx_banner{ display:none; height:0; overflow:hidden;} } */ @media screen and (max-width: 620px) { .rwd_table thead,.rwd_table tfoot{ display:none;} .rwd_table .label{ display:inline-block;} .rwd_table td{ width:100%; box-sizing:border-box; float:left; clear:left; } .rwd_table tr td:first-child{ padding-top:10px;} .rwd_table tr td:last-child{ border-bottom:1px solid #bbb;} ._m_s_h2{ display:block;} ._m_hide_1{ display:none;} ._m_cart_tb_1{ display:block;} .s_tb_2{ background:#f1f1f1;} .s_tb_2 tr:nth-child(2n){ background: rgba(255, 255, 255, .5);} .s_tb_2 tbody td{ text-align:left;} .s_tb_2 i{ display:inline-block;} .s_tb_2 .s_4{width:70%;} .s_tb_2 .s_1{ padding-left:0;} .s_h2{ font-size:13px; text-indent:10px;} .salesList_2 li { width: 100%; margin-right: 0%;} #cart_sum{ width:95%; margin:0 auto; float:none; min-width:0;} a.float-right-contact{display:none !important;} a.float-right-cart{display:none !important;} } @media screen and (max-width: 560px) { .newWrap li time{ display:block;} .newWrap li time.lunarDate{ display:none;} .newsPic { width: 30%; margin-right:0;} .newText { padding-left: 0; width:65%; margin-left:5%; float:left;} } @media screen and (max-width: 500px) { /* #isIdx .salesBox .fl_tai{ display:none;} #isIdx .salesList li{ display:none;} #isIdx .salesList li:nth-child(1), #isIdx .salesList li:nth-child(2), #isIdx .salesList li:nth-child(3){ display:block;} */ .salesList li{ width:100%;} #isIdx .overseas{ display:none;} #isIdx .taiwan{ border:0; margin-bottom:0; padding-bottom:0;} #s_banner{ overflow:hidden;} #s_banner img { width: 150%; margin-left: -25%;} .quickBox li a.icon_01{ background-position:-10px -105px;} .quickBox li a.icon_02{ background-position:-115px -105px;} .quickBox li a.icon_03{ background-position:-217px -105px;} #g_nav li a.menu_01{ background-position:-10px 0px;} #g_nav li a.menu_02{ background-position:-115px 0px;} #g_nav li a.menu_03{ background-position:-220px 0px;} #g_nav li a.menu_04{ background-position:-325px 0px;} #g_nav li a.menu_05{ background-position:-430px 0px;} #g_nav li a.menu_06{ background-position:-535px 0px;} .little_secret{ padding:5%; width:90%;} .fl_tai .btn34 li{ margin:5px;} .tag_wrap button{ margin:5px;} .newsPic{ width:100%;} .newText{ width:100%; float:left; padding-left:0; margin-left:0;} .newWrap li{ padding-bottom: 10%; border-bottom: 1px solid #ddd;} .link_list .img{ width:40%;} .link_list .txt{ width:55%;} #idxb_bt_prev,#idxb_bt_next,#rpi_bt_prev,#rpi_bt_next{ display:none;} } @media screen and (max-width: 450px) { .btn3, .btn4, .btn5, .btn6 { width: 65px; line-height: 65px; border-width:1px;} .media_list li{ width:100%; margin:2% 0;} .online li{ width: 100%; display: block; margin-right: 0; margin-bottom: 0;} } @media screen and (max-width: 380px) { .btn3, .btn4, .btn5, .btn6 { width: 50px; line-height: 50px; } } /*拷貝RWD*/ @media screen and (max-width: 1200px) { .if_wrap_a{ width:100%;} } @media screen and (max-width: 990px) { #container .idea .boxWrap .box{ width:33%;} #container .idea .boxWrap .box:nth-child(3) .plus{ display:none; } #container .banner_slider ul.banner_s li img{ width:22%;} } @media screen and (max-width: 800px) { #ftpsw_captcha, #m_captcha, #edm_captcha, #edm_un_captcha{ width:45%;} .other_article li{ padding-left:150px;} } @media screen and (max-width: 740px) { .fr_heart{ width:100%; float:left;} .fr_heart img { width:100%; float:left;} .fl_heart { width:100%; margin-right:0;} } @media screen and (max-width: 730px) { .new_L {width:100%; margin:0; float:none;} .new_R { width:98%;} .margin-top{ margin-top:3%;} } @media screen and (max-width: 680px) { .zone .feature li { width:30%; margin-right:2.6%; margin-bottom:2%;} .pager { float:left; width:100%;} } @media screen and (max-width: 650px) { .s_form_1 label.s_1{ clear:both; margin-left:5px;} .ibox{ width:280px; margin:10% auto 0 auto; position:relative;} .ibox_forgotPsw{ } .close_ibox { top:0; right:0;} .side_l, .side_r{ width:84%; padding:3% 7%;} .side_l{ border-right:0; border-bottom:1px dashed #99cccc;} .side_r{ margin-top:0; float:none;} .side_c{ width:85%;} .side_a{ display:none;} .side_b{ width:84%; padding:3% 7%; border:0; margin: 11% auto;} #m_captcha,#ftpsw_captcha,#edm_captcha, #edm_un_captcha{ width:44%;} ._m_gheader_space_1{ height:80px;} ._m_gheader_space_2{ height:100px;} ._m_gheader_space_3{ height:70px;} .pd_img{ width:62.5%;} .pd_details{ width:35%;} .pd_title .pd_now_price{ font-size:50px;} .pdl_item h3{ width:90%;} .pdl_item span.s_1{ width:50%;} .pdl_item span.s_2{ font-size:17px;} .pdl_item span.s_3{ float:left; text-align:left; width:30%;} .s_msg .msg_author{ width: 30%;} .s_msg .msg_comment{ width: 65%;} #atm_bank{ width:98%;} .sep_2{ padding-left:28%;} .order_steps li { margin: 0; background-position: 85% 50%;} .order_steps li { margin-top:20px;} .banner_slider ul.banner_s li a { font-size:16px;} .global_right .onsale{ width:112%; margin-left:-6%;} #R_txt .fl_78_shop{ width:45%;} #R_txt .fr_20_shop{ width:50%;} } @media screen and (max-width: 640px) { .s_h2 { font-size: 13px; text-indent:10px;} } @media screen and (max-width: 620px) { .rwd_table thead,.rwd_table tfoot{ display:none;} .rwd_table .label{ display:inline-block;} .rwd_table td{ width:100%; box-sizing:border-box; float:left; clear:left; } .rwd_table tr td:first-child{ padding-top:10px;} .rwd_table tr td:last-child{ border-bottom:1px solid #bbb;} ._m_s_h2{ display:block;} ._m_hide_1{ display:none;} ._m_cart_tb_1{ display:block;} .s_tb_2{ background:#f1f1f1;} .s_tb_2 tr:nth-child(2n){ background: rgba(255, 255, 255, .5);} .s_tb_2 tbody td{ text-align:left;} .s_tb_2 i{ display:inline-block;} .s_tb_2 .s_4{width:70%;} .s_tb_2 .s_1{ padding-left:0;} .s_h2{ font-size:13px; text-indent:10px;} #R_txt .fl_78_shop{ width:100%;} #R_txt .fr_20_shop{ width:100%; margin-left:0%;} } @media screen and (max-width: 550px) { .s_form_001 li label{ width:100%; text-indent:2px;} .s_form_001 li input[type=text], .s_form_001 li input[type=password] {width:95%; padding:0 2%;} .s_form_001 li select{ width:50%; margin-bottom:7px;} .s_form_001 li textarea{ width:94%;} .chk_lay{ left:60%;} .sep_1{ padding-left:0;} .sep_1 div{ width:100%;} .order_steps li{ padding-right:15px; background-position:100% 50%; background-size:10px;} .order_steps li div{ width:auto; height:auto; border:none; border-radius:0;} .order_steps li span.s_1{ padding-top:0;} .newlist li .gray_line { width: 65%;} .fl_Q{ float:left; width:10%; margin-right:5%;} .fr_text{ float:left; width:85%; padding-left:0;} } @media screen and (max-width: 500px) { .page { width: 90%;} .addBox{ width:100%; float:left;} .join_1 span, .join_2 span{ background-size:23%; text-indent:32px;} } @media screen and (max-width: 450px) { .sbt_big { padding: 8px 14px;} #dishes_list.no_owl li{ width:32%;} #dishes_list.no_owl li:nth-child(4n+1){ clear:none;} #dishes_list.no_owl li:nth-child(3n+1){ clear:both;} } @media screen and (max-width: 400px) { #container .idea .boxWrap .box{ width:100%;} #container .idea .boxWrap .box .plus{ display:none; } #container .idea .boxWrap .box:nth-child(3) .plus{ display:none; } #container .idea { margin: 20px 0 20px 0;} #container .idea .boxWrap .box p{ margin:12px 0;} #foot .foot_right{ float:left;} #foot .foot_right li a { line-height:0;} .mediaV {width:100%; margin-right:0;} .new_R .leftTop, .new_R .rightTop, .new_R .leftDown, .new_R .rightDown { width: 100%; display: block;} .popular li{ display:block; width:100%;} .popular li h4{ margin-top:20px;} .popular li p{ margin-bottom:20px;} .rec_L{ width:100%; float:none; margin-bottom:1%;} .rec_R{ width:100%; float:none;} #container .global_right .itemList li { width:95%; margin-right:0;} .zone .feature li { width:100%; margin-right:0;} .zone .feature li img { width:80%;} .zone .ad_2, .ad_3 { width:100%;} .banner_slider ul.banner_s li a { font-size:12px;} .media_banner{ margin-bottom:5%; width:112%; margin-left:-6%;} } /* #g_header h1{ float:left;text-indent:-9999px;} #g_header a{ display:block;} #g_header .logo{ float:left; width:100%;} #g_header .logo img{ } #top{ display: block; overflow: hidden; margin:10px 0; } .quick_bar{ padding:3px 0; text-align:right;} .quick_bar li{ display:inline-block; padding:0 10px; border-right:1px solid #CCC;} .quick_bar li:last-child{ padding-right:0; border:0;} .quick_bar li a{ font-size:14px; } .quick_bar li a:hover{ color:#999;} .quick_bar .bar01{color:#DF7947;} .quick_bar .bar02{ color:#2D8D5D;} .number{ float:right; text-indent:50px; background:url(../img/icon_01.png) center left no-repeat; font-size:28px; color: #5F615F; font-weight: bold; margin-right:2px; font-family:Arial;} #g_nav{ float:left; width:100%; clear:both; margin-top:10px;} #g_nav ul{} #g_nav li{ display:inline-block; float:left; width:16.5%; padding:8px 0; text-align:center; border-right:1px solid #E9E8E6;} #g_nav li:first-child{ border-left:1px solid #E9E8E6;} #g_nav li a{ font-size:20px; color:#4F9A87; letter-spacing:1px;} #g_nav li a:hover{ color:#E9E8E6;} banner .banner{ position:relative; top:0; left:0; width:100%; padding:2% 0; border-top:1px solid #E9E8E6; background-color:#F3F2EE;} .banner .prev{ cursor:pointer; position: absolute; top:40%; left:5%; z-index:99; background: url(../img/pre.png); width:44px; height:44px; text-indent: -9999px; transition: .2s; padding: 0;} .banner .next{ cursor:pointer; position: absolute; top:40%; right:5%; z-index:99; background: url(../img/pre.png) 44px 0; width:44px; height:44px; text-indent: -9999px; transition: .2s; padding: 0;} .banner .w90{ width:80%; margin:0 auto;} .banner img{ width:100%; margin:0 auto; display:block;} */ /*float fixed*/ .btn.float-left{ display: block; background: url(../img/money.png) no-repeat 50% 50%; width: 129px; height: 158px; position: fixed; left: 0; top: 35%; z-index: 20; text-indent: -99999px; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .btn.float-left:hover{ opacity: 0.7; } .btn.float-right{ display: block; background: url(../img/line.png) no-repeat 50% 50%; width: 90px; height: 209px; position: fixed; right: 0; top: 25%; z-index: 20; text-indent: -99999px; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .btn.float-right-fb:hover, .btn.float-right-cart:hover, .btn.float-right-contact:hover, .btn.float-right:hover{ opacity: 0.7; } .btn.float-right-fb{ display: block; background: url(../img/fb_icon.png) no-repeat 50% 50%; width: 130px; height: 130px; position: fixed; right: 0; top: 58%; z-index: 20; text-indent: -99999px; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .btn.float-right-cart{ display: block; background: url(../img/cart_icon.png) no-repeat 50% 50%; width: 90px; height: 90px; position: fixed; right: 0; top: 200px; z-index: 20; text-indent: -99999px; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .btn.float-right-contact{ display: block; background: url(../img/contact_icon.png) no-repeat 50% 50%; width: 90px; height: 90px; position: fixed; right: 0; top: 300px; z-index: 20; text-indent: -99999px; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .border-round{padding:10px; border:1px solid #eee; } #breadcrumb{background-color:#fafafa}ul.breadcrumb{padding:10px 16px;list-style:none;text-align:right}ul.breadcrumb li{display:inline;font-size:14px}ul.breadcrumb li+li:before{padding:8px;color:#000;content:"/\00a0"}ul.breadcrumb li a{color:#259d8b;text-decoration:none}ul.breadcrumb li a:hover{color:#01447e;text-decoration:underline}