﻿@charset "UTF-8";
.memberCenter {
  font-size: 16px;
  margin-bottom: 40px; }
  /*input, select {
        border: 1px solid #d1c9bb; 邊框樣式
        border-radius: 3px; 邊框圓角
        padding: 8px 10px; 框架的內邊距:上下-左右
        background: #faf7f2;
    }*/ 
  .memberCenter .memberWelcom, .memberCenter .logout {
    display: none; }
  .memberCenter button.ui-datepicker-trigger {
    display: none; }
  .memberCenter ul.nav-tabs {
    font-size: 16px; }
    .memberCenter ul.nav-tabs .nav-item {  /*會員中心-導航標籤選單*/
      padding-left: 20px; }                /*框架內縮左邊距離*/
    .memberCenter ul.nav-tabs .nav-link.active {     /*會員中心標籤按鈕-游標點擊後的動態變化(網頁版)*/ 
      background: #f1f9f2;                         /*背景顏色*/
      padding-bottom: 9px;                           /*框架內縮底部距離*/
      padding-top: 7px;                              /*框架內縮上面距離8px*/
      border-color: #009145 #009145 #f1f9f2; } /*邊框樣式設定:上-左右-下*/
  .memberCenter .tab-content {   /*會員中心-選項內容*/
    background: #f1f9f2;       /*背景底色*/ 
    padding: 45px 70px; }        /*框架的內邊距：上下-左右*/
  .memberCenter .m-memberTitle {
    display: none; }
  .memberCenter span.fbIcon {  
    display: inline-block;
    width: 25px;
    height: 25px;
    border-radius: 50%; 
    color: #fff;
    background: #4d6baa;  
    text-align: center;
    margin-left: 5px; }
  .memberCenter span.appleIcon {  
    color: #fff;
    background: #000;  
  }
	
    .memberCenter span.fbIcon i {
      line-height: 27px; }
  .memberCenter .trangleLeft:after { /*會員中心-訂單查詢後面符號*/
    content: "\f0da";                /*內容*/
    font-family: FontAwesome;        /*字體*/
    display: inline-block;           /*依照元素中的內容來決定內容的寬高*/
    padding-right: 3px;              /*框架內縮右邊距離*/
    vertical-align: middle;          /*垂直對齊：置中*/
    position: absolute;              /*絕對位置*/
    right: -30px;                    /*右邊*/
    top: 3px;                        /*上面*/
    color: #61c46e;                /*符號顏色*/
    font-size: 12px; }               /*文字尺寸*/
  .memberCenter .editPasswordTitle:after {
    content: ""; }
  .memberCenter .flexTableRow {     /*會員中心-訂單查詢下面分隔線*/
    display: flex;                  /*彈性容器*/
    font-size: 15px;                /*文字尺寸*/
    background-image: linear-gradient(to right, #009145 40%, rgba(241, 142, 0, 0) 40%); /*背景圖片-分隔線邊線樣式*/
    background-position: bottom;    /*背景位置:底部*/
    background-size: 5px 1px;       /*背景大小*/
    background-repeat: repeat-x; }  /*背景重複:X-方向重複*/
    .memberCenter .flexTableRow > .flexCell {
      flex: none;
      text-align: center;
      padding-top: 24px;
      padding-bottom: 24px; }
  .memberCenter .flexTitleRow {   /*會員中心-訂單查詢標題色塊底色*/
    background-color: #bfeac3;  /*欄位底色*/
    font-size: 16px;              /*文字尺寸*/
    border-bottom: 0;             /*下方邊框樣式*/
    background-image: none; }     /*背景圖片*/
    .memberCenter .flexTitleRow > .flexCell { /*會員中心-訂單查詢標題色塊分隔線*/
      flex: none;
      font-weight: bold;                      /*字體粗細*/
      border-right: 1px solid #fff;         /*底色分隔線顏色*/
      padding-top: 13px;                      /*上方內邊距*/
      padding-bottom: 13px; }                 /*下方內邊距*/
    .memberCenter .flexTitleRow > .flexCell:nth-last-child(1) {
      border-right: 0; }           
  .memberCenter .memberEditRow {
    width: 505px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    margin-bottom: 20px; }
    .memberCenter .memberEditRow .editTitle { /*加入會員-標題調整*/
      flex: none;
      width: 85px;              /*寬度*/
      position: relative;       /*相對位置*/
      text-align: right;        /*文字對齊:右邊*/
      font-weight: bold; }      /*標題文字粗細*/
    .memberCenter .memberEditRow .editValue {
      flex: 1;
      margin-left: 50px; }
  .memberCenter #tab1 hr {   /*會員中心-會員資料修改分隔線*/
    border-top: 0;           /*上方邊框樣式*/
    margin-bottom: 30px;     /*框架外拉下面距離*/
    margin-top: 30px;        /*框架外拉上面距離*/
    background-image: linear-gradient(to right, #009145 40%, rgba(241, 142, 0, 0) 40%); /*背景圖片-分隔線邊線樣式*/
    background-position: bottom;  /*背景位置:底部*/
    background-size: 5px 1px;    /*背景大小*/
    background-repeat: repeat-x; /*背景重複:X-方向重複*/
    padding-top: 1px; }          /*框架內縮上面距離*/
  .memberCenter #tab1 input {
    width: 370px; }
  .memberCenter #tab1 input[type=checkbox] {
    width: auto; }
  .memberCenter #tab1 label {
    margin-bottom: 0; }
  .memberCenter #tab1 select {
    margin-bottom: 10px; }
  .memberCenter #tab1 .editPassword {    /*會員中心-修改密碼*/
    color: #5d9e49;                    /*顏色*/
    border-bottom: 1px solid #5d9e49;  /*下方邊框樣式*/
    cursor: pointer; }                   /*改變滑鼠游標的形狀:手指*/
  .memberCenter #tab1 .buyNowBtn {
    width: 262px;
    padding: 10px 0; }
  .memberCenter #tab2 .orderQuery {
    margin: 0 auto; }
    .memberCenter #tab2 .orderQuery .orderQueryRow {
      margin-bottom: 25px; }
      .memberCenter #tab2 .orderQuery .orderQueryRow > div {
        display: inline-block;
        margin-right: 60px; }
      .memberCenter #tab2 .orderQuery .orderQueryRow .buyNowBtn {
        padding: 7px 20px;
        vertical-align: baseline; }
      .memberCenter #tab2 .orderQuery .orderQueryRow select {
        padding: 9px 10px;
        margin-right: 5px;
        margin-left: 5px; }
      .memberCenter #tab2 .orderQuery .orderQueryRow label { /*會員中心-訂單查詢頁按鈕*/
        background: #61C36E;                               /*查詢按鈕顏色*/  
        color: #fff;                                       /*查詢文字顏色*/ 
        padding: 9px 40px;                                   /*框架的內邊距:上下-左右*/
        cursor: pointer;                                     /*改變滑鼠游標的形狀:手指*/
        margin-bottom: 0;                                    /*下方外邊界*/
        margin-left: -20px; }                                /*左側外邊界*/
    .memberCenter #tab2 .orderQuery .queryTitle {
      position: relative;
      padding-right: 21px;
      display: inline-block;
      font-weight: bold; }
    .memberCenter #tab2 .orderQuery .queryTitle + input {
      margin-left: 10px;
      width: 160px; }
    .memberCenter #tab2 .orderQuery input[type=date] {
      margin-right: 5px;
      width: 90px; }
    .memberCenter #tab2 .orderQuery .trangleLeft:after {
      right: 0; }
    .memberCenter #tab2 .orderQuery .orderList .m-title {
      display: none; }
    .memberCenter #tab2 .orderQuery .orderList .flexTableRow > .flexCell {
      flex: 1;
      text-align: center; }
    .memberCenter #tab2 .orderQuery .orderList .flexTableRow > .flexCell:nth-child(3) {
      font-weight: bold; }
    .memberCenter #tab2 .orderQuery .orderList .flexTableRow > .flexCell:nth-last-child(1) {
      flex: 1.3;
      display: flex;
      padding: 0;
      align-items: center;
      border-right: 0; }  
      .memberCenter #tab2 .orderQuery .orderList .flexTableRow > .flexCell:nth-last-child(1) > div {
        flex: 1;
        border-right: 1px solid #fff;  
        padding-top: 13px;
        padding-bottom: 13px; }
      .memberCenter #tab2 .orderQuery .orderList .flexTableRow > .flexCell:nth-last-child(1) > div:nth-last-child(1) {
        border-right: 0; }   
    .memberCenter #tab2 .orderQuery .orderList .flexTableRow a {
      text-decoration: underline; }
  .memberCenter #tab3 h2 {
    font-size: 16px;
    margin-bottom: 25px; }
    .memberCenter #tab3 h2 span {
      font-size: 21px;
      color: #F10000;
      margin-left: 5px; }
  .memberCenter #tab3 .minusColor {
    color: #F10000; }
  .memberCenter #tab3 .m-title {
    display: none; }
  .memberCenter #tab3 .moneyQuery {
    margin-bottom: 20px; }
    .memberCenter #tab3 .moneyQuery .trangleLeft { /*會員中心-購物金查詢頁*/
      position: relative;                          /*相對位置*/
      padding-right: 21px;                         /*框架內縮右邊距離*/
      display: inline-block;                       /*依照元素中的內容來決定內容的寬高*/
      font-weight: bold;                           /*文字粗細*/
      width: auto; }                               /*寬度*/
    .memberCenter #tab3 .moneyQuery .trangleLeft:after { 
      right: 4px; }
    .memberCenter #tab3 .moneyQuery label {  /*購物金查詢選單*/
      background: #61C36E;                 /*查詢按鈕顏色*/
      color: #fff;                         /*查詢文字顏色*/
      padding: 8px 30px;                     /*框架的內邊距:上下-左右*/
      margin-left: 10px;                     /*左側外邊界*/
      cursor: pointer; }                     /*改變滑鼠游標的形狀:手指*/
  .memberCenter #tab3 .shopMoney p {         /*購物金查詢消費*/
    color: #5d9e49;                        /*文字顏色*/
    margin-bottom: 1px;                      /*框架外拉下面距離*/
    font-size: 13px; }                       /*文字尺寸*/
  .memberCenter #tab3 .shopMoney .minus {    /*購物金顏色*/
    color: #F10000; }                      /*文字顏色*/
  .memberCenter #tab3 .flexTableRow {
    align-items: center; }
    .memberCenter #tab3 .flexTableRow .flexCell {
      padding: 13px 5px; }
    .memberCenter #tab3 .flexTableRow .flexCell:nth-child(1) {
      width: 174px; }
    .memberCenter #tab3 .flexTableRow .flexCell:nth-child(2) {
      flex: 1; }
    .memberCenter #tab3 .flexTableRow .flexCell:nth-child(3) {
      width: 168px;
      font-weight: bold; }
    .memberCenter #tab3 .flexTableRow .flexCell:nth-child(4) {
      flex: .9;
      text-align: left; }
  .memberCenter #tab3 .flexTitleRow .flexCell:nth-child(4) {
    text-align: center; }
  .memberCenter #tab4 .m-title {
    display: none; }
  .memberCenter #tab4 .queryCouponStatus {
    margin-bottom: 20px; }
    .memberCenter #tab4 .queryCouponStatus .queryTitle { /*會員中心-折價卷查詢頁*/
      position: relative;                                /*相對位置*/
      padding-right: 21px;                               /*框架內縮右邊距離*/
      display: inline-block;                             /*依照元素中的內容來決定內容的寬高*/
      font-weight: bold;                                 /*文字粗細*/
      margin-right: 10px; }                              /*框架外拉右邊距離*/
    .memberCenter #tab4 .queryCouponStatus .trangleLeft:after {
      right: 0; }
    .memberCenter #tab4 .queryCouponStatus select { 
      width: 150px; }
    .memberCenter #tab4 .queryCouponStatus label {  /*折價卷查詢選單*/
      color: #fff;                                /*查詢文字顏色*/
      background: #61C36E;                        /*查詢按鈕顏色*/
      text-align: center;                           /*文字對齊：置中*/
      width: 100px;                                 /*寬度*/
      height: 42px;                                 /*高度*/
      line-height: 42px;                            /*行高*/
      margin-left: 10px; }                          /*框架外拉左邊距離*/
  .memberCenter #tab4 .couponQuery span.notUsed {   /*折價卷查詢選單-未使用*/
    color: #5d9e49; }
  .memberCenter #tab4 .couponQuery span.used {      /*折價卷查詢選單-使用*/
    color: #f18e00; }
  .memberCenter #tab4 .couponQuery span.overdue {   /*折價卷查詢選單-過期*/
    color: #afafaf; }
  .memberCenter #tab4 .flexTableRow {
    align-items: center; }
    .memberCenter #tab4 .flexTableRow .flexCell:nth-child(1) {
      flex: 1;
      padding-left: 15px;
      padding-right: 15px; }
    .memberCenter #tab4 .flexTableRow .flexCell:nth-child(2) {
      width: 140px; }
    .memberCenter #tab4 .flexTableRow .flexCell:nth-child(3) {
      color: red;
      font-weight: bold; }
    .memberCenter #tab4 .flexTableRow .flexCell:nth-child(3), .memberCenter #tab4 .flexTableRow .flexCell:nth-child(4) {
      width: 105px; }
    .memberCenter #tab4 .flexTableRow .flexCell:nth-child(5), .memberCenter #tab4 .flexTableRow .flexCell:nth-child(6) {
      width: 114px; }
    .memberCenter #tab4 .flexTableRow .flexCell:nth-child(7) {
      width: 125px;
      font-weight: bold; }
  .memberCenter #tab4 .flexTitleRow .flexCell:nth-child(3) {
    color: #333; }
  .memberCenter #tab5 .m-title {
    display: none; }
  .memberCenter #tab5 a {
    text-decoration: underline; }
  .memberCenter #tab5 .flexTableRow .flexCell:nth-child(1) {
    width: 173px; }
  .memberCenter #tab5 .flexTableRow .flexCell:nth-child(2) {
    flex: 1;
    padding-left: 15px;
    padding-right: 15px;
    overflow: hidden; }
    .memberCenter #tab5 .flexTableRow .flexCell:nth-child(2) > div {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap; }
  .memberCenter #tab5 .flexTableRow .flexCell:nth-child(3), .memberCenter #tab5 .flexTableRow .flexCell:nth-child(4) {
    flex: .4; }

