@charset "UTF-8";

 /* 強制取消所有圖片圓角 
    img {
        border-radius: 0px !important;
    }
  */

.shopping_notice{       /*加入會員-第一次購物下方選單對齊*/
  text-align: left;     /*文字對齊:左邊*/
}
.shopping_notice label{ /*加入會員-第一次購物下方選單對齊*/
  display: block;       /*彈性容器*/
  padding-left: 17px;   /*框架內縮左邊距離*/
  text-indent: -18px;   /*設定文字行前面空格(縮排)的長度*/
}

.flowStatus { /*流量狀態*/
  width: 80%;
  margin: 40px auto;
  font-size: 15px;
  text-align: center; }
  .flowStatus .stautsCell {
    width: 20%;
    margin-right: 4%;
    position: relative;               
    text-align: center; }
  .flowStatus .stautsCell.active {  /*購物步驟流程順序*/
    color: #009145; }             /*文字顏色*/
  .flowStatus .stautsCell:nth-last-child(1) {
    margin-right: 0; }
  .flowStatus .stautsCell:after {  /*購物步驟流程順序之後狀態*/
    content: "\f054";              /*內容*/
    font-family: FontAwesome;     /*圖示字型符號*/ 
    display: inline-block;        /*依照元素中的內容來決定內容的寬高*/
    color: #afafaf;             /*箭頭符號顏色*/
    font-size: 30px;              /*文字尺寸*/
    position: absolute;           /*絕對位置*/
    right: -32px; }               /*右邊*/
  
   
  .flowStatus .stautsCell .more_word {  /*字數過多忽略本身排版*/
    position: absolute;                 /*絕對位置*/
    }

  .flowStatus .stautsCell:nth-last-child(1):after {
    content: ""; }
  .flowStatus div {
    display: inline-block;
    text-align: left; }
  .flowStatus p {
    margin-bottom: 0; }  
  .flowStatus .statusImg { /*固定購物車小圖的框*/
    vertical-align: top;   /*圖片對齊:頂部tpo/文字底部text-bottom*/
    margin-right: 10px; }  /*框架外拉右邊距離*/
  .flowStatus .statusImg img { /*修改購物車小圖圓角*/
    border-radius:0px; }       /*增加圓角設定*/

.cartListContainer {      /*購物車列表內容*/
  background: #f1f9f2;  /*背景底色設定*/
  padding: 30px 70px;     /*框架的內邊距:上下-左右*/
  margin-bottom: 30px; }  /*框架外拉下面距離*/

.cartList {               /*購物車列表*/
  font-size: 16px; }
  .cartList .m-title, .cartList label, .cartList .m-deleteBtn {
    display: none; }
  .cartList section {
    margin-bottom: 40px; }
    .cartList section > p {
      font-weight: bold;
      padding: 0 15px;
      margin-bottom: 3px; }
  .cartList select, .cartList input { /*購物車清單輸入(與手機版.cartListBotton select相同樣式*/
    border: 1px solid #d1c9bb;      /*邊框樣式#cec5b7*/
    border-radius: 3px;               /*邊框圓角樣式*/
    padding: 8px 10px; }              /*框架的內邊距:上下-左右*/
  .cartList .flexRow {                /*購物車列表-彈性線條*/
    display: flex;                    /*彈性容器*/
    border-bottom: 1px dotted #009145;  /*下面分隔線樣式*/
    margin-bottom: 20px; }   /*框架外拉下面距離*/
    .cartList .flexRow img { /*商品圖片縮圖*/
      width: 100%;           /*寬度*/
      cursor: pointer; }    /*改變滑鼠游標的形狀:手指*/
    .cartList .flexRow i {  /*購物車step1確認訂單-購買商品選單後面符號*/
      color: #28a745;     /*符號顏色#cec5b7*/
      margin-left: 5px; }   /*左側外邊界*/
    .cartList .flexRow .flexCell { 
      text-align: center;
      font-weight: bold; }
    .cartList .flexRow .flexCell:nth-child(1) {
      flex: none;
      width: 42.8%;
      display: flex; }
      .cartList .flexRow .flexCell:nth-child(1) .cell {
        padding: 10px 0; }
      .cartList .flexRow .flexCell:nth-child(1) .cell:nth-child(1) {
        flex: none;
        width: 150px;
        padding: 15px;}
      .cartList .flexRow .flexCell:nth-child(1) .cell:nth-child(2) {
        flex: 1;
        padding-right: 10px;
        text-align: left; }
    .cartList .flexRow .flexCell:nth-child(2) {
      flex: none;
      width: 57.2%;
      display: flex; }
      .cartList .flexRow .flexCell:nth-child(2) .cell {
        flex: 1;
        padding: 10px 0;
        align-self: center; }
  .cartList .flexTitleRow {   /*標題色塊(網頁版)*/
    background: #bfeac3;    /*標題底色*/
    border-bottom: 0; }       /*下方邊框樣式*/
    .cartList .flexTitleRow .flexCell:nth-child(1) .cell {
      border-right: 1px solid #fff; } /*右側分隔線顏色*/
    .cartList .flexTitleRow .flexCell:nth-child(1) .cell:nth-child(1) {
      padding: 10px 0; }
    .cartList .flexTitleRow .flexCell:nth-child(1) .cell:nth-child(2) {
      text-align: center; }
    .cartList .flexTitleRow .flexCell:nth-child(2) .cell {
      border-right: 1px solid #fff; } /*右側分隔線顏色*/
    .cartList .flexTitleRow .flexCell:nth-child(2) .cell:nth-last-child(1) {
      border-right: 0; }      /*右側分隔線顏色*/
  .cartList h2 {
    font-size: 21px;
    font-weight: bold;
    cursor: pointer; }
  .cartList .productName {
    padding-left: 20px; }
    .cartList .productName p.activityName { /*購物車商品活動名稱*/
      margin-bottom: 2px;      /*下方外邊界*/
      font-size: 15px;         /*文字尺寸*/
      position: relative;      /*相對位置*/
      padding-left: 20px;      /*框架內縮左邊距離*/
      color: #f18e00; }      /*顏色*/
    .cartList .productName p.activityName:before {  /*購物車商品活動名稱之前符號*/
      content: "\f005";          /*內容*/
      font-family: FontAwesome;  /*圖示字型符號*/ 
      display: inline-block;     /*依照元素中的內容來決定內容的寬高*/
      color: #afafaf;          /*箭頭符號顏色*/
      position: absolute;        /*絕對位置*/
      left: 0;                   /*左邊*/
      top: 3px;                  /*上面*/ 
      color: #f18e00;          /*顏色*/
      font-size: 12px; }         /*文字尺寸*/
  .cartList .price span {
    text-decoration: line-through;
    padding: 0 3px; }
  .cartList .price p {
    margin-bottom: 0; }
  .cartList .deleteBtn i { /*刪除按鈕*/
    color: #333;         /*顏色*/
    font-size: 24px;       /*文字尺寸*/
    cursor: pointer; }     /*改變滑鼠游標的形狀:手指*/
  .cartList .totalPrice {  /*購物車總價*/
    color: #ff0000; }    /*數字顏色*/
  .cartList .shopMoney {   /*售價*/
    color: #df5400;      /*數字顏色*/
    margin: 5px 0; }       /*框架的外邊界：上下-左右*/
    .cartList .shopMoney img {  /*購物車費用圖片*/
      width: 180px;             /*寬度*/
      border-radius:0px;  }    /*邊框圓角樣式*/

.cartListBotton {   /*購物車列表按鈕*/
  display: flex;    /*彈性容器*/
  font-size: 15px;  /*文字尺寸*/
  /*#select_coupon{ 選擇優惠券
        width: 100%;  寬度
    }*/ }
  .cartListBotton input, .cartListBotton select { /*購物車列表-輸入欄區域*/
    background: none;                             /*輸入欄區域底色#fff*/
    padding: 6px 10px;                            /*框架的內邊距:上下-左右*/
    width: 70%; }                                 /*寬度*/
  .cartListBotton label {   /*使用按鈕(網頁版)*/
    display: inline-block;  /*依照元素中的內容來決定內容的寬高*/
    background: #5d9e49;  /*按鈕底色*/
    color: #fff;          /*文字顏色*/ 
    margin-left: 10px;      /*左側外邊界*/
    margin-bottom: 0;       /*框架外拉下面距離*/
    padding: 6px 25px;      /*框架的內邊距:上下-左右*/
    cursor: pointer; }      /*改變滑鼠游標的形狀:手指*/
  .cartListBotton > div {
    flex: 1; }
  .cartListBotton .left > p {
    padding-left: 20px; }
    .cartListBotton .left > p span { /*此筆訂單最多可抵用XXX購物金*/
      color: #f18e00;              /*XXX金額顏色*/
      font-weight: bold;             /*字體粗細*/
      font-size: 18px;               /*文字尺寸*/
      display: inline-block;         /*依照元素中的內容來決定內容的寬高*/
      margin: 0 5px; }               /*框架的外邊界：上下-左右*/
  .cartListBotton .bottomRow {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    padding-left: 20px; }
    .cartListBotton .bottomRow .title {
      flex: none;
      width: 80px;
      position: relative;
      margin-right: 30px; }
    .cartListBotton .bottomRow .title:after { /*step1確認訂單-購物金/折價券選項後面符號*/
      content: "\f0da";            /*內容*/
      font-family: FontAwesome;    /*圖示字型符號*/        
      display: inline-block;       /*依照元素中的內容來決定內容的寬高*/
      position: absolute;          /*絕對位置*/
      right: -17px;                /*右邊*/           
      top: 3px;                    /*上面*/
      color: #28a745;            /*箭頭符號顏色#cec5b7*/
      font-size: 12px; }           /*文字尺寸*/
    .cartListBotton .bottomRow .value {
      flex: 1; }
    .cartListBotton .bottomRow span.greenColor {
      font-size: 18px;
      font-weight: bold;
      display: inline-block;
      margin-right: 5px; }
  .cartListBotton .priceRow {
    display: flex;
    margin-bottom: 30px;
    padding-right: 20px; }
    .cartListBotton .priceRow .title {
      flex: none;
      width: 70%;
      text-align: right; }
    .cartListBotton .priceRow .price {
      flex: 1;
      text-align: right; }
  .cartListBotton .finalPrice {
    font-size: 18px;
    font-weight: bold; }
    .cartListBotton .finalPrice .price { /*購物車列表按鈕-最後金額*/
      font-size: 21px;                   /*文字尺寸*/
      color: #ff0000; }                /*文字顏色*/            

.bottomBtn {                  /*底部按鈕*/
  margin-bottom: 40px; }      /*框架外拉下面距離*/
  .bottomBtn .btn {           /*底部按鈕*/
    width: 200px;             /*寬度*/
    padding: 10px 0; }        /*框架的內邊距:上下-左右*/
  .bottomBtn .backBtn {       /*底部繼續購物按鈕*/
    margin-right: 20px;       /*框架外拉右邊距離*/
    background: #b1b1b1; }  /*按鈕顏色*/

.cartStep {                              /*購物車步驟*/
  font-size: 16px; }                     /*文字尺寸*/
  .cartStep hr {                         /*購物車-填寫訂單資料*/
    border-top: 1px dotted #009145; }  /*上方分隔線樣式*/
  .cartStep input, .cartStep textarea {
    width: 80%; }
  .cartStep input[type=checkbox], .cartStep input[type=radio] {
    width: auto;
    margin-right: 5px; }
  .cartStep .commonAddress > button { /*購物車步驟Step2-常用收件人資訊欄位選單調整*/
    overflow: hidden;              /*新增防止遮罩溢出邊界*/  
    width: 80%;                    /*寬度*/
    margin-bottom: 0;              /*下邊距*/
    position: relative;            /*相對位置*/
    background-color: #ffffff;   /*透明transparent*/
    height: 38px;                  /*新增高度*/   
    color: #333;                 /*顏色*/   
    border-color: #d1c9bb;       /*邊框顏色*/
    border-radius: 3px;            /*邊框圓角樣式*/
    text-align: left;              /*文字對齊:左邊*/
    padding: 6px 30px 8px 10px;    /*框架的內邊距:上8px-右-下-左*/
    position: relative;            /*相對位置*/
    white-space: normal; }         /*空白:普通*/
  .cartStep .commonAddress .dropdown-toggle::after {
    position: absolute;
    right: 10px;
    top: 44%; }
  .cartStep .commonAddress .dropdown-menu.show {
    width: 80%;
    cursor: pointer; }
  .cartStep .commonAddress .dropdown-item {
    display: flex;
    align-items: center;
    white-space: normal;
    padding: 8px 10px; }
    .cartStep .commonAddress .dropdown-item > div {
      flex: 1; }
    .cartStep .commonAddress .dropdown-item > button {
      flex: none;
      width: 60px;
      margin-left: 15px; }
  .cartStep select {
    margin-bottom: 10px;
    width: 35%; }
  .cartStep .birthdayVale select {
    width: 25%; }
  .cartStep .birthdayVale p {
    font-size: 14px;
    margin-bottom: 0; }
  .cartStep section {
    margin-bottom: 40px; }
    .cartStep section > p {   /*填寫訂單資料-選單欄位(網頁版)*/
      font-weight: bold;      /*字體粗細*/
      margin-bottom: 30px;    /*框架外拉下面距離*/
      background: #DFF2E1;  /*標題底色*/
      padding: 15px; }        /*框架的內邊距*/
  .cartStep p.note {          /*填寫訂單資料-備註*/
    color: #ff0000;         /*文字顏色*/
    font-size: 14px;          /*文字尺寸*/
    margin-bottom: 3px; }     /*框架外拉下面距離*/
  .cartStep .trangle:after {  /*購物車step2填寫訂單資料-填寫資料後面符號*/
    content: "\f0da";         /*內容*/
    font-family: FontAwesome; /*圖示字型符號*/    
    display: inline-block;    /*依照元素中的內容來決定內容的寬高*/
    position: absolute;       /*絕對位置*/
    right: -25px;             /*右邊*/  
    top: 0;                   /*上面*/
    color: #28a745;         /*符號顏色#cec5b7*/
    font-size: 16px; }        /*文字尺寸*/
  .cartStep .markTitle:before {  /*購物車step2填寫訂單資料-選單必填欄位前面標記*/
    content: "*";                /*符號樣式*/
    color: #009145; }          /*符號顏色*/
  .cartStep .member_address2 {
    margin-bottom: 5px; }  
  .cartStep .customerRow {
    width: 660px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    margin-bottom: 20px; }   
    .cartStep .customerRow .title {
      width: 120px;
      flex: none;
      margin-right: 50px;
      position: relative;
      text-align: right;
      font-weight: bold; }
    .cartStep .customerRow .flex-align {
      align-self: flex-start;
      padding-top: 10px; }
    .cartStep .customerRow .trangle.flex-align:after {
      padding-top: 10px; }
    .cartStep .customerRow .value {
      flex: 1; }
  .cartStep .invoiceType {
    margin-bottom: 20px;
    padding-top: 10px; }
    .cartStep .invoiceType .invoiceTypeContent, .cartStep .invoiceType .hasChild {
      display: none;
      padding-left: 20px;
      padding-top: 20px; }
    .cartStep .invoiceType .invoiceTypeContent > div {
      margin-bottom: 10px; } 
    .cartStep .invoiceType label {
      margin-bottom: 0; } 
    .cartStep .invoiceType input[type=text] {
      width: 200px;
      margin-bottom: 5px; }
    .cartStep .invoiceType select { /*購物車step2填寫訂單資料-發票資料欄-捐贈選單尺寸*/
      width: 150px;                 /*寬度*/    
      margin-bottom: 0; }           /*框架外拉下面距離*/   
    .cartStep .invoiceType p {
      font-size: 14px;
      margin-bottom: 3px; } 
    .cartStep .invoiceType p.typeNotice {
      padding-left: 24px; }
  .cartStep .termList {
    width: 300px;
    margin: 0 auto;
    text-align: left; }

.step3Container {               /*step3購物車-選擇付款方式頁面*/
  font-size: 18px; }            /*文字尺寸*/
  .step3Container section > p { /*選擇付款方式項目*/
    font-weight: bold;          /*字體粗細*/
    margin-bottom: 30px;        /*框架外拉下面距離*/
    background: #DFF2E1;      /*標題底色顏色*/
    padding: 15px; }            /*框架的內邊距*/
  .step3Container .payment {
    display: flex;
    align-items: center; }
    .step3Container .payment > .paymentItem {  /*購物車step3選擇付款方式：圖片*/
      flex: 1;
      text-align: center;                      /*文字對齊：置中*/
      align-self: flex-start; }                /*自我對齊：彈性啟動*/
    .step3Container .payment > .verticalLine { /*選擇付款方式：垂直線*/
      flex: none;
      width: 0;                                /*寬度*/
      height: 80px;                            /*高度50px*/
      border-right: 2px dotted #009145;      /*右側邊框樣式*/
      margin: 0 2% 15%; }                      /*框架的外邊界：上-左右-下*/
    .step3Container .payment img { /*選擇付款方式圖片*/
      width: auto;                 /*寬度*/
      height: 100px;               /*高度*/
      border-radius:0px }          /*取消圓角*/
    .step3Container .payment .figcaption, .step3Container .payment .itemImg, .step3Container .payment figcaption { /*選擇付款方式：圖片*/
      padding: 15% 0; }     
    .step3Container .payment .paymentItemOuter { /*選擇付款方式：超商代碼繳費*/
      margin-bottom: 30px;                       /*框架外拉下面距離*/
      cursor: pointer;                           /*改變滑鼠游標的形狀:手指*/
      border: 2px solid transparent; }           /*邊框樣式:透明的*/
      .step3Container .payment .paymentItemOuter img:nth-child(1) { /*選擇付款方式超商代碼繳費-圖片*/
        display: none; }                                 /*顯示方式:無*/
      .step3Container .payment .paymentItemOuter img:nth-child(2) { /*選擇付款方式ATM-圖片*/
        display: inline; }                               /*顯示方式:內嵌*/
    .step3Container .payment .paymentItemOuter.active {  /*選擇付款方式外框反應*/
      border: 2px solid #009145;                       /*邊框樣式*/
      border-radius:15px }                               /*新增圓角設定*/
      .step3Container .payment .paymentItemOuter.active img:nth-child(1) { /*選擇付款方式超商代碼繳費圖片-點選後反應*/
        display: inline; }                               /*顯示方式:內嵌*/
      .step3Container .payment .paymentItemOuter.active img:nth-child(2) { /*選擇付款方式ATM圖片-點選後反應*/
        display: none; }                                 /*顯示方式:無*/
      .step3Container .payment .paymentItemOuter.active figcaption { /*購物車step3選擇付款方式點選後文字反應*/
        color: #009145; }                                          /*文字顏色*/
    .step3Container .payment p {  /*選擇付款方式:透過轉帳付款*/
      margin-bottom: 1px;         /*框架外拉下面距離*/
      font-size: 14px; }          /*文字尺寸*/                                

.step4Container {          /*購物車-完成訂購頁面*/
  font-size: 15px; }       /*文字尺寸*/
  .step4Container h1 {     /*訂購成功!!*/
    font-size: 24px;       /*文字尺寸*/
    font-weight: bold;     /*字體粗細*/
    text-align: center;    /*文字對齊:置中*/
    color: #009145;      /*文字顏色*/
    margin-bottom: 40px; } /*框架外拉下面距離*/
  .step4Container h3 {     /*已收到您的訂購與期待!*/
    font-size: 18px;       /*文字尺寸*/
    font-weight: bold;     /*字體粗細*/
    color: #5d9e49; }    /*文字顏色*/  
  .step4Container section ol { /*完成訂購頁面項目標籤*/
    margin: 20px 0;            /*框架的外邊界：上下-左右*/
    border-bottom: 1px dotted #009145;    /*下方邊框樣式-分隔線*/
    padding-bottom: 20px; }/*框架內縮下面距離*/
    .step4Container section ol li {  /*完成訂購頁面項目標籤*/
      line-height: 35px; }           /*行高*/
  .step4Container section > p { /*訂單資訊-標題色塊*/
    font-weight: bold;          /*字體粗細*/
    margin-bottom: 0;           /*框架外拉下面距離*/
    background: #DFF2E1;      /*標題底色*/
    padding: 15px; }            /*框架的內邊距*/
  .step4Container .orderInfoRowOuter { /*訂單資訊頁*/
    background: #fff;         /*背景底色*/
    margin-bottom: 30px; }      /*框架外拉下面距離*/
  .step4Container .infoRow {    /*資料分隔線*/
    border-bottom: 1px dotted #009145;   /*下方邊框樣式-分隔線*/
    padding: 30px; }                       /*框架的內邊距*/
    .step4Container .infoRow p {
      margin-bottom: 0;
      line-height: 30px; }
    .step4Container .infoRow span {  /*完成付款日期*/
      color: #ff0000;              /*日期顏色*/
      margin: 0 5px;                 /*框架的外邊界：上下-左右*/
      font-weight: bold; }           /*字體粗細*/
  .step4Container .orderInfoRow {    /*完成訂購頁面資訊列*/
    display: flex;                   /*彈性容器*/
    border-bottom: 1px dotted #009145;  /*下方邊框樣式-分隔線*/
    padding: 30px; }                      /*框架的內邊距*/
    .step4Container .orderInfoRow .title {
      flex: none;
      width: 100px; }
      .step4Container .orderInfoRow .title span:after { /*完成訂購後面相關設定*/
        content: "："; }
    .step4Container .orderInfoRow .value {
      flex: 1; }
      .step4Container .orderInfoRow .value span {  /*金額*/
        color: #ff0000; }                        /*顏色*/

.step4Btn .backHomeBtn {  /*回首頁按鈕*/
  background: #e27300;  /*按鈕顏色*/
  margin-right: 20px; }   /*框架外拉右邊距離*/

@media (max-width: 1200px) {
  .cartListContainer {
    padding: 25px 40px; } }

@media (max-width: 992px) {
  .flowStatus {
    width: 100%;
    font-size: 14px; }
    .flowStatus .stautsCell:after { /*流量狀態後面相關設定(手機版)*/
      font-size: 24px;       /*文字尺寸*/
      right: -30px;          /*右邊*/
      top: 4px; }            /*箭頭位置高度(手機版)*/
  .cartListContainer {       /*購物車列表內容(手機版)*/
    padding: 25px 10px; }    /*框架的內邊距:上下-左右*/
  .flexRowContianer {
    position: relative; }
  .cartList {                /*購物車列表*/
    font-size: 20px; }       /*文字尺寸*/
    .cartList .m-title, .cartList label {
      display: inline-block;
      margin-right: 5px; }
    .cartList h2 { 
      padding-right: 30px; } 
    .cartList label {        /*數量按鈕(手機版)*/
      background: #5d9e49; /*按鈕底色*/
      padding: 8px;          /*框架的內邊距*/
      color: #fff;         /*顏色*/
      margin-bottom: 0; }    /*邊距底部*/
    .cartList .m-deleteBtn {
      display: block;
      position: absolute; 
      right: 0;
      top: 4px;
      font-size: 25px;
      cursor: pointer; } 
    .cartList select {       /*購物車清單選擇*/
      margin-left: -11px; }  /*左側外邊界*/   
    .cartList section > p {  /*標題色塊(手機版)*/
      background: #DFF2E1; /*標題底色*/
      padding: 15px; }       /*框架的內邊距*/
    .cartList .flexRow {
      flex-direction: column; }
      .cartList .flexRow .flexCell:nth-child(1) {
        flex: none;
        width: 100%; }
        .cartList .flexRow .flexCell:nth-child(1) .cell:nth-child(1) {
          width: 40%; }
      .cartList .flexRow .flexCell:nth-child(2) {
        width: 100%; }
        .cartList .flexRow .flexCell:nth-child(2) .cell:nth-child(3) {
          flex: 0;
          width: 0; }
    .cartList .flexTitleRow {
      display: none; }
    .cartList .price {
      display: inline-block; }
      .cartList .price span {
        display: none; }
    .cartList .totalPrice {
      display: inline-block; }
    .cartList .productName p, .cartList .productName p.activityName {
      font-size: 16px; }
    .cartList .deleteBtn {
      display: none; }
  .cartListBotton {
    flex-direction: column;
    font-size: 28px; }
    .cartListBotton label {  /*使用按鈕(手機版)*/
      background: #5d9e49; /*按鈕底色*/
      padding: 6px 25px; }   /*框架的內邊距:上下-左右*/
    .cartListBotton select {
      margin-left: 0; }
    .cartListBotton .left {
      margin-bottom: 20px; }
      .cartListBotton .left > p span {
        font-size: 28px; }
    .cartListBotton .bottomRow .title {
      width: 155px; }
    .cartListBotton .bottomRow .title:after {
      right: -8px;
      top: 5px;
      font-size: 22px; }
    .cartListBotton .bottomRow span.greenColor {
      font-size: 28px; }
    .cartListBotton .priceRow {
      margin-bottom: 10px; }
    .cartListBotton .finalPrice {
      font-size: 28px; }
      .cartListBotton .finalPrice .price {
        font-size: 28px; }
  .bottomBtn .btn {
    font-size: 22px; } }

@media (max-width: 768px) {
  .flowStatus {
    font-size: 18px; }
    .flowStatus .stautsCell:after {
      right: -24px;
      top: 10px; }
    .flowStatus .statusImg {
      display: none; }
  .cartListBotton {
    font-size: 22px; }
    .cartListBotton input, .cartListBotton select {
      width: 50%; }
    .cartListBotton .left > p span {
      font-size: 22px; }
    .cartListBotton .bottomRow .title {
      width: 125px; }
    .cartListBotton .bottomRow .title:after {
      font-size: 18px; }
    .cartListBotton .bottomRow span.greenColor {
      font-size: 22px; }
    .cartListBotton .finalPrice {
      font-size: 22px; }
      .cartListBotton .finalPrice .price {
        font-size: 22px; }
  .bottomBtn .btn {
    width: 150px;
    font-size: 18px; }
  .cartStepContainer {        /*step2購物車列表-填寫訂單資料(手機版)*/ 
    background: #f1f9f2;    /*背景底色設定*/
    padding: 0; }             /*框架的內邊距*/
  .cartStep section > p {     /*填寫訂單資料-選單欄位(手機版)*/
    background: #DFF2E1; }  /*標題底色*/
  .cartStep .customerRow {
    width: 90%; }
    .cartStep .customerRow .invoiceTitle {
      width: 0;
      display: none; }
  .cartStep .commonAddress > button {
    background-color: #faf7f2; }
  .step3Container {           /*step3購物車列表-選擇付款方式*/ 
    background: #efeae2;    /*背景底色設定*/
    padding: 25px 10px; }     /*新增框架的內邊距:上下-左右*/
    .step3Container section > p {
      background: #fff; }
    .step3Container .payment {
      flex-wrap: wrap;
      justify-content: space-between; }
      .step3Container .payment > .paymentItem {
        flex: none;
        width: 45%;
        margin-bottom: 40px; }
      .step3Container .payment > .verticalLine {
        display: none; }
      .step3Container .payment .figcaption, .step3Container .payment .itemImg, .step3Container .payment figcaption {
        padding: 10% 0; }
      .step3Container .payment p {
        display: none; } }

@media (max-width: 576px) {
  .flowStatus {
    font-size: 14px;
    text-align: center; }
    .flowStatus .stautsCell {
      width: auto;
      margin-right: 35px; }  
    .flowStatus .stautsCell:after {
      font-size: 20px;
      right: -25px;
      top: 10px; }
  .cartList {
    font-size: 17px; }
    .cartList .m-title {
      display: block;
      margin-right: 0; }
    .cartList .m-deleteBtn {
      font-size: 20px; }
    .cartList label {
      padding: 6px 2px;
      height: 37px; }
    .cartList select {                 /*購物車清單選擇*/
      margin-left: -10px;              /*左側外邊界*/   
      padding: 5px 1px;                /*框架的內邊距:上下-左右*/
      width: 63%;                      /*寬度*/
      height: 37px;                    /*高度*/
      vertical-align: bottom;          /*垂直對齊:底部*/
      border-top-left-radius: 0px;     /*左上邊框圓角*/
      border-bottom-left-radius: 0px;  /*左下邊框圓角*/
      border-left: 0; }                /*左側邊框樣式*/
    .cartList .flexRow .flexCell:nth-child(1) .cell:nth-child(1) {
      padding: 10px; }
    .cartList .flexRow .flexCell:nth-child(1) .cell:nth-child(2) {
      margin-left: 0; }
    .cartList .productName {
      padding-left: 10px; }
      .cartList .productName .shopMoney {
        font-size: 18px; }
  .cartListBotton {            /*購物車列表按鈕*/
    font-size: 18px; }         /*文字尺寸*/
    .cartListBotton input, .cartListBotton select {
      width: 55%;
      margin-left: 0; }       
    .cartListBotton select {   /*購物車列表按鈕選擇(與手機版cartList select, .cartList input相同樣式*/  
      border-top-left-radius: 3px;         /*左上邊框圓角*/
      border-bottom-left-radius: 3px;      /*左下邊框圓角*/
      border-left: 1px solid #d1c9bb; }  /*左側邊框樣式*/
    .cartListBotton label {
      padding: 6px 20px; }
    .cartListBotton .left > p span {
      font-size: 18px; }
    .cartListBotton .bottomRow .title {
      width: 100px; }
    .cartListBotton .bottomRow .title:after {
      font-size: 12px; }
    .cartListBotton .bottomRow span.greenColor {
      font-size: 18px; }
    .cartListBotton .finalPrice {
      font-size: 18px; }
      .cartListBotton .finalPrice .price {
        font-size: 18px; }
  .bottomBtn .btn {
    width: 40%; }
  .cartStep {   /*購物車步驟*/
    /*select  {
            width:48%;
        }*/ }
    .cartStep .trangle:after { 
      right: -17px; }
    .cartStep .commonAddress, .cartStep input, .cartStep select, .cartStep textarea {   /*購物車-填寫訂單資料欄位設定(手機版)*/
      width: 100%; }
    .cartStep label {
      display: inline; }
    .cartStep .commonAddress > button {
      width: 100%; }
    .cartStep .commonAddress .dropdown-menu.show {
      width: 100%; }
    .cartStep .invoiceType input[type=text], .cartStep .invoiceType select {
      width: 100%; }
    .cartStep .invoiceType label {
      display: inline; }
    .cartStep .birthdayVale select {
      width: 100%; }
    .cartStep .customerRow {            /*購物車-填寫訂單資料欄位設定(手機版)*/
      width: 100%; }                    /*填寫欄位比例100%*/
      .cartStep .customerRow .title {   /*購物車-填寫訂單資料欄位設定(手機版)*/
        width: 110px;                   /*填寫欄位比例110%*/
        margin-right: 30px; }          /*框架外拉右邊距離*/
  .step4Container {
    font-size: 24px;
    background: #efeae2; }
    .step4Container h1 {
      font-size: 32px; }
    .step4Container h3 {
      font-size: 24px; }
    .step4Container section ol {
      margin-bottom: 60px; }
    .step4Container section > p {
      background: #fff; }
    .step4Container .orderInfoRowOuter { /*step4完成訂購訂單資訊表底色(手機版)*/
      background: #efeae2; }           /*背景底色#efeae2*/
    .step4Container .orderInfoRow {
      padding: 20px; }
      .step4Container .orderInfoRow .title {
        width: 135px; }
        .step4Container .orderInfoRow .title span {
          position: relative; }
        .step4Container .orderInfoRow .title span:after { /*step4完成訂購後面相關設定(手機版)*/
          content: "\f0da";          /*內容*/
          font-family: FontAwesome;  /*圖示字型符號*/ 
          display: inline-block;     /*依照元素中的內容來決定內容的寬高*/
          color: #afafaf;          /*顏色*/
          position: absolute;        /*絕對位置*/
          right: -20px;              /*右邊*/
          top: 10px;                 /*上面*/
          color: #cec5b7;          /*符號顏色*/
          font-size: 12px; }         /*文字尺寸*/
  .step4Btn {  /*步驟4按鈕*/
    position: fixed;
    bottom: 0;
    left: 0;
    margin-bottom: 0;
    display: flex;
    width: 100%; }
    .step4Btn .btn {
      flex: 1; }
    .step4Btn .backHomeBtn { /*返回首頁按鈕(手機版)*/
      margin-right: 0; } }   /*框架外拉右邊距離*/

@media (max-width: 414px) {
  .flowStatus {
    font-size: 12px; }
    .flowStatus .stautsCell {
      margin-right: 30px; }
    .flowStatus .stautsCell:after {
      font-size: 12px;
      right: -17px; }
  .cartList h2 {
    font-size: 16px; }
  .cartList .productName p, .cartList .productName p.activityName { 
    font-size: 14px; }
  .cartList .shopMoney img {  /*購物車step1 確認訂單-圖片(手機版) */
    width: 80%;               /*寬度*/
    border-radius: 0px;}      /*增加圖片圓角*/
  .cartListBotton {
    font-size: 16px; }
    .cartListBotton input, .cartListBotton select {
      width: 63%; }
    .cartListBotton .inputCoupon input, .cartListBotton .inputCouponSelect select {
      width: 100%; }
    .cartListBotton label {
      padding: 6px 12px; }
    .cartListBotton .left > p {
      padding-left: 10px; }
      .cartListBotton .left > p span {
        font-size: 16px; }
    .cartListBotton .bottomRow {
      padding-left: 10px; }
      .cartListBotton .bottomRow .title {
        width: 90px;
        margin-right: 20px; }
      .cartListBotton .bottomRow .title:after {
        font-size: 12px; }
      .cartListBotton .bottomRow span.greenColor {
        font-size: 16px; }
    .cartListBotton .priceRow {
      padding-right: 10px; }
    .cartListBotton .finalPrice {
      font-size: 16px; }
      .cartListBotton .finalPrice .price {
        font-size: 16px; }
  .step2Btn .btn {
    width: 100%; }
  .step3Container .payment img {
    height: 80px; }
  .step4Container {
    font-size: 18px; }
    .step4Container h1 {
      font-size: 24px; }
    .step4Container h3 {
      font-size: 18px; }
    .step4Container .orderInfoRow {
      padding: 15px; }
      .step4Container .orderInfoRow .title {
        width: 110px; }
        .step4Container .orderInfoRow .title span:after {
          top: 5px; } }

@media (max-width: 375px) {
  .flowStatus .stautsCell {
    margin-right: 26px; } }

@media (max-width: 320px) {
  .flowStatus {
    font-size: 10px; }
    .flowStatus .stautsCell {
      margin-right: 20px; }
    .flowStatus .stautsCell:after {
      font-size: 12px;
      right: -15px;
      top: 7px; }
  .cartList {
    font-size: 15px; }
    .cartList h2 {
      font-size: 16px; }
    .cartList .flexRow .flexCell:nth-child(1) .cell:nth-child(1) {
      padding: 5px; }
    .cartList .productName {
      padding-left: 5px; }
      .cartList .productName p.activityName {
        font-size: 13px; }
      .cartList .productName .shopMoney {
        font-size: 15px; }
        .cartList .productName .shopMoney img {
          width: 90%; }
  .cartListBotton {
    font-size: 15px; }
    .cartListBotton label {
      padding: 6px 10px;
      margin-right: 0;
      margin-left: 5px; }
    .cartListBotton .left > p {
      padding-left: 5px; }
      .cartListBotton .left > p span {
        font-size: 15px; }
    .cartListBotton .bottomRow {
      padding-left: 5px; }
      .cartListBotton .bottomRow .title {
        width: 80px; }
      .cartListBotton .bottomRow span.greenColor {
        font-size: 15px; }
    .cartListBotton .priceRow {
      padding-right: 5px; }
    .cartListBotton .finalPrice {
      font-size: 15px; }
      .cartListBotton .finalPrice .price {
        font-size: 15px; }
  .cartStep {
    font-size: 15px; }
    .cartStep .trangle:after {
      content: ""; }
    .cartStep .customerRow {
      flex-direction: column; }
      .cartStep .customerRow .title {
        width: 100%;
        margin-right: 0;
        margin-bottom: 5px;
        text-align: left; }
      .cartStep .customerRow .value {
        width: 100%; } }