@charset "UTF-8";
/*----------------------------------------

* Jhuang Ping Editor (c) & Management Update
* Version - 1.3 | 2019.06.04

* Github - https://github.com/jhuangping/_JPFrame

----------------------------------------*/
/* Basic ======================================================================*/
.title { font-family: "MyriadPro"; font-size: 2.5rem; padding: 5px 0; display: block; margin: 0px 0 20px 0; font-weight: normal; color: #0eb493; text-align: left; }
.title span { font-size: 2.2rem; color: #808080; }

.subtitle { font-family: "MyriadPro"; font-size: 1.8rem; font-weight: normal; display: block; text-align: left; color: #062033; margin: 0px; }

/* path =======================================================================*/
.path { font-size: 1.3rem; color: #5B656E; justify-content: flex-end; padding: 22px 0; display: flex; flex-wrap: wrap; flex-direction: row; }
.path:before { content: '\f0da'; font-family: "Font Awesome 5 Solid"; color: #1EA78D; margin-right: 8px; }
.path a { color: #5B656E; }
.path a:hover { opacity: .5; }
.path li:after { color: #B1B1B1; }
.path li { display: inline-block; }
.path li:after { content: ">"; font-family: "Font Awesome 5 Solid"; display: inline-block; padding: 0 5px; }
.path li:last-child:after { display: none; }
.path li:first-child:after { display: inline-block; }
article.content:after{content:"";display:block;clear:both}
@media all and (max-width: 992px) { .path { justify-content: flex-start; } }

/* page =======================================================================*/
.page { max-width: 875px; margin: 0 auto; display: flex; justify-content: center; align-items: center; }
.page a { font-size: 1.4rem; padding: 5px; color: #545454; cursor: pointer; }
.page a:hover { opacity: .5; }
.page a.current { color: #1EA78D; font-weight: bold; }
.page a.prev { padding-right: 10px; }
.page a.next { padding-left: 10px; }
.page a.prev:before, .page a.next:before { content: ''; font-family: "Font Awesome 5 Solid"; display: block; opacity: .5; font-size: 20px; }
.page a.prev:before { content: '\f104'; }
.page a.next:before { content: '\f105'; }

/* Banner =====================================================================*/
.banner { position: relative; background: #000; min-height: 131px; }
.banner img { width: 100%; }
@media all and (max-width: 992px) { .banner { min-height: 95px; } }

.slogan { display: flex; justify-content: center; align-items: center; position: absolute; left: 0px; width: 100%; height: 100%; z-index: 99; pointer-events: none; }
.slogan h1 { font-family: "OpenSans"; padding-top: 80px; color: #fff; font-weight: normal; text-align: center; }
.slogan [class*="font"] { display: block; padding: 10px 0; }
.slogan .fontBig { font-size: 52px; line-height: 52px; }
.slogan .fontMin { font-size: 38px; line-height: 38px; }
.slogan .fontSml { font-size: 14px; line-height: 14px; }
.slogan .green { color: #0EDC94; }
.slogan .bothLine { display: flex; justify-content: center; align-items: center; }
.slogan .bothLine:before, .slogan .bothLine:after { content: ''; background: #0EDC94; width: 25px; height: 1px; }
.slogan .bothLine:before { margin-right: 30px; }
.slogan .bothLine:after { margin-left: 30px; }
@media all and (max-width: 480px) { .slogan h1 { padding-top: 30px; }
  .slogan .fontBig { font-size: 30px; line-height: 30px; }
  .slogan .fontMin { font-size: 20px; line-height: 20px; }
  .slogan .fontSml { font-size: 12px; line-height: 12px; } }
@media all and (max-width: 375px) { .slogan .fontBig { font-size: 20px; line-height: 20px; }
  .slogan .fontMin { font-size: 16px; line-height: 16px; }
  .slogan .fontSml { font-size: 12px; line-height: 12px; } }

/* About ======================================================================*/
.history { position: relative; max-width: 740px; margin: 0 auto; padding: 40px 0; }
.history:before { content: ''; position: absolute; top: 0px; left: calc( 50% - 2px ); width: 4px; height: 100%; background: #DBDBDB; }
.history .list { width: 100%; display: flex; align-items: center; margin-top: -30px; padding-bottom: 20px; }
.history .list:first-child { margin-top: 0px; }
.history .list:nth-child(odd) { justify-content: flex-end; }
.history .list:nth-child(odd) .year:before, .history .list:nth-child(odd) .year:after { right: auto; left: -58px; }
.history .box { width: calc( 50% - 50px ); }
.history .year { display: block; color: #D95225; font-size: 3rem; line-height: 1; margin-bottom: 5px; position: relative; }
.history .year:before, .history .year:after { content: ''; right: -58px; position: absolute; background: #858585; }
.history .year:before { width: 14px; height: 14px; border-radius: 100%; top: calc(50% - 7px); }
.history .year:after { width: 50px; height: 2px; top: calc(50% - 1px); }
.history .content { display: block; font-size: 1.5rem; }
@media all and (max-width: 992px) { .history:before { left: 0px; }
  .history .list { margin-top: 0px; }
  .history .list:nth-child(odd) { justify-content: flex-start; }
  .history .list:nth-child(odd) .year:before { left: -35px; right: auto; }
  .history .box { width: 100%; margin-left: 20px; padding: 10px; border-bottom: 1px dotted #DBDBDB; }
  .history .year:before { left: -35px; right: auto; }
  .history .year:after { display: none; } }

/* Products ===================================================================*/
.block-product.mold-grid { padding-bottom: 90px; margin-right: -12px; margin-left: -12px; }
.block-product.mold-grid .item { width: calc(100%/3); padding-left: 12px; padding-right: 12px; margin-bottom: 35px; }
.block-product.mold-grid .item:hover img { transform: scale(1.1); }
.block-product.mold-grid .item:hover .product-name a { color: #41A777; }
.block-product a { display: block; }
@media all and (max-width: 992px) { .block-product.mold-grid .item { width: 50%; } }
@media all and (max-width: 320px) { .block-product.mold-grid .item { width: 100%; } }

.product-pic { border: 1px solid #C0C0C0; }
.product-pic.mold-fix { padding-top: 76.57%; }

.product-name { font-family: "MyriadPro"; font-size: 1.8rem; margin-top: 10px; text-align: center; transition: all .3s; }
.product-name a { color: #202020; }

/* Products List ==============================================================*/
.block-proList.mold-grid { padding-bottom: 90px; margin-right: -12px; margin-left: -12px; }
.block-proList.mold-grid .item { width: calc(100%/4); margin-bottom: 35px; }
.block-proList.mold-grid .item:hover img { transform: scale(1.1); }
.block-proList.mold-grid .item:hover .proList-name a { color: #1EA78D; }
.block-proList a { display: block; }
@media all and (max-width: 992px) { .block-proList.mold-grid .item { width: 50%; } }
@media all and (max-width: 375px) { .block-proList.mold-grid .item { width: 100%; } }

.proList-pic { border: 1px solid #C0C0C0; }
.proList-pic.mold-fix { padding-top: 77.46%; }

.proList-name { font-family: "MyriadPro"; font-size: 1.8rem; margin-top: 10px; text-align: center; transition: all .3s; }
.proList-name a { color: #202020; }

.narrative.edit-box { padding-bottom: 30px; }

/* Products Detail ============================================================*/
.pro-title { font-family: "MyriadPro"; font-weight: bold; font-size: 2.2rem; display: block; padding-bottom: 10px; }

.proDetail-brief { display: flex; flex-wrap: wrap;}
.proDetail-brief .owlpro .owl-nav { position: absolute; top: calc(50% - 12px); width: 100%; margin-top: 0px; }
.proDetail-brief .owlpro .owl-nav [class*=owl-] { margin: 0px; padding: 0px; background: transparent; font-size: 2.5rem; color: #1EA78D; position: absolute; }
.proDetail-brief .owlpro .owl-nav [class*=owl-]:before { content: ''; font-family: "Font Awesome 5 Solid"; opacity: .5; }
.proDetail-brief .owlpro .owl-nav [class*=owl-]:hover { background: transparent; }
.proDetail-brief .owlpro .owl-nav [class*=owl-]:hover:before { color: #fff; opacity: 1; }
.proDetail-brief .owlpro .owl-nav .owl-prev { left: 0px; }
.proDetail-brief .owlpro .owl-nav .owl-prev:before { content: '\f053'; }
.proDetail-brief .owlpro .owl-nav .owl-next { right: 0px; }
.proDetail-brief .owlpro .owl-nav .owl-next:before { content: '\f054'; }
@media all and (max-width: 700px) { /*.proDetail-brief { flex-direction: column; }*/ }

.proDetail-pic { width: 365px; }
@media all and (max-width: 768px) { .proDetail-pic {width: 50%; } }
@media all and (max-width: 576px) { .proDetail-pic {width: 100%; } }

.item-proDetail.mold-fix { padding-top: 100%; }

.proDetail-content { padding-left: 50px; width: calc(100% - 365px); }
@media all and (max-width: 768px) { .proDetail-content { padding: 0 0 0 20px; width: 50%; } }
@media all and (max-width: 576px) { .proDetail-content { padding: 30px 0 0 0; width: 100%; } }

.proDetail-detailed { margin-top: 45px; }
.proDetail-detailed .resp-tab-content { padding: 0px; border: none; border-top: 1px solid #C9C9C9; overflow: hidden; }
.proDetail-detailed .resp-tab-content p { margin: 1.12em 0; }

.proDetail-btnbox { margin-top: 15px; }
.proDetail-btnbox li:nth-child(2) { padding: 35px 0; }
.proDetail-btnbox li:first-child { text-align: left; }
.proDetail-btnbox li:last-child { display: flex; align-items: center; }
.proDetail-btnbox .btn-pro-prev + .btn-pro-next:before { content: ''; display: inline-block; width: 1px; height: 14px; background: #999; margin: 0 15px; }
@media all and (max-width: 700px) { .proDetail-btnbox li { text-align: center; }
  .proDetail-btnbox li:first-child { text-align: center; }
  .proDetail-btnbox li:last-child { justify-content: center; } }

/* Video ======================================================================*/
.block-video.mold-grid { padding-bottom: 90px; margin-left: -12px; margin-right: -12; }
.block-video.mold-grid .item { width: calc(100%/3); margin-bottom: 35px; }
.block-video.mold-grid .item:hover img { transform: scale(1.1); }
.block-video.mold-grid .item:hover .video-name { color: #202020; }
.block-video a { display: block; }
@media all and (max-width: 992px) { .block-video.mold-grid .item { width: 50%; } }
@media all and (max-width: 320px) { .block-video.mold-grid .item { width: 100%; } }

.video-mov { border: 1px solid #C0C0C0; }
.video-mov.mold-fix { padding-top: 58.166%; }

.video-name { font-size: 1.8rem; margin-top: 10px; text-align: center; transition: all .3s; }
.video-name a { color: #202020; }

/* Contact Form*/
.contact-form { padding-top: 35px; font-size: 1.5rem; }
.contact-form .row { display: flex; align-items: center; width: 100%; padding-bottom: 25px; }
.contact-form .row.tab-content { align-items: flex-start; }
.contact-form .row.add { align-items: flex-start; }
.contact-form .row.add .formTd input.address { margin-top: 16px; display: block; }
.contact-form .row.rowEnd { border-bottom: 4px solid #019F6E; padding-bottom: 40px; }
.contact-form .certification { display: flex; justify-content: flex-end; border-bottom: 5px solid #D8D8D8; padding-bottom: 40px; }
.contact-form .certification .formTh { width: calc(100% - 130px); text-align: left; }
.contact-form .verification { background: #fff; padding: 20px 0; border-bottom: 4px solid #019F6E; padding-bottom: 40px; }
.contact-form .verification .formTd { display: flex; align-items: center; }
.contact-form .formTh { width: 130px; text-align: right; padding-right: 20px; }
.contact-form .formTh.red:before { content: '*'; padding-right: 8px; color: #ec6666; }
.contact-form .formTd { width: calc(100% - 130px); }
.contact-form .formTd.colorLine { display: flex; align-items: center; }
.contact-form .formTd.colorLine li { padding-left: 20px; }
.contact-form .formTd.colorLine li:first-child { padding-left: 0px; }
.contact-form .formTd.colorLine li input[type="radio"] { display: none; }
.contact-form .formTd.colorLine li input[type="radio"] + label { position: relative; padding-left: 15px; }
.contact-form .formTd.colorLine li input[type="radio"] + label:before { position: absolute; top: calc(50% - 5px); left: 0px; content: ''; width: 10px; height: 10px; border: 1px solid #B3B3B3; }
.contact-form .formTd.colorLine li input[type="radio"]:checked + label:before { background: #B3B3B3; }
.contact-form .formTd.colorLine li input[type="text"] { max-width: 150px; }
@media all and (max-width: 768px) { .contact-form .formTd.colorLine { flex-wrap: wrap; }
  .contact-form .formTd.colorLine li { margin-top: 20px; width: calc(100%/4 - 20px); }
  .contact-form .formTd.colorLine li:first-child { padding-left: 20px; }
  .contact-form .formTd.colorLine li:last-child { width: 100%; } }
.contact-form .txtName { color: #30664E; }
.contact-form .colName { width: 100px; text-align: center; }
.contact-form input[type="text"], .contact-form input[type="password"], .contact-form select, .contact-form textarea { border: none; background: #E8E8E8; padding: 8px 10px; max-width: 250px; width: 100%; outline: none; }
.contact-form input.name-first { max-width: 150px; }
.contact-form input.name-last { max-width: 200px; }
.contact-form input.address, .contact-form input.w100 { width: calc(90% - 150px); max-width: 100%; }
.contact-form textarea { width: calc(90% - 150px); max-width: 100%; min-height: 100px; }
.contact-form .formSelect { position: relative; display: inline-block; background: #E8E8E8; width: auto; }
.contact-form .formSelect:before, .contact-form .formSelect:after { content: ''; display: block; position: absolute; pointer-events: none; }
.contact-form .formSelect:before { z-index: 2; top: calc(50% - 9px); right: 10px; content: '\f0d7'; font-family: "Font Awesome 5 Solid"; text-align: center; font-size: 12px; color: #FEFEFE; }
.contact-form .formSelect:after { top: calc(50% - 7px); right: 5px; width: 16px; height: 14px; background: #6C6C6C; z-index: 1; }
.contact-form select { position: relative; appearance: none; -moz-appearance: none; -webkit-appearance: none; padding-right: 25px; text-align: center; max-width: inherit; }
.contact-form select.gender { width: 70px; }
.contact-form .fromBtn { display: flex; justify-content: center; padding-top: 40px; }
.contact-form .fromBtn [class^="btn-"] { display: flex; justify-content: center; align-items: center; width: 230px; height: 50px; font-size: 1.6rem; color: #fff; background: #1EA78D; border: none; }
.contact-form .fromBtn [class^="btn-"]:first-child { margin-right: 25px; }
.contact-form .fromBtn [class^="btn-"]:last-child { margin-left: 25px; }
.contact-form .terms { padding-top: 25px; }
.contact-form .terms input { display: none; }
.contact-form .terms input:checked + label:before { background: #333; }
.contact-form .terms label:before { display: inline-block; content: ''; width: 10px; height: 10px; border: 1px solid #333; }
.contact-form .terms a { color: #202020; text-decoration: underline; }
@media all and (max-width: 992px) { .contact-form .row { flex-direction: column; align-items: flex-start; }
  .contact-form .row input, .contact-form .row textarea { width: 100%; max-width: 100%; }
  .contact-form .row input[type="checkbox"] { width: 15px; }
  .contact-form .row select { max-width: 100%; }
  .contact-form .row .formSelect { width: 100%; margin: 10px 0; }
  .contact-form .certification .formTh { width: 100%; }
  .contact-form .formTh { text-align: left; padding-left: 10px; }
  .contact-form .formTd { width: 100%; padding: 0 10px; } }
@media all and (max-width: 425px) { .contact-form .fromBtn [class^="btn-"]:first-child { margin-right: 5px; }
  .contact-form .fromBtn [class^="btn-"]:last-child { margin-left: 5px; }
  .contact-form .verification .formTd { flex-direction: column; }
  .contact-form .verification input { margin-top: 10px; } }

/* Member Form & Shopping Form */
[class^="member-form-"] { margin-top: 30px; }
[class^="member-form-"] [class^="inq-"] { font-size: 1.5rem; text-align: center; color: #202020; }
[class^="member-form-"] [class^="inq-"] a { color: #202020; }
[class^="member-form-"] img { width: auto; max-height: 70px; }
[class^="member-form-"] .tab-headline { display: flex; background: #019F6E; padding: 0 20px; }
[class^="member-form-"] .tab-headline div { color: #fff; line-height: 36px; position: relative; }
[class^="member-form-"] .tab-headline div.sf-number:before { display: none; }
[class^="member-form-"] .tab-headline div:last-child:before { display: none; }
[class^="member-form-"] .row { display: flex; padding: 20px; position: relative; border-bottom: 1px solid #B2B2B2; }
[class^="member-form-"] .row div { display: flex; justify-content: center; align-items: center; }
[class^="member-form-"] .total .row { justify-content: flex-end; padding: 5px 20px; border-bottom: none; }
[class^="member-form-"] .total .row:before { display: none; }
[class^="member-form-"] .total .row:first-child { padding-top: 20px; }
[class^="member-form-"] .total .row:last-child { padding-bottom: 20px; }
[class^="member-form-"] .total .row:last-child:before { display: block; }
[class^="member-form-"] .total .row .inq-annotation { justify-content: flex-end; color: #696969; }
[class^="member-form-"] .total .row .inq-text { width: 90px; justify-content: flex-end; }
[class^="member-form-"] .total input.shopping-gold { width: 30px; padding: 3px; text-align: center; }
[class^="member-form-"] .total input.shopping-offer { width: 70px; padding: 3px; text-align: center; }
[class^="member-form-"] .total .txt-orange { color: #eb6100; }
[class^="member-form-"] .add_up .row { justify-content: flex-end; border-top: 1px solid #B2B2B2; border-bottom: 4px solid #019F6E; }
[class^="member-form-"] .add_up .row:before { display: none; }
[class^="member-form-"] .add_up .row .total_amount { color: #eb6100; font-size: 18px; }
[class^="member-form-"] .fromBtn { display: flex; justify-content: center; margin-top: 30px; }
[class^="member-form-"] [class^="btn-basic-"] { width: 90px; height: 30px; display: flex; justify-content: center; align-items: center; border-radius: 50px; padding: 0 10px; font-size: 15px; }
[class^="member-form-"] [class^="btn-basic-"]:first-child { margin-right: 30px; }
[class^="member-form-"] [class^="btn-basic-"]:last-child { margin-right: 0px; }
[class^="member-form-"] .btn-basic-member { color: #fff !important; background: #479A70; }
[class^="member-form-"] .btn-basic-shopping { color: #fff !important; background: #E78903; }
[class^="member-form-"] .btn-inqDelete:before { content: url(../images/icon/icon-inqDelete.png); display: inline-block; }
[class^="member-form-"] .btn-inqView { color: #fff !important; background: #3C3C3C; border-radius: 50px; padding: 0 10px; }
[class^="member-form-"] .btn-inqJoin { color: #fff !important; background: #E78903; border-radius: 50px; padding: 0 10px; font-size: 13px; }
@media all and (max-width: 992px) { [class^="member-form-"] .tab-headline { display: none; }
  [class^="member-form-"] .row { flex-direction: column; }
  [class^="member-form-"] .row div { padding-bottom: 10px; justify-content: flex-start; }
  [class^="member-form-"] .row [class^="inq-"] { width: 100%; flex-basis: auto; }
  [class^="member-form-"] .row [class^="inq-"]:before { content: ''; display: block; color: #019F6E; padding-right: 12px; }
  [class^="member-form-"] .total .row .inq-text { justify-content: flex-start; }
  [class^="member-form-"] .total .row .inq-annotation { justify-content: flex-start; } }

/* Member ======================================================================*/
[class^="box-member-"] .title { font-weight: normal; margin: 0px; font-size: 40px; line-height: 40px; }
[class^="box-member-"] .title span { font-size: 1.8rem; padding-left: 10px; color: #47996f; }

.box-member-login { width: 100%; display: flex; flex-direction: column; padding: 20px 10px; border: 6px solid #00A06F; background: url("../images/background/member-bg-left.jpg") no-repeat left; }
.box-member-login .login-box { display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; }
.box-member-login .login-box .login-title { padding: 10px 0 20px 0; }
.box-member-login .login-box .login-title .name { font-size: 3rem; line-height: 1; color: #2b2b2b; }
.box-member-login .login-box .login-title .name .sub { display: inline-block; color: #53A17A; font-size: 16px; }
.box-member-login .login-box .login-list { max-width: 470px; width: 100%; position: relative; padding-bottom: 40px; border-bottom: 4px solid #00A06E; }
.box-member-login .login-box .login-list .list { position: relative; padding-bottom: 30px; display: flex; align-items: center; }
.box-member-login .login-box .login-list .list span { flex: 0 0 64px; }
.box-member-login .login-box .login-list .list.verification { padding-bottom: 0px; }
.box-member-login .login-box .login-list .list.verification input { margin-left: 20px; }
.box-member-login .login-box .btn-login { display: flex; justify-content: center; align-items: center; color: #fff; background: #019F6E; width: 125px; height: calc(100% - 40px); position: absolute; top: 0px; right: -155px; }
.box-member-login .login-box input { border: none; background: #E8E8E8; padding: 8px 10px; flex: 0 1 410px; outline: none; }
.box-member-login .button-box { display: flex; justify-content: center; align-items: center; margin-top: 30px; margin-bottom: 5px; position: relative; }
.box-member-login .button-box [class^="btn-features-"] { color: #000; font-size: 15px; display: flex; justify-content: center; align-items: center; margin-right: 30px; }
.box-member-login .button-box [class^="btn-features-"]:before { width: 7px; height: 7px; border-radius: 100%; content: ''; display: inline-block; background: #00A06E; margin-right: 8px; }
.box-member-login .button-box [class^="btn-features-"]:last-child { margin-right: 0px; }
@media all and (max-width: 768px) { .box-member-login { position: relative; background-size: contain; }
  .box-member-login:before { display: inline-block; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.7); content: ''; }
  .box-member-login .login-box .btn-login { position: relative; right: 0px; margin: 30px auto 0 auto; width: 80%; z-index: 1; padding: 15px 0; } }
@media all and (max-width: 425px) { .box-member-login .login-box .login-list .list.verification { flex-wrap: wrap; }
  .box-member-login .login-box .login-list .list.verification input { margin-top: 20px; margin-left: 0px; }
  .box-member-login .button-box { flex-direction: column; }
  .box-member-login .button-box [class^="btn-features-"] { margin-right: 0px; width: 90px; justify-content: flex-start; } }

.fb-box { display: flex; justify-content: center; padding: 30px 0; }

/* join */
/* forget */
.box-member-forget .narrative { padding: 20px 0; }

.forget-mail { margin-bottom: 35px; width: 100%; min-height: 245px; display: flex; align-items: center; padding: 20px 35px; border: 6px solid #00A06F; background: url(../images/background/member_forget-right.jpg) no-repeat right; }
.forget-mail .mail-lists { max-width: 470px; width: 100%; position: relative; padding-bottom: 40px; }
.forget-mail .mail-lists .list { position: relative; padding-bottom: 30px; display: flex; }
.forget-mail .mail-lists .list:first-child { flex-direction: column; }
.forget-mail .mail-lists .list:first-child input { width: 100%; max-width: 430px; }
.forget-mail .mail-lists .list.verification { padding-bottom: 0px; }
.forget-mail .mail-lists .list.verification input { margin-left: 20px; }
.forget-mail input { border: none; background: #E8E8E8; padding: 8px 10px; max-width: 410px; outline: none; }

/* Membership Order */
.member-form-order { padding-bottom: 45px; }
.member-form-order [class^="inq-"] [class^="order_status"] { color: #202020; }
.member-form-order [class^="inq-"] .unatm_block { display: flex; flex-direction: column; padding-top: 10px; color: #8b3333; font-size: 1.4rem; color: #30674b; }
.member-form-order [class^="inq-"] .unatm_block span:first-child { color: #202020; font-size: 1.5rem; }
.member-form-order [class^="inq-"] .unatm_block input { margin-bottom: 12px; background: #e8e8e8; border: none; padding: 5px; width: calc(100% - 10px); }
.member-form-order [class^="inq-"] .unatm_block .ajax_remit { display: inline-block; color: #fff; background: #E78903; border-radius: 50px; padding: 5px 12px; font-size: 1.3rem; line-height: 1; cursor: pointer; }
.member-form-order [class^="inq-"] .unatm_block .ajax_remit:hover { opacity: .7; }
.member-form-order .inq-number { flex: 0 1 30px; }
.member-form-order .inq-numbering { flex: 0 1 150px; }
.member-form-order .inq-time { flex: 0 1 121px; }
.member-form-order .inq-modify { flex: 0 1 121px; }
.member-form-order .inq-amount { flex: 0 1 132px; }
.member-form-order .inq-view { flex: 0 1 132px; }
.member-form-order .inq-cancel { flex: 0 1 132px; }
.member-form-order .inq-status { flex: 0 1 132px; }
.member-form-order .row div .inq-buy input[type="checkbox"] { width: 15px; height: 15px; }
.member-form-order .row .inq-cancel a { color: #633815; }
.member-form-order .row .inq-cancel a:hover { opacity: .5; }
@media all and (max-width: 992px) { .member-form-order .row .inq-number { display: none; }
  .member-form-order .row .inq-numbering:before { content: '訂單編號/'; }
  .member-form-order .row .inq-time:before { content: '建立時間/'; }
  .member-form-order .row .inq-modify:before { content: '修改時間/'; }
  .member-form-order .row .inq-amount:before { content: '訂單金額/'; }
  .member-form-order .row .inq-view:before { content: '檢視/'; }
  .member-form-order .row .inq-cancel:before { content: '取消訂單/'; }
  .member-form-order .row .inq-status:before { content: '狀態/'; } }

/* Membership Order Detail */
.mo-detail-data { display: block; background: #EDEDED; padding: 30px; margin-top: 30px; margin-bottom: 40px; font-size: 1.5rem; }
.mo-detail-data li { padding: 10px 0; border-bottom: 1px solid #D1D1D1; }
.mo-detail-data li:first-child { padding-top: 0px; }
.mo-detail-data li:last-child { padding-bottom: 0px; border-bottom: none; }
.mo-detail-data span { display: inline-block; }
.mo-detail-data span.title { color: #30684B; }
.mo-detail-data .motitle { margin-right: 25px; color: #30674A; }

.result_lis { text-align: center; }
.result_lis span { display: inline-block; }
.result_lis .title { margin-right: 25px; }

.member-form-order-detail { padding-bottom: 45px; }
.member-form-order-detail .inq-number { flex: 0 1 30px; }
.member-form-order-detail .inq-pic { flex: 0 1 146px; }
.member-form-order-detail .inq-name { flex: 0 1 147px; }
.member-form-order-detail .inq-specification { flex: 0 1 125px; }
.member-form-order-detail .inq-temperate { flex: 0 1 125px; }
.member-form-order-detail .inq-quantity { flex: 0 1 125px; }
.member-form-order-detail .inq-member_price { flex: 0 1 125px; }
.member-form-order-detail .inq-subtotal { flex: 0 1 125px; }
.member-form-order-detail .inq-discount { flex: 0 1 125px; }
.member-form-order-detail .row div .inq-buy input[type="checkbox"] { width: 15px; height: 15px; }
.member-form-order-detail .row .inq-pic .mask { display: flex; justify-content: center; align-items: center; width: 65px; height: 65px; position: relative; }
.member-form-order-detail .row .inq-pic .mask:before { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background: url("../images/products-mask.png") no-repeat; background-size: 100%; }
.member-form-order-detail .row .inq-pic img { width: auto; max-height: 45px; }
.member-form-order-detail .row .inq-cancel a { color: #A77B12; }
.member-form-order-detail .row .inq-cancel a:hover { opacity: .5; }
@media all and (max-width: 992px) { .member-form-order-detail .row .inq-number { display: none; }
  .member-form-order-detail .row .inq-specification:before { content: '規格/'; }
  .member-form-order-detail .row .inq-temperate:before { content: '溫層/'; }
  .member-form-order-detail .row .inq-quantity:before { content: '數量/'; }
  .member-form-order-detail .row .inq-member_price:before { content: '價格/'; }
  .member-form-order-detail .row .inq-subtotal:before { content: '小計/'; }
  .member-form-order-detail .row .inq-discount:before { content: '折扣/'; }
  .member-form-order-detail .total .row [class^="inq-"], .member-form-order-detail .add_up .row [class^="inq-"] { text-align: left; justify-content: flex-start !important; }
  .member-form-order-detail .total .row [class^="inq-"]:before, .member-form-order-detail .add_up .row [class^="inq-"]:before { display: none !important; } }

/* Membership Collection */
.member-form-collection { padding-bottom: 45px; }
.member-form-collection .inq-number { flex: 0 1 60px; }
.member-form-collection .inq-pic { flex: 0 1 143px; }
.member-form-collection .inq-name { flex: 0 1 227px; }
.member-form-collection .inq-member_price { flex: 0 1 143px; }
.member-form-collection .inq-join { flex: 0 1 153px; }
.member-form-collection .inq-time { flex: 0 1 163px; }
.member-form-collection .inq-delete { flex: 0 1 101px; }
.member-form-collection .row div .inq-buy input[type="checkbox"] { width: 15px; height: 15px; }
.member-form-collection .row .inq-pic .mask { display: flex; justify-content: center; align-items: center; width: 60px; height: 65px; position: relative; }
.member-form-collection .row .inq-pic .mask:before { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background: url("../images/products-mask.png") no-repeat; background-size: 100%; }
.member-form-collection .row .inq-pic img { width: auto; max-height: 45px; }
@media all and (max-width: 992px) { .member-form-collection .row .inq-number { display: none; }
  .member-form-collection .row .inq-member_price:before { content: '價格/'; }
  .member-form-collection .row .inq-join:before { content: '加入購物車/'; }
  .member-form-collection .row .inq-time:before { content: '收藏時間/'; }
  .member-form-collection .row .inq-delete:before { content: '刪除/'; } }

/* Membership Shoppingmoney */
.member-form-shoppingmoney { padding-bottom: 20px; }
.member-form-shoppingmoney .inq-number { flex: 0 1 30px; }
.member-form-shoppingmoney .inq-numbering { flex: 0 1 192px; }
.member-form-shoppingmoney .inq-points { flex: 0 1 192px; }
.member-form-shoppingmoney .inq-status { flex: 0 1 192px; }
.member-form-shoppingmoney .inq-category { flex: 0 1 192px; }
.member-form-shoppingmoney .inq-activate-time { flex: 0 1 192px; }
.member-form-shoppingmoney .inq-obtain { flex: 0 1 192px; }
@media all and (max-width: 992px) { .member-form-shoppingmoney .row .inq-number { display: none; }
  .member-form-shoppingmoney .row .inq-numbering:before { content: '訂單/'; }
  .member-form-shoppingmoney .row .inq-points:before { content: '點數/'; }
  .member-form-shoppingmoney .row .inq-status:before { content: '狀態/'; }
  .member-form-shoppingmoney .row .inq-category:before { content: '類型/'; }
  .member-form-shoppingmoney .row .inq-activate-time:before { content: '啟用日期/'; }
  .member-form-shoppingmoney .row .inq-obtain:before { content: '時間/'; } }

.member-shoppingmoney-total { color: #346649; }
.member-shoppingmoney-total li { padding: 8px 20px; }
.member-shoppingmoney-total span { color: #000; }

/* Shopping Cart ==============================================================*/
.check-steps { width: 100%; max-width: 800px; margin: 0 auto; display: flex; padding-bottom: 25px; }
.check-steps li { width: calc(100%/4); position: relative; padding: 20px; }
.check-steps li:after { display: inline-block; content: url("../images/arrow/arrow-shopping-cart.png"); position: absolute; top: calc(50% - 17px); right: -15px; }
.check-steps li:last-child:after { display: none; }
.check-steps li:before { display: inline-block; content: ''; width: 135px; height: 135px; border-radius: 100%; border: 3px solid #019F6E; background: transparent; position: absolute; top: -10px; left: calc(50% - 70px); z-index: -1; }
.check-steps li.on_page .row { color: #fff; }
.check-steps li.on_page:before { display: inline-block; content: ''; width: 135px; height: 135px; border-radius: 100%; background: #019F6E; position: absolute; top: -10px; left: calc(50% - 70px); z-index: -1; }
.check-steps .row { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; }
.check-steps .row .title { font-size: 22px; }
.check-steps .row .title .big { font-size: 24px; }
.check-steps .row .text { font-size: 14px; text-align: center; }
@media all and (max-width: 680px) { .check-steps { flex-direction: column; align-items: center; }
  .check-steps li { width: 100%; height: 141px; margin-bottom: 50px; }
  .check-steps li:after { transform: rotate(90deg); top: auto; bottom: -10px; right: calc(50% - 15px); } }

.shopping-distribution { padding: 30px 40px; margin-bottom: 30px; background: #E6E6E6; font-size: 15px; }
.shopping-distribution .row { display: flex; padding-bottom: 20px; position: relative; }
.shopping-distribution .row:last-child { padding-bottom: 0px; }
.shopping-distribution .row.row-area .sd-td { padding-top: 1px; }
.shopping-distribution .row.row-payment .sd-td { padding-top: 5px; }
.shopping-distribution .sd-th { flex: 0 0 90px; color: #31674D; padding-right: 10px; }
.shopping-distribution .sd-td { flex: 0 1 900px; }
@media all and (max-width: 680px) { .shopping-distribution .row { flex-direction: column; }
  .shopping-distribution [class^="sd-"] { flex-basis: auto; }
  .shopping-distribution .sd-td { display: flex; flex-direction: column; } }

.member-form-shoppingCart { padding-bottom: 45px; }
.member-form-shoppingCart .stocks_short { background: #f00; color: #fff; }
.member-form-shoppingCart .inq-number { flex: 0 1 30px; }
.member-form-shoppingCart .inq-pic { flex: 0 1 122px; }
.member-form-shoppingCart .inq-name { flex: 0 1 157px; }
.member-form-shoppingCart .inq-specification { flex: 0 1 151px; }
.member-form-shoppingCart .inq-temperate { flex: 0 1 114px; }
.member-form-shoppingCart .inq-quantity { flex: 0 1 114px; }
.member-form-shoppingCart .inq-member_price { flex: 0 1 114px; }
.member-form-shoppingCart .inq-subtotal { flex: 0 1 114px; }
.member-form-shoppingCart .inq-discount { flex: 0 1 112px; }
.member-form-shoppingCart .inq-delete { flex: 0 1 35px; }
.member-form-shoppingCart .row div .inq-buy input[type="checkbox"] { width: 15px; height: 15px; }
.member-form-shoppingCart .row .inq-pic .mask { display: flex; justify-content: center; align-items: center; width: 60px; height: 65px; position: relative; }
.member-form-shoppingCart .row .inq-pic .mask:before { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background: url("../images/procart-mask.png") no-repeat; background-size: 100%; }
.member-form-shoppingCart .row .inq-pic img { width: auto; max-height: 45px; }
.member-form-shoppingCart .row .inq-cancel a { color: #A77B12; }
.member-form-shoppingCart .row .inq-cancel a:hover { opacity: .5; }
.member-form-shoppingCart .add_up .row { border-bottom: none; }
.member-form-shoppingCart #cartItem13 .total .row:before { position: absolute; left: 0px; bottom: -3px; content: ''; width: 100%; height: 6px; background: url("../images/pro-titleLine.png") repeat; }
.member-form-shoppingCart #cartItem13 .total .row:last-child:before { display: none; }

.shopping-contact-form { border-bottom: 5px solid #019F6C; }

.payment-list li { padding-bottom: 20px; display: flex; }
.payment-list li:last-child { padding-bottom: 0px; }
.payment-list li input { margin-right: 5px; }
.payment-list li label { margin-top: -5px; }

.super-business-address { width: 100%; padding: 15px 0 15px 18px; }
@media all and (max-width: 680px) { .super-business-address { display: flex; flex-direction: column; } }

.shopping-contact-form { margin-bottom: 30px; }

.invoice-list { display: block; padding-top: 35px; padding-bottom: 20px; border-bottom: 5px solid #019F6E; }
.invoice-list li { padding: 0 0px 15px 0px; }
.invoice-list li.title { color: #46735C; }
.invoice-list li span { margin-right: 8px; }
.invoice-list li span:last-child { margin-right: 0px; }
.invoice-list li .category { color: #9A7A23; }
.invoice-list input[type="text"] { border: none; background: #E8E8E8; padding: 8px 10px; max-width: 250px; width: 100%; outline: none; }
.invoice-list textarea { border: none; background: #e9e1d8; padding: 8px 10px; max-width: 100%; width: 100%; min-height: 80px; outline: none; }

.form-step3 { background: #EDEDED; padding: 30px; margin-bottom: 30px; border-bottom: none; }
.form-step3 .row { border-bottom: 1px solid #D1D1D1; padding: 10px 0; }
.form-step3 .formTh { width: 100px; color: #31684B; }
.form-step3 .formTh.txtName { color: #424242; }
.form-step3 li .category { color: #30674A; }
@media all and (max-width: 768px) { .form-step3 .formTh { width: 130px; } }

.complete_order { padding: 30px; margin-bottom: 200px; background: #EDEDED; margin-top: 25px; }
.complete_order .title { font-size: 1.8rem; color: #30684B; margin-bottom: 12px; padding-right: 10px; }
.complete_order .text span { color: #9C7925; }
.complete_order a { color: #000; text-decoration: underline; }

@media all and (max-width: 1024px) { .shopping-cart-form .tab-headline { display: none; }
  .shopping-cart-form .row { flex-direction: column; }
  .shopping-cart-form .row div { padding-bottom: 10px; justify-content: flex-start; }
  .shopping-cart-form .row [class^="inq-"] { width: 100%; }
  .shopping-cart-form .row [class^="inq-"]:before { content: ''; display: block; color: #8b673e; padding-right: 12px; }
  .shopping-cart-form .row .inq-number { display: none; }
  .shopping-cart-form .row .inq-specification:before { content: '規格/'; }
  .shopping-cart-form .row .inq-temperate:before { content: '溫層/'; }
  .shopping-cart-form .row .inq-quantity:before { content: '數量/'; }
  .shopping-cart-form .row .inq-member_price:before { content: '價格/'; }
  .shopping-cart-form .row .inq-subtotal:before { content: '小計/'; }
  .shopping-cart-form .row .inq-discount:before { content: '折扣/'; }
  .shopping-cart-form .row .inq-delete:before { content: '刪除/'; }
  .shopping-cart-form .total .row [class^="inq-"], .shopping-cart-form .add_up .row [class^="inq-"] { text-align: left; justify-content: flex-start !important; }
  .shopping-cart-form .total .row [class^="inq-"]:before, .shopping-cart-form .add_up .row [class^="inq-"]:before { display: none !important; } }