.signupContainer {                             /*註冊內容*/
  background: #f1f9f2;                       /*背景顏色*/ 
  padding: 45px 70px;                          /*框架的內邊距:上下-左右*/
  margin-bottom: 40px; }                       /*框架外拉下面距離*/
  .signupContainer .requiredCell:before {      /*註冊資料必填的欄位-前面重要符號(手機版)*/
    content: "*";                              /*必填的符號圖示*/
    color: #009145; }                        /*符號顏色*/
  .signupContainer .editValue input:focus {    /*註冊資料中的外框顏色*/
    border: 1px solid #009145;               /*邊框樣式*/
    outline-color: #61C36E; }                /*外邊框樣式*/
  .signupContainer .editValue .btn {
    width: 70%;
    height: 40px;
    line-height: 40px; }
  .signupContainer .memberEditRow { /*註冊內容-整體寬度調整*/ 
    width: 70%; }                   /*寬度*/
  .signupContainer input {
    width: 70%; }
  .signupContainer select {
    width: 21.5%;
    margin-right: 10px; }
  .signupContainer p {
    margin-top: -15px;
    margin-bottom: 0;
    font-size: 14px; }
  .signupContainer .member_address select {
    display: inline-block;
    margin-bottom: 10px; }
  .signupContainer .checkBox input[type=radio], .signupContainer .checkBox input[type=checkbox], .signupContainer .choiceCell input[type=radio], .signupContainer .choiceCell input[type=checkbox] {
    width: auto; }
  .signupContainer .checkBox label, .signupContainer .choiceCell label {  /*註冊內容-我了解並同意勾選欄文字對齊*/
    margin-bottom: 0; }                                                   /*框架外拉下面距離*/
  .signupContainer .choiceCell {
    margin-right: 20px;
    display: inline-block; }
  .signupContainer .checkBox {
    margin-bottom: 10px; }       
    .signupContainer .checkBox a {  /*加入會員-會員服務條款勾選(網頁版)*/
      margin-left: 5px;             /*框架外拉左邊距離*/
      color: #f18e00;             /*文字顏色*/          
      text-decoration: underline; } /*文字修飾:底線*/
  .signupContainer .verificationCode input {  /*加入會員-驗證碼欄位(網頁版)*/
    width: 150px; }                           /*寬度*/
  .signupContainer .verificationCode img {   /*驗證碼圖片*/
    border: 1px solid #d1c9bb;             /*邊框樣式*/
    height: 42px;                            /*高度*/
    vertical-align: bottom; }                /*垂直對齊:底部*/
  .signupContainer .verificationCode span.reload { /*加入會員-重新整理(網頁版)*/
    color: #009145;                              /*文字顏色#f18e00*/
    text-decoration: underline;                    /*文字修飾:底線*/
    cursor: pointer; }                             /*改變滑鼠游標的形狀:手指*/

.loginContianer {   /*會員登入(網頁版)*/
  font-size: 16px;
  margin-bottom: 40px; }   
  .loginContianer .loginOuter {
    display: flex;
    justify-content: space-between; } /*水平對齊:平均分配元素空間*/
    .loginContianer .loginOuter .left, .loginContianer .loginOuter .right { /*會員登入畫面(網頁版)*/
      flex: none;
      width: 45%;             /*寬度*/
      background: #f1f9f2;  /*背景底色*/
      padding: 30px 0; }      /*內框距離*/
  .loginContianer .loginRow {
    width: 70%;
    margin: 0 auto 20px; }
    .loginContianer .loginRow p {
      margin-bottom: 5px;  
      position: relative;
      font-weight: bold; }
      .loginContianer .loginRow p a {   /*會員登入-輸入欄位(網頁版)*/
        font-size: 13px;                /*文字尺寸*/
        color: #f18e00;               /*忘記密碼/重新整理-文字顏色*/
        text-decoration: underline;     /*文字修飾:底線*/
        position: absolute;             /*相對位置*/
        right: 0;                       /*右邊*/
        bottom: 0; }                    /*底部*/
    .loginContianer .loginRow i {    /*會員登入-輸入欄位前面符號(網頁/手機版)*/
      color: #cec5b7;              /*會員登入-輸入欄位前面符號(網頁/手機版)*/
      margin-left: 5px; }            /*框架外拉左邊距離*/
    .loginContianer .loginRow input {
      width: 100%; }
    .loginContianer .loginRow .verificationCode {
      display: flex; }
      .loginContianer .loginRow .verificationCode input {
        flex: 1;
        margin-right: 10px; }
      .loginContianer .loginRow .verificationCode img {  /*會員登入-驗證碼圖片*/
        flex: none; 
        width: auto;                                     /*寬度*/
        border: 1px solid #d1c9bb;                     /*邊框樣式*/ 
        border-radius: 3px;                              /*新增邊框圓角樣式*/              
        height: 42px;                                    /*高度*/
        vertical-align: bottom; }                        /*垂直對齊:底部*/  
  .loginContianer .btn {               /*會員登入-按鈕*/
    display: block;                    /*彈性容器*/
    width: 70%;                        /*寬度*/
    height: 50px;                      /*高度*/
    line-height: 50px;                 /*行高*/
    margin: 0 auto 20px;
    font-weight: bold; }               /*字體粗細*/
  .loginContianer .facebookBtn {     /*會員登入-以fackbook帳號登入按鈕*/
    background: #4d6baa; }         /*按鈕底色*/
  .loginContianer .signupBtn {       /*會員登入-加入會員按鈕*/
    background: #b1b1b1; }         /*按鈕底色*/
    .loginContianer .signupBtn img { /*會員登入-登入按鈕圖示*/
      margin-right: 5px;             /*圖示外拉右邊距離*/
      border-radius: 0px;}           /*增加圖片圓角*/ 
  .loginContianer hr {               /*會員登入-水平線標籤*/
    width: 70%;                      /*寬度*/
    margin: 0 auto 20px; 
    border-top: none ; }             /*上方分隔線樣式:1px dotted #f18e00*/
  
  .loginContianer .right {           /*會員登入-右邊*/
    display: flex;                   /*彈性容器*/
    align-items: center;             /*對齊選項:置中*/
    justify-content: center; }       /*對齊主軸的中間*/
    .loginContianer .right .content { 
      text-align: center;
      width: 80%;
      margin: 0 auto; }
    .loginContianer .right p {
      margin-bottom: 5px; }
    .loginContianer .right .circle {  /*會員登入-右邊第一次購物圓型底色*/
      padding: 31px 39px;             /*框架的內邊距：上下-左右*/
      border-radius: 100%;            /*邊框圓角樣式*/
      background-color: #DFF2E1;    /*圓型底色*/
      font-size: 24px;                /*文字字級*/
      text-align: center;             /*文字對齊:置中*/
      font-weight: bold;              /*字體粗細*/
      display: inline-block;          /*依照元素中的內容來決定內容的寬高*/
      margin-bottom: 20px; }          /*框架外拉下面距離*/
      .loginContianer .right .circle p {  /*會員登入-第一次購物圓型底色*/
        font-size: 35px;                  /*文字字級*/
        margin-bottom: 0; }               /*框架外拉下面距離*/
    .loginContianer .right .checkoutBtn { /*會員登入-結帳按鈕*/
      background: #df5401;              /*結帳按鈕底色*/
      width: 80%;                         /*寬度*/
      margin-top: 20px; }                 /*框架外拉上面距離*/

.modifyPassword {           /*修改密碼*/
  background: #faf7f2;    /*背景底色*/
  padding: 10px;            /*框架的內邊距*/
  margin-bottom: 40px; }    /*框架外拉下面距離*/
  .modifyPassword .card {   /*修改密碼卡*/
    font-size: 18px;        /*框架的內邊距*/
    border: 0;              /*邊界樣式*/
    background: #f7f0e5;  /*背景底色*/
    margin-bottom: 30px; }  /*框架外拉下面距離*/
  .modifyPassword .card-body {
    padding: 2.5rem; }
  .modifyPassword p {
    margin-bottom: 0; }   
  .modifyPassword .passwordRow {
    width: 530px;
    display: flex;
    margin: 0 auto 20px;
    font-size: 16px; }
    .modifyPassword .passwordRow .title {
      flex: none;
      width: 100px;
      position: relative;
      align-self: center;
      margin-right: 60px;
      text-align: right; }
    .modifyPassword .passwordRow .value {
      flex: 1; }
    .modifyPassword .passwordRow input { /*會員登入-請輸入帳號密碼欄位(網頁版)*/
      border: 1px solid #d1c9bb;       /*邊框樣式*/
      border-radius: 3px;                /*邊框圓角樣式*/
      padding: 8px 10px;                 /*邊框的內邊距：上下-左右*/
      background: #faf7f2; }           /*輸入欄位顏色*/
    .modifyPassword .passwordRow input[type=password] {
      width: 100%; }
    .modifyPassword .passwordRow input[type=text] {
      width: 167px; }
    .modifyPassword .passwordRow .title:after { /*會員登入-請輸入帳號密碼欄位標題後面(網頁版)*/
      content: "\f0da";                         /*內容*/
      font-family: FontAwesome;                 /*字體*/
      display: inline-block;                    /*依照元素中的內容來決定內容的寬高*/
      padding-right: 3px;                       /*框架內縮右邊距離*/
      vertical-align: middle;                   /*垂直對齊:置中*/
      position: absolute;                       /*絕對位置*/ 
      right: -35px;                             /*右邊*/
      top: 3px;                                 /*上面*/
      color: #61c46e;                         /*符號顏色*/
      font-size: 12px; }                        /*文字尺寸*/
    .modifyPassword .passwordRow .sendBtn:after { /*修改密碼發送後按鈕*/
      content: ""; }                      /*內容*/
    .modifyPassword .passwordRow img {    /*修改密碼圖片*/
      border: 1px solid #d1c9bb;        /*邊框樣式*/
      height: 42px;                       /*高度*/
      vertical-align: bottom; }           /*垂直對齊:底部*/
    .modifyPassword .passwordRow .verificationCode span {  /*修改密碼-驗證碼*/
      font-size: 13px;                                     /*文字尺寸*/                             
      color: #f18e00;                                    /*文字顏色*/
      text-decoration: underline;                          /*文字修飾:底線*/
      margin-left: 10px; }                                 /*左側外邊界*/
    .modifyPassword .passwordRow .btnOrange { /*請立即修改您的密碼-送出按鈕*/
      width: 100%;                            /*寬度*/
      height: 45px;                           /*高度*/
      line-height: 45px; }                    /*行高*/

.oderInfo {                      /*訂單資訊*/
  background: #f1f9f2;         /*背景顏色*/
  padding: 43px 70px;            /*框架的內邊距:上下-左右*/
  font-size: 15px;               /*文字尺寸*/
  margin-bottom: 40px; }         /*框架外拉下面距離*/
  .oderInfo textarea {           /*訂單資訊文字區域*/
    border: 1px solid #d1c9bb; /*邊框樣式*/
    border-radius: 3px;          /*邊框圓角樣式*/
    padding: 8px 10px;           /*框架的內邊距:上下-左右*/
    background: #faf7f2;       /*背景顏色*/
    resize: none; }              /*調整大小*/
  .oderInfo section {
    margin-bottom: 40px; } 
  .oderInfo h2 {            /*訂單資訊/付款資訊/收件資訊標題底色*/
    background: #bfeac3;  /*標題底色*/   
    font-size: 18px;        /*文字尺寸*/
    padding: 20px 15px;     /*框架的內邊距：上下-左右*/
    font-weight: bold;      /*字體粗細*/
    margin: 0 0 20px; }     /*框架的外邊界：上-左右-下*/
  .oderInfo .orderNum {     /*訂單編號資訊*/
    color: #28a745;       /*編號顏色*/
    padding: 0 15px; }      /*框架的內邊距:上下-左右*/
    .oderInfo .orderNum span:after { /*訂單編號後面*/
      content: "："; }               /*符號樣式*/
  .oderInfo .listContainer {
    display: flex;
    padding: 0 15px;
    flex-wrap: wrap; }
    .oderInfo .listContainer .listCell { /*訂單資訊儲存格*/
      flex: none;
      width: auto;                       /*寬度*/
      margin-right: 20px;                /*下方邊框樣式*/
      margin-bottom: 10px; }             /*框架外拉下面距離*/
    .oderInfo .listContainer .title, .oderInfo .listContainer .value {
      display: inline-block;
      position: relative; }
    .oderInfo .listContainer .title:after {
      content: "："; }
    .oderInfo .listContainer .listCell:nth-last-child(1) {
      margin-right: 0; }
  .oderInfo .productList {
    margin: 20px 0;
    font-size: 16px; }
  .oderInfo .category > p {   /*訂單資訊類別-未處理*/
    background: #DFF2E1;    /*色塊顏色*/
    padding: 10px 15px;       /*框架的內邊距：上下-左右*/
    margin-bottom: 0; }       /*框架外拉下面距離*/
  .oderInfo .category > section { /*訂單資訊商品清單*/
    background: #fffefb;        /*背景底色*/
    padding: 0 15px; }            /*框架的內邊距：上下-左右*/
  .oderInfo .priceFee {
    padding: 0 15px; }
    .oderInfo .priceFee .productListRow .cell:nth-child(1), .oderInfo .priceFee .productListRow .cell:nth-child(2) {
      flex: none;
      width: 0; }
    .oderInfo .priceFee .productListRow .cell:nth-child(3) {
      flex: 1;
      width: auto;
      text-align: right; }
    .oderInfo .priceFee .productListRow .cell:nth-child(4) {
      width: 20%; }
  .oderInfo .productListRow {  /*訂單資訊商品清單-分隔線*/
    display: flex;             /*彈性容器*/
    padding: 20px 0;           /*框架的內邊距：上下-左右*/
    border-bottom: 1px dotted #009145; }  /*下方邊框樣式*/
    .oderInfo .productListRow .m-title {
      display: none; }
    .oderInfo .productListRow .cell {
      flex: none; }
    .oderInfo .productListRow .cell:nth-child(1) {
      flex: 1;
      margin-right: 10px; }
    .oderInfo .productListRow .cell:nth-child(2) {
      width: 100px;
      text-align: center; }
    .oderInfo .productListRow .cell:nth-child(3), .oderInfo .productListRow .cell:nth-child(4) {
      width: 15%;
      text-align: center; }
    .oderInfo .productListRow .cell:nth-child(4) {
      text-align: right; }
  .oderInfo .titleRow .cell span {
    position: relative; }
  .oderInfo .titleRow .cell span:after { /*訂單資訊-未處理標題列*/
    content: "\f0d7";            /*內容*/
    font-family: FontAwesome;    /*字體*/
    display: inline-block;       /*依照元素中的內容來決定內容的寬高*/
    padding-right: 3px;          /*框架內縮右邊距離*/
    vertical-align: middle;      /*垂直對齊:置中*/
    position: absolute;          /*絕對位置*/
    right: -15px;                /*右邊*/
    top: 3px;                    /*上面*/
    color: #28a745;            /*符號顏色#cec5b7*/
    font-size: 12px; }           /*文字尺寸*/
  .oderInfo .titleRow .cell:nth-child(4) {
    text-align: center; }
  .oderInfo .finalPriceRow {
    font-weight: bold;
    font-size: 18px;
    border-bottom: 0; } 
    .oderInfo .finalPriceRow .cell:nth-child(4) { /*訂單付款資訊-最後價格*/
      color: #ff0000; }                         /*金額顏色*/
  .oderInfo .paymentInfo {
    margin: 20px 0;
    padding: 0 15px; }
    .oderInfo .paymentInfo div {
      display: inline-block;
      margin-right: 40px; }
    .oderInfo .paymentInfo div:nth-last-child(1) {
      margin-right: 0; }
    .oderInfo .paymentInfo .title {
      position: relative; }
    .oderInfo .paymentInfo .title:after { /*訂單付款資訊-標題後面符號*/
      content: "：";        /*符號樣式*/
      margin-right: 5px; }  /*框架外拉右邊距離*/
  .oderInfo .receiveInfo {  /*接收訂單訊息*/
    padding: 0 15px; }      /*框架的內邊距:上下-左右*/
    .oderInfo .receiveInfo .title {
      position: relative; }
    .oderInfo .receiveInfo .title:after { /*接收訂單訊息-標題後面符號*/
      content: "：";        /*符號樣式*/
      margin-right: 5px; }  /*框架外拉右邊距離*/
  .oderInfo .cancelReason {
    padding: 5px 15px; }
    .oderInfo .cancelReason .reasonRow {
      display: flex;
      align-items: center;   
      margin-bottom: 20px; } 
      .oderInfo .cancelReason .reasonRow .title {
        flex: none;
        width: 110px;
        margin-right: 30px;
        font-weight: bold;
        position: relative; }
      .oderInfo .cancelReason .reasonRow .value {
        flex: 1; }
      .oderInfo .cancelReason .reasonRow .title:after { /*取消申請-取消訂單原因後面符號(手機版)*/
        content: "\f0da";                               /*內容*/
        font-family: FontAwesome;                       /*字體*/
        display: inline-block;                          /*依照元素中的內容來決定內容的寬高*/
        padding-right: 3px;                             /*框架內縮右邊距離*/
        vertical-align: middle;                         /*垂直對齊:置中*/
        position: absolute;                             /*絕對位置*/
        right: -9px;                                    /*右邊*/
        top: 3px;                                       /*上面*/
        color: #61c46e;                               /*符號顏色#cec5b7*/
        font-size: 12px; }                              /*文字尺寸*/
      .oderInfo .cancelReason .reasonRow select, .oderInfo .cancelReason .reasonRow textarea {
        width: 50%; }
      .oderInfo .cancelReason .reasonRow textarea {
        height: 100px; }
  .oderInfo .returnReason .reasonRow textarea {
    width: 100%; }
  .oderInfo .returnReason label { /*訂單資訊-退貨原因-"icon+退貨規則"文字*/
    color: #009145;             /*icon+退貨規則文字顏色#f18e00*/
    margin-bottom: 0;             /*框架外拉下面距離*/
    margin-left: 20px;            /*左側外邊界*/
    border: 1px solid #009145;  /*邊框樣式#f18e00*/
    padding: 8px 20px;            /*框架的內邊距:上下-左右*/
    font-weight: bold;            /*字體粗細*/
    cursor: pointer; }            /*改變滑鼠游標的形狀:手指*/
  .oderInfo .returnReason input[type=file] { /*訂單資訊-照片檔案上傳_"未選擇任何檔案"文字*/
    color: #009145;             /*未選擇任何檔案文字顏色#f18e00*/
    display: block;               /*顯示:區塊*/
    margin-bottom: 10px;          /*框架外拉下面距離*/
    border: 1px solid #009145;  /*邊框樣式#f18e00*/
    width: 40%; }                 /*寬度*/
  .oderInfo .buyerInfo {          /*訂單資訊-買家資訊*/
    padding: 0 15px; }            /*框架的內邊距:上下-左右*/
    .oderInfo .buyerInfo .title:after { /*買家資訊後面標題*/
      content: "："; }            /*符號樣式*/
  .oderInfo .QuestionContents {  /*訂單資訊-問題內容*/
    padding: 0 15px; }           /*框架的內邊距:上下-左右*/
    .oderInfo .QuestionContents .qRow {
      display: flex;
      margin-bottom: 20px; }
      .oderInfo .QuestionContents .qRow .title {
        flex: none;
        width: 80px;
        margin-right: 30px;
        position: relative; }
      .oderInfo .QuestionContents .qRow .title:after { /*問問題-詢問內容後面標題*/
        content: "\f0da";             /*內容*/
        font-family: FontAwesome;     /*字體*/  
        display: inline-block;        /*依照元素中的內容來決定內容的寬高*/
        padding-right: 3px;           /*框架內縮右邊距離*/
        vertical-align: middle;       /*垂直對齊:置中*/
        position: absolute;           /*絕對位置*/
        right: -9px;                  /*右邊*/
        top: 3px;                     /*上面*/
        color: #61c46e;             /*符號顏色#cec5b7*/
        font-size: 12px; }            /*文字尺寸*/
      .oderInfo .QuestionContents .qRow .value {
        flex: 1; }
      .oderInfo .QuestionContents .qRow label {
        margin-right: 20px; 
        margin-bottom: 0; }
        .oderInfo .QuestionContents .qRow label input[type=radio] {
          margin-right: 5px; }
      .oderInfo .QuestionContents .qRow label:nth-last-child(1) {
        margin-right: 0; }
      .oderInfo .QuestionContents .qRow textarea {
        width: 100%;
        height: 100px; }
  .oderInfo .bottomBtn .btn {  /*訂單資訊-送出按鈕*/
    height: 45px;              /*高度*/
    width: 200px;              /*寬度*/
    line-height: 20px; }       /*行高45px*/
    /*按鈕顏色=btnOrange*/
  .oderInfo .bottomBtn .sendBtn { /*訂單資訊-回訂單查詢按鈕*/
    background: #b1b1b1;         /*按鈕顏色*/
    margin-right: 20px; }          /*框架外拉右邊距離*/

.returnFinish {             /*返回完成*/
  background: #faf7f2;    /*顏色*/
  padding: 43px 70px;       /*框架的內邊距：上下-左右*/
  font-size: 16px;          /*文字尺寸*/
  margin-bottom: 40px; }    /*框架外拉下面距離*/
  .returnFinish h1 {
    font-size: 21px;
    text-align: center;
    font-weight: bold;
    margin-bottom: 40px; }   
  .returnFinish .line {
    display: none; }
  .returnFinish .QRCode, .returnFinish .line {
    width: 75px;
    margin: 20px auto; }
    .returnFinish .QRCode img, .returnFinish .line img {
      width: 100%; }
  .returnFinish hr {       /*返回完成標題*/   
    border-top: 1px dotted #009145;  /*上方邊框樣式#f18e00*/
    margin: 40px 0; }      /*框架的外邊界：上下-左右*/
  .returnFinish .bottomBtn .btn { /*返回完成底部按鈕*/  
    height: 45px;                 /*高度*/
    width: 200px;                 /*寬度*/
    line-height: 45px;            /*行高*/
    background: #b1b1b1; }      /*按鈕顏色*/

.replyInfo {               /*客服回覆內容對話框*/
  background: #f1f9f2;   /*背景顏色#faf7f2*/
  padding: 43px 17px;     /*框架的內邊距：上下-左右*/
  border: 1px solid #61c36e; /*新增邊框樣式*/
  font-size: 18px;         /*文字尺寸*/
  margin-bottom: 40px;     /*框架外拉下面距離*/
  position: relative;      /*相對位置*/
  z-index: 0; }            /*元素的堆疊順序*/

  .replyInfo h1 {          /*客服回覆內容*/
    text-align: center;    /*文字對齊：置中*/
    border-bottom: 1px dotted #61c36e;  /*下方邊框樣式-分隔線*/
    font-size: 18px;        /*日期尺寸*/
    color: #009145;       /*日期顏色*/
    padding-bottom: 10px;   /*框架內縮底部距離*/
    margin: 0 0 20px;  }    /*框架的外邊界：上-左右-下*/
  
  .replyInfo .dialogueRow {
    margin-bottom: 10px; }   
    .replyInfo .dialogueRow p {
      margin-bottom: 5px;   
      font-size: 14px; }
    .replyInfo .dialogueRow .dialogueCell { 
      display: inline-block;
      min-width: 350px;
      max-width: 450px;
      padding: 15px 30px;
      text-align: left;
      border-radius: 50px;  
      position: relative;
      word-wrap: break-word; }
  .replyInfo .client {
    text-align: right;
    padding-right: 10px; }
    .replyInfo .client .dialogueCell {  /*客服回覆內容對話框-您的詢問*/
      background-color: #dff2e1; }    /*對話框背景顏色*/
    .replyInfo .client .dialogueCell:after {  /*回覆訊息客戶對話框後面*/
      content: "";                            /*內容*/
      position: absolute;                     /*絕對位置*/ 
      right: -7px;                            /*右邊*/
      bottom: 0;                              /*底部*/
      width: 50px;                            /*寬度*/
      height: 50px;                           /*高度*/
      background-image: url(../img/icon/Messagebubble3.png?v=1);  /*背景圖片*/
      background-repeat: no-repeat;           /*背景重複*/ 
      background-size: 100% 100%;             /*背景大小*/
      z-index: -1; }                          /*元素的堆疊順序*/
  .replyInfo .service {
    text-align: left;
    padding-left: 10px; }
    .replyInfo .service img {
      vertical-align: bottom;
      margin-right: 5px;
      width: 25px; }
    .replyInfo .service .dialogueCell { /*回覆訊息服務對話框*/
      background-color: #ffffff; }    /*背景顏色*/
    .replyInfo .service .dialogueCell:before {  /*回覆訊息服務對話框之前樣式*/
      content: "";                              /*內容*/
      position: absolute;                       /*絕對位置*/
      left: -9px;                               /*左邊*/
      bottom: 0;                                /*底部*/
      width: 50px;                              /*寬度*/
      height: 50px;                             /*高度*/
      background-image: url(../img/icon/Messagebubble5.png?v=1);  /*背景圖片*/
      background-repeat: no-repeat;             /*背景重複*/
      background-size: 100% 100%;               /*背景大小*/
      z-index: -1; }                            /*元素的堆疊順序*/
  .replyInfo hr {                      /*回覆訊息*/
    border-top: 1px dotted #009145;  /*上方邊框樣式*/
    margin-top: 1.5rem;         /*框架外拉上面距離*/
    margin-bottom: 1.5rem; }   /*框架外拉下面距離*/
  .replyInfo .moreBtn {        /*更多按鈕*/
    background: #b1b1b1;     /*背景顏色*/
    margin-right: 20px; }      /*框架外拉右邊距離*/
  .replyInfo .btn {
    padding: 7px 0;
    width: 200px; }
  .replyInfo .moreQuestion {
    display: none; }
  .replyInfo textarea  {          /*客服回覆內容對話框-請輸入您的問題*/
    resize: none;                 /*調整大小*/
    width: 100%;                  /*寬度*/
    height: 200px;                /*高度min-height:200px*/
    margin: 20px 0;               /*框架的外邊界：上下-左右*/
    border: 1px solid #caeece;  /*邊框樣式#d1c9bb*/
    border-radius: 3px;           /*邊框圓角樣式*/
    padding: 8px 10px;            /*框架的內邊距：上下-左右*/
    background: #FFF; }         /*背景顏色*/

.faqCenter.tabSwitch {    
  margin-bottom: 40px; }   
  .faqCenter.tabSwitch ul.nav-tabs .nav-link.active { /*常見問題標籤按鈕-游標點擊後的動態變化*/
    background-color: #f1f9f2;                      /*標籤按鈕底色*/
    padding-bottom: 9px;                              /*框架內縮底部距離*/
    padding-top: 7px;                                 /*框架內縮上面距離8px*/
    border-color: #009145 #009145 #f1f9f2; }   /*邊框樣式設定:上-左右-下*/
  .faqCenter.tabSwitch ul.nav-tabs .nav-item {
    padding-left: 15px; }
  .faqCenter.tabSwitch .m-memberTitle {
    display: none; }
  .faqCenter.tabSwitch .tab-content {  /*常見問題選項內容頁*/
    background-color: #f1f9f2;       /*內容背景底色*/
    padding: 45px 70px; }              /*框架的內邊距：上下-左右*/
  .faqCenter.tabSwitch .q-block {        /*常見問題選項題目圖示*/
    border-bottom: 2px dotted #009145; /*下面分隔線樣式*/
    padding: 20px 0 15px;                /*框架的內邊距：上下-左右*/
    font-size: 15px; }                   /*文字尺寸*/
    .faqCenter.tabSwitch .q-block img {  /*常見問題選項題目圖示*/
      margin-right: 5px; }               /*圖示外拉右邊距離*/
    .faqCenter.tabSwitch .q-block h2 {   /*常見問題選項題目*/
      color: #009145;                  /*題目文字顏色*/
      font-size: 20px;                   /*問題文字字級 18px*/
      font-weight: bold }                /*題目文字粗細*/
    .faqCenter.tabSwitch .q-block .ans {
      padding-left: 30px; }
    .faqCenter.tabSwitch .q-block p {
      margin-bottom: 5px; }  

.customerService {              /*聯絡客服/合作開發*/
  font-size: 16px;              /*文字尺寸*/
  background-color: #f1f9f2;  /*背景顏色*/
  padding: 10px 0;              /*框架的內邊距：上下-左右*/
  margin-bottom: 80px; }        /*框架外拉下面距離40px*/
  .customerService .top {
    margin-bottom: 40px; }
  .customerService .top img { /*客戶服務上面圖片*/
    width: 100%;              /*寬度*/
    border-radius: 15px !important;  /*圖片圓角樣式*/
    padding: 13PX 18px 15px;         /*框架的內邊距：上15px-左右15px-下15px*/
    margin-top: 20px;  }             /*框架外拉上面距離*/
  .customerService .formRow { 
    width: 580px;
    margin: 0 auto 20px;
    display: flex;
    align-items: center; }  
    .customerService .formRow > .title { 
      flex: none;
      width: 165px;
      position: relative;
      text-align: right;
      margin-right: 40px;            
      font-weight: bold; }
    .customerService .formRow > .value {
      flex: 1; }
      .customerService .formRow > .value > div {
        margin-bottom: 10px; }
      .customerService .formRow > .value > div:nth-child(2) {
        margin-bottom: 0; }
      .customerService .formRow > .value img {
        margin-right: 5px; }
  .customerService input {             
    width: 100%; }
  .customerService input[type=radio] { 
    width: auto; }
  .customerService input[type=file] {  /*聯絡客服-附加檔案*/
    margin-bottom: 10px;               /*框架外拉下面距離*/
    border: 1px solid #5d9e49; }     /*邊框樣式*/
  .customerService input:focus {       /*客戶服務-輸入重點*/
    border: 1px solid #009145;       /*邊框樣式*/
    outline: 1px solid #61C36E; }    /*外邊框樣式*/
  .customerService p {
    font-size: 13px;
    margin-bottom: 0;                 
    font-weight: bold; }
  .customerService .trangleLeft:after { /*聯絡客服後面資訊符號*/
    content: "\f0da";                   /*內容*/
    font-family: FontAwesome;           /*字體*/
    display: inline-block;              /*依照元素中的內容來決定內容的寬高*/
    padding-right: 3px;                 /*框架內縮右邊距離*/
    vertical-align: middle;             /*垂直對齊:置中*/
    position: absolute;                 /*絕對位置*/
    right: -25px;                       /*右邊*/
    top: 3px;                           /*上面*/
    color: #61c46e;                   /*符號顏色*/
    font-size: 12px; }                  /*文字尺寸*/
  .customerService .requiredCell:before { /*聯絡客服必填的欄位-前面重要符號*/
    content: "*";                         /*必填的符號圖示*/          
    color: #009145; }                   /*符號顏色*/
  .customerService label {
    margin-bottom: 0;
    margin-right: 20px; }
  .customerService .alignFix {
    align-self: flex-start;
    padding-top: 10px; }
  .customerService .alignFix:after {
    top: 13px; }
  .customerService textarea {
    width: 100%;
    height: 100px; }
  .customerService .verificationCode {
    margin-bottom: 0; }
    .customerService .verificationCode input { /*聯絡客服驗證碼輸入*/
      width: 150px; }                          /*寬度*/
    .customerService .verificationCode img {   /*聯絡客服驗證碼片*/
      border: 1px solid #d1c9bb; /*邊框樣式*/
      height: 42px;                /*高度*/
      vertical-align: bottom; }    /*垂直對齊:底部*/
    .customerService .verificationCode span.reload { /*聯絡客服-重新整理*/
      color: #f18e00;            /*文字顏色*/
      text-decoration: underline;  /*文字修飾:底線*/
      cursor: pointer; }           /*改變滑鼠游標的形狀:手指*/
  .customerService .btnOrange {
    width: 100%;
    height: 40px;
    line-height: 40px; }

.cooperation section {
  padding: 0 105px;
  margin-bottom: 40px;
  font-weight: bold;
  font-size: 18px; }

.cooperation input, .cooperation select, .cooperation textarea {
  width: 80%; }

.cooperation input.name {
  margin-bottom: 10px; }

.cooperation input[type=checkbox] {
  width: auto; }

.cooperation .member_address select {
  width: 140px;
  margin-bottom: 10px; }

.cooperation #labelInput {
  width: 150px;
  padding: 3px 5px; }

.cooperation .formRow {
  width: 60%; }

.loginFb {
  background: #faf7f2;
  padding: 20px;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 40px; }
  .loginFb .btnOrange {
    width: 150px;
    height: 40px;
    line-height: 40px; }
  .loginFb .fbIcon {
    width: 30px;
    height: 30px;
    line-height: 30px;
    color: #fff;
    background: #4d6baa;
    display: inline-block;
    text-align: center;
    border-radius: 50%; 
    font-size: 18px;
    margin-left: 5px; }
  .loginFb .fbIcon {  
    color: #fff;
    background: #000;  
  }
  .loginFb p {
    margin-bottom: 10px; }
  .loginFb label {
    margin-bottom: 0;
    display: inline; }
  .loginFb p.greenColor {
    font-size: 19px; }
  .loginFb input:active, .loginFb input:focus {  /*登入fb會員-游標點擊後的動態變化*/ 
    outline: 1px solid #61C36E;               /*外邊框樣式*/
    border: 1px solid #009145; }              /*邊框樣式*/
  .loginFb .loginFbContainer {
    width: 530px;
    margin: 0 auto; }
  .loginFb .collapseOuter > div {
    margin-bottom: 10px; }          /*框架外拉下面距離*/
    .loginFb .collapseOuter > div > input[type=radio] {
      margin-right: 10px; }         /*框架外拉右邊距離*/
  .loginFb .ansOuter {              /*正常情況下顯示狀態*/
    border-bottom: 2px dotted #009145; /*下方邊框樣式*/
    margin-bottom: 20px;            /*框架外拉下面距離*/
    margin-top: 20px;               /*框架外拉上面距離*/
    display: none; }
  .loginFb .ansRow {
    display: flex;
    align-items: center;
    margin-bottom: 20px; }
    .loginFb .ansRow .title {
      width: 90px;
      flex: none;
      text-align: right;
      margin-right: 40px;
      position: relative; }
    .loginFb .ansRow .value {
      flex: 1; }
      .loginFb .ansRow .value input {
        width: 100%; }
      .loginFb .ansRow .value input[type=radio], .loginFb .ansRow .value input[type=checkbox] {
        width: auto; }
      .loginFb .ansRow .value label {
        margin-right: 20px; }
    .loginFb .ansRow .alignFix {
      align-self: flex-start;
      padding-top: 10px; }
  .loginFb select {
    margin-right: 10px;
    width: 30%;
    margin-bottom: 10px; }
  .loginFb select:nth-last-child(1) {
    margin-right: 0; }
  .loginFb p.orangeColor {
    font-size: 14px; }
  .loginFb .trangleLeft:after { /*登入Fb-左邊後面符號*/
    content: "\f0da";           /*內容*/
    font-family: FontAwesome;   /*字體*/
    display: inline-block;      /*依照元素中的內容來決定內容的寬高*/
    padding-right: 3px;         /*框架內縮右邊距離*/
    vertical-align: middle;     /*垂直對齊:置中*/
    position: absolute;         /*絕對位置*/
    right: -25px;               /*右邊*/
    top: 3px;                   /*上面*/
    color: #61c46e;           /*符號顏色*/
    font-size: 12px; }          /*文字尺寸*/
  .loginFb .alignFix:after {
    padding-top: 10px; } 
  .loginFb label.termCheck {
    display: block;
    margin-bottom: 10px; }
    .loginFb label.termCheck a {   /*登入Fb標籤檢查*/
      color: #f18e00;            /*顏色*/
      text-decoration: underline;  /*文字修飾:底線*/
      margin-left: 5px; }          /*左側外邊界*/

@media (max-width: 1200px) {
  .memberCenter ul.nav-tabs .nav-item {
    padding-left: 10px; }
  .signupContainer .editValue .btn {
    width: 100%; }
  .signupContainer .memberEditRow {
    width: 100%; }
  .signupContainer input {
    width: 100%; }
  .signupContainer select {
    width: 30%; }
  .replyInfo {
    padding: 35px 80px; } }

@media (max-width: 992px) {
  .memberCenter .memberWelcom, .memberCenter .logout {
    display: block;
    font-weight: bold;
    font-size: 18px;
    padding: 0 20px; }
  .memberCenter .logout {
    margin-bottom: 0; }
  .memberCenter ul.nav-tabs {
    display: none; }
  .memberCenter .tab-content { /*會員中心選項內容-(手機版)*/
    background: #f1f9f2;        /*背景底色*/
    padding: 10px 20px; }      /*框架的內邊距:上下-左右*/
  .memberCenter .tab-pane {
    margin-bottom: 40px;
    margin-top: 20px; }
  .memberCenter .m-memberTitle {
    display: block; }
    .memberCenter .m-memberTitle h2 { /*會員中心選項內容-(手機版)*/
      position: relative;             /*相對位置*/
      background: #fff;             /*選單欄位底色*/
      border: 1px solid #28a745;    /*邊框樣式(填寫時)*/
      padding: 10px 15px;             /*框架的內邊距:上下-左右*/
      text-align: center;             /*文字對齊:置中*/
      color: #009145;               /*文字顏色*/
      font-weight: bold;              /*字體粗細*/
      font-size: 26px;                /*文字尺寸*/
      cursor: pointer; }              /*改變滑鼠游標的形狀:手指*/
      .memberCenter .m-memberTitle h2 span.collapseArrow { /*會員中心右邊 "━"折疊箭頭設定(手機版)*/
        display: inline-block;        /*依照元素中的內容來決定內容的寬高*/
        width: 20px;                  /*寬度*/
        height: 4px;                  /*高度*/  
        background: #61C36E;        /*顏色*/
        float: right;                 /*浮動：右邊*/
        position: relative;           /*相對位置*/
        top: 13px; }                  /*上面*/
      .memberCenter .m-memberTitle h2 span.collapseArrow:after { /*會員中心右邊 "┃"折疊箭頭設定(手機版)*/
        content: "";                   /*內容*/
        display: inline-block;         /*依照元素中的內容來決定內容的寬高*/
        width: 4px;                    /*寬度*/
        height: 20px;                  /*高度*/
        background: #61C36E;         /*顏色*/
        position: absolute;            /*絕對位置*/
        top: -8px;                     /*上面*/
        left: 8px; }                   /*左邊*/
      .memberCenter .m-memberTitle h2 span.collapseMinus:after {
        content: "";
        display: inline-block;
        width: 4px;
        height: 20px;
        background: transparent;
        position: absolute;
        top: -8px;
        left: 8px; }
  .memberCenter #tab2 .orderQuery .orderQueryRow > div {
    display: block;
    margin-right: 0;
    margin-bottom: 20px; }
  .memberCenter #tab2 .orderQuery .orderQueryRow .queryTitle {
    width: 95px;
    text-align: right; }
  .memberCenter #tab2 .orderQuery .orderQueryRow select {
    margin-left: 10px; }
  .memberCenter #tab2 .orderQuery .orderQueryRow label {
    margin-left: 110px;
    width: 150px;
    text-align: center; }
  .memberCenter #tab2 .orderQuery .orderList { /*會員中心-訂單查詢列表分隔線(手機版)*/
    margin-top: 20px;                   /*框架外拉上面距離*/
    border-top: 2px dotted #61C36E;   /*上方邊框樣式*/
    padding-top: 15px; }                /*框架內縮上面距離*/
    .memberCenter #tab2 .orderQuery .orderList .flexTableRow {
      flex-direction: column;
      font-size: 18px;
      margin-bottom: 20px;
      padding-bottom: 20px; }
      .memberCenter #tab2 .orderQuery .orderList .flexTableRow > .flexCell {
        text-align: left;
        padding: 5px 0;
        font-weight: bold; }
      .memberCenter #tab2 .orderQuery .orderList .flexTableRow > .flexCell:nth-child(1) a {
        color: #5d9e49; }
      .memberCenter #tab2 .orderQuery .orderList .flexTableRow .flexCell:nth-last-child(1) {
        text-align: center;
        padding-left: 105px; }
        .memberCenter #tab2 .orderQuery .orderList .flexTableRow .flexCell:nth-last-child(1) > div {
          border-right: 0;     
          flex: none;
          width: auto;
          margin-right: 20px; }
    .memberCenter #tab2 .orderQuery .orderList .m-title {
      position: relative;
      display: inline-block;
      margin-right: 20px;
      width: 80px;
      text-align: right; }
    .memberCenter #tab2 .orderQuery .orderList .trangleLeft:after {
      right: -17px; }
  .memberCenter #tab2 .flexTitleRow {
    display: none; }
  .memberCenter #tab3 .moneyQuery, .memberCenter #tab3 h2 {  /*會員中心-金額查詢(手機版)*/
    border-bottom: 1px dotted #009145;  /*下方邊框樣式*/
    padding-bottom: 20px; }
  .memberCenter #tab3 .moneyQuery label {
    display: block;
    margin: 10px 0 0 130px;
    width: 200px;
    text-align: center; }
  .memberCenter #tab3 .shopMoney p {
    font-size: 15px;
    font-weight: bold; }
  .memberCenter #tab3 .shopMoney .trangleLeft:after {
    right: 3px; }
  .memberCenter #tab3 .flexTitleRow {
    display: none; }
  .memberCenter #tab3 .m-title {
    display: inline-block;
    position: relative;
    margin-right: 30px;
    width: 60px;
    text-align: right;
    font-weight: bold; }
  .memberCenter #tab3 .flexTableRow {
    flex-direction: column;
    font-size: 18px; }
    .memberCenter #tab3 .flexTableRow .trangleLeft:after {
      right: -15px; }
    .memberCenter #tab3 .flexTableRow .flexCell {
      padding: 13px 5px;
      font-weight: bold; }
    .memberCenter #tab3 .flexTableRow > .flexCell {
      text-align: left;
      display: flex; }
      .memberCenter #tab3 .flexTableRow > .flexCell > div {
        flex: 1; }
    .memberCenter #tab3 .flexTableRow .flexCell:nth-child(1) {
      flex: 1;
      width: 100%; }
    .memberCenter #tab3 .flexTableRow .flexCell:nth-child(2) {
      width: 100%; }
    .memberCenter #tab3 .flexTableRow .flexCell:nth-child(3) {
      flex: 1;
      width: 100%; }
    .memberCenter #tab3 .flexTableRow .flexCell:nth-child(4) {
      flex: 1;
      width: 100%; }
  .memberCenter #tab4 .flexTitleRow {
    display: none; }
  .memberCenter #tab4 .m-title {
    display: inline-block;
    position: relative;
    margin-right: 30px;
    width: 80px;
    text-align: right;
    font-weight: bold; }
  .memberCenter #tab4 .trangleLeft:after {
    right: -20px; }
  .memberCenter #tab4 .flexTableRow {
    flex-direction: column;
    font-size: 18px;
    padding-bottom: 20px;
    margin-bottom: 20px; }
    .memberCenter #tab4 .flexTableRow .flexCell {
      display: flex;
      text-align: left;
      padding-top: 5px; 
      padding-bottom: 5px; }
      .memberCenter #tab4 .flexTableRow .flexCell div {
        flex: 1; }
    .memberCenter #tab4 .flexTableRow .flexCell:nth-child(1) {
      width: 100%;
      padding-left: 0;
      padding-right: 0; }
    .memberCenter #tab4 .flexTableRow .flexCell:nth-child(3) .m-title {
      color: #333; }
    .memberCenter #tab4 .flexTableRow .flexCell:nth-child(2), .memberCenter #tab4 .flexTableRow .flexCell:nth-child(3), .memberCenter #tab4 .flexTableRow .flexCell:nth-child(4), .memberCenter #tab4 .flexTableRow .flexCell:nth-child(5), .memberCenter #tab4 .flexTableRow .flexCell:nth-child(6), .memberCenter #tab4 .flexTableRow .flexCell:nth-child(7) {
      width: 100%;
      flex: 1; }
  .memberCenter #tab5 .flexTitleRow {
    display: none; }
  .memberCenter #tab5 .m-title {
    display: inline-block;
    position: relative;
    margin-right: 30px;
    width: 120px;
    text-align: right;
    font-weight: bold; }
  .memberCenter #tab5 .trangleLeft:after {
    right: -20px; }
  .memberCenter #tab5 .flexTableRow {
    flex-direction: column;
    font-size: 18px;
    padding-bottom: 20px;
    margin-bottom: 20px; }
    .memberCenter #tab5 .flexTableRow .flexCell { 
      display: flex;  
      padding-top: 5px;
      padding-bottom: 5px; }
      .memberCenter #tab5 .flexTableRow .flexCell div {
        flex: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap; }
    .memberCenter #tab5 .flexTableRow .flexCell:nth-child(1), .memberCenter #tab5 .flexTableRow .flexCell:nth-child(2), .memberCenter #tab5 .flexTableRow .flexCell:nth-child(3), .memberCenter #tab5 .flexTableRow .flexCell:nth-child(4) {
      flex: 1;
      width: 100%;
      text-align: left;
      padding-left: 0;
      padding-right: 0; }
  .loginContianer .loginOuter .left, .loginContianer .loginOuter .right {
    width: 48%; }
  .loginContianer .loginRow {
    width: 80%; }
  .loginContianer .btn {
    width: 80%; }
  .loginContianer hr {
    width: 80%; }
  .loginContianer .right .content {
    width: 80%; }
  .loginContianer .right .checkoutBtn {
    width: 100%; }
  .oderInfo {
    padding: 30px 40px; }
  .faqCenter.tabSwitch ul.nav-tabs {
    font-size: 16px; }
  .faqCenter.tabSwitch .tab-content {
    padding: 30px; }
  .cooperation section {
    padding: 0 50px; }
  .cooperation .formRow {
    width: 70%; } }

