﻿html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }

html { line-height: 1; font-family: "Microsoft JhengHei"; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }

q, blockquote { quotes: none; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; }

a img { border: none; }

a:hover, a:focus { color: #23527c; text-decoration: none;}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

img { display: block; border: none; }

#header .header-content h1:after, .main-content .mainCont:after, .th-billList .pt-list li:after, .th-billList .pt-list li .num:after, .th-winelist .md-wineTab ul:after, .th-winelist .md-wineCont ul:after, .th-wineinfo .md-inery ul:after, .th-wineinfo .md-taste ul:after, .th-wineinfo .md-more ul:after, .th-wineinfo .md-button:after, .th-contact .md-button:after, .th-bill .md-bill .pt-userinfo .address:after, .th-bill .md-button:after, .th-myorder .md-button:after, .th-mywallet .md-mywallet .listCont .tab:after { content: ""; display: block; clear: both; }

html { font-family: "Microsoft JhengHei"; }

input { font-family: "Microsoft JhengHei"; }

button { position: relative; overflow: visible; font-family: "Microsoft JhengHei"; }

input[type=submit] { border-radius: 0; -webkit-appearance: none; }

input[type=button] { border-radius: 0; -webkit-appearance: none; }

html, body { width: 100%; height: 100%; word-break: break-all; }

body { -webkit-overflow-scrolling: touch; }
body.pc-mobileMenu #menuBtn { z-index: 60; opacity: 1; left: 15px; top: 10px; }
body.pc-mobileMenu #header nav { left: -350px; padding: 30px 0 30px; -moz-transition: left, 0.4s; -o-transition: left, 0.4s; -webkit-transition: left, 0.4s; transition: left, 0.4s; }

html.mobileMenu body.pc-mobileMenu #header nav { left: 0; position: fixed; -moz-transition: left, 0.4s; -o-transition: left, 0.4s; -webkit-transition: left, 0.4s; transition: left, 0.4s; }
html.mobileMenu body.pc-mobileMenu #menuBtn > div { background-color: transparent; -moz-transition: all, 0s; -o-transition: all, 0s; -webkit-transition: all, 0s; transition: all, 0s; }
html.mobileMenu body.pc-mobileMenu #menuBtn span { top: 12px; }
html.mobileMenu body.pc-mobileMenu #menuBtn span:before { top: 1px; -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); transform-origin: center; -moz-transition: rotate, 0.4s; -o-transition: rotate, 0.4s; -webkit-transition: rotate, 0.4s; transition: rotate, 0.4s; }
html.mobileMenu body.pc-mobileMenu #menuBtn span:after { top: 0px; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); transform-origin: center; -moz-transition: rotate, 0.4s; -o-transition: rotate, 0.4s; -webkit-transition: rotate, 0.4s; transition: rotate, 0.4s; }

#menuBtn { display: block; width: 40px; height: 40px; position: fixed; top: 60px; left: 15px; z-index: -1; opacity: 0; cursor: pointer; padding: 5px; box-sizing: border-box;/* background-color: #000; border: 1px solid #fff;*/ }
#menuBtn.btn-hide { display: none; }
#menuBtn div { position: relative; top: 14px; height: 2px; width: 33px; margin: 0 auto; background-color: #22a592; -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); -moz-transition: rotate, 0.1s; -o-transition: rotate, 0.1s; -webkit-transition: rotate, 0.1s; transition: rotate, 0.1s; }
#menuBtn span { display: block; position: relative; top: 7px; }
#menuBtn span:before, #menuBtn span:after { content: ""; display: block; width: 33px; height: 2px; margin: 0 auto; position: relative; background-color: #22a592; -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); -moz-transition: rotate, 0.4s; -o-transition: rotate, 0.4s; -webkit-transition: rotate, 0.4s; transition: rotate, 0.4s; }
#menuBtn span:before { top: -4px; }
#menuBtn span:after { top: 12px; }

#header { height: 65px;  position: relative; }
#header .header-content { position: fixed; z-index: 55; width: 100%; height: 65px; background-color:#E1E2DE;  }
#header .header-content h1 {width: 100%; height: 68px; padding: 7px 10px; box-sizing: border-box; }
#header .header-content h1 img { float: left; }
#header .header-content h1 span { float: right; color: #FFF; font-size: 22px; margin: 10px; letter-spacing: 0px; }  
#header nav { width: 190px; padding: 30px 0; box-sizing: border-box; position: absolute; top: 55px; left: 0; z-index: 50;  height:100vh;}
#header nav:before { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; opacity: 1; background-color: rgba(29, 107, 103, 0.94); }
#header .menu { position: relative; z-index: 5; }
#header .menu > li { font-size: 17px; line-height: 34px; position: relative; }
#header .menu > li > a { display: block; width: 100%; height: 100%; text-decoration: none; color: #fff; padding: 0 30px; box-sizing: border-box;  }
#header .menu > li:hover { font-size: 16px; background-color: #15857f; }/*#header .menu > li.on*/
#header .menu > li:hover .subMenu { display: block; }
#header .menu .subMenu { display: none; min-width: 166px; position: absolute; top: 0; left: 100%; background-color: #404041; padding: 10px 0; }
#header .menu .subMenu li { font-size: 15px; }
#header .menu .subMenu li a { display: block; width: 100%; height: 100%; padding: 0 10px 0 15px; box-sizing: border-box; text-decoration: none; color: #fff; text-align: left;  }
#header .menu .subMenu li:hover { font-size: 16px; background-color: #6D6E70; }
#header .md-language { width: 30px; height: 30px; border-radius: 50%; float: right; margin-right: 60px; margin-top: 13px; position: relative; overflow: hidden; }
#header .md-searchbar { float: right; margin-right: 25px; }
#header .md-searchbar .entertext { display: inline-block; vertical-align: top; width: 160px; height: 22px; box-sizing: border-box; margin-top: 15px; }
#header .md-searchbar .btn-search { display: inline-block; vertical-align: top; cursor: pointer; width: 22px; height: 22px; background-image: url(../images/search.svg); background-size: 14px 14px; background-repeat: no-repeat; background-position: center; border-radius: 0; margin-top: 15px; background-color: #fff; border: none; }


#wrap { width: 100%; height: 100%; }

body { background-color: fdfdfd; }
#header {border-bottom: 1px solid rgb(197, 197, 197);} 

.main-content { width: 100%; }
.main-content .mainCont { width: 100%; padding: 0; box-sizing: border-box;    background: url(../images/portfolio1.jpg) center center fixed;
    background-size: cover; 
    box-sizing: border-box; }
.main-content.main-winelist .main-aside { width: calc(60% - 20px); height: calc(100vh - 116px); margin-left: 20px; float: right; background-color: #fff; }
.main-content.main-winelist .sub-aside { width: 40%; height: calc(100vh - 116px); float: left; background-color: #fff; }
.main-content.main-winelist .mainCont { padding: 24px 20px; }
.main-content.main-winecont .mainCont { position: relative; }
.main-content.main-winecont .mainCont:before { content: ""; display: block; width: 100%; height: 68px; position: absolute; left: 0; bottom: -68px; background-color: #434343; }
.main-content.main-winecont .main-aside { width: 47%; float: left; }
.main-content.main-winecont .main-aside .th-wineimg { width: 100%; height: calc(100vh - 136px); position: relative; }
.main-content.main-winecont .main-aside .th-wineimg figure { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center; }
.main-content.main-winecont .sub-aside { width: 53%; height: calc(100vh - 136px); float: left;    background: #f3f3f3; }
.main-content .mainCont_{ width: 100%;}
.main-content .mainCont a {color: #00a29a; text-decoration: none;}

#footer .footer-content { height: 68px; background-color: #00A199; text-align: center; line-height: 22px;}
#footer .footer-content > div { display: inline-block; font-size: 12px; color: #fff; }
#footer .footer-content > div a { color: #fff; text-decoration: none; }
#footer .footer-content .email { float: left; }
#footer .footer-content .tel { float: right; }

@media (max-width: 935px) { html { overflow-x: hidden; }
  html.billShow .main-content.main-winelist .sub-aside { right: 0; -moz-transition: left, 0.4s; -o-transition: left, 0.4s; -webkit-transition: left, 0.4s; transition: left, 0.4s; }
  .main-content.main-winelist .mainCont { padding: 0; }
  .main-content.main-winelist .main-aside { width: 100%; height: auto; margin-left: 0; }
  .main-content.main-winelist .sub-aside { width: 100%; height: calc(100vh - 46px); position: fixed; top: 46px; right: -100%; -moz-transition: left, 0.4s; -o-transition: left, 0.4s; -webkit-transition: left, 0.4s; transition: left, 0.4s; }
  .main-content.main-winecont .mainCont:before { display: none; }
  .main-content.main-winecont .main-aside { width: 100%; } 
  .main-content.main-winecont .sub-aside { width: 100%; height: auto; } 
}
@media (max-width: 760px) { #header .header-content h1 { padding-left: 4%; } }
@media (max-width: 640px) { .main-content.main-winelist .mainCont { padding: 0; } }
.th-index { width: 100%; min-height: calc(100vh - 68px); }
.th-index .md-logo { width: 20%; margin: 0 auto 50px; }
.th-index .md-logo img { width: 100%; }
.th-index .md-nav { text-align: center; }
.th-index .md-nav > a { display: inline-block; width: calc(20% - 24px); position: relative;  margin: 0 10px 8px; background-size: cover; }
.th-index .md-nav > a:before { content: ""; position: absolute; display: block; top: 50%; left: 50%; background-size: cover; width: 60%; padding-bottom: 14%; margin-left: -30%; margin-top: -7%; }
.th-index .md-nav > a.nav {border-radius: 5px; padding: 0 ;display: inline-block;    float: left;}
.th-index .md-nav > a.nav:before {  }
.th-index .md-nav > a.nav img{ width:70%; padding: 15px; margin:0 auto;background: #E1E2DE;    border-radius: 50%;}
.th-index .md-nav > a.nav p{ color:#FFF; font-size:18px; padding-top:7px;font-weight: 500; margin-bottom: 0px;}
.th-index .md-nav > a.nav1 {background: rgba(0, 0, 0, 0.78);border: 1px solid #ceaa14;border-radius: 5px;}
.th-index .md-nav > a.nav1:before { background-image: url(../images/nav1.png); }
.th-index .md-nav > a.nav2 {background: rgba(0, 0, 0, 0.78);border: 1px solid #ceaa14;border-radius: 5px;}
.th-index .md-nav > a.nav2:before { background-image: url(../images/nav2.png); }
.th-index .md-nav > a.nav3 {background: rgba(0, 0, 0, 0.78);border: 1px solid #ceaa14;border-radius: 5px;}
.th-index .md-nav > a.nav3:before { background-image: url(../images/nav3.png); }
.th-index .md-nav > a.nav4 { background: rgba(0, 0, 0, 0.78);border: 1px solid #ceaa14;border-radius: 5px;}
.th-index .md-nav > a.nav4:before { background-image: url(../images/nav4.png); }


.th-billList .btn-cart { display: none; min-width: 60px;  height: 40px; position: fixed; z-index: 10; right: 12px; bottom: 10px; background-color: #d4170e; font-size: 19px; color: #fff; text-align: center; line-height: 40px; cursor: pointer; padding: 0 10px; box-sizing: border-box; }
.th-billList .pt-head { width: 100%; height: 80px; background-image: url(../images/hdbg.png); background-repeat: no-repeat; position: relative; }
.th-billList .pt-head h3 { font-size: 28px; color: #fff; padding: 22px 4%; box-sizing: border-box; position: relative; z-index: 5; }
.th-billList .pt-head h3 i { display: inline-block; vertical-align: middle; font-size: 38px; margin-right: -8px; }
.th-billList .pt-head h3 span { display: inline-block; vertical-align: middle; }
.th-billList .pt-head .hdbg { display: block; position: absolute; z-index: 0; top: 0; left: 0; height: 0; width: 145px; border-bottom: 80px solid #3ccdbf; border-left: 0px solid transparent; border-right: 100px solid transparent; }
.th-billList .pt-list { width: 100%; height: calc(100vh - 356px); overflow-y: auto; }
.th-billList .pt-list li { width: 100%; padding: 10px 45px 10px 15px; box-sizing: border-box; color: #414141; position: relative; }
.th-billList .pt-list li + li { border-top: 1px solid #ededed; }
.th-billList .pt-list li > span { display: inline-block; vertical-align: middle;  }
.th-billList .pt-list li .img { width: 10%; }
.th-billList .pt-list li .img figure { width: 100%; padding-bottom: 100%;   background-size: 200%; background-position: center; }
.th-billList .pt-list li .text { width: calc(35% - 12px); margin: 0 3%; }
.th-billList .pt-list li .num { display: inline-block; vertical-align: middle; width: 65px; text-align: center; }
.th-billList .pt-list li .num > span { display: inline-block; vertical-align: middle; }
.th-billList .pt-list li .num .cut { float: left; cursor: pointer; }
.th-billList .pt-list li .num .add { float: right; cursor: pointer; }
.th-billList .pt-list li .price { width: 110px; color: #de2500; text-align: right; box-sizing: border-box; }
.th-billList .pt-list li .price:before { content: attr(data-before); }
.th-billList .pt-list li .delete { width: 20px; height: 20px; position: absolute; right: 20px; top: 50%; margin-top: -10px; margin-left: 12px; cursor: pointer; }
.th-billList .pt-list li .delete:before, .th-billList .pt-list li .delete:after { content: ""; display: block; width: 20px; height: 2px; background-color: gray; position: absolute; top: 8px; }
.th-billList .pt-list li .delete:before { -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.th-billList .pt-list li .delete:after { -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
.th-billList .pt-total { display: block; width: 100%; height: 80px; font-size: 28px; color: #444; line-height: 80px; padding: 0px 4%; border-top: 1px dashed #ededed; box-sizing: border-box; }
.th-billList .pt-total .text { float: left; }
.th-billList .pt-total .number { float: right; color: #ff0000; }
.th-billList .pt-total .number:before { content: attr(data-before); }
.th-billList .pt-button { width: 100%; height: 80px; }
.th-billList .pt-button button, .th-billList .pt-button input { width: 100%; height: 80px; background-color: #00a0e9; border: none; font-size: 28px; color: #fff; cursor: pointer; border-radius: 0; }
.th-billList .pt-button button:hover, .th-billList .pt-button input:hover { background-color: #53bff0; }

.th-winelist { width: 100%; }
.th-winelist .md-wineTab { width: calc(100% - 20px); height: 80px; margin: 0 auto 20px; overflow-x: auto; overflow-y: hidden;    border-bottom: 1px solid #d9d9d9; }
.th-winelist .md-wineTab ul { height: 80px; }
.th-winelist .md-wineTab ul li { float: left; padding: 30px 5px; }
.th-winelist .md-wineTab ul li a { color: #fff; text-decoration: none; border-radius: 5px; padding: 9px 10px; box-sizing: border-box; }
.th-winelist .md-wineTab ul li:hover a, .th-winelist .md-wineTab ul li.on a { background-size: 100%; background-image: -moz-linear-gradient(90deg, #809be0, #915af0); background-image: -webkit-linear-gradient(90deg, #809be0, #915af0); background-image: linear-gradient(0deg, #809be0, #915af0); }
.th-winelist .md-wineCont ul { width: 100%; height: calc(100vh - 236px); text-align: left; padding-left: calc((100% - (100% - 20px)) / 2); box-sizing: border-box; overflow-y: auto; }
.th-winelist .md-wineCont ul li { display: inline-block; vertical-align: top; width: calc((100% / 4) - 20px); margin: 0 0 5px; border: 1px solid #e6e6e6; }
.th-winelist .md-wineCont ul li a { text-decoration: none; display: block; width: 100%; height: 100%; padding: 0px; box-sizing: border-box; }
.th-winelist .md-wineCont ul li a:hover { background-color: #f8f8f8; }
.th-winelist .md-wineCont ul li figure { width: 100%; padding-top: 100%; background-repeat: no-repeat; background-size: cover; background-position: center; }
.th-winelist .md-wineCont ul li figcaption { width: 100%; display: inline-block; vertical-align: middle; padding: 5px; }
.th-winelist .md-wineCont ul li .text { color: #414141; font-size: 13px; display: inline-block; width: 100%;     height: 3.5rem; }
.th-winelist .md-wineCont ul li .price { color: #b92609; font-size: 16px; float: right; }
.th-winelist .md-wineCont ul li .price:before { content: attr(data-before); }
.th-winelist .md-wineCont ul li .price_left {text-decoration: line-through;color: #999;font-size: 13px;font-weight: 400;margin-top: 3px;  display: inline-block;}

.th-wineinfo { width: 100%; height: 100%; }
.th-wineinfo .gpmd-info { width: 100%; height: calc(100vh - 200px); padding: 30px 50px; box-sizing: border-box; overflow-y: auto; }
.th-wineinfo .md-head { text-align: right; padding-bottom: 15px;  background: #FFF; padding: 10px;  margin-top: 1px; }
.th-wineinfo .md-head h3 { font-size: 15px; line-height: 20px; color: #414141; text-align: left; margin-bottom: 10px; }
.th-wineinfo .md-head .price {vertical-align: middle; color: #de2500; font-size: 24px; margin-right: 40px; display: block; width: 100%; text-align: left;}
.th-wineinfo .md-head .price:before { content: attr(data-before); }
.th-wineinfo .md-head .price_left { text-align: left; width: 100%; display: block; text-decoration: line-through; color: #999;}
.th-wineinfo .md-head .pt-add { display: inline-block; vertical-align: middle; }
.th-wineinfo .md-head .pt-add > span { display: inline-block; vertical-align: middle; text-align: center; border-radius: 50%; }
.th-wineinfo .md-head .pt-add .btn { width: 36px; height: 36px; color: #22a592; border: 1px solid #22a592; font-size: 24px; padding: 4px; box-sizing: border-box; cursor: pointer; }
.th-wineinfo .md-head .pt-add .number { width: 50px; height: 50px; color: #fff; background-color: #22a592; font-size: 24px; padding-top: 13px; box-sizing: border-box; margin: 0 15px; }
.th-wineinfo .pt-last { padding:3px 10px 9px; margin: 0; text-align: right; font-size: .9em; color: red; background: #FFF;}
.th-wineinfo .pt-last:before { content: attr(data-text); font-size: 14px; color: #de2500; }
.th-wineinfo .pt_lastinfobox { background: #FFF; padding: 10px; margin: 10px 0 8px;}
.th-wineinfo .md-text {  box-sizing: border-box; font-size: 20px; line-height: 25px; color: #545454; }
.th-wineinfo .md-inery { border-top: 1px solid #d45752; font-size: 20px; }
.th-wineinfo .md-inery h4 {display: inline-block;background-color: #d45752; color: #fff;padding: 4px 15px 5px;border-radius: 0 0 10px 10px;margin-bottom: 15px; font-size: .89em;}
.th-wineinfo .md-inery ul { padding-bottom: 10px; }
.th-wineinfo .md-inery ul li { float: left; padding: 3px; box-sizing: border-box;color: #525252;    border: 1px solid #b6b6b6; margin: 0 8px 8px 0;  background-size: 100%;   }
.th-wineinfo .md-inery ul li:hover {color: #ff5722;border-color: #ff5722;}
.th-wineinfo .md-inery ul li.on {   background-size: 100%;     color: #ff5722;    border-color: #ff5722;  }
.th-wineinfo .md-inery ul li a {   box-sizing: border-box;color: #525252;font-size: .8em;    }
.th-wineinfo .md-inery ul li a :hover {color: #ff5722;border-color: #ff5722;}
.th-wineinfo .md-inery ul li a .on {   background-size: 100%;     color: #ff5722;    border-color: #ff5722;  }
.th-wineinfo .md-taste { border-top: 1px solid #d45752; font-size: 20px; }
.th-wineinfo .md-taste h4 { display: inline-block; background-color: #d45752; color: #fff; padding: 10px 80px 12px; padding: 10px 70px 12px; border-radius: 0 0 20px 20px; margin-bottom: 20px; }
.th-wineinfo .md-taste ul { padding-bottom: 10px; }
.th-wineinfo .md-taste ul li { float: left; padding: 14px 26px; box-sizing: border-box; border-radius: 24px; color: #fff; margin: 0 20px 20px 0;   background-size: 100%; background-image: -moz-linear-gradient(90deg, #d2d2d2, #c9c9c9); background-image: -webkit-linear-gradient(90deg, #d2d2d2, #c9c9c9); background-image: linear-gradient(0deg, #d2d2d2, #c9c9c9); }
.th-wineinfo .md-taste ul li.on {  background-size: 100%; background-image: -moz-linear-gradient(90deg, #809cdf, #915af0); background-image: -webkit-linear-gradient(90deg, #809cdf, #915af0); background-image: linear-gradient(0deg, #809cdf, #915af0); }
.th-wineinfo .md-more {background: #FFF;border-top: 1px solid #d45752; font-size: 1em; margin: 10px 0; padding: 0 10px;}
.th-wineinfo .md-more h4 {  display: inline-block; background-color: #d45752; color: #fff; padding: 6px 15px 5px; border-radius: 0 0 10px 10px; margin-bottom: 15px; font-size: .89em; }
.th-wineinfo .md-more ul { margin-bottom: 50px; }
.th-wineinfo .md-more ul li { float: left; padding: 10px; box-sizing: border-box; color: #525252; margin: 10px auto 20px;  cursor: pointer; width: 100%; }
.th-wineinfo .md-more ul li:hover {   background-size: 100%; background-image: -moz-linear-gradient(90deg, #809cdf, #915af0); background-image: -webkit-linear-gradient(90deg, #809cdf, #915af0); background-image: linear-gradient(0deg, #809cdf, #915af0); }
.th-wineinfo .md-button button, .th-wineinfo .md-button input { border: none; background-color: transparent; color: #fff; width: calc(50% - 1px); float: left; font-size: 24px; text-align: center; padding: 20px 30px; box-sizing: border-box; cursor: pointer; border-radius: 0; }
.th-wineinfo .md-button .btn-calce { background-color: #939393; }
.th-wineinfo .md-button .btn-calce:hover { background-color: #aaaaaa; }

.th-wineinfo .md-button .btn-confirm { background-color: #00b7ee; float: right; }
.th-wineinfo .md-button .btn-confirm:hover { background-color: #53bff0; }
.th-wineinfo .md-button .btn-confirmaddcar { background-color: #ff0000; float: right; }
.th-wineinfo .md-button .btn-confirmaddcar:hover { background-color: #ff0000; }

.th-contact { width: 100%; min-height: calc(100vh - 68px); padding: 80px; box-sizing: border-box; background-image: url(../images/portfolio1.jpg); background-repeat: no-repeat; background-size: cover; background-position: center top; position: relative; }
.th-contact .md-contactinfo { width: 62%;  }
.th-contact .md-contactinfo > p { border-bottom: 1px solid #fff100; padding-bottom: 5px; margin-bottom: 15px; font-size: 17px; }
.th-contact .md-contactinfo label span { display: block; margin-bottom: 5px;font-size: 17px; }
.th-contact .md-contactinfo input { color: #000; display: inline-block;    width: 60%;  margin-bottom: 5px; border-radius: 0;    font-size: 17px;    padding: 0 10px; }
.th-contact .md-button { position: absolute; bottom: 80px; right: 80px; }
.th-contact .md-button button, .th-contact .md-button input { padding: 12px 60px; border: none; border-radius: 30px; color: #fff; font-size: 26px; cursor: pointer; border-radius: 0; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjEuMCIgeDI9IjAuNSIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgwOWNkZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzkxNWFmMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background: rgba(255,175,75,1);
background: -moz-linear-gradient(top, rgba(255,175,75,1) 0%, rgba(255,91,32,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,175,75,1)), color-stop(100%, rgba(255,91,32,1)));
background: -webkit-linear-gradient(top, rgba(255,175,75,1) 0%, rgba(255,91,32,1) 100%);
background: -o-linear-gradient(top, rgba(255,175,75,1) 0%, rgba(255,91,32,1) 100%);
background: -ms-linear-gradient(top, rgba(255,175,75,1) 0%, rgba(255,91,32,1) 100%);
background: linear-gradient(to bottom, rgba(255,175,75,1) 0%, rgba(255,91,32,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffaf4b', endColorstr='#ff5b20', GradientType=0 );
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px; }
.th-contact .md-button button:hover, .th-contact .md-button button:active, .th-contact .md-button input:hover, .th-contact .md-button input:active { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjEuMCIgeDI9IjAuNSIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2QyZDJkMiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2M5YzljOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -moz-linear-gradient(90deg, #d2d2d2, #c9c9c9); background-image: -webkit-linear-gradient(90deg, #d2d2d2, #c9c9c9); background-image: linear-gradient(0deg, #d2d2d2, #c9c9c9); }

.th-qrcode { width:auto; min-height: 100vh; position: relative;padding: 10px;  }
.th-qrcode .md-qrcode {  padding: 10% 20px; box-sizing: border-box; margin: 0 auto; text-align: center; }
.th-qrcode .md-qrcode > p { display: inline-block; color: #fff; font-size: 13px; line-height: 22px; padding-bottom: 24px; border-bottom: 1px solid #fff100; }
.th-qrcode .md-qrcode .qrcodeCont { width: 100%; padding: 40px 0px; }
.th-qrcode .md-qrcode .qrcodeCont .qrcode {   margin: 0 auto; }
.th-qrcode .md-qrcode .qrcodeCont .qrcode img {    width: 80%;  margin: 0 auto; }
.th-qrcode .md-qrcode .pt-button { text-align: center; }
.th-qrcode .md-qrcode .pt-button a, .th-qrcode .md-qrcode .pt-button button, .th-qrcode .md-qrcode .pt-button input { display: inline-block; padding: 12px 60px; border: none; border-radius: 30px; color: #fff; font-size: 26px; text-decoration: none; cursor: pointer; border-radius: 0; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjEuMCIgeDI9IjAuNSIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgwOWNkZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzkxNWFmMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -moz-linear-gradient(90deg, #809cdf, #915af0); background-image: -webkit-linear-gradient(90deg, #809cdf, #915af0); background-image: linear-gradient(0deg, #809cdf, #915af0); }
.th-qrcode .md-qrcode .pt-button a:hover, .th-qrcode .md-qrcode .pt-button a:active, .th-qrcode .md-qrcode .pt-button button:hover, .th-qrcode .md-qrcode .pt-button button:active, .th-qrcode .md-qrcode .pt-button input:hover, .th-qrcode .md-qrcode .pt-button input:active { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjEuMCIgeDI9IjAuNSIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2QyZDJkMiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2M5YzljOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -moz-linear-gradient(90deg, #d2d2d2, #c9c9c9); background-image: -webkit-linear-gradient(90deg, #d2d2d2, #c9c9c9); background-image: linear-gradient(0deg, #d2d2d2, #c9c9c9); }
.th-qrcode .md-newscontimgbox img{width:100%;}
.th-qrcode .qrcode .newscont{}
.th-qrcode .qrcode.newscont img{width:100%;}
.th-qrcode .qrcode.newscont .newscont_date{color: #a2a2a2;font-size: 12px;}
.th-qrcode .qrcode.newscont .newscont_title{color: #00a29a;}


.th-bill { width: 100%; height: 100%;
/* background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjEuMCIgeDI9IjAuNSIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzI3MjkyYSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzNmNDE0MyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -moz-linear-gradient(90deg, #27292a, #3f4143); background-image: -webkit-linear-gradient(90deg, #27292a, #3f4143); background-image: linear-gradient(0deg, #27292a, #3f4143); */}
.th-bill .md-bill { width: 100%; height: calc(100vh - 168px); overflow-y: auto; }
.th-bill .md-bill .pt-head { width: 92%; margin: 0 auto;padding:10px 15px; border-bottom: 1px solid #d45752; font-size: 26px; color: #333; }
.th-bill .md-bill .pt-head i { display: inline-block; vertical-align: middle; color: #d21818; font-size: 42px; }
.th-bill .md-bill .pt-head > span { display: inline-block; vertical-align: middle; }
.th-bill .md-bill .pt-userinfo { font-size: 24px; }
.th-bill .md-bill .pt-userinfo table { width: 94%; margin: 0 auto; }
.th-bill .md-bill .pt-userinfo table tr { width: 100%; }
.th-bill .md-bill .pt-userinfo table tr th { width: 25%; text-align: center; font-size: 24px; color:#FFF; padding:10px; box-sizing: border-box; position: relative;border-bottom: 1px solid #d45752;background-color: #939393; }
.th-bill .md-bill .pt-userinfo table tr th + th:before { content: ""; height: 70%; width: 1px; background-color: #fff; position: absolute; left: 0; top: 15%; }
.th-bill .md-bill .pt-userinfo table tr td { width: 25%; text-align: center; color: #414141; background-color: #eeeeee; padding: 10px; box-sizing: border-box; }
.th-bill .md-bill .pt-userinfo .address { color: #333;width: 94%;margin: 0 auto; }
.th-bill .md-bill .pt-userinfo .address span { padding: 10px; box-sizing: border-box; }
.th-bill .md-bill .pt-userinfo .address .title { width: 15%; float: left; text-align: left;    padding-left: 5px;}
.th-bill .md-bill .pt-userinfo .address .text { width: 75%; float: left; padding: 10px 10px 10px 5%; position: relative; }
.th-bill .md-bill .pt-userinfo .address .text:before { content: ""; height: 70%; width: 1px; background-color: #fff; position: absolute; left: 0; top: 15%; }
.th-bill .md-bill .pt-itemlist {width: 94%; margin: 0 auto;}
.th-bill .md-bill .pt-itemlist table { width: 100%; }
.th-bill .md-bill .pt-itemlist table tr { color: #000; width: 100%; font-size: 24px; }
.th-bill .md-bill .pt-itemlist table tr.table-hd { background-image: url(../images/billbg.jpg); background-position: center 45%; }
.th-bill .md-bill .pt-itemlist table tr th { padding: 10px; box-sizing: border-box; text-align: center; }
.th-bill .md-bill .pt-itemlist table tr th.tb-btn { width: 60px; }
.th-bill .md-bill .pt-itemlist table tr th.tb-large { width: calc(50% - 60px); }
.th-bill .md-bill .pt-itemlist table tr th.tb-middle { width: 20%; }
.th-bill .md-bill .pt-itemlist table tr th.tb-small { width: 10%; }
.th-bill .md-bill .pt-itemlist table tr td { color: #333; text-align: center; padding: 10px; box-sizing: border-box; vertical-align: top;border-bottom: 1px dotted #a2a2a2; }
.th-bill .md-bill .pt-itemlist table tr td > span:before { content: attr(data-title); }
.th-bill .md-bill .pt-itemlist table tr td i, .th-bill .md-bill .pt-itemlist table tr td input { display: inline-block; width: 30px; height: 30px; border: none; background-color: transparent; font-size: 24px; color: #f00; cursor: pointer; }
.th-bill .md-button button, .th-bill .md-button input { border: none; background-color: transparent; color: #fff; width: calc(33.333333%); float: left; font-size: 24px; text-align: center; padding: 33px 30px 34px; box-sizing: border-box; cursor: pointer; border-radius: 0; }/*width: calc(50% - 1px); */
.th-bill .md-button .btn-calce { background-color: #939393; display:inline-block; }
.th-bill .md-button .btn-calce:hover { background-color: #aaaaaa; }
.th-bill .md-button .btn-confirm { background-color: #00b7ee; display:inline-block; }
.th-bill .md-button .btn-confirm:hover { background-color: #53bff0; }
.th-bill .md-button .btn-stage { background-color: #7bbf8b;  display:inline-block; }
.th-bill .md-button .btn-stage:hover { background-color: #53bff0; }

.th-myorder { width: 100%; height: 100%; }
.th-myorder .md-myorder { width: 100%; height: calc(100vh - 0px); overflow-y: auto; }
.th-myorder .md-myorder .pt-head {width: 92%;margin: 0 auto;padding: 10px 0px;border-bottom: 1px solid #d45752; font-weight:bold; color: #333; }
.th-myorder .md-myorder .pt-head i { display: inline-block; vertical-align: middle; color: #d21818; font-size: 42px; }
.th-myorder .md-myorder .pt-head > span { display: inline-block; vertical-align: middle; }
.th-myorder .md-myorder .pt-itemlist table { width: 100%; }
.th-myorder .md-myorder .pt-itemlist table tr { color: #fff; width: 100%; font-size: 1.1em;border-bottom: 1px solid #d7d7d7; }
.th-myorder .md-myorder .pt-itemlist table tr.table-hd { background-image: url(../images/billbg.jpg); background-position: center 45%; }
.th-myorder .md-myorder .pt-itemlist table tr th { padding: 20px 10px; box-sizing: border-box; text-align: center; }
.th-myorder .md-myorder .pt-itemlist table tr th.tb-btn { width: 60px; }
.th-myorder .md-myorder .pt-itemlist table tr th.tb-large { width: calc(50% - 60px); }
.th-myorder .md-myorder .pt-itemlist table tr th.tb-middle { width: 10%; }
.th-myorder .md-myorder .pt-itemlist table tr th.tb-small { width: 10%; }
.th-myorder .md-myorder .pt-itemlist table tr td {color:#000;text-align: center; padding:10px; box-sizing: border-box; vertical-align: top;line-height: 20px;}
.th-myorder .md-myorder .pt-itemlist table tr td > span:before { content: attr(data-title); }
.th-myorder .md-myorder .pt-itemlist table tr td i { display: inline-block; width: 30px; height: 30px; border: none; background-color: transparent; font-size: 24px; color: #fff; cursor: pointer; }
.th-myorder .md-myorder .pt-itemlist table tr td input{font-size: .8em;}
.th-myorder .md-button button, .th-myorder .md-button input { border: none; background-color: transparent; color: #fff; width: calc(100% - 1px); float: left; font-size: 24px; text-align: center; padding: 33px 30px 34px; box-sizing: border-box; cursor: pointer; border-radius: 0; }
.th-myorder .md-button .btn-calce { background-color: #939393; }
.th-myorder .md-button .btn-calce:hover { background-color: #aaaaaa; }
.th-myorder .md-button .btn-confirm { background-color: #00b7ee; float: right; }
.th-myorder .md-button .btn-confirm:hover { background-color: #53bff0; }

.th-mywallet { width: 100%; height: 100%; background:#FFF; }
.th-mywallet .md-mywallet { width: 100%; height: calc(100vh - 68px); overflow-y: auto; }
.th-mywallet .md-mywallet .pt-head { width: 92%; margin: 0 auto 20px;  border-bottom: 1px solid #d45752; font-size: 16px; padding: 10px 0px;font-weight: bold;}
.th-mywallet .md-mywallet .pt-head i { display: inline-block; vertical-align: middle; color: #d21818; font-size: 42px; }
.th-mywallet .md-mywallet .pt-head > span { display: inline-block; vertical-align: middle; }
.th-mywallet .md-mywallet .pt-money { width: 92%; margin: 0 auto 20px; background-color: #FF9800; padding:10px 20px; box-sizing: border-box; text-align: right;color:#FFF; }
.th-mywallet .md-mywallet .pt-money:before { content: attr(data-title); }
.th-mywallet .md-mywallet .listCont { width: 92%; margin: 0 auto 20px; }
.th-mywallet .md-mywallet .listCont > li {  border-bottom: 1px solid #737373;}
.th-mywallet .md-mywallet .listCont > li.show .tab .icon:before { -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); -moz-transition: all, 0.4s; -o-transition: all, 0.4s; -webkit-transition: all, 0.4s; transition: all, 0.4s; }
.th-mywallet .md-mywallet .listCont .tab { width: 100%;   padding: 5px 0px; box-sizing: border-box; position: relative; cursor: pointer; }
.th-mywallet .md-mywallet .listCont .tab > span { float: left; width: 85%; }
.th-mywallet .md-mywallet .listCont .tab > span:before { content: attr(data-text); }
.th-mywallet .md-mywallet .listCont .tab .icon { width: 40px; }
.th-mywallet .md-mywallet .listCont .tab .icon:before, .th-mywallet .md-mywallet .listCont .tab .icon:after { content: ""; display: block; width: 20px; height: 2px; background-color: #d45752; position: absolute; top: 20px; right: 20px; }
.th-mywallet .md-mywallet .listCont .tab .icon:before { -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg); -moz-transition: all, 0.4s; -o-transition: all, 0.4s; -webkit-transition: all, 0.4s; transition: all, 0.4s; }
.th-mywallet .md-mywallet .listCont .tabCont { display: none; width: 100%; }
.th-mywallet .md-mywallet .listCont .tabCont table { width: 100%; }
.th-mywallet .md-mywallet .listCont .tabCont table tr { width: 100%; border-bottom: 1px solid #d8d8d8; }
.th-mywallet .md-mywallet .listCont .tabCont .order-number { float: left; width: 30%; padding: 10px 0px; box-sizing: border-box; }
.th-mywallet .md-mywallet .listCont .tabCont .order-day { float: left; width: 40%; padding: 10px 5px; box-sizing: border-box; }
.th-mywallet .md-mywallet .listCont .tabCont .order-money { float: left; width: 30%; padding: 10px 20px; box-sizing: border-box; }
.th-mywallet .md-mywallet .listCont .tabCont .order-money:before { content: attr(data-text); }

@media (max-width: 1400px) { }
@media (max-width: 1200px) { .th-wineinfo .gpmd-info { height: calc(100vh - 194px); padding:0; }
  .th-wineinfo .md-head h3 { font-size: 15px; line-height: 20px;font-weight: bold; }
  .th-wineinfo .md-text { font-size: 16px;background: #FFF;padding: 0 5px 10px;}
  .th-wineinfo .md-inery { font-size: 18px; }
  .th-wineinfo .md-inery ul li { margin: 0 8px 8px 0; }
  .th-wineinfo .md-taste { font-size: 18px; }
  .th-wineinfo .md-taste ul li { margin: 0 18px 18px 0; }
  .th-wineinfo .md-button button, .th-wineinfo .md-button input { font-size: 22px; padding: 18px 30px; }
  .th-billList .pt-list li .price { font-size: 16px; width: 90px; }  }
@media (max-width: 1100px) { .th-winelist .md-wineCont ul li { width: calc((100% / 3) - 20px); } }

@media (max-width: 935px) { 
  .th-winelist .md-wineCont ul li { width: calc((100% / 4) - 20px); }
  .th-winelist { padding-bottom: 15px; }
  .th-winelist .md-wineTab { height: 62px; margin: 0 auto 10px; }
  .th-winelist .md-wineTab ul { height: 62px; display: flex; align-items: center; }
  .th-winelist .md-wineTab ul li { padding: 5px; }
  .th-winelist .md-wineTab ul li:first-child { padding-left: 0; }
  .th-winelist .md-wineTab ul li a { padding: 6px 10px; white-space: nowrap; }
  .th-winelist .md-wineCont ul { height: calc(100vh - 155px); padding-bottom: 35px; box-sizing: border-box; }
  .th-wineinfo .gpmd-info { height: auto; }
  .th-billList .btn-cart { display: inline-block; }
  .th-billList .pt-head { height: 62px; background-size: cover; }
  .th-billList .pt-head h3 { padding: 14px 4%; }
  .th-billList .pt-head .hdbg { border-bottom: 62px solid #3ccdbf; }
  .th-billList .pt-list { height: calc(100vh - 255px); } 
  .th-billList .pt-total { height: 62px; line-height: 62px; }
  .th-billList .pt-button { height: 62px; }
  .th-billList .pt-button button, .th-billList .pt-button input { height: 62px; }
  .th-qrcode .md-qrcode { padding-top: 8%; }
  .th-qrcode .md-qrcode > p { font-size: 22px; }
  .th-bill .md-bill .pt-userinfo table tr th { display: none; }
  .th-bill .md-bill .pt-userinfo table tr td { display: block; width: 100%; text-align: left; background-color: transparent;font-size: 18px; }
  .th-bill .md-bill .pt-userinfo table tr td:before { content: attr(data-title); display: inline-block; vertical-align: top; padding: 0; width: 15%; text-align: left; border-right: 1px solid #fff; box-sizing: border-box; margin: 0 -5px; }
  .th-bill .md-bill .pt-userinfo table tr td span { display: inline-block; vertical-align: top; width: 75%; padding-left: 5%; box-sizing: border-box; margin: 0 4px; }
  .th-bill .md-bill .pt-userinfo .address{font-size: 18px;}
  .th-bill .md-bill .pt-userinfo .address .text:before { height: 45%; top: 26%; } 
  .th-bill .md-bill .pt-itemlist table tr{font-size: 18px;}
  
  }
@media (max-width: 768px) { .th-contact .md-contactinfo { width: 90%; margin:0 auto; }
  .th-contact .md-button { position: relative; bottom: auto; right: auto; }
  .th-contact .md-button button, .th-contact .md-button input { margin: 30px 0 20px; float: right; }
  .th-index { padding: 20px 20px 25px; }
  .th-index .md-logo { width: 30%; margin: 0 auto 20px; }
  .th-index .md-nav > a { width: calc(50% - 24px); margin:0 10px 8px; } 
  }
@media (max-width: 760px) { .th-winelist .md-wineCont ul li { width: calc((100% / 3) - 20px); }
  .th-contact { padding: 15px 4% 80px; }
  .th-contact .md-contactinfo { font-size: 22px; } }
@media (max-width: 720px) { 
  .th-bill .md-bill .pt-userinfo { font-size: 20px; padding-top: 10px;}
  .th-bill .md-bill .pt-userinfo table tr td { padding: 5px 10px;line-height: 23px; }
  .th-bill .md-bill .pt-userinfo table tr td:before {   }
  .th-bill .md-bill .pt-userinfo table tr td span { width: 65%; } 
  .th-bill .md-bill .pt-userinfo .address .text { width: 65%; line-height: 10px; }
  .th-bill .md-bill .pt-itemlist table tr { font-size: 19px; }
  .th-bill .md-bill .pt-itemlist table tr th { display: none; }
  .th-bill .md-bill .pt-itemlist table tr:nth-child(2n) { background-color: #f7f7f7; color: #414141; }
  .th-bill .md-bill .pt-itemlist table tr td { display: block; padding: 5px 15px 5px 0; box-sizing: border-box; }
  .th-bill .md-bill .pt-itemlist table tr td:last-child { padding-bottom: 30px; }
  .th-bill .md-bill .pt-itemlist table tr td:before { content: attr(data-title); display: inline-block; vertical-align: top; width: 25%; margin: 0 -2px; }
  .th-bill .md-bill .pt-itemlist table tr td span { display: inline-block; vertical-align: top; width: 75%; margin: 0 -2px; text-align: left;line-height: 24px; }
  .th-bill .md-bill .pt-itemlist table tr td button, .th-bill .md-bill .pt-itemlist table tr td input, .th-bill .md-bill .pt-itemlist table tr td i { float: right; }
  .th-myorder .md-myorder .pt-itemlist table tr {  }
  .th-myorder .md-myorder .pt-itemlist table tr th { display: none; }
  .th-myorder .md-myorder .pt-itemlist table tr:nth-child(2n) {  }
  .th-myorder .md-myorder .pt-itemlist table tr td { display: block; padding: 1px 0; box-sizing: border-box;font-size: 0.85em;text-align: left;}
  .th-myorder .md-myorder .pt-itemlist table tr td:last-child { padding-bottom:5px; }
  .th-myorder .md-myorder .pt-itemlist table tr td:before { content: attr(data-title); display: inline-block; vertical-align: top; width: 21%; margin: 0 -2px; }
  .th-myorder .md-myorder .pt-itemlist table tr td span { display: inline-block; vertical-align: top; width: 75%; margin: 0 -2px; text-align: left; }
  .th-myorder .md-myorder .pt-itemlist table tr td button, .th-myorder .md-myorder .pt-itemlist table tr td i { float: right; }
  .th-myorder .md-myorder .pt-itemlist table tr td input{} }
@media (max-width: 599px) { .th-winelist .md-wineCont ul li { width: calc(50% - 6px); }
  .th-qrcode .md-qrcode { width: auto;}
  .th-qrcode .md-qrcode > p { font-size: 15px; }
  .th-qrcode .md-qrcode .qrcodeCont .qrcode {  }
  .th-qrcode .md-qrcode .pt-button a, .th-qrcode .md-qrcode .pt-button button, .th-qrcode .md-qrcode .pt-button input { font-size: 20px; }
  .th-bill .md-bill { height: calc(100vh - 145px); }
  .th-bill .md-bill .pt-userinfo table tr td:before {   }
  .th-bill .md-bill .pt-userinfo table tr td span { width: 55%; } 
  .th-bill .md-bill .pt-userinfo .address .text { width: 55%; }
  .th-bill .md-button button, .th-bill .md-button input { font-size: 20px; padding: 24px 30px 25px; } 
  .th-myorder .md-button button, .th-myorder .md-button input { font-size: 20px; padding: 24px 30px 25px; }
  .th-mywallet .md-button button, .th-mywallet .md-button input { font-size: 20px; padding: 24px 30px 25px; }
  .th-billList .pt-list li .text { width: calc(90% - 40px); }
  .th-bill .md-bill .pt-userinfo .address .text { float: left; padding: 10px 10px 10px 3px; position: relative;}
    .th-bill .md-bill .pt-userinfo table tr td:before { content: attr(data-title); display: inline-block; vertical-align: top; padding: 0; width: 30%; text-align: left; border-right: 1px solid #fff; box-sizing: border-box; margin: 0 -5px; }
	.th-bill .md-bill .pt-userinfo .address .title { width: 35%; }
   }
@media (max-width: 460px) { .th-index .md-logo { width: 45%; }
  .th-index .md-nav > a { width: calc(50% - 20px); }
  .th-qrcode .md-qrcode {  }
  .th-qrcode .md-qrcode .qrcodeCont .qrcode {   } 
  .th-myorder .md-myorder { width: 100%; height: calc(100vh - 0px); }
  .th-bill .md-bill { height: calc(100vh - 130px); }
  .th-bill .md-button button, .th-bill .md-button input { padding: 17px 30px; } 
  .th-myorder .md-button button, .th-myorder .md-button input { padding: 17px 30px; }
  .th-mywallet .md-button button, .th-mywallet .md-button input { padding: 17px 30px; }
  .th-wineinfo .md-button button, .th-wineinfo .md-button input { font-size: 20px; padding: 16px 30px; }
  .th-billList .pt-button { height: 80px; }
  .th-billList .pt-button button, .th-billList .pt-button input { height: 80px; font-size: 20px; }
  .th-billList .pt-list { height: calc(100vh - 273px); }
  .th-billList .pt-list li .text { width: calc(90% - 57px); font-size: 14px; }
  .th-billList .pt-list li .price { width: 80px; font-size: 14px; } }

.th-list { height: calc(100vh - 136px); overflow-y: auto; }
.th-list .md-list { width: 100%; margin: 0 auto; }
.th-list .md-list li { display: inline-block; width: calc(16.66666% - 24px); margin: 10px; position: relative; }
.th-list .md-list li a { display: block; width: 100%; height: 100%; }
.th-list .md-list li figure { position: relative; z-index: 0; }
.th-list .md-list li figure img { width: 100%;    border: 1px solid #e6e6e6; }
.th-list .md-list li h6 { position: absolute; z-index: 5; width: 100%; bottom: 0; left: 0; padding: 10px; box-sizing: border-box; color: #fff; }
.th-list .md-list li h6:before { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: #000; opacity: 0.6; z-index: -1; }

.th-list1 { /*height: calc(100vh - 0px);*/overflow-y: auto; }
.th-list1 .md-list { width: 100%; margin: 0 auto; padding:17px 5px 5px; }
.th-list1 .md-list li { display: inline-block; width: calc(16.66666% - 24px); margin: 10px; position: relative; }
.th-list1 .md-list li a { display: block; width: 100%; height: 100%; }
.th-list1 .md-list li figure { position: relative; z-index: 0; }
.th-list1 .md-list li figure img { width: 80%; margin:0 auto;    }
.th-list1 .md-list li .list-pic { position: relative; z-index: 0; }
.th-list1 .md-list li .list-pic img { width: 80%; margin:0 auto;    }
.th-list1 .md-list li h6 {font-size: 15px;z-index: 5; width: 100%; bottom: 0; left: 0; padding:5px 10px; box-sizing: border-box; color: #333; text-align: center; margin-top:5px; }
.th-list1 .md-list li h6:before { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color:transparent; opacity: 0.6; z-index: -1; }

@media (max-width: 1100px) { .th-list .md-list li { width: calc(25% - 24px); }  .th-list1 .md-list li { width: calc(25% - 24px); }}
@media (max-width: 768px) { .th-list .md-list li { width: calc(33.3333% - 24px); } .th-list1 .md-list li { width: calc(33.3333% - 24px); } }
@media (max-width: 640px) { .th-list .md-list li { width: calc(50% - 24px); } .th-list1 .md-list li { width: calc(24.8% - 3px);margin: 0 0 5px; }
.th-list1 .md-list li h6{font-size: .85em;}
}

.th-wineinfo .md-remainder{ text-align: right; padding: 8px 0; border-bottom: 1px dashed gray; color: #de2500;}
.th-wineinfo .md-remainder span{font-size: 1.5em; padding: 0 8px;font-weight: bold;}

/*# sourceMappingURL=layout.css.map */
.infobox{width: 92%;  margin: 0 auto 20px;color:#333;text-align: center; }
.pricebox{ margin:25px auto;color:#FFF}

.th-contcont{width:85%; margin:0 auto;}


/*ÁÊ¶R²M³æ*/

.myorderlist { width: 100%; }
.myorderlist .pt-orderTab { width: calc(100% - 20px); padding: 0px;margin: 0 auto 10px; overflow-x: auto; overflow-y: hidden; }
.myorderlist .pt-orderTab ul {   }
.myorderlist .pt-orderTab ul li { float: left; padding: 18px 5px; }
.myorderlist .pt-orderTab ul li a { color: #FF5722; text-decoration: none; padding: 9px; box-sizing: border-box; }
.myorderlist .pt-orderTab ul li:hover a, .myorderlist .pt-orderTab ul li.on a {border-bottom: 2px solid #FF5722;  }


.inputbox {border-bottom: 1px solid #d9d9d9;}
.th-winelist .md-wineTab select {width: auto;display: inline-block;}
.th-winelist .md-wineTab input { margin-left: 0.5em;display: inline-block; width: auto;}

@media (max-width: 600px) { 
.th-winelist .md-wineTab {  overflow-x: auto;overflow-y: hidden; border-bottom:none;}
.th-winelist .md-wineTab input {margin-left: 0;    margin-top: 5px;}
}

/*¶ê»æ¹Ï*/
.item-list2 {display: inline-block;}
#dvLegend div { display: inline-block;}

.playrow{width: 92%;margin: 0 auto;}
.playrow #dvLegend span{ margin: 0 8px;}
.text-center { text-align: center;}

.mymoneymenu{display: block;margin-bottom: 20px;}
.mymoneymenu li{display: inline-block;}  

.mymoneymenu li a {padding: 6px 10px;}
.mymoneymenu li:hover a, .mymoneymenu li.on a {  border-bottom: 2px solid #FF5722;}

.mymoneymenu li a {
   color: #FF5722;
    text-decoration: none;
    padding: 9px;
    box-sizing: border-box;
}

.pt-itemlist {
    width: 92%;
    margin: 0 auto;
}


/*µn¤Jµù¥U­¶*/

.loginbox {
    width:500px;
    margin: 0 auto;
    background: #FFF;
}
@media (max-width: 768px) {
.loginbox { width: 90%;}
}

.word01{font-size: 15px; padding-bottom: 5px; border-bottom: 1px solid #FF5722;}


/*¦X¬ù®Ñ*/
.textbox{ background:#FFF;}

.btn{background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    font-size: .8em;}

.btn-outline-gray {
	color: #495057;
	background-color: transparent;
	background-image: none;
	border-color: #ced4da;
	width: 100%;
}
.btn-outline-gray:hover {
	color: #495057; 
	border-color: #ced4da
}
.btn-outline-gray.focus, .btn-outline-gray:focus {
box-shadow:0 0 0 .2rem rgba(0,123,255,.25)
}
.btn-outline-gray.disabled, .btn-outline-gray:disabled {
	color: #495057;
	background-color: transparent
}
.btn-outline-gray:not(:disabled):not(.disabled).active, .btn-outline-gray:not(:disabled):not(.disabled):active, .show>.btn-outline-gray.dropdown-toggle {
	color: #495057; 
	border-color: #ced4da
}
.btn-outline-gray:not(:disabled):not(.disabled).active:focus, .btn-outline-gray:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-gray.dropdown-toggle:focus {
box-shadow:0 0 0 .2rem rgba(0,123,255,.25)
}


/*ÃöÃö«ö§á*/

/* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

/* Hide default HTML checkbox */
.switch input {display:none;}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}
/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}
 


/*²£«~½ü¼½¹Ï*/
.th-indexBanner { position: relative; z-index: 0; }
.th-indexBanner .md-slideShow { position: relative; overflow: hidden; }
.th-indexBanner .pt-bannerList { position: relative; z-index: 0; padding-top: 140%; }
.th-indexBanner .pt-bannerList li { position: absolute; top: 0; width: 100%; height: 100%; }
.th-indexBanner .pt-bannerList li.active { z-index: 10; filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; }
.th-indexBanner .pt-bannerList li > span { color: #fff; font-size: 28px; font-weight: bold; display: block; width: 50%; position: absolute; right: 70px; top: 35%; text-align: right; line-height: 33px; }
.th-indexBanner .pt-bannerList li img { width: 100%; top: 0; left: 0; }
.th-indexBanner .pt-dot { width: 100%; position: absolute; bottom: 30px; left: 0%; z-index: 15; text-align: right; padding-right: 70px; box-sizing: border-box; }
.th-indexBanner .pt-dot ul { display: inline-block; }
.th-indexBanner .pt-dot ul li { float: left; margin-left: 16px; cursor: pointer; width: 15px; height: 15px; background-color: #5D5D5D; -moz-transition: backgroundColor, 0.3s; -o-transition: backgroundColor, 0.3s; -webkit-transition: backgroundColor, 0.3s; transition: backgroundColor, 0.3s; }
.th-indexBanner .pt-dot ul li.active { background-color: #9B1E2D; -moz-transition: backgroundColor, 0.3s; -o-transition: backgroundColor, 0.3s; -webkit-transition: backgroundColor, 0.3s; transition: backgroundColor, 0.3s; }
.th-indexBanner .pt-dot ul li:hover { background-color: #9B1E2D; -moz-transition: backgroundColor, 0.3s; -o-transition: backgroundColor, 0.3s; -webkit-transition: backgroundColor, 0.3s; transition: backgroundColor, 0.3s; }

@media (max-width: 1260px) { .th-indexBanner .pt-bannerList { padding-top: 368px; }
  .th-indexBanner .pt-bannerList li > span { width: 60%; } }
@media (max-width: 980px) { .th-indexBanner .pt-bannerList { padding-top: 83%; }
  .th-indexBanner .pt-bannerList li > span { font-size: 20px; top: 30%; line-height: 24px; }}
@media (max-width: 640px) {.th-indexBanner .pt-bannerList { padding-top: 95%; } .th-indexBanner .pt-bannerList li > span { width: calc(100% - 80px); font-size: 16px; top: 25%; line-height: 20px; right: 40px; }
  .th-indexBanner .pt-dot { padding-right: 40px; bottom: 15px; }}
@media (max-width: 460px) { .th-indexBanner .pt-bannerList li > span { font-size: 12px; top: 22%; line-height: 14px; right: 20px; }
  .th-indexBanner .pt-dot { padding-right: 20px; }}
@media screen and (min-width: 420px) and (max-width: 430px) { 	.th-indexBanner .pt-bannerList { padding-top: 100%;}
	
}
@media (max-width: 935px) {.main-content.main-winecont .main-aside .th-wineimg { height: auto; }} 
@media (max-width: 375px) { .th-wineinfo .md-head h3{    margin-top: 10px;}}
@media (max-width: 340px) { 
.th-indexBanner .pt-bannerList { padding-top: 100%; } 
.th-myorder .md-myorder .pt-itemlist table tr td:before{width: 25%;  }
.th-myorder .md-myorder .pt-itemlist table tr td span{  }

} 


.headerbar li{ width:32.3333%; display:inline-block; height:55px;}

.border-allw {  -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;width: 40px;    padding: 5px 5px 0 0;}



/*§Úªº¿ú¥]*/
.searchbox {
    border: 1px solid #dedede;
    padding: 5px 0px 2px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
	background: #dedede;
}
.searchbox span {
    padding: 0px 10px 0 20px;
}

.btn-search {
    display: inline-block;
    vertical-align: top;
    cursor: pointer;
    width: 22px;
    height: 22px;
    background-image: url(../images/search.svg);
    background-size: 14px 14px;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 0;  
    border: none;
	margin-top: -3px;
}

.servicelist, .about-box{ line-height:22px; font-size: 13px;}

.servicelist li{ list-style:disc;}

.about-box li{ list-style:decimal;    text-align: justify;text-justify: distribute;}

.news-head { 
    margin: 0 auto 20px;
    border-bottom: 1px solid #d45752;
    font-size: 16px;
    padding: 10px 0px;
    font-weight: bold;}
	
.news-head i {
    display: inline-block;
    vertical-align: middle;
    color: #d21818;
    font-size: 42px;
}
	
.newstable td {  padding: 2px 0; font-size: 15px;line-height: 22px;text-align: justify;text-justify: distribute;}

label {
    display: inline-block;
    width: 100%;
    margin-bottom: 5px;
    font-weight: bold;
}


.info_selectbox {
    display: block;
    /*width: 90%;*/
    height: auto;
    padding: 5px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    /*border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;*/
}


select.form-control:not([size]):not([multiple]) {
    height: calc(2.25rem + 10px);
}

.loginbtnbox{}
.loginbtnbox li{ display: inline-block;margin-right: 8px;    width: 100%;}
.loginbtnbox li input[type="submit"] {  width: 100%;}
.newspic {
    width: 100%;
}
.prdlistbg {
    background-image: url(../images/prdlist_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top;
}

.th-prdmore {
    width: 100%;
    min-height: 100vh;
    position: relative;
    background-size: 100%;
    background-image: -moz-linear-gradient(90deg, #27292a, #3f4143);
    background-image: -webkit-linear-gradient(90deg, #27292a, #3f4143);
    background-image: linear-gradient(0deg, #27292a, #3f4143);
}
.th-prdmore .md-prdmore{ padding: 8px; }
.th-prdmore .md-prdmore .prdmoreCont { width: 100%; padding: 0px; }
.th-prdmore .md-prdmore .prdmoreCont .prdmore {   margin: 0 auto; }
.th-prdmore .md-prdmore .prdmoreCont .prdmore img { width: 100%; }


label { font-size: 17px;}
.th-contact .md-contactinfo label span {    display: inline-block;}
select.form-control:not([size]):not([multiple]) {  height: auto;}

@media (max-width: 935px){
  .th-billList .pt-total {height: 45px;line-height: 45px;font-size: 18px;}
  .th-contact .md-contactinfo { font-size: 18px;}
  }

@media (max-width: 460px){
  .th-billList .pt-list {height: calc(100vh - 295px); }
}

.th-contact .md-contactinfo span input {  width: 15px;  height: 15px;}
.th-contact .md-contactinfo label span {  margin: 10px 0 15px;    font-size: 14px;  font-weight: 500;}
.th-contact .md-button button, .th-contact .md-button input{    padding: 5px 55px;}
.th-contact .md-contactinfo input{border: 1px solid #b5b5b5;font-size: 1.0em;  font-weight: 400;}
.th-contact .md-contactinfo .box-body .form-group label{font-size: 14px;  font-weight: 400;margin: 8px 0 0;}
.th-contact .md-contactinfo .box-body .form-group .form-control { width: 100%;}

.btn {border: 1px solid #dedede;}
.btn-50 {
  width: calc(50% - 3px); 
  border: 1px solid #dedede;
  height: 35px;
}

.th-contact .md-contactinfo p{font-size: 17px;}
.th-wineinfo .md-head .pt-add .number{width: 40px;height: 40px;padding-top: 5px;}
.th-wineinfo .md-head .pt-add .btn{padding: 0px;}

.th-wineinfo .md-more h4{margin-top: 0px;}


/*footer bar*/
.footerbar {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 75px;
  background: #5f5d5d;
  z-index: 888;
  -moz-box-shadow: 0px 0px 17px -2px rgba(20%,20%,40%,0.35);
  -webkit-box-shadow: 0px 0px 17px -2px rgba(20%,20%,40%,0.35);
  box-shadow: 0px 0px 17px -2px rgba(20%,20%,40%,0.35);
  border-top: 1px solid #e1e1e1;
}
.footerbar-menu {margin-bottom: 0px;text-align: center;}
.footerbar .footerbarmenu li{ display: inline-block; width: calc(20% - 3px); text-align: center; }

.footerbar .footerbar-menu li{
  display: inline-block;
  width: calc(20% - 5px);
  padding:8px 5px 5px 5px; 
  text-align: center;
}
.footerbar .footerbar-menu li a {
  color: #777573;
}
.footerbar .footerbar-menu li a img { 
  width: 50%;
  margin: 0px auto;
}
.footerbar .footerbar-menu li a p{color:#FFF; padding:2px 0 5px;font-size: .8em;}
@media (max-width: 460px){
.th-billList .pt-button button, .th-billList .pt-button input {
    height: 50px;
    font-size: 20px;
}
.th-billList .pt-head h3{    margin-top: 0;}
.th-billList .pt-list {
  height: calc(100vh - 353px);
}

}
.th-wineinfo .md-more1 { 
  font-size: 1em; 
  padding: 0 5px;
  margin-top: 7px;
}
.th-wineinfo .md-more1 ul{ 
  margin:0;
}
.th-wineinfo .md-more1 ul li {
  padding-bottom: 10px;
  height: 50px;
  display: inline-block;
  width: calc(50% - 4px);
}

.th-wineinfo .md-more1 ul li input { width: 100%;}
.th-wineinfo .md-more1 .btn-calce { background-color: #939393; background-color: #d2d2d2; border: 1px solid #d2d2d2;  padding: 10px;-webkit-border-radius: 5px;
  -moz-border-radius: 5px;  border-radius: 5px;}
.th-wineinfo .md-more1 .btn-confirmaddcar { background-color: #ff0000;color: #FFF;  border: 1px solid #d2d2d2;  padding: 10px;-webkit-border-radius: 5px;
  -moz-border-radius: 5px;  border-radius: 5px;}
 
  main {margin-bottom: 35px;}
  #header .header-content{    -moz-box-shadow: 4px 4px 12px -2px rgba(20%,20%,40%,0.35); -webkit-box-shadow: 4px 4px 12px -2px rgba(20%,20%,40%,0.35);
    box-shadow: 4px 4px 12px -2px rgba(20%,20%,40%,0.35); border-bottom: 1px solid #777;}
 
 /*slider*/

 .th-sliderShow .pt-bannerList:after, .th-sliderShow .pt-dot ul:after { content: ""; display: block; clear: both; }

@-moz-keyframes hover-color { 0% { background-position: 0% 88%; }
  50% { background-position: 100% 45%; }
  100% { background-position: 0% 88%; } }
@-webkit-keyframes hover-color { 0% { background-position: 0% 88%; }
  50% { background-position: 100% 45%; }
  100% { background-position: 0% 88%; } }
@keyframes hover-color { 0% { background-position: 0% 88%; }
  50% { background-position: 100% 45%; }
  100% { background-position: 0% 88%; } }
.th-sliderShow { position: relative; z-index: 0; }
.th-sliderShow:hover .pt-prev { left: 0; -moz-transition: left, 0.4s; -o-transition: left, 0.4s; -webkit-transition: left, 0.4s; transition: left, 0.4s; }
.th-sliderShow:hover .pt-next { right: 0; -moz-transition: right, 0.4s; -o-transition: right, 0.4s; -webkit-transition: right, 0.4s; transition: right, 0.4s; }
.th-sliderShow .md-slideShow { position: relative; overflow: hidden; }
.th-sliderShow .pt-bannerList { position: relative; z-index: 0; }
.th-sliderShow .pt-bannerList li { float: left; position: absolute; top: 0; }
.th-sliderShow .pt-bannerList li.active { position: relative; z-index: 10; filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; }
.th-sliderShow .pt-bannerList li a { text-decoration: none; }
.th-sliderShow .pt-bannerList li .text { display: none; background-color: gray; color: #FFF; padding: 20px 20px 40px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.th-sliderShow .pt-bannerList li .text h4 { font-size: 1rem; margin-bottom: 15px; }
.th-sliderShow .pt-bannerList li .text p { font-size: 0.8125rem; line-height: 1.5; }
.th-sliderShow .pt-bannerList li .imgCont { width: 100%; padding-top: 50%; background-size: cover; background-position: center; }
.th-sliderShow .pt-dot { width: 100%; position: absolute; bottom: 20px; left: 0%; z-index: 15; text-align: center; }
.th-sliderShow .pt-dot ul { display: inline-block; }
.th-sliderShow .pt-dot ul li { float: left; margin-left: 15px; cursor: pointer; width: 15px; height: 15px; border: 1px solid #FFF; background-color: transparent; -moz-transition: backgroundColor, 0.3s; -o-transition: backgroundColor, 0.3s; -webkit-transition: backgroundColor, 0.3s; transition: backgroundColor, 0.3s; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; }
.th-sliderShow .pt-dot ul li.active { background-color: #FFF; -moz-transition: backgroundColor, 0.3s; -o-transition: backgroundColor, 0.3s; -webkit-transition: backgroundColor, 0.3s; transition: backgroundColor, 0.3s; }
.th-sliderShow .pt-dot ul li:hover { background-color: #FFF; -moz-transition: backgroundColor, 0.3s; -o-transition: backgroundColor, 0.3s; -webkit-transition: backgroundColor, 0.3s; transition: backgroundColor, 0.3s; }
.th-sliderShow .pt-prev, .th-sliderShow .pt-next { display: block; width: 35px; height: 70px; position: absolute; z-index: 999; top: 50%; margin-top: -35px; z-index: 5; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60); opacity: 0.6; filter: alpha(opacity=60); -moz-transition: all, 0.4s; -o-transition: all, 0.4s; -webkit-transition: all, 0.4s; transition: all, 0.4s; }
.th-sliderShow .pt-prev:hover, .th-sliderShow .pt-next:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40); opacity: 0.4; filter: alpha(opacity=40); -moz-transition: opacity, 0.4s; -o-transition: opacity, 0.4s; -webkit-transition: opacity, 0.4s; transition: opacity, 0.4s; }
.th-sliderShow .pt-prev { left: -40px; background-image: url("../images/banner_prev.png"); -moz-transition: all, 0.4s; -o-transition: all, 0.4s; -webkit-transition: all, 0.4s; transition: all, 0.4s; }
.th-sliderShow .pt-next { right: -40px; background-image: url("../images/banner_next.png"); -moz-transition: all, 0.4s; -o-transition: all, 0.4s; -webkit-transition: all, 0.4s; transition: all, 0.4s; }

@media (min-width: 0px) { html, body { min-width: 320px; } }
@media (max-width: 980px) { .th-sliderShow .pt-prev { left: 0; -moz-transition: left, 0s; -o-transition: left, 0s; -webkit-transition: left, 0s; transition: left, 0s; }
  .th-sliderShow .pt-next { right: 0; -moz-transition: right, 0s; -o-transition: right, 0s; -webkit-transition: right, 0s; transition: right, 0s; } }
@media (max-width: 640px) { 
  .th-sliderShow .pt-bannerList li .text { display: block; }
  .th-sliderShow .pt-dot { bottom: 10px; }
  .th-sliderShow .pt-dot ul li { width: 10px; height: 10px; }
  .th-sliderShow .pt-prev, .th-sliderShow .pt-next { width: 25px; height: 50px; background-position: center center; margin-top: -25px; } 
}
  .th-list1 .sliderbox{ width: 100%; margin:0 auto 50px;  display: block; }
  .th-list1 .slider{padding: 0 5px 5px;  display: block;    background: transparent;}

  .th-winelist .md-wineTab ul li a{ background: #22a592;}
  .th-winelist .md-wineTab ul li.on a{background: #858585;}
 
  .footerbar .footerbar-menu li a span {
    position: absolute;
    top: 3px;
    right: 27px;
    display: inline-block;
    vertical-align: middle;
    width: 15px;
    height: 15px;
    font-size: 12px;
    color: #fff;
    border-radius: 50%;
    background-color: #499b8c;
    line-height: 16px;
    text-align: center;
    margin-left: 4px;
}  

.th-myorder .md-myorder .pt-itemlist table tr td a, .th-myorder .md-myorder .pt-itemlist table tr td .btn{font-size: .8em;}
.th-contact h2 {font-size: 18px;}
.th-contact h3 {font-size: 13px;}

.member_info{width: 100%;background: #FFF;}


.L4memberbox {background: #FFF;  padding: 20px;} 
.L4memberbox .L4member-infoboxtop { text-align: center;border-bottom:1px solid #858585;padding-bottom: 25px;}
.L4memberbox .L4member-infoboxtop .L4-pic { width: 80px;height: 80px;-webkit-border-radius: 50%;-moz-border-radius: 50%; border-radius: 50%;  background: #e1e2de;  margin: 0 auto;}
.L4memberbox .L4member-infoboxtop .L4-pic img {width: 80%; margin: 0 auto; padding-top: 5px;}
.L4memberbox .L4member-infoboxtop .L4-phone {font-size: 15px;  margin: 25px auto 30px;}
.L4memberbox .L4member-infoboxtop .L4-point span {padding: 8px 15px;background: #22a592; color: #FFF;}


.L4memberbox .L4member-infoboxbottom .L4-btn{padding: 5px 10px;  background: #22a592;  color: #FFF; border:none;}
.L4memberbox .L4member-infoboxbottom .L4-info {border-bottom: 1px solid #858585; padding: 8px 0;}
.L4memberbox .L4member-infoboxbottom .L4-info .L4-infodetail{ padding: 8px 0; margin-left: 35px;}
.L4memberbox .L4member-infoboxbottom .L4-info .L4-infodetail label{display: inline-block; width: 20%;font-size: 13px;font-weight: 500;}
.L4memberbox .L4member-infoboxbottom .L4-info .L4-infodetail input{display: inline-block; width: 78%; padding:5px;font-size: 13px;background: #dddddd;
  border: 1px solid #b5b5b5; text-align: center;margin-bottom: 5px;}
.L4memberbox .L4member-infoboxbottom .L4-location, .L4memberbox .L4member-infoboxbottom .L4-upgrade, .L4memberbox .L4member-infoboxbottom .L4-service {border-bottom: 1px solid #858585; padding: 8px 0;background: url(../images/icon/arrow-right.png) center right;
  background-size: 20px;  background-repeat: no-repeat;display: block;color: #333;}

.L4locationbox {background: #FFF;  padding: 20px;} 
.L4locationbox .L4location-infoboxtop {border-bottom:1px solid #858585; padding-bottom: 10px; margin-bottom: 30px; font-weight: bold;}
.L4locationbox .L4location-infoboxbottom .L4-info .L4-infotop{ margin-bottom:30px;} 
.L4locationbox .L4location-infoboxbottom .L4-info .L4-infotop p{ margin-bottom:10px;font-weight: bold;}
.L4locationbox .L4location-infoboxbottom .L4-info .L4-infotop .input-100{ width: 100%;padding: 5px 10px;}
.L4locationbox .L4location-infoboxbottom .L4-info .L4-infobottom{line-height: 22px; color: #666;} 
.L4locationbox .L4location-infoboxbottom .L4-info .L4-infobottom .L4-stitle{margin-bottom:15px;}
.L4locationbox .L4location-infoboxbottom .L4-info .L4-infobottom span{color:#ce7441;}
.L4locationbox .L4location-infoboxbottom .L4-info .L4-infobottom .L4-locationinfo {margin-bottom:20px;}
.L4locationbox .L4location-infoboxbottom .L4-btn{padding: 8px 15px;  background: #22a592;  color: #FFF; border:none;}


.L4upgradebox {background: #FFF;  padding: 20px;} 
.L4upgradebox .L4upgrade-infoboxtop {border-bottom:1px solid #CCC; padding-bottom: 20px; margin-bottom: 30px; }
.L4upgradebox .L4upgrade-infoboxtop .L4-title{font-weight: bold;  border-bottom: 1px solid #ccc;  padding-bottom: 10px;  margin-bottom: 15px;}
.L4upgradebox .L4upgrade-infoboxtop .L4-btn{padding: 8px 15px;  background: #22a592;  color: #FFF; border:none;}
.L4upgradebox .L4upgrade-infoboxtop .L4-upgradeinfo { line-height: 22px;  color: #666;}
.L4upgradebox .L4upgrade-infoboxtop .L4-upgradeinfo span { color: #ce7441;}
.L4upgradebox .L4upgrade-infoboxbottom .L4-btn{padding: 8px 15px;  background: #22a592;  color: #FFF; border:none;}

.md-inery h4 {margin-top: 0;}

/*iphone 瀏海用*/
.pc-mobileMenu {
  padding-top: constant(safe-area-inset-top);
  padding-right: constant(safe-area-inset-right);
  padding-bottom: constant(safe-area-inset-bottom);
  padding-left: constant(safe-area-inset-left);
}



.member-content .forgotCont {  margin: 0 auto;}
.member-content .forgotCont .forgot-password { width: 50%; margin: 0 auto;border: 1px solid #E5E5E5;  padding: 65px 35px;background-color: #FFF;}
.member-content .forgotCont .forgot-password .title{text-align: center;font-size: 24px;color: #333;padding: 0 10px 10px 10px;}
.member-content .forgotCont .forgot-password .subtitle{text-align: center;font-size: 18px;color: #666;margin: 10px 0;    padding: 0 10px;}
.member-content .forgotCont .forgot-password .subword{margin-top: 12px; margin-bottom: 0px; text-align: center; color: #b0b0b0; line-height: 25px; font-size: 13px; padding: 0 10px;}

.member-content .forgotCont .password-send {margin: 0 auto;border: 1px solid #E5E5E5;  padding: 65px 35px;background-color: #FFF;}
.member-content .forgotCont .password-send .passwordsend-left{width: 55%; display: inline-block;  border-right: 1px solid #e5e5e5;}
.member-content .forgotCont .password-send .passwordsend-left .title{text-align: center;font-size: 24px;color: #333;padding: 0 10px 10px 10px;}
.member-content .forgotCont .password-send .passwordsend-left .subtitle{text-align: center; font-size: 14px; color: #666; padding: 0 10px; margin-top: 20px;}
.member-content .forgotCont .password-send .passwordsend-left p{    text-align: center; font-size: 20px; color: #333; margin-bottom: 20px;}
.member-content .forgotCont .password-send .passwordsend-left .msgcode{text-align: left; outline: none; padding: 10px 5px; border: none; border-bottom: 1px solid #ccc; margin: 0 auto;
    width: 75%;display: block;}
.member-content .forgotCont .password-send .passwordsend-left  .error-input {text-align: center; margin-top: 10px;}
.member-content .forgotCont .password-send .passwordsend-right{width: 44%; display: inline-block; float: right; }

.member-content .forgotCont .change-password {width: 50%; margin: 0 auto; border: 1px solid #E5E5E5; padding: 65px 35px;background-color: #FFF;}
.member-content .forgotCont .change-password .title{text-align: center;font-size: 24px;color: #333;padding: 0 10px 10px 10px;}
.member-content .forgotCont .change-password .subtitle{text-align: center;font-size: 18px;color: #666;margin: 10px 0;    padding: 0 10px;}
.member-content .forgotCont .change-password .changemsgcode{text-align: left; outline: none; padding: 10px 5px; border: none; border-bottom: 1px solid #ccc; margin: 25px auto;
    width: 75%;display: block;}
    .btnbox {  margin: 25px auto;  text-align: center;  }
.form-btn, .red-btn { border-radius: 5px; font-size: 15px; color: #fff !important; text-align: center; cursor: pointer; line-height: 44px; height: 44px; display: inline-block; width: 80%;   border: none;  }
.red-btn {background: #E33D26;}
.orange-btn { background: #FF9933; border-radius: 5px; font-size: 15px; color: #fff !important; text-align: center; cursor: pointer; line-height: 44px; height: 44px; display: inline-block;
  width: 64%; border: none; margin: 11px 18% 11px;}
.orange-btn:hover { transition: all 0.6s ease; background-color: #F08316;}
    @media (max-width: 768px){
      .member-content .forgotCont .forgot-password { width: 100%; margin: 0 auto;border:none; padding: 0;background-color: #FFF;}
      .member-content .forgotCont .password-send   { width: 100%; margin: 0 auto;border:none; padding: 0;background-color: #FFF;}
      .member-content .forgotCont .password-send .passwordsend-left {width: 100%;border:none;}
      .member-content .forgotCont .password-send .passwordsend-left .title{font-size: 21px;line-height: 28px;}
      .member-content .forgotCont .password-send .passwordsend-right{display: none;}
      .member-content .forgotCont .change-password { width: 100%; margin: 0 auto;border:none; padding:30px 0;background-color: #FFF;}
     

    }


.font18{font-size:18px;}

.md-tabs {
    width: calc(100% - 10px);
    margin: 20px auto;
    padding-bottom: 10px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 5px;
    overflow-y: auto;
}
    .md-tabs li {
        width: auto;
        padding: 6px 10px;
        box-sizing: border-box;
        border-radius: 5px;
        background-color: #22A592 !important;
    }
.md-tabs li.on {
    background-color: #858585 !important;
}
.md-tabs li a {
    color: white !important;
    white-space: nowrap;
}