/* member center*/
.member-center { width: 96%; margin: auto; padding: 2em 0px 5em 0px; display: block; vertical-align: top; }
.member-left { width: 90%; display: block; margin: auto auto 5% auto; vertical-align: top; }
.member-left li { width: 80%; margin: 2% auto; display: block; color: #000; line-height: 24px; vertical-align: top; }
.member-left li.member-logo { width: 100%; height: 120px; margin: 2% auto; background: url(../images/icons/logo-m.svg) no-repeat 8% top; background-size: 50% auto; text-indent: -9999px; }
.member-left li.name { font-size: 24px; line-height: 36px; }
.member-left li.name strong { margin: 0 0 0 10px; text-decoration: underline; font-style: normal }
.member-right { width: 90%; margin: auto; display: block; }
.member-right li { display: inline-block; width: 22.5%; min-height: 130px; margin: 5%; list-style: none; font-weight: bold; }
.member-right li a { display: block; padding: 110px 0 0 0; height: 20px; width: 110px; line-height: 20px; text-align: center; font-size: 1em; color: #000; }
.member-right li.profile a { background: url(../images/icons/profile@2x.png) no-repeat center top; background-size: 96px 280px }
.member-right li.order a { background: url(../images/icons/order@2x.png) no-repeat center top; background-size: 96px 280px }
.member-right li.faqs a { background: url(../images/icons/faqs@2x.png) no-repeat center top; background-size: 96px 280px }
.member-right li.password a { background: url(../images/icons/password@2x.png) no-repeat center top; background-size: 96px 280px }
.member-right li.logout a { background: url(../images/icons/logout@2x.png) no-repeat center top; background-size: 96px 280px }
.member-right li.coupons a { background: url(../images/icons/coupons.png) no-repeat center top; background-size: 96px 280px }
.member-right li.recommended a { background: url(../images/icons/recommended.png) no-repeat center top; background-size: 96px 280px }
.member-right li.feedback a { background: url(../images/icons/feedback.png) no-repeat center top; background-size: 96px 280px }
.member-right li.collection a { background: url(../images/icons/collection.png) no-repeat center top; background-size: 96px 280px }
.member-right li a:hover { background-position: center -184px; color: #6eb54e; }
.member-promo { width: 55%; display: inline-block; }
.member-promo ul { display: block; width: 280px; margin: 65px auto; overflow: hidden }
.member-promo ul li { display: block; width: 100%; color: #E6E6E6; line-height: 24px; float: left }
.member-promo ul li.member-center-logo { background: url(../images/member-center.png) no-repeat center top; height: 150px; margin: 0 0 30px 0; text-indent: -9999px; }
.member-promo ul li.join a { display: block; width: 80px; height: 80px; line-height: 80px; font-size: 19px; color: #FFF; overflow: hidden; border-radius: 40px; text-align: center; margin: 30px auto 0 auto; text-decoration: none; font-weight: normal; background: rgba(0,109,69,1); }
.member-promo ul li.join a span { display: block; width: 100%; height: 22px; line-height: 22px }
.member-promo ul li.join a span:first-child { margin-top: 17px }
.member-promo ul li.join a:hover { background: rgba(0,109,69,.8); }
.member-promo ul li.promoad { display: block; height: 150px; overflow: hidden; border: 1px solid #0F0 }
.member-promo ul li.promo-ad img { display: block; margin: 0 auto; width: 100%; height: auto }
/* forget password*/
.password-form { width: 100%; display: block; margin: auto; text-align: center; padding: 2em 0px; }
.password-form ul { display: block; width: 100%; margin: 30px auto auto auto; text-align: center; padding:15px; background:#fff; }
.password-form ul li { width: 100%; display: block; height: auto; margin: 0 0 5px 0; padding: 0; }
.password-form ul li.title { margin: 0 0 10px 0; padding-bottom: 10px; font-size: 18px; height: 35px; line-height: 35px; border-bottom: 2px solid #000; width: 100%; font-weight: 400; }
.password-form ul li span { display: inline-block; vertical-align: top; line-height: 40px; font-size: 16px; }
.password-form ul li span .remark { display: inline-block; line-height: 21px; font-size: 11px; color: #999; text-align: left; }
.password-form ul li input { width: 90%; border: 1px solid #afbabf; line-height: 1.5em; padding: 5px; }
.password-form ul li span:first-child { width: 25%; color: #000; }
.password-form ul li span:first-child+span { width: 65%; text-align: left; }
.password-form .birthday select { width: 90px; border: 1px solid #CCC; height: 26px; line-height: 26px; padding: 0; margin: 0 10px 0 0 }
.password-form ul li .input_text { background:#ee999c; padding:5px; }
.password-form ul li .input_text span{ color:#fff; }
.password-form ul li .input_text input{ border:0 none; }
.password-form ul li .remark{ color:#c2c2c2; font-size:.8rem; line-height:3; }
.password-form ul li input[type=submit]{ background:#ee999c; color:#fff; border:0 none; padding:10px; font-size:1rem; transition:.2s linear; }
.password-form ul li input[type=submit]:hover{ background:#d8777a; }

/**------member-join----*/
.form-medium { width:90%; display: block; margin:5% auto; }
.form-medium ul { width: 100%; display: block; margin:auto; text-align: center; }
.form-medium ul li { display: block; height: auto; margin: 0 0 10px 0; padding: 0 }
.form-medium ul li.title { font-size: 18px; height: 35px; line-height: 35px; border-bottom: 2px solid #000; width: 100%; font-weight: bold; margin: 0 0 10px 0; padding-bottom: 10px }
.form-medium ul li span { display:block; line-height: 40px; font-size: 1em; }
.form-medium ul li span:first-child { width:100%; color: #333333; text-align: left; vertical-align: top; }
.form-medium ul li span:first-child+span { width: 100%; text-align: left; }
.form-medium ul li span .remark { display: block; line-height: 1.8em; padding-top: 15px; font-size: 12px; color: #aab3bb; }
.form-medium ul li input {  padding: 5px;  line-height: 24px; }
.form-medium select { min-height: 36px; margin:5px 0px;  padding: 5px 0px; line-height: 24px;   color:#afbabf; }
.form-medium .birthday select { margin: 0 10px 0 0; width: 90px; }
.form-medium ul li.rule { width: 100%; margin:3% 0; }
.form-medium ul li.rule span:first-child { width:50%; margin:0;  line-height: 24px; text-align:left;}
.form-medium ul li.rule label{width:25%;}
.form-medium ul li.rule span:first-child+span { width:100%; line-height: 24px; color: #666;}
.form-medium ul li.rule span:first-child+span a { color: #6eb54e; }
.form-medium p { display: block; width: 100%; margin: 0 auto; font-size: 15px; text-align: center; margin: 20px 0; line-height: 26px; min-height: 35px; }
.form-medium p strong { font-weight: bold; margin: 0 10px; }
.form-medium ul li input{ width: 100%; border: 1px solid rgba(126,144,174,.6); }

.center-info { width: 80%; margin:10% auto; display: block; text-align: center; }
.center-info h2 { font-size: 26px; display: block; width: 100%; margin: 30px 0; text-align: center; font-weight: bold }
.center-info p { font-size: 15px; display: block; text-align: center; width: 100%; margin: 30px 0; line-height: 26px; }
.center-info p.info-more { font-size: 14px; display: block; text-align: center; width: 100%; margin: 30px 0; line-height: 26px; }
.center-info p strong { font-weight: bold; color: #C9163A; margin: 0 0 0 10px; }

.border { height: 2px; overflow: hidden; display: block; color: #aeb8bd; background-color: #aeb8bd; width: 100%; clear: both; }






 @media (min-width:800px) {
.member-center { padding: 5em 0px 8em 0px; }
.member-left { width: 35%; margin-left: 5%; margin-top: 10%; display: inline-block; }
.member-right { width: 50%; margin-left: 8%; display: inline-block; }
.member-left li.member-logo { width: 100%; height: 120px; background-size: 80% auto; }
.member-left li { text-align: center; }
.member-left li.name{ width: 70%; }
/* forget password*/
.password-form { width: 80%; }
.password-form ul { width: 70% }
.password-form ul li input { width: 70%; }

.form-medium { width:80%;}
.form-medium ul li span { display: inline-block;}
.form-medium ul li span:first-child { width: 25%; margin-right: 4%; text-align:right;}
.form-medium ul li span:first-child+span { width: 65%; }
.form-medium select{ width:auto; display: block;}
.form-medium ul li input{ width:auto;}
.form-medium ul li.rule span:first-child { width:5%; margin:0; display: inline-block;  text-align:left;}
.form-medium ul li.rule span:first-child+span { width: 70%;}

.password-form ul li .input_text { display:flex; }
}

 @media (max-width:800px) {
    .password-form ul{ padding:0 0 15px; }
 }