@media (max-width: 768px) {
  .signupContainer {
    padding: 35px 10px; }
    .signupContainer select {
      width: 28%;
      padding: 5px 3px; }
  .loginContianer .loginOuter {
    flex-direction: column; }
    .loginContianer .loginOuter .left, .loginContianer .loginOuter .right {
      width: 100%;
      margin-bottom: 30px; }
  .modifyPassword .passwordRow {
    width: 90%; }
    .modifyPassword .passwordRow input[type=text] {
      width: 36%; }
  .oderInfo {
    padding: 20px 35px; }
    .oderInfo .productList {
      padding: 0 10px; }
    .oderInfo .category > section {
      padding: 0; }
    .oderInfo .priceFee {
      padding: 0; }
    .oderInfo .productListRow {
      border-bottom: 0; 
      padding: 10px; }
      .oderInfo .productListRow .cell:nth-child(1), .oderInfo .productListRow .cell:nth-child(2) {
        flex: none;
        width: 0;
        margin-right: 0; }
      .oderInfo .productListRow .cell:nth-child(3) {
        flex: 1;
        text-align: right;
        font-weight: bold; }
      .oderInfo .productListRow .cell:nth-child(4) {
        width: 25%; }
    .oderInfo .m-productListRow {             /*訂單資訊商品清單-分隔線(手機版)*/
      flex-direction: column;                 /*交錯軸線位置與主軸線位置調換呈現直向排列*/
      border-bottom: 1px dotted #009145; }  /*下方邊框樣式*/
      .oderInfo .m-productListRow .m-title {
        display: inline-block;
        margin-right: 20px;
        position: relative; }
      .oderInfo .m-productListRow .m-title:after { /*訂單資訊-未處理後面符號(手機版)*/
        content: "\f0da";                          /*內容*/
        font-family: FontAwesome;                  /*字體*/
        display: inline-block;                     /*依照元素中的內容來決定內容的寬高*/
        padding-right: 3px;                        /*框架內縮右邊距離*/
        vertical-align: middle;                    /*垂直對齊:置中*/
        position: absolute;                        /*絕對位置*/
        right: -16px;                              /*右邊*/
        top: 3px;                                  /*上面*/
        color: #61c46e;                          /*符號顏色*/
        font-size: 12px; }                         /*文字尺寸*/
      .oderInfo .m-productListRow .cell:nth-child(1) {
        font-size: 18px; }
      .oderInfo .m-productListRow .cell:nth-child(1), .oderInfo .m-productListRow .cell:nth-child(2), .oderInfo .m-productListRow .cell:nth-child(3), .oderInfo .m-productListRow .cell:nth-child(4) {
        width: 100%;
        text-align: left;
        margin-right: 0;
        margin-bottom: 10px;
        font-weight: bold; }
    .oderInfo .titleRow {
      display: none; }
    .oderInfo .finalPriceRow {
      font-weight: bold;
      font-size: 18px;
      border-bottom: 0; } 
      .oderInfo .finalPriceRow .cell:nth-child(4) {
        color: #ff0000; }
    .oderInfo .paymentInfo {
      margin: 20px 0;
      padding: 0 15px; }
      .oderInfo .paymentInfo div {
        display: inline-block;
        margin-right: 40px; }
    .oderInfo .receiveInfo {
      padding: 0 15px; }
    .oderInfo .cancelReason .reasonRow select, .oderInfo .cancelReason .reasonRow textarea {
      width: 100%; }
    .oderInfo .returnReason .reasonRow select {
      width: 50%; }
    .oderInfo .returnReason input[type=file] {
      width: 100%; }
    .oderInfo .bottomBtn .btn { /*訂單資訊-回訂單查詢/送出文字對齊(手機版)*/
      height: 45px;             /*高度*/
      width: 40%;               /*寬度*/
      line-height: 25px; }      /*行高45px*/ 
       /*送出按鈕顏色=btnOrange */
  .faqCenter.tabSwitch .collapseArrow {       /*問與答欄位選項"━━"符號(手機版)*/
    display: inline-block;                    /*依照元素中的內容來決定內容的寬高*/
    width: 20px;                              /*寬度*/
    height: 4px;                              /*高度*/
    background: #009145;                    /*選項符號"━━"顏色*/
    float: right;                             /*浮動：右邊*/
    position: relative;                       /*依照元素中的內容來決定內容的寬高*/
    top: 13px; }                              /*上面*/
  .faqCenter.tabSwitch .collapseArrow:after { /*問與答欄位選項"┃"符號(手機版)*/
    content: "";                              /*內容*/
    display: inline-block;                    /*依照元素中的內容來決定內容的寬高*/
    width: 4px;                               /*寬度*/ 
    height: 20px;                             /*高度*/ 
    background: #009145;                    /*選項符號"┃"顏色*/
    position: absolute;                       /*絕對位置*/
    top: -8px;                                /*上面*/
    left: 8px; }                              /*左邊*/ 
  .faqCenter.tabSwitch .collapseMinus:after {
    background: transparent; }
  .faqCenter.tabSwitch ul.nav-tabs {
    display: none; }
  .faqCenter.tabSwitch .tab-content {  /*問與答欄位選項內容(手機版)*/
    background-color: #f1f9f2;       /*欄位選項底色*/
    padding: 15px; }                   /*框架的內邊距*/
  .faqCenter.tabSwitch .tab-pane {
    margin-bottom: 40px; }           
  .faqCenter.tabSwitch .m-memberTitle {
    display: block; }
    .faqCenter.tabSwitch .m-memberTitle h2 {    /*問與答欄位選項內容(手機版)*/
      position: relative;                       /*相對位置*/
      background: #f1f9f2;                    /*欄位選項底色#f1f9f2*/
      border: 1px solid #009145;              /*欄位選項邊框樣式*/
      padding: 10px 15px;                       /*框架的內邊距:上下-左右*/
      text-align: center;                       /*文字對齊:置中*/
      color: #009145;                         /*欄位選項文字顏色*/
      font-weight: bold;                        /*欄位選項文字粗細*/
      font-size: 26px;                          /*文字尺寸*/
      cursor: pointer; }                        /*改變滑鼠游標的形狀:手指*/
  .customerService .formRow {
    width: 90%; }
    .customerService .formRow > .title {
      width: 110px; }
  .customerService .verificationCode input {
    width: 90px; }
  .loginFb .loginFbContainer {
    width: 100%; }
  .loginFb select {
    width: 29%; } }

@media (max-width: 576px) {
  .memberCenter .memberWelcom, .memberCenter .logout {
    font-size: 16px;
    padding: 0; }
  .memberCenter .tab-content {   /*會員中心欄位選項內容(手機版)*/
    padding: 10px 0; }           /*框架的內邊距*/
  .memberCenter .memberEditRow {
    width: 100%; }
    .memberCenter .memberEditRow .editTitle {
      width: 85px; }
    .memberCenter .memberEditRow .editValue {
      margin-left: 30px;
      word-break: break-all; }
  .memberCenter .trangleLeft:after {
    padding-right: 0;
    right: -17px; }
  .memberCenter #tab1 input {
    width: 80%; }
  .memberCenter #tab3 .moneyQuery .trangleLeft {
    width: 100px;
    text-align: right;
    top: 15px; }
  .memberCenter #tab3 .moneyQuery .trangleLeft:after {
    right: 5px;
    top: 15px; }
  .memberCenter #tab3 .moneyQuery input {
    width: 130px; }
  .memberCenter #tab3 .moneyQuery label {
    margin: 10px 0 0 105px; }
  .memberCenter #tab4 .queryCouponStatus select {
    width: 60%; }
  .memberCenter #tab4 .queryCouponStatus label {
    display: block;
    margin-left: 100px;
    margin-top: 10px;
    width: 150px; }
  .signupContainer .memberEditRow .editValue {
    margin-left: 30px; }
  .signupContainer .trangleLeft:after {
    right: -20px; }
  .signupContainer select {
    margin-right: 5px; }
  .signupContainer .member_address select {
    width: 32%; }
  .signupContainer .verificationCode input {
    width: 80px; }
  .signupContainer .verificationCode span.reload {
    font-size: 14px; }
  .modifyPassword .passwordRow {
    width: 95%; }
    .modifyPassword .passwordRow .title {
      width: 80px;
      margin-right: 40px; }
    .modifyPassword .passwordRow .title:after {
      right: -25px; }
    .modifyPassword .passwordRow input[type=text] {
      width: 35%; }
    .modifyPassword .passwordRow .verificationCode span {
      display: block;
      margin-left: 0;
      margin-top: 10px; }
  .oderInfo {                  /*訂單資訊(手機版)*/
    padding: 20px 0;           /*框架的內邊距：上下-左右*/
    background: #f1f9f2; }   /*背景底色*/
    .oderInfo h2 {             /*訂單資訊-標題色塊(手機版)*/
      background: #bfeac3;   /*標題底色*/
      padding: 15px; }         /*框架的內邊距*/
    .oderInfo .category > p {  /*訂單資訊類別-未處理(手機版)*/
      background: #DFF2E1; } /*背景底色*/
    .oderInfo .category > section {  
      padding: 0; }
    .oderInfo .category .productListRow .cell:nth-child(4) {
      width: 100%; }
    .oderInfo .orderNum span { /*訂單編號資訊(手機版)*/
      position: relative;      /*相對位置*/
      margin-right: 20px; }    /*框架外拉右邊距離*/
    .oderInfo .orderNum span:after { /*訂單編號後面符號(手機版)*/
      content: "\f0da";              /*內容*/
      font-family: FontAwesome;      /*字體*/
      display: inline-block;         /*依照元素中的內容來決定內容的寬高*/
      padding-right: 3px;            /*框架內縮右邊距離*/
      vertical-align: middle;        /*垂直對齊:置中*/
      position: absolute;            /*絕對位置*/
      right: -15px;                  /*右邊*/
      top: 3px;                      /*上面*/
      color: #28a745;              /*符號顏色*/
      font-size: 12px; }             /*文字尺寸*/
    .oderInfo .listContainer {
      flex-direction: column; }
      .oderInfo .listContainer .title {
        margin-right: 20px; }
      .oderInfo .listContainer .listCell {
        margin-right: 0; }
      .oderInfo .listContainer .title:after { /*訂單資訊內容後面符號(手機版)*/
        content: "\f0da";                     /*內容*/
        font-family: FontAwesome;             /*字體*/
        display: inline-block;                /*依照元素中的內容來決定內容的寬高*/
        padding-right: 3px;                   /*框架內縮右邊距離*/
        vertical-align: middle;               /*垂直對齊:置中*/
        position: absolute;                   /*絕對位置*/
        right: -15px;                         /*右邊*/
        top: 3px;                             /*上面*/
        color: #61c46e;                     /*符號顏色*/
        font-size: 12px; }                    /*文字尺寸*/
    .oderInfo .productListRow .cell:nth-child(4) {
      width: 40%; }
    .oderInfo .paymentInfo div {
      display: block;
      margin-right: 0;
      margin-bottom: 10px; }
    .oderInfo .paymentInfo .title {
      margin-right: 25px; }
    .oderInfo .paymentInfo .title:after { /*付款訊息內容後面符號(手機版)*/
      content: "\f0da";                   /*內容*/
      font-family: FontAwesome;           /*字體*/
      display: inline-block;              /*依照元素中的內容來決定內容的寬高*/
      padding-right: 3px;                 /*框架內縮右邊距離*/
      vertical-align: middle;             /*垂直對齊:置中*/
      position: absolute;                 /*絕對位置*/
      right: -20px;                       /*右邊*/
      top: 3px;                           /*上面*/
      color: #61c46e;                   /*符號顏色*/
      font-size: 12px; }                  /*文字尺寸*/
    .oderInfo .receiveInfo .title {
      margin-right: 25px; }
    .oderInfo .receiveInfo .title:after { /*收件資訊內容後面符號(手機版)*/
      content: "\f0da";                   /*內容*/
      font-family: FontAwesome;           /*字體*/
      display: inline-block;              /*依照元素中的內容來決定內容的寬高*/
      padding-right: 3px;                 /*框架內縮右邊距離*/
      vertical-align: middle;             /*垂直對齊:置中*/
      position: absolute;                 /*絕對位置*/
      right: -20px;                       /*右邊*/
      top: 3px;                           /*上面*/
      color: #61c46e;                   /*符號顏色*/
      font-size: 12px; }                  /*文字尺寸*/
    .oderInfo .returnReason .reasonRow select {
      width: 100%; }
    .oderInfo .returnReason .reasonRow .title {
      width: 80px;
      margin-right: 20px; }
    .oderInfo .returnReason .reasonRow .title:after {
      right: -3px; }
    .oderInfo .returnReason label {     /*退貨原因標題*/
      display: block;                   /*顯示：區塊*/
      margin-left: 0;                   /*左側外邊界*/   
      width: 130px;                     /*寬度*/
      margin-top: 10px;                 /*框架外拉上面距離*/
      background: #faf7f2; }          /*符號顏色*/
    .oderInfo .QuestionContents .qRow label {
      margin-right: 0;
      display: block; }
    .oderInfo .buyerInfo .title {
      position: relative;
      margin-right: 20px; }
    .oderInfo .buyerInfo .title:after { /*買家訂單資訊標題後面*/
      content: "\f0da";                 /*內容*/
      font-family: FontAwesome;         /*字體*/
      display: inline-block;            /*依照元素中的內容來決定內容的寬高*/
      padding-right: 3px;               /*框架內縮右邊距離*/
      vertical-align: middle;           /*垂直對齊:置中*/
      position: absolute;               /*絕對位置*/
      right: -15px;                     /*右邊*/
      top: 3px;                         /*上面*/
      color: #61c46e;                 /*符號顏色*/
      font-size: 12px; }                /*文字尺寸*/
  .returnFinish {
    padding: 20px 40px; }
    .returnFinish h1 {
      font-size: 18px; }
    .returnFinish .QRCode {
      display: none; }
    .returnFinish .line {
      display: block;
      width: 100px; }
  .replyInfo {                /*客服回覆內容對話框(手機版)*/
    padding: 15px 10px;       /*框架的內邊距：上下-左右*/
    background: #f7fff8; }  /*背景顏色*/
    .replyInfo .dialogueRow {
      margin-bottom: 20px; }
      .replyInfo .dialogueRow .dialogueCell {
        min-width: 100%;
        max-width: 100%; }
    .replyInfo .client .dialogueCell { /*客服回覆內容對話框-您的詢問*/
      background-color: #dff2e1; }   /*背景顏色#faf6f1*/
    .replyInfo .client .dialogueCell:after { /*回覆訊息-客戶對話後面*/
      content: "";                           /*內容*/
      background-image: url(../img/icon/Messagebubble4.png?v=1); } /*背景圖片*/
    .replyInfo .btn {
      width: auto;
      padding: 7px 20px; }
    .replyInfo .sendBtn {
      width: 80%; }
  .cooperation section {
    padding: 0 20px; }
  .cooperation input, .cooperation select, .cooperation textarea {
    width: 100%; }
  .loginFb select {
    width: 100%; } }

@media (max-width: 414px) {
  .signupContainer select {
    display: block;
    width: 100%;
    padding: 8px 5px;
    margin-bottom: 10px; }
  .signupContainer .member_address select {
    width: 45%;
    padding: 8px 5px; }
  .signupContainer .verificationCode input {
    width: 100px; }
  .signupContainer .verificationCode img {  /*驗證碼圖片(手機版)*/
    display: block;                         /*顯示：區塊*/
    margin-top: 10px;                       /*框架外拉上面距離*/
    margin-bottom: 10px; }                  /*框架外拉下面距離*/
  .signupContainer .verificationCode span.reload {
    font-size: 16px; }
  .modifyPassword .passwordRow {
    width: 100%;
    font-size: 14px; }
    .modifyPassword .passwordRow .title {
      width: 70px;
      margin-right: 30px; }
    .modifyPassword .passwordRow .title:after {
      right: -20px; }
    .modifyPassword .passwordRow input[type=text] {
      width: 35%; }
    .modifyPassword .passwordRow .verificationCode span {
      display: block;
      margin-left: 0;
      margin-top: 10px; }
  .oderInfo .cancelReason .reasonRow .title {
    width: 100px;
    margin-right: 20px; }
  .oderInfo .returnReason .reasonRow .title {
    width: 70px; }
  .oderInfo .returnReason .reasonRow .title:after {
    right: -10px; }
  .oderInfo .QuestionContents .qRow .title {
    margin-right: 20px; }
  .oderInfo .QuestionContents .qRow .title:after {
    right: 0; }
  .returnFinish {                  /*返回完成*/
    padding: 0;                    /*框架的內邊距*/
    background-color: #efeae2; } /*背景顏色*/
    .returnFinish h1 {
      font-size: 18px; }
  .memberCenter #tab3 .moneyQuery {
    text-align: center; }
    .memberCenter #tab3 .moneyQuery .trangleLeft {
      width: 100%;
      text-align: center;
      top: 0;
      margin-bottom: 15px; }
    .memberCenter #tab3 .moneyQuery .trangleLeft:after {
      content: ""; }
    .memberCenter #tab3 .moneyQuery input {
      width: 45%; }
    .memberCenter #tab3 .moneyQuery label {
      width: 95%;
      margin: 10px auto; }
  .customerService .formRow {
    width: 100%;
    flex-direction: column; }
    .customerService .formRow > .title {
      width: auto;
      margin-right: 0;
      text-align: left;
      align-self: flex-start;
      margin-left: 10px;
      margin-bottom: 10px; }
    .customerService .formRow > .value {
      width: 90%; }
  .customerService .trangleLeft:after {
    right: -15px; }
  .loginFb .ansRow {
    align-items: flex-start;
    flex-direction: column; }
    .loginFb .ansRow .title {
      width: auto;
      text-align: left;
      margin-bottom: 5px; }
    .loginFb .ansRow .value {
      width: 100%; } }

@media (max-width: 375px) {
  .signupContainer .checkBox {
    font-size: 14px; } }

@media (max-width: 320px) {
  .signupContainer {
    font-size: 14px; }
    .signupContainer .memberEditRow .editTitle {
      width: 68px; }
    .signupContainer .member_address select {
      display: block;
      width: 100%; }
  .modifyPassword .passwordRow {
    font-size: 14px; }
    .modifyPassword .passwordRow input[type=text] {
      display: block;
      width: 100%;
      margin-bottom: 10px; }
    .modifyPassword .passwordRow .btnOrange {
      height: 35px;
      line-height: 35px; }
  .oderInfo {
    font-size: 14px;
    padding: 10px 0; }
    .oderInfo .productList {
      font-size: 14px; }
    .oderInfo .finalPriceRow {
      font-size: 16px;
      padding: 10px 0; }
  .replyInfo .btn {
    width: 100%;
    display: block;
    margin-bottom: 10px; }
  .customerService .verificationCode span.reload {
    display: block;
    margin-top: 10px; }
  .memberCenter #tab2 .orderQuery .orderList .flexTableRow {
    font-size: 16px; } }

