@charset "UTF-8";
* {
  box-sizing: border-box;
}

input:read-only {
  background-color: #eee;
}

body {
  /* width: 100%; */
  margin: 0;
  padding: 0;
  font-family: "Microsoft JhengHei UI", "Microsoft JhengHei UI Light";
  font-size: 14px;
  color: #626262;
  overflow-x: hidden;
}

p, ul, ol, dl, dt, dd, form {
  margin: 0;
  padding: 0;
}

ul, ol {
  list-style: none;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
  font-size: 14px;
}

img {
  border: 0;
}

a {
  color: #626262;
  text-decoration: none;
}
a:hover {
  color: #765935;
}

.clear {
  height: 0;
  font-size: 0;
  line-height: 0;
  clear: both;
}

* html .clearfix {
  height: 1%;
}

* + html .clearfix {
  height: 1%;
}

.item-box > .item {
  display: flex;
  flex-direction: row;
  width: 100%;
  margin: 10px;
  padding: 10px;
  line-height: 1.2rem;
  background-color: #fff;
  box-shadow: 1px 2px 12px rgba(0, 0, 0, 0.8);
  transition: all 0.3s;
}

@media screen and (max-width: 999px) {
  .item-box > .item {
    margin: 10px 0;
  }
}
.item-box > .item:hover {
  box-shadow: 0 0 8px rgba(45, 45, 45, 0.8);
  transform: translateY(-2px);
}

.item-box > .item dt.pic {
  width: 150px;
  min-width: 150px;
}

@media screen and (max-width: 999px) {
  .item-box > .item dt.pic {
    width: 120px;
    min-width: 120px;
  }
}
@media screen and (max-width: 320px) {
  .item-box > .item dt.pic {
    width: 80px;
    min-width: 80px;
  }
}
.item-box > .item dt.pic > a {
  display: block;
  height: 100%;
}

.item-box > .item dt.pic > a > img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid #ddd;
}

.item-box > .item > div {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding-left: 10px;
}

@media screen and (max-width: 999px) {
  .item-box > .item > div {
    padding-left: 5px;
  }
}
@media screen and (max-width: 413px) {
  .item-box > .item > div {
    margin: 0 0 0 5px;
    padding-left: 0;
    overflow: hidden;
  }
}
.item-box > .item .name {
  display: flex;
  align-items: center;
  min-height: 35px;
  padding: 0 4px;
  font-size: 16px;
}

@media screen and (max-width: 413px) {
  .item-box > .item .name {
    padding: 0;
  }
}
@media screen and (max-width: 320px) {
  .item-box > .item .name {
    min-height: auto;
  }
}
.item-box > .item ._newDiv {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}

.item-box > .item ._newDiv > .pic {
  display: flex;
}

@media screen and (max-width: 413px) {
  .item-box > .item ._newDiv > .pic {
    flex-wrap: wrap;
  }
}
.item-box > .item ._newDiv > .pic > a {
  position: relative;
  display: block;
  width: 27px;
  height: 27px;
  margin-right: 15px;
  border: 1px solid #AB1D33;
  overflow: hidden;
  transition: all 0.3s;
}

.item-box > .item ._newDiv > .pic > a:hover {
  background-color: #AB1D33;
}

.item-box > .item ._newDiv > .pic > a:hover img {
  left: -25px;
}

.item-box > .item ._newDiv > .pic > a > img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  transition: all 0.3s;
}

@media screen and (max-width: 414px) {
  .item-box > .item ._newDiv > .pic > font {
    line-height: 1rem;
  }
}
.item-box > .item .price {
  margin: 4px 0;
}

.item-box > .item .price > div {
  display: flex;
  justify-content: space-between;
  padding: 6px 0 6px 3px;
  font-size: 15px;
}

@media screen and (max-width: 413px) {
  .item-box > .item .price > div {
    flex-wrap: wrap;
  }
}
.item-box > .item .price > dt {
  padding: 6px 0 0 3px;
  font-size: 15px;
}

.item-box > .item .price > .goods-price_box {
  padding-top: 0;
}

.btn2 {
  width: 60px;
  height: 20px;
  font-size: 12px;
  color: #F0DFBE;
  letter-spacing: 2.4pt;
  line-height: 20px;
  text-align: center;
  border: none;
  background: url(images/btn_bg.gif) no-repeat 0px 0px;
}

.btn4 {
  width: 100px;
  height: 20px;
  padding: 0 !important;
  font-size: 12px;
  color: #F0DFBE;
  letter-spacing: 2.4pt;
  line-height: 20px;
  text-align: center;
  border: none;
  background: url(images/btn_bg.gif) no-repeat 0px -30px;
}

.btn8 {
  width: 130px;
  height: 20px;
  font-size: 12px;
  color: #F0DFBE;
  letter-spacing: 2.4pt;
  line-height: 20px;
  text-align: center;
  border: none;
  background: url(images/btn_bg.gif) no-repeat 0px -60px;
}

.btn10 {
  width: 180px;
  height: 20px;
  font-size: 12px;
  color: #F0DFBE;
  letter-spacing: 2.4pt;
  line-height: 20px;
  text-align: center;
  border: none;
  background: url(images/btn_bg.gif) no-repeat 0px -90px;
}

.bnt_order {
  width: 88px;
  height: 20px;
  color: #fff;
  line-height: 21px;
  text-align: center;
  border: none;
  background: url(images/btn_order_query.gif) no-repeat;
  cursor: pointer;
}

.blank {
  height: 8px;
  line-height: 8px;
  visibility: hidden;
  clear: both;
}

.blank5 {
  height: 5px;
  line-height: 5px;
  visibility: hidden;
  clear: both;
}

input[type=text], input[type=password], select {
  border: 1px solid #CCC;
}

/* 主體框架----------------------------------------------- */
#globalWrapper {
  min-height: 300px;
  margin: 0 auto;
  padding-bottom: 50px;
  background-color: #fff;
}

#globalWrapper.noPaddingBottom {
  padding-bottom: 0;
}

@media screen and (max-width: 999px) {
  #globalWrapper {
    width: 100% !important;
  }
}
#wrapper {
  width: 100%;
}

@media screen and (max-width: 999px) {
  #wrapper {
    width: 100% !important;
  }
}
#ontainer-index {
  display: flex;
  width: 100%;
  padding: 108px 20px 0 20px;
}
@media screen and (max-width: 999px) {
  #ontainer-index.column-3 {
    flex-direction: column;
    padding: 20px;
  }
}

#pageIn {
  /* width: calc(100% - 240px); */
  width: 100%;
}

@media screen and (max-width: 999px) {
  #pageIn {
    width: 100% !important;
  }
}
#pageIn td {
  height: 25px;
}

.user-default #wel_name {
  margin-bottom: 5px;
  font-size: 1.2rem;
  color: #333;
}
.user-default .level {
  font-size: 1.2rem;
}
.user-default .basic-info {
  display: flex;
  margin-top: 40px;
}
@media screen and (max-width: 999px) {
  .user-default .basic-info {
    flex-direction: column;
  }
}
.user-default .basic-info li {
  width: 250px;
  margin-right: 10px;
}
@media screen and (max-width: 999px) {
  .user-default .basic-info li {
    width: 100%;
    margin-right: 0;
  }
}
@media screen and (max-width: 999px) {
  .user-default .basic-info li:first-child {
    margin-bottom: 20px;
  }
}
.user-default .basic-info li dt {
  padding: 2px 5px;
  color: #fff;
  background-color: #666;
}
.user-default .basic-info li dd {
  padding: 2px 5px;
  border-bottom: 1px solid #ccc;
}
@media screen and (max-width: 999px) {
  .user-default .basic-info li dd {
    border-bottom: 0;
  }
}
.user-default .announcement h4 {
  margin-bottom: 10px;
  font-size: 1.4rem;
  color: #333;
}
.user-default .announcement .search-box {
  margin-bottom: 20px;
}
.user-default .announcement .search-box form {
  display: flex;
}
.user-default .announcement .search-box input[type=text] {
  width: 300px;
  height: 28px;
  border-radius: 3px;
}
@media screen and (max-width: 999px) {
  .user-default .announcement .search-box input[type=text] {
    width: calc(100% - 95px);
  }
}
.user-default .announcement .search-box input[type=submit] {
  width: 90px;
  height: 28px;
  margin: 0 0 0 5px;
  padding: 0;
  font-size: 1rem;
  font-weight: bold;
  color: #fff;
  line-height: 28px;
  letter-spacing: 0;
  border: 0;
  border-radius: 3px;
  background-color: #666;
}
.user-default .announcement ul li {
  display: flex;
  align-items: flex-start;
  margin-bottom: 12px;
  color: #555;
}
@media screen and (max-width: 999px) {
  .user-default .announcement ul li {
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px dotted #ccc;
  }
}
@media screen and (max-width: 999px) {
  .user-default .announcement ul li:last-child {
    border-bottom: 0;
  }
}
.user-default .announcement ul li span {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 90px;
  flex: 0 0 90px;
  margin-right: 10px;
  border-radius: 3px;
  background-color: #ddd;
}
@media screen and (max-width: 999px) {
  .user-default .announcement ul li span {
    margin-bottom: 5px;
  }
}
.user-default .announcement ul li a:hover {
  color: #aa0000;
}
.user-default .announcement .pager {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 8px;
}
@media screen and (max-width: 999px) {
  .user-default .announcement .pager {
    justify-content: center;
  }
}
.user-default .announcement .pager .page-active {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  padding: 0 5px;
  color: #fff;
  border-radius: 10px;
  background-color: #fba714;
}
.user-default .announcement .pager .page-no {
  padding: 0 5px;
}
.user-default .announcement .pager .page-arrow-prev {
  padding-right: 10px;
}
.user-default .announcement .pager .page-arrow-next {
  padding-left: 10px;
}

.user-default > div {
  color: #999;
}

.user-default > .user-note {
  margin: 5px 0;
  padding: 10px 20px;
  border: 1px solid #B0D8FF;
  background: #F4FAFF;
}

.user-note {
  margin: 30px 0 0 0;
  background-color: #fafffa;
}
.user-note .hello {
  font-size: 1.2rem;
  font-weight: bold;
  color: #000;
  line-height: 36px;
}
.user-note .account-detail {
  font-size: 1rem;
  color: #444444;
  line-height: 28px;
}
.user-note .account-info {
  margin: 10px 0 20px 0;
  font-size: 1rem;
  font-weight: bold;
  line-height: 28px;
  color: #0000ff;
}
.user-note .account-info span {
  display: inline-block;
}
.user-note .notice {
  font-size: 1rem;
  line-height: 1.4rem;
}
.user-note .notice p {
  margin-top: 40px;
  margin-bottom: 10px;
  font-size: 1.4rem;
  font-weight: bold;
  color: #000;
}
.user-note .notice table {
  width: 100%;
  border-collapse: collapse;
}
.user-note .notice table td {
  vertical-align: top;
  padding-bottom: 15px;
}
.user-note .notice table td:first-child {
  width: 36px;
}
.user-note .notice table td ol {
  list-style-position: outside;
  list-style-type: decimal;
  margin: 10px 0 0 1rem;
}
.user-note .notice table td ol li {
  margin-bottom: 10px;
  color: #000;
}
.user-note .notice table td ol li:last-child {
  margin-bottom: 0;
}
.user-note .notice table tr:nth-child(4) {
  color: #000080;
}
.user-note .notice table tr:nth-child(5) {
  color: #000;
}
.user-note .notice table tr:nth-child(5) b {
  color: #ff0000;
}

.user_nav {
  border: 1px solid #ccc;
  border-radius: 15px;
  overflow: hidden;
}
@media screen and (max-width: 999px) {
  .user_nav {
    margin-bottom: 20px;
  }
}
.user_nav h2 {
  display: flex;
  align-items: center;
  padding: 10px 15px;
  font-size: 1rem;
  color: #aa0000;
}
@media screen and (max-width: 999px) {
  .user_nav h2 {
    justify-content: center;
  }
}
@media screen and (max-width: 999px) {
  .user_nav h2::after {
    content: "";
    width: 0;
    height: 0;
    margin-left: 5px;
    border-style: solid;
    border-width: 8px 6px 0 6px;
    border-color: #666 transparent transparent transparent;
  }
}
.user_nav .libTitle {
  height: auto;
}
.user_nav ul {
  padding: 15px 0;
  border-top: 1px solid #e5e5e5;
}
.user_nav ul li {
  margin: 0 15px;
  font-size: 0.9rem;
  border-radius: 5px;
}
.user_nav ul li.current {
  font-weight: bold;
  background-color: #ccc;
}
.user_nav ul li:hover {
  background-color: #ddd;
}
.user_nav ul li a {
  display: block;
  padding: 5px 10px;
  color: #000;
}
.user_nav ul li a::before {
  content: "．";
  margin-right: 5px;
  font-weight: bold;
}

.user-mt-application {
  border-top: 3px solid #ac1d21;
}
.user-mt-application .intro {
  margin: 20px 0;
  font-size: 1rem;
  line-height: 1.6rem;
}
.user-mt-application form {
  margin: 10px 0;
  font-size: 1rem;
}
.user-mt-application .form-column {
  display: flex;
  align-items: center;
  font-weight: bold;
  color: #333;
  border-radius: 0 3px 3px 0;
  background-color: #ffefd2;
}
.user-mt-application .form-column > span {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  margin-right: 10px;
  color: #fff;
  text-align: center;
  border-radius: 3px 0 0 3px;
  background-color: #fba714;
}
.user-mt-application .form-column-content {
  margin: 20px 0 40px 0;
}
.user-mt-application .form-column-content span {
  padding: 5px 10px;
  color: #07b53b;
  border: 1px solid #07b53b;
  border-radius: 5px;
}
.user-mt-application .form-column-content input {
  height: 37px;
  margin: 0 5px;
  padding: 5px 20px;
  font-size: 1rem;
  color: #fff;
  border: none;
  border-radius: 50px;
  background-color: #333;
  transition: all 0.3s;
  cursor: pointer;
}
.user-mt-application .form-column-content--line {
  margin: 30px 0;
}
.user-mt-application .section-title {
  margin-top: 30px;
  font-weight: bold;
  color: #000;
}
.user-mt-application table {
  margin: 10px 0 40px 0;
}
.user-mt-application table th {
  width: 120px;
  padding: 5px 0;
  font-weight: normal;
  color: #000;
  text-align: left;
  vertical-align: middle;
}
.user-mt-application table td {
  padding: 5px 0;
  vertical-align: middle;
}
.user-mt-application table td b {
  color: #0000ff;
}
.user-mt-application table td select, .user-mt-application table td input {
  width: 300px !important;
  height: calc(1.5em + 0.75rem + 2px);
  padding: 0.275rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #495057;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
@media screen and (max-width: 999px) {
  .user-mt-application table td select, .user-mt-application table td input {
    width: 100% !important;
  }
}
.user-mt-application table td select + small, .user-mt-application table td input + small {
  padding-left: 10px;
}
@media screen and (max-width: 999px) {
  .user-mt-application table td select + small, .user-mt-application table td input + small {
    padding-left: 0;
  }
}
.user-mt-application table td select {
  width: 120px !important;
}
@media screen and (max-width: 999px) {
  .user-mt-application table td select {
    width: 100% !important;
    margin-bottom: 5px;
  }
}
.user-mt-application .result {
  padding: 50px 20px;
  font-size: 16px;
  font-weight: bold;
  color: #000;
  text-align: center;
}
.user-mt-application .result .success {
  display: flex;
  width: 80px;
  height: 80px;
  margin: 0 auto 10px auto;
  padding: 5px;
  border-radius: 50px;
  border: 1px solid #07b53b;
  background-color: #fff;
  overflow: hidden;
}
.user-mt-application .result .success b {
  border-radius: 50px;
  background-color: #07b53b;
}
.user-mt-application .result .error {
  display: flex;
  width: 80px;
  height: 80px;
  margin: 0 auto 10px auto;
  padding: 5px;
  border-radius: 50px;
  border: 1px solid #990000;
  background-color: #fff;
  overflow: hidden;
}
.user-mt-application .result .error b {
  border-radius: 50px;
  background-color: #990000;
}
.user-mt-application .result img {
  max-width: 100%;
}
.user-mt-application .warning {
  display: flex;
  font-size: 0.9rem;
  color: #ff0000;
  line-height: 1.4rem;
}
.user-mt-application .warning::before {
  content: "*";
  flex: 0 0 15px;
  width: 15px;
}
@media screen and (max-width: 640px) {
  .user-mt-application .warning {
    padding: 0;
  }
}

.transfer-record {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
@media screen and (max-width: 999px) {
  .transfer-record {
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 10px;
    line-height: 1.6rem;
  }
}
.transfer-record span {
  margin-right: 20px;
  font-size: 1rem;
}
.transfer-record a {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 2px 10px;
  font-size: 0.9rem;
  font-weight: normal;
  color: #fff;
  border-radius: 3px;
  background-color: #f39a00;
}
.transfer-record a:hover {
  background-color: #ef921b;
}

#user_order_list {
  margin-bottom: 50px;
  overflow-x: auto;
}
#user_order_list table {
  width: 100%;
  border-top: 3px solid #ac1d21;
  border-spacing: 0;
}
#user_order_list table tr:hover td {
  background-color: #e1f4ff;
}
#user_order_list table th, #user_order_list table td {
  padding: 8px 10px;
}
#user_order_list table th {
  font-size: 1rem;
  color: #333;
  background-color: #ececec;
}
#user_order_list table th:first-child {
  min-width: 100px;
}
#user_order_list table th:nth-child(2) {
  min-width: 150px;
}
#user_order_list table th:nth-child(3) {
  min-width: 120px;
}
#user_order_list table th:nth-child(4) {
  min-width: 120px;
}
#user_order_list table td {
  font-size: 0.9rem;
  text-align: center;
}

.user__order-list ul.tabs {
  display: flex;
  overflow-x: auto;
}
.user__order-list ul.tabs li {
  flex: 0 0 auto;
  position: relative;
  height: 30px;
  margin-right: 1px;
  line-height: 30px;
  border-radius: 5px 5px 0 0;
  background: #e1e1e1;
  overflow: hidden;
}
.user__order-list ul.tabs li a {
  display: block;
  padding: 0 20px;
  white-space: nowrap;
  color: #000;
}
@media screen and (max-width: 999px) {
  .user__order-list ul.tabs li a {
    padding: 0 10px;
  }
}
.user__order-list ul.tabs li a:hover {
  background-color: #ccc;
}
.user__order-list ul.tabs li.active  {
  background-color: #ac1d21;
}
.user__order-list ul.tabs li.active a {
  color: #fff;
}
.user__order-list ul.tabs li.active a:hover {
  background-color: #ac1d21;
  cursor: default;
}
.user_all_order {
  margin-bottom: 50px;
  overflow-x: auto;
}
.user_all_order table {
  width: 100%;
  border-top: 3px solid #ac1d21;
  border-spacing: 0;
}
.user_all_order table tr:hover td {
  background: #e1f4ff;
}
.user_all_order table th, .user_all_order table td {
  padding: 8px 10px;
}
.user_all_order table th {
  font-size: 1rem;
  color: #333;
  text-align: left;
  background-color: #ececec;
}
.user_all_order table th:nth-child(1) {
  min-width: 180px;
}
.user_all_order table th:nth-child(2) {
  min-width: 270px;
}
.user_all_order table th:nth-child(3) {
  min-width: 165px;
}
.user_all_order table th:nth-child(4) {
  min-width: 100px;
  text-align: right;
}
.user_all_order table th:nth-child(5) {
  min-width: 175px;
}
.user_all_order table th:nth-child(6) {
  min-width: 160px;
  text-align: center;
}
.user_all_order table th:nth-child(7) {
  text-align: center;
  min-width: 65px;
}
.user_all_order table td {
  font-size: 0.9rem;
}
.user_all_order table td:first-child a {
  color: #0000ff;
}
.user_all_order table td:nth-child(2) {
  text-align: left;
  overflow: hidden;
}
.user_all_order table td:nth-child(2) img {
  margin-right: 5px;
}
.user_all_order table td:nth-child(4) {
  text-align: right;
}
.user_all_order table td:nth-child(6) {
  text-align: center;
}
.user_all_order table td:nth-child(6) img {
  height: 16px;
}
.user_all_order table td:nth-child(7) {
  text-align: center;
}

.money-detail {
  display: flex;
}
@media screen and (max-width: 999px) {
  .money-detail {
    flex-direction: column;
  }
}
.money-detail li {
  margin-right: 10px;
}
@media screen and (max-width: 999px) {
  .money-detail li {
    margin-right: 0;
  }
}
.money-detail li::after {
  content: "/";
  margin-left: 10px;
}
@media screen and (max-width: 999px) {
  .money-detail li::after {
    content: "";
    margin-left: 0;
  }
}
.money-detail li:last-child {
  margin-right: 0;
}
.money-detail li:last-child::after {
  content: "";
  margin-left: 0;
}

#money_order_list {
  overflow-x: auto;
}
#money_order_list > table {
  width: 100%;
  border-top: 3px solid #ac1d21;
  border-spacing: 0;
}
#money_order_list > table tr:hover td {
  background-color: #e1f4ff;
}
#money_order_list > table td > table {
  width: 100%;
}
#money_order_list > table td > table th {
  padding: 4px 10px;
  color: #fff;
  background-color: #f39a00;
}
#money_order_list > table td > table th:first-child {
  min-width: 180px;
}
#money_order_list > table td > table th:nth-child(2) {
  min-width: 150px;
}
#money_order_list > table td > table th:nth-child(3) {
  min-width: 120px;
}
#money_order_list > table td > table td {
  padding: 4px 10px;
  border-bottom: 0;
}
#money_order_list > table td > table td:nth-child(3) {
  text-align: right;
}
#money_order_list th, #money_order_list td {
  padding: 8px 10px;
}
#money_order_list th {
  font-size: 1rem;
  color: #333;
  background-color: #ececec;
}
#money_order_list th:first-child {
  min-width: 120px;
}
#money_order_list th:nth-child(2) {
  min-width: 120px;
}
#money_order_list td {
  font-size: 0.9rem;
  text-align: center;
  border-bottom: 1px solid #eee;
}

.marketing-channel--switch {
  padding: 30px;
  border: 2px solid #fba714;
  border-radius: 5px;
}
.marketing-channel--switch > div {
  margin-bottom: 40px;
}
.marketing-channel--switch > div:first-child {
  margin-top: 10px;
}
.marketing-channel--switch > div:last-child {
  margin-bottom: 0;
}
.marketing-channel > div.identity {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding-top: 20px;
  font-size: 1rem;
  font-weight: bold;
  border-top: 3px solid #ac1d21;
}
.marketing-channel > div.identity .function-line {
  display: flex;
}
.marketing-channel > div.identity .function-line a {
  margin-left: 10px;
  padding: 2px 10px;
  font-size: 0.9rem;
  font-weight: normal;
  color: #555;
  border: 1px solid #bbb;
  border-radius: 3px;
  background-color: #ddd;
  box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
}
.marketing-channel > div.identity .function-line a:hover {
  background-color: #e8e8e8;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.15);
}
.marketing-channel > div.selected {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
  font-size: 1rem;
  color: #333;
  border-radius: 3px;
  background-color: rgba(251, 167, 20, 0.2);
  overflow: hidden;
}
@media screen and (max-width: 999px) {
  .marketing-channel > div.selected {
    align-items: flex-start;
  }
}
.marketing-channel > div.selected label {
  position: relative;
  padding: 10px;
  margin-right: 20px;
  font-weight: bold;
  color: #fff;
  background-color: #fba714;
}
.marketing-channel > div.selected label::after {
  content: "";
  position: absolute;
  top: 12px;
  right: -8px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8px 0 8px 8px;
  border-color: transparent transparent transparent #fba614;
}
@media screen and (max-width: 999px) {
  .marketing-channel > div.selected span {
    margin-top: 10px;
  }
}
@media screen and (max-width: 999px) {
  .marketing-channel > div.selected b {
    margin-top: 10px;
  }
}
.marketing-channel > div p {
  font-size: 1rem;
  font-weight: bold;
  color: #333;
}
.marketing-channel > div ul {
  display: flex;
  flex-wrap: wrap;
}
.marketing-channel > div ul li {
  display: flex;
  align-items: center;
  flex: 0 0 calc((100% - 60px) / 3);
  margin-right: 30px;
  padding: 15px;
  font-size: 1rem;
  color: #333;
  cursor: pointer;
  border-bottom: 1px dotted #ccc;
}
@media screen and (max-width: 999px) {
  .marketing-channel > div ul li {
    flex: 0 0 100%;
    margin-right: 0;
  }
}
.marketing-channel > div ul li:nth-child(3n) {
  margin-right: 0;
}
@media screen and (max-width: 999px) {
  .marketing-channel > div ul li:last-child {
    border-bottom: 0;
  }
}
.marketing-channel > div ul li:hover {
  background-color: rgba(251, 167, 20, 0.1);
}
.marketing-channel > div span {
  display: flex;
  justify-content: center;
  align-content: center;
  width: 30px;
  margin-right: 10px;
  font-weight: bold;
  color: #fff;
  border-radius: 5px;
  background-color: #37bd59;
}
@media screen and (max-width: 999px) {
  .marketing-channel > div span {
    margin-right: 5px;
  }
}

.customer-repair .identity {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding-top: 20px;
  font-size: 1rem;
  font-weight: bold;
  border-top: 3px solid #ac1d21;
}
.customer-repair .identity .function-line {
  display: flex;
}
.customer-repair .identity .function-line a {
  margin-left: 10px;
  padding: 2px 10px;
  font-size: 0.9rem;
  font-weight: normal;
  color: #555;
  border: 1px solid #bbb;
  border-radius: 3px;
  background-color: #ddd;
  box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
}
.customer-repair .identity .function-line a:hover {
  background-color: #e8e8e8;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.15);
}
.customer-repair--switch .tabs {
  display: flex;
}
.customer-repair--switch .tabs li {
  padding: 8px 15px;
  font-size: 1rem;
  font-weight: bold;
  border-radius: 5px 5px 0 0;
  background-color: rgba(251, 167, 20, 0.2);
  cursor: pointer;
}
.customer-repair--switch .tabs li.active {
  background-color: #fba714;
}
.customer-repair--switch .tabs li.active a {
  color: #fff;
}
.customer-repair--switch .tab_container {
  padding: 30px;
  border: 2px solid #fba714;
  border-radius: 0 5px 5px 5px;
}
.customer-repair--switch .tab_container .tab_content > div {
  margin-bottom: 30px;
  padding-bottom: 20px;
  border-bottom: 1px solid #eee;
}
.customer-repair--switch .tab_container .tab_content > div:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}
.customer-repair--switch .tab_container .tab_content > div.search-bar {
  display: flex;
}
.customer-repair--switch .tab_container .tab_content > div.search-bar input {
  flex: 0 0 240px;
  width: 240px;
  height: calc(1.5em + 0.75rem + 2px);
  margin: 0;
  padding: 0.275rem 0.75rem;
  font-size: 1rem;
  color: #495057;
  border: 1px solid #ced4da;
  border-radius: 3px 0 0 3px;
}
@media screen and (max-width: 999px) {
  .customer-repair--switch .tab_container .tab_content > div.search-bar input {
    flex: 0 0 calc(100% - 60px);
    width: calc(100% - 60px);
  }
}
.customer-repair--switch .tab_container .tab_content > div.search-bar button {
  flex: 0 0 60px;
  width: 60px;
  height: calc(1.5em + 0.75rem + 2px);
  padding: 0.275rem 0.75rem;
  font-size: 1rem;
  border: 1px solid #ced4da;
  border-left: 0;
  border-radius: 0 3px 3px 0;
  cursor: pointer;
}
.customer-repair--switch .tab_container p {
  display: flex;
  margin-bottom: 10px;
  font-size: 1rem;
  font-weight: bold;
  color: #333;
}
.customer-repair--switch .tab_container p span {
  display: flex;
  justify-content: center;
  align-content: center;
  width: 30px;
  margin-right: 10px;
  font-weight: bold;
  color: #fff;
  border-radius: 5px;
  background-color: #37bd59;
}
@media screen and (max-width: 999px) {
  .customer-repair--switch .tab_container p span {
    margin-right: 5px;
  }
}
.customer-repair--switch .tab_container ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.customer-repair--switch .tab_container ul li {
  display: flex;
  align-items: center;
  width: calc((100% - 60px) / 3);
  padding: 5px 0;
  font-size: 1rem;
  cursor: pointer;
}
@media screen and (max-width: 999px) {
  .customer-repair--switch .tab_container ul li {
    width: 100%;
  }
}
.customer-repair--switch .tab_container ul li:hover {
  color: #aa0000;
}
.customer-repair--switch .tab_container ul li:hover::before {
  background-color: #999;
}
.customer-repair--switch .tab_container ul li::before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  margin-right: 10px;
  background-color: #ccc;
}

#pageIn .user_profile_data tr > td {
  background-color: white;
}

#pageIn .user_profile_data tr > td:first-child {
  width: 30%;
  text-align: right;
}

#pageIn .user_profile_data tr > td:last-child {
  width: 70%;
  text-align: left;
}

#pageIn .user_profile_data tr > td input[type=text], #pageIn .user_profile_data tr > td input[type=password] {
  width: 80%;
  padding: 3px 5px;
}

#pageIn .user_profile_data tr > td select {
  padding: 3px 5px;
}

#pageIn .user_profile_data tr:last-child > td {
  text-align: center;
}

#pageIn #com_v {
  padding: 6px;
  overflow: hidden;
}

@media screen and (max-width: 999px) {
  #pageIn #com_v > div {
    width: 100% !important;
  }
}
@media screen and (max-width: 999px) {
  #pageIn #com_v img {
    width: 100% !important;
  }
}
@media screen and (max-width: 999px) {
  #pageIn #com_v iframe {
    width: 100% !important;
  }
}
#pageIn #com_v table tr:nth-child(odd) {
  background-color: #fff;
}

#pageIn #com_v table tr:nth-child(even) {
  background-color: #e6e6e6;
}

#pageIn #com_v table td {
  background-color: unset;
}

@media screen and (max-width: 999px) {
  #pageIn #com_v .img_initial {
    width: initial !important;
  }
}
#pageIn #ECS_COMMENT {
  padding: 7px;
}

#pageIn #ECS_COMMENT .commentsList {
  margin-top: 20px;
}

#pageIn #ECS_COMMENT .commentsList #commentForm ul {
  display: flex;
  flex-direction: column;
  padding: 5px 0;
  border-top: 1px solid #DADADA;
}

#pageIn #ECS_COMMENT .commentsList #commentForm ul li {
  display: flex;
  min-height: 35px;
  padding: 5px 0;
  font-size: 15px;
}

#pageIn #ECS_COMMENT .commentsList #commentForm ul li:last-child {
  padding-top: 5px;
  border-top: 1px solid #DADADA;
}

#pageIn #ECS_COMMENT .commentsList #commentForm ul li:last-child p {
  width: 100%;
  margin-left: 80px;
}

#pageIn #ECS_COMMENT .commentsList #commentForm ul li p:first-child {
  display: flex;
  align-items: center;
  min-width: 80px;
}

@media screen and (max-width: 999px) {
  #pageIn #ECS_COMMENT .commentsList #commentForm ul li p:first-child {
    align-items: baseline;
  }
}
#pageIn #ECS_COMMENT .commentsList #commentForm ul li p:last-child {
  display: flex;
  align-items: center;
}

#pageIn #ECS_COMMENT .commentsList #commentForm ul li p:last-child > img {
  height: 100%;
  cursor: pointer;
}

#pageIn #ECS_COMMENT .commentsList #commentForm ul li p .textInput {
  margin: 0 10px 0 0;
  padding: 4px 5px;
}

#pageIn #ECS_COMMENT .commentsList #commentForm ul li p #content {
  width: 100%;
}

#pageIn #ECS_COMMENT .commentsList #commentForm ul li:nth-child(5) > p:first-child {
  align-items: baseline;
}

#pageIn #ECS_COMMENT .commentsList #commentForm ul li div {
  display: flex;
}

#pageIn #ECS_COMMENT .commentsList #commentForm ul li div > dt {
  display: flex;
  align-items: center;
}

@media screen and (max-width: 999px) {
  #pageIn #ECS_COMMENT .commentsList #commentForm ul li > div {
    flex-direction: column;
  }
}
#pageIn #ECS_COMMENT .commentsList #commentForm ul li input[id*=_rank] + img {
  max-width: 120px;
}

@media screen and (max-width: 999px) {
  #pageIn .box {
    margin-top: 40px;
  }
}
@media screen and (max-width: 999px) {
  #pageIn .box #com_b h2 {
    width: 20%;
    padding: 0 3.5px;
  }
}
@media screen and (max-width: 999px) {
  #pageIn .box #com_b h2:last-child {
    margin: 0;
  }
}
@media screen and (max-width: 999px) {
  #pageIn .box #com_b .h2bg {
    height: 32px;
    border: 0;
    background-color: #EEE;
  }
}
@media screen and (max-width: 999px) {
  #pageIn .box #com_v img {
    height: initial;
    margin: 0;
  }
}
@media screen and (max-width: 999px) {
  #pageIn .box #com_v iframe {
    margin: 5px 0;
  }
}
@media screen and (max-width: 999px) {
  #pageIn #user_merge_order > li:first-child > dt {
    float: none;
    width: 98%;
    margin: 0 auto;
    overflow: hidden;
  }
}
#pageIn-article {
  width: 980px;
  margin: 0 auto;
  overflow: hidden;
}

#pageIn-article #ECS_COMMENT .commentsList #commentForm ul li input[id*=_rank] + img {
  max-width: 120px;
}

.adDiv {
  margin: 10px 0px;
}

.adBorder td {
  border: #e0e0e0 1px solid;
}

#subNav {
  height: 26px;
  font-size: 14px;
  color: white;
  line-height: 30px;
  background-color: #AB1D33;
}

#subNav td {
  text-align: center;
  border-right: 1px solid #FFF;
}

#subNav .qSearch {
  width: 190px;
  padding-left: 10px;
  text-align: left;
  background-color: #AB1D33;
}

#subNav .qSearch td {
  border-right: 0px solid #FFF;
}

#subNav .qSearch .textbox-search {
  width: 145px;
  padding: 1px 2px;
  color: #AA0000;
  border-top: 1px solid #AB1D33;
  border-right: 10px solid #AB1D33;
  border-bottom: 1px solid #AB1D33;
  border-left: 1px solid #AB1D33;
}

#subNav a:visited, #subNav a:link {
  color: #FFFFFF;
}

#subNav a:hover {
  color: #ffaf45;
}

/* Library:通用結構----------------------------------------------- */
ul.contentDiv {
  padding-left: 155px;
}

.libDiv .more {
  position: absolute;
  top: 1px;
  right: 0;
}

/* - 內頁左側 - */
#pageLeft .libDiv {
  color: #aa0000;
}
#pageLeft .libDiv h2 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 0 5px 10px;
  font-size: 18px;
  font-weight: bold;
  color: #303030;
  border-bottom: 1px solid #ab1d33;
}

.history {
  border-bottom: 3px solid #d5163d;
}
.history h2 {
  width: 148px;
  height: 32px;
  margin-right: 5px;
  font-size: 14px;
  color: #fff;
  line-height: 32px;
  text-align: center;
  background: #d5163d;
}
@media screen and (max-width: 999px) {
  .history h2 {
    margin-right: 3px;
  }
}
.history .h2bg {
  width: 146px;
  height: 31px;
  color: #666;
  line-height: 31px;
  border: 1px solid #ddd;
  border-bottom: none;
  background: none;
}
.history li {
  width: 100%;
}

#pageLeft div + .history-list {
  margin-top: 60px;
}
@media screen and (max-width: 999px) {
  #pageLeft .history-list {
    width: 100% !important;
    padding: 20px;
  }
}

.history-list {
  color: #aa0000;
}
.history-list h2 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 0 20px 0;
  padding: 0 0 5px 10px;
  font-size: 18px;
  font-weight: bold;
  color: #303030;
  border-bottom: 1px solid #ab1d33;
}

#history_list ul {
  display: flex;
  margin-bottom: 10px;
  padding: 0 10px 10px 10px;
  border-bottom: 1px solid #ddd;
}
#history_list ul:last-child {
  border-bottom: 0;
}
#history_list li {
  font-size: 12px;
}
#history_list li.goodsimg {
  width: 50px;
  min-width: 50px;
  height: 50px;
  margin-right: 10px;
}
#history_list li.goodsimg img {
  display: block;
  width: 100%;
}
#history_list li.goodsdescribe {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
#history_list li.goodsdescribe a {
  display: block;
}
#history_list li.goodsdescribe strong {
  font-size: 14px;
}
#history_list li.goodsdescribe strong span.unit {
  margin-left: 5px;
  font-size: 12px;
  color: #626262;
}
#history_list > p {
  margin: 0 0 0 10px;
}

#clear_history {
  display: block;
  width: 40px;
  font-size: 14px;
  font-weight: normal;
  color: #fff;
  text-align: center;
  border-radius: 5px;
  background: #aaa;
  cursor: pointer;
}

div#ECS_CARTINFO a {
  display: block;
  padding-left: 5px;
  font-family: "Century Gothic", "Helvetica", "Microsoft JhengHei", sans-serif;
  font-size: 20px;
  color: #ea5413;
}

/* LIBRARY:庫樣式集----------------------------------------------- */
ul.top10 {
  position: relative;
}
ul.top10 li {
  display: flex;
  padding: 10px 0;
  font-size: 12px;
  border-bottom: 1px solid #ddd;
}
ul.top10 li:last-child {
  border-bottom: 0;
}
ul.top10 li .ranking {
  margin-right: 5px;
}
ul.top10 li .ranking span {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  font-size: 12px;
  color: #fff;
  border-radius: 3px;
  background-color: #ab1d33;
}
ul.top10 li .ranking--black span {
  background-color: #000;
}
ul.top10 li .samllimg {
  margin-right: 5px;
}
ul.top10 li .samllimg img {
  width: 35px;
  height: 35px;
}
ul.top10 li p {
  font-size: 14px;
  font-weight: bold;
}
ul.top10 li p .unit {
  margin-left: 5px;
  font-size: 12px;
  color: #626262;
}

ul.top10 #myship-list {
  background: #F1F1F1;
  padding: 5px 20px;
  margin-top: 20px;
}

#myship {
  margin: 0 auto 30px auto;
}

#myship .myship-title {
  background: #DADADA;
}

#myship td {
  padding: 5px 10px;
  border-bottom: 1px dotted #DADADA;
}

#myship .colum1 {
  background: #F7F7F7;
}

#myship .colum2 {
  background: #F1F1F1;
}

#price-grade {
  margin: 0;
  padding: 0;
  list-style: none;
}

#price-grade li {
  margin: 0 0 5px 8px;
  padding-left: 10px;
  font: 12px Arial;
  background: url(images/arrow_orange.gif) no-repeat left center;
}

#price-grade #price-grade-current {
  color: #333;
  background: url(images/arrow_black.gif) no-repeat left center;
}

#pwd_lower, #pwd_middle, #pwd_high {
  border-bottom: 2px solid #DADADA;
}

.activity-list {
  margin: 10px auto;
  border: 1px solid #DADADA;
  border-top: 3px solid #F1EDE4;
  border-collapse: collapse;
}

.activity-list th {
  width: 140px;
  padding: 3px 10px;
  text-align: left;
  vertical-align: top;
  background: #F1F1F1;
}

.activity-list td {
  padding: 3px 10px;
  vertical-align: top;
}

.activity-list td a {
  color: #2359B1;
}

.activity-list td a:hover {
  text-decoration: underline;
}

.commentsList .textInput {
  margin-left: 10px;
  padding: 1px 2px;
  color: #000000;
  border: 1px solid #CCCCCC;
}

/* LIBRARY:bought_notes 購買記錄----------------------------------------------- */
.boughtNotes {
  margin-bottom: 15px;
}

.boughtNotes #buy_pagebar {
  text-align: right;
}

.boughtNotes .globalTitle span {
  float: right;
  font-size: 12px;
  font-weight: normal;
}

.boughtNotes .thead td {
  border-bottom: 2px solid #D7D7D7;
  font-weight: 600;
}

.boughtNotes .alt1 td {
  border-bottom: 1px dotted #C6C6C6;
  background: none repeat scroll 0 0 #F8F8F8;
  color: #676767;
}

.boughtNotes .alt2 td {
  border-bottom: 1px dotted #C6C6C6;
  color: #676767;
}

/* LIBRARY:brands 品牌中心----------------------------------------------- */
#brands {
  padding-left: 10px;
}

#brands img {
  float: left;
  width: 80px;
  height: 33px;
  margin: 3px 1px;
}

#brands a {
  margin: 2px;
  color: #0069cd;
  text-decoration: none;
}

/* LIBRARY:推薦商品-促銷商品----------------------------------------------- */
.proRecommend {
  height: 90px;
}

.proRecommend .pic {
  float: left;
  width: 85px;
  margin-right: 6px;
}

.proRecommend .pic img {
  width: 85px;
  height: 80px;
}

.proRecommend .name {
  float: right;
  width: 70px;
  padding-right: 5px;
}

.proRecommend .price {
  float: right;
  width: 70px;
  padding-right: 5px;
}

.goodsRecommend {
  display: flex;
  flex-direction: column;
  margin-bottom: 30px;
  list-style-type: none;
  color: #626262;
}

.goodsRecommend h2 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 35px;
  margin-bottom: 20px;
  font-size: 17px;
  font-weight: bold;
  color: #414141;
}

.goodsRecommend .orange {
  margin-left: 10px;
}

.goodsRecommend .more {
  height: 100%;
}

.goodsRecommend .more a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 60px;
  height: 100%;
  font-size: 15px;
  font-weight: normal;
  color: #fff;
}

.goodsRecommend ul {
  display: flex;
  flex-wrap: wrap;
}

.goodsRecommend li {
  display: flex;
  width: 47.6%;
  margin: 1.2%;
  padding: 10px;
  font-size: 15px;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(100, 100, 100, 0.4);
  transition: all 0.3s;
}

@media screen and (max-width: 999px) {
  .goodsRecommend li {
    width: 95%;
    margin: 2% 2.5%;
  }
}
.goodsRecommend li:hover {
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.5);
  transform: translateY(-16px) scale(1.2);
}

.goodsRecommend li > a {
  display: flex;
  width: 100%;
}

.goodsRecommend li > a:hover {
  color: #626262;
}

.goodsRecommend.hot h2 {
  border-bottom: 1px solid #F39800;
  border-left: 5px solid #F39800;
}

.goodsRecommend.hot .more a {
  background-color: #F39800;
}

.goodsRecommend.new h2 {
  border-bottom: 1px solid #AB1D33;
  border-left: 5px solid #AB1D33;
}

.goodsRecommend.new .more a {
  background-color: #AB1D33;
}

.goodsRecommend.best h2 {
  border-bottom: 1px solid #AB1D33;
  border-left: 5px solid #AB1D33;
}

.goodsRecommend.best .more a {
  background-color: #AB1D33;
}

.hot_goods-pic {
  width: 150px;
  min-width: 150px;
  margin-right: 15px;
}

@media screen and (max-width: 999px) {
  .hot_goods-pic {
    width: 120px;
    min-width: 120px;
  }
}
.hot_goods-pic img {
  width: 100%;
  height: auto;
}

.hot_goods-desc {
  width: 80%;
}

.hot_goods-desc > div {
  display: flex;
  justify-content: space-between;
  padding-bottom: 20px;
}

@media screen and (max-width: 999px) {
  .hot_goods-desc > div {
    padding-bottom: 10px;
  }
}
.table-div {
  padding: 5px;
  background-image: url(images/table_bg.gif);
}

.re-goods-price {
  color: #AA0000;
}

@media screen and (max-width: 999px) {
  .re-goods-price {
    color: #f53b3b;
  }
}
.goods-price {
  color: #ea5413;
}

.market-price, .market {
  color: #AA0000;
}

.market-price1, .market {
  color: #ea5413;
}

.goods-table {
  width: 140px;
  height: 200px;
  margin: 5px;
  text-align: center;
  background-color: #DADADA;
}

.goods-table td {
  vertical-align: top;
  background-color: #FFF;
}

.re_goods-table {
  width: 140px;
  height: 150px;
  margin: 5px;
  text-align: center;
  background-color: #DADADA;
}

.re_goods-table td {
  vertical-align: top;
  background-color: #FFF;
}

#com_v .titleDiv {
  padding: 5px;
  font-size: 16px;
  font-weight: bold;
}

#com_v .related_products {
  width: 25%;
  padding: 5px;
}

@media screen and (max-width: 999px) {
  #com_v .related_products {
    width: 50%;
  }
}
#com_v .related_products img {
  width: 100%;
}

#com_v .content-div-box {
  flex-direction: unset;
  flex-wrap: wrap;
}

/* BRAND:品牌中心 ----------------------------------------------- */
#brandList {
  height: 1%;
  margin-top: 12px;
  font-size: 11px;
  background: url(images/brandBg.gif) repeat-y top center;
}

#brandList .brandBox {
  float: left;
  width: 245px;
  _width: 241px;
  height: 160px;
  margin: 0 5px 20px 5px;
  text-align: center;
  overflow: hidden;
}

#brandList .brandBox .brandLogo {
  width: 188px;
  height: 52px;
  overflow: hidden;
}

#brandList .brandBox h4 {
  height: 23px;
  margin: 15px 0 8px 0;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 100;
  line-height: 23px;
  text-align: right;
  background: #e9e9e9;
}

#brandList .brandBox h4 span {
  float: left;
  font-weight: bold;
  color: #3f3f3f;
  text-decoration: none;
}

#brandList .brandBox h4 span a {
  float: left;
  font-weight: bold;
  color: #3f3f3f;
  text-decoration: none;
}

#brandList p {
  margin-bottom: 5px;
  padding: 8px;
  color: #909090;
  text-align: left;
}

#brandList p.brandCategory {
  color: #006acd;
  text-align: left;
  text-decoration: none;
}

#brandList p.brandCategory a {
  color: #006acd;
  text-align: left;
  text-decoration: none;
}

#brandList .brandArticle {
  text-align: left;
  border: 1px dashed #d9d9d9;
  background: #f8f8f8;
}

.brandCategoryA a {
  margin-right: 15px;
}

/* LIBRARY:網店幫助分類----------------------------------------------- */
#help {
  width: auto;
  margin-top: 0;
  font-family: Arial, Helvetica, sans-serif;
  clear: both;
}

#help table {
  border: 1px #eee solid;
}

#help .cat-name {
  height: 30px;
  font-family: Arial, Helvetica, sans-serif;
  border-bottom: 1px #F2F2DE solid;
}

#help .cat-name span {
  padding-top: 3px;
  padding-left: 10px;
  font-size: 14px;
  font-weight: bold;
  color: #61461E;
}

#help ul {
  padding: 10px 2px 10px 26px;
  list-style-type: circle;
}

/* 友情鏈接----------------------------------------------- */
#link {
  margin-top: 10px;
  padding: 5px;
  padding-bottom: 0;
  border: 1px solid #EEEEEE;
  background-color: #FCFCFC;
}

#link img {
  width: 88px;
  height: 33px;
}

#link p {
  padding-bottom: 5px;
}

#link a {
  margin-right: 5px;
}

/* LIBRARY: 購物車 ----------------------------------------------- */
.messageli {
  padding: 5px;
  list-style-type: none;
  color: red;
}

.messagediv {
  position: absolute;
  padding: 5px;
  font-size: 12px;
  text-align: center;
  border: 1px solid #FFD700;
  background-color: #FFFACD;
  filter: alpha(opacity=50);
  -moz-opacity: 0.7;
  opacity: 0.7;
}

/* LIBRARY: goods_tags ----------------------------------------------- */
#globalTags {
  padding: 10px;
  padding-left: 0;
}

#globalTags .globalTags_input {
  display: flex;
  align-items: center;
}

/* #ECS_TAGS {} */
#ECS_TAGS a {
  padding-right: 5px;
}

.textInput_tag {
  width: 115px;
  margin-right: 5px;
  padding: 3px 8px;
  font-size: 16px;
  background: #fff;
}

.textInput_member {
  width: 50px;
  padding: 5px 8px;
  font-size: 16px;
  background: #fff;
}

.sumbit_tag {
  width: 29px;
  height: 18px;
  margin: 0 7px 0 0;
  padding: 0;
  vertical-align: bottom;
  border: 1px solid #FFFFFF;
}

/* 會員中心 ----------------------------------------------- */
#userLeft {
  float: left;
  width: 200px;
  margin-right: 0px;
  overflow: hidden;
}

#userLeft .leftTitle {
  padding-top: 100px;
}

@media screen and (max-width: 999px) {
  #userLeft .leftTitle {
    padding: 0;
  }
}
#userIn {
  float: left;
  width: 1000px;
  overflow: hidden;
}

@media screen and (max-width: 999px) {
  #userIn {
    width: 100% !important;
  }
}
@media screen and (max-width: 999px) {
  #userIn .userToppic {
    display: none;
  }
}
@media screen and (max-width: 999px) {
  #userIn .userPassport {
    padding: 0;
  }
}
@media screen and (max-width: 999px) {
  #userIn .userPassport form > table {
    width: 100%;
    padding: 10px;
  }
}
@media screen and (max-width: 999px) {
  #userIn .userPassport form > table > tbody tr td:first-child {
    width: 31%;
    text-align: right;
  }
}
@media screen and (max-width: 999px) {
  #userIn .userPassport form > table input[type=text], #userIn .userPassport form > table input[type=password] {
    width: 95% !important;
    margin: 0;
  }
}
@media screen and (max-width: 999px) {
  #userIn .userPassport form > table font {
    display: none;
  }
}
.userPassport {
  float: left;
  padding: 40px 30px 40px 0;
  color: #686868;
}

@media screen and (max-width: 999px) {
  .userPassport {
    width: 100% !important;
  }
}
.userPassport_nofl {
  padding: 40px 30px 40px 0;
  color: #686868;
}

@media screen and (max-width: 999px) {
  .userPassport_nofl {
    padding: 0 40px;
  }
}
@media screen and (max-width: 999px) {
  .userPassport_nofl .pasresetnow {
    width: 100% !important;
  }
}
.userPassportRule {
  float: left;
  width: 446px;
}

@media screen and (max-width: 999px) {
  .userPassportRule {
    width: 100% !important;
  }
}
.actionSub a {
  padding-left: 14px;
  color: #686868;
  line-height: 200%;
  text-decoration: underline;
  background: url(images/arrow_compare.gif) no-repeat;
}

.userPassportLogin {
  padding: 0 30px;
  color: #686868;
}

.userPage {
  margin-top: 30px;
  background: url(images/passport_bg.jpg);
}

.userPage p.top {
  display: flex;
  align-items: center;
  height: 37px;
  padding-left: 30px;
  font-size: 16px;
  font-weight: bold;
  color: #686868;
}

@media screen and (max-width: 999px) {
  .userPage p.top {
    height: 60px;
  }
}
.userPage p.top span {
  content: "";
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  margin-right: 15px;
  border-radius: 100%;
  background: #ab1d33;
}

.userPage p.top span::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 100%;
  border: 2px solid #fff;
}

.userPage p.top span::after {
  content: "";
  display: inline-block;
  align-self: flex-end;
  width: 1.5px;
  height: 10px;
  background-color: #fff;
  transform: rotate(-45deg);
}

.userPage p.bot {
  height: 20px;
  background: url(images/passport_bot.jpg);
}

.userTxt {
  float: left;
  width: 310px;
  padding: 0 0 0 2px;
  line-height: 23px;
  text-align: left;
  background: #f2f2f2;
  background: url(images/ur_bg1.gif) no-repeat 0 50%;
}

.userTxt img {
  margin-top: 15px;
}

.userTxt .f4 {
  color: #fe596a;
}

.inputBox {
  width: 180px;
  padding: 3px 5px;
  color: #000000;
  border: 1px solid #CCCCCC;
}

.left10 {
  margin-left: 6px;
}

.inputNowidth {
  padding: 3px 5px;
  color: #000000;
  border: 1px solid #CCCCCC;
}

.textbox {
  padding: 0 2px;
  border: 1px solid #959595;
}

.libTitle {
  display: block;
  height: 26px;
  background-position: 0 5px;
  background-repeat: no-repeat;
}

#formLogin ul {
  margin: 8px 8px 8px 30px;
  padding: 0;
}

#formLogin li {
  padding: 3px 0;
  color: #2359B1;
  line-height: 16px;
}

.user-message {
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

.user-message_title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 30px;
  padding-left: 25px;
  border-bottom: 2px solid #f1f1f1;
  background-color: #f9f9f9;
  background-image: url(images/msg_title.gif);
  background-position: 2px;
  background-repeat: no-repeat;
}

.user-message_title > h3 {
  margin: 0;
  font-size: 15px;
  color: #333;
}

.user-message_title > h3 > span {
  margin-left: 10px;
  font-size: 12px;
  color: #999;
}

.user-message_content {
  padding: 5px 10px 10px 10px;
  border-right: 2px solid #f9f9f9;
  border-left: 2px solid #f9f9f9;
}

.user-message_reply {
  border-right: 2px solid #f9f9f9;
  border-left: 2px solid #f9f9f9;
}

.user-message_reply > div:first-child {
  padding: 7px 0 3px 30px;
  border-bottom: 2px solid #f1f1f1;
  background: url(images/msg_reply.gif) no-repeat 2px 4px;
}

.user-message_reply > div:last-child {
  padding: 5px 10px 20px 10px;
}

.user-message_reply h3 {
  font-size: 15px;
}

.user-message_reply h3 > span {
  margin-left: 10px;
  font-size: 12px;
  color: #999;
}

#user_comment {
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

#user_message_from {
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

#user_message_from > div {
  display: flex;
  padding: 10px;
}

#user_message_from > div > div:first-child {
  width: 80px;
  min-width: 80px;
  padding-right: 15px;
}

#user_message_from > div > div:last-child {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

#user_message_from > div > div:last-child > div {
  display: flex;
  align-items: center;
  padding: 0 0 5px;
}

#user_message_from > div > div > a {
  display: flex;
  align-items: center;
}

#user_message_from > div > div > a > img {
  display: block;
  width: 15px;
  height: 15px;
  margin-right: 5px;
}

#user_message_from > div > div input, #user_message_from > div > div textarea {
  padding: 5px 8px;
}

#user_message_from > div > div textarea {
  width: 100%;
}

@media screen and (max-width: 999px) {
  #user_message_from > div > div input {
    width: 100%;
  }
}
#user_message_from > div > div input[type=radio] {
  width: 15px;
  height: 15px;
}

.user_comment-head {
  display: flex;
  justify-content: space-between;
  padding: 10px 10px 10px 30px;
  border-bottom: 2px solid #f1f1f1;
  background: #f9f9f9 url(images/msg_title.gif) no-repeat 5px 50%;
}

.user_comment-head > h3 {
  font-size: 15px;
  color: #333;
}

.user_comment-head > h3 > span {
  font-size: 13px;
  color: #999;
}

.user_comment-body {
  padding: 10px;
}

.user_comment-reply {
  padding: 10px 10px 10px 30px;
  border-top: 1px solid #ddd;
  background: url(images/msg_reply.gif) no-repeat 2px 4px;
}

#user-my_label {
  display: flex;
  padding: 5px;
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

#user-my_label > div {
  display: flex;
  padding: 5px;
  font-size: 15px;
}

#user-my_label > div a:first-child > div {
  padding: 8px 18px;
  color: #fff;
  background-color: #ab1d33;
  transition: all 0.3s;
}

#user-my_label > div a:first-child > div:hover {
  background-color: #d8233f;
}

#user-my_label > div a:last-child {
  display: flex;
  align-items: center;
  margin: 0 15px 0 8px;
}

#user-my_label > div a:last-child > img {
  display: block;
  width: 20px;
  height: 20px;
}

#user_booking_add {
  padding: 0 10px 10px;
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

#user_booking_add > div {
  display: flex;
  padding: 10px 0 0;
}

#user_booking_add > div .label {
  width: 110px;
}

#user_booking_add > div .alc {
  display: flex;
  align-items: center;
}

#user_booking_add > div input, #user_booking_add > div textarea {
  padding: 5px 8px;
}

#user_label_booking {
  display: flex;
  flex-wrap: wrap;
  padding: 10px 0;
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

@media screen and (max-width: 999px) {
  #user_label_booking {
    padding: 10px 0 0;
  }
}
#user_label_booking > div {
  width: 50%;
}

@media screen and (max-width: 999px) {
  #user_label_booking > div {
    width: 100%;
    padding: 0 10px 10px !important;
  }
}
#user_label_booking > div:nth-child(odd) {
  padding: 10px 10px 10px 20px;
}

#user_label_booking > div:nth-child(even) {
  padding: 10px 20px 10px 10px;
}

#user_label_booking > div > div {
  display: flex;
  width: 100%;
  padding: 10px;
  background-color: #fff;
  box-shadow: 1px 2px 12px rgba(0, 0, 0, 0.8);
  transition: all 0.3s;
}

#user_label_booking > div > div:hover {
  box-shadow: 1px 2px 8px rgba(123, 123, 123, 0.8);
  transform: translateY(-2px);
}

#user_label_booking > div > div .label_booking {
  padding-bottom: 12px;
}

#user_label_booking > div > div .label_booking-img {
  margin-right: 20px;
}

@media screen and (max-width: 999px) {
  #user_label_booking > div > div .label_booking-img {
    margin-right: 8px;
  }
}
#user_label_booking > div > div .label_booking-img img {
  display: block;
  width: 160px;
  border: 1px solid #ddd;
}

@media screen and (max-width: 999px) {
  #user_label_booking > div > div .label_booking-img img {
    width: 130px;
  }
}
#user_merge_order {
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

#user_merge_order input, #user_merge_order select {
  padding: 5px 8px;
  font-size: 15px;
}

#user_merge_order > li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  padding: 10px;
}

@media screen and (max-width: 999px) {
  #user_merge_order > li > p:nth-child(1), #user_merge_order > li > p:nth-child(3) {
    width: 20%;
    padding-bottom: 7px;
  }
}
@media screen and (max-width: 999px) {
  #user_merge_order > li > p:nth-child(2), #user_merge_order > li > p:nth-child(4) {
    width: 80%;
    padding-bottom: 7px;
  }
}
@media screen and (max-width: 999px) {
  #user_merge_order > li > p:nth-child(5) {
    width: 100%;
  }
}
@media screen and (max-width: 999px) {
  #user_merge_order > li > p select {
    width: 100%;
  }
}
#user_merge_order input[type=submit] {
  padding: 8px 40px;
  color: #fff;
  border: 0;
  background-color: #aa0000;
  transition: all 0.3s;
  cursor: pointer;
}

#user_merge_order input[type=submit]:hover {
  background-color: #d01313;
}

#user_order_status {
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

#user_order_status > div {
  display: flex;
  align-items: center;
  margin: 10px 0;
  padding: 0 10px;
}

#user_order_status > div > div {
  display: flex;
  align-items: center;
}

@media screen and (max-width: 999px) {
  #user_order_status > div > div {
    flex-direction: column;
    align-items: flex-start;
  }
}
#user_order_status > div > div:first-child {
  width: 25%;
  min-width: 100px;
}

#user_order_status > div > div > span {
  display: block;
}

#user_order_status > div > div > span:nth-child(1) {
  margin-right: 20px;
}

#user_order_status > div > div input[type=submit], #user_order_status > div > div input[type=button] {
  min-width: 80px;
  padding: 8px;
  border: 0;
  color: #fff;
  background-color: #aa0000;
  transition: all 0.3s;
  cursor: pointer;
}

#user_order_status > div > div input[type=submit]:hover, #user_order_status > div > div input[type=button]:hover {
  background-color: #bf1313;
}

#user_order_status > div > div > strong > b {
  display: inline-block;
  margin: 0.6rem 0 0 0;
}

#user_goods_list {
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

#user_goods_list > div {
  display: flex;
  align-items: center;
  padding: 10px;
}

#user_goods_list > div > div {
  padding: 0 5px;
}

#user_goods_list > div > div:nth-child(1) {
  display: flex;
  width: 55%;
}

@media screen and (max-width: 999px) {
  #user_goods_list > div > div:nth-child(1) {
    width: 100%;
  }
}
#user_goods_list > div > div:nth-child(1) > div {
  width: 80%;
}

#user_goods_list > div > div:nth-child(1) > div > div {
  margin-top: 15px;
}

#user_goods_list > div > div:nth-child(1) > a {
  display: block;
  min-width: 100px;
  margin-right: 10px;
}

#user_goods_list > div > div:nth-child(1) img {
  display: block;
  width: 100px;
  height: auto;
  border: 1px solid #ddd;
}

#user_goods_list > div > div:nth-child(2) {
  width: 10%;
  text-align: center;
}

@media screen and (max-width: 999px) {
  #user_goods_list > div > div:nth-child(2) {
    width: 50%;
    padding: 8px 5px;
    text-align: left;
  }
}
#user_goods_list > div > div:nth-child(3) {
  width: 10%;
  text-align: center;
}

@media screen and (max-width: 999px) {
  #user_goods_list > div > div:nth-child(3) {
    width: 25%;
    padding: 8px 5px;
  }
}
#user_goods_list > div > div:nth-child(4) {
  width: 10%;
  text-align: center;
}

@media screen and (max-width: 999px) {
  #user_goods_list > div > div:nth-child(4) {
    width: 25%;
    padding: 8px 5px;
  }
}
#user_goods_list > div > div:nth-child(4) > span {
  font-size: 12px;
}

#user_goods_list > div > div:nth-child(5) {
  display: flex;
  justify-content: flex-end;
  width: 15%;
}

@media screen and (max-width: 999px) {
  #user_goods_list > div > div:nth-child(5) {
    width: 100%;
    justify-content: flex-start;
  }
}
@media screen and (max-width: 999px) {
  #user_goods_list > .user_goods_list-head {
    display: none;
  }
}
#user_goods_list > .user_goods_list-body {
  align-items: flex-start;
}

@media screen and (max-width: 999px) {
  #user_goods_list > .user_goods_list-body {
    flex-wrap: wrap;
    margin: 15px 10px;
    box-shadow: 0 0 10px #484848;
  }
}
.user_goods_list-head {
  background-color: #ddd;
}

.user_goods_list-total {
  background-color: #eef6ff;
}

.user_goods_list-total > div {
  display: flex;
  justify-content: flex-end;
  width: 100% !important;
}

#user_total_costs {
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

#user_total_costs > div {
  padding: 0 10px;
  margin: 10px 0;
  display: flex;
  align-items: center;
}

#user_order_consignee_info {
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

#user_order_consignee_info > div {
  display: flex;
  margin: 10px;
}

@media screen and (max-width: 999px) {
  #user_order_consignee_info > div {
    flex-wrap: wrap;
  }
}
#user_order_consignee_info > div > div {
  display: flex;
  align-items: center;
  width: 100%;
}

@media screen and (max-width: 999px) {
  #user_order_consignee_info > div > div:nth-child(1) {
    margin-bottom: 10px;
  }
}
#user_order_consignee_info > div > div > input[type=submit] {
  padding: 10px 40px;
  font-size: 15px;
  color: #fff;
  border: 0;
  background-color: #aa0000;
  transition: all 0.3s;
  cursor: pointer;
}

#user_order_consignee_info > div > div > input[type=submit]:hover {
  background-color: #cc1a1a;
}

#user_order_consignee_info > div > div > div:nth-child(1) {
  width: 110px;
  min-width: 110px;
}

#user_order_consignee_info > div > div > div:nth-child(2) {
  width: 95%;
}

#user_order_consignee_info > div > div > div > input {
  width: 100%;
  padding: 5px 8px;
  font-size: 15px;
}

#user_consignee_info {
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

#user_consignee_info > div {
  display: flex;
  padding: 0 10px;
  margin: 10px 0;
}

@media screen and (max-width: 999px) {
  #user_consignee_info > div {
    flex-wrap: wrap;
  }
}
#user_consignee_info > div > div {
  display: flex;
  width: 100%;
}

@media screen and (max-width: 999px) {
  #user_consignee_info > div > div:nth-child(1) {
    margin-bottom: 10px;
  }
}
#user_consignee_info > div > div > div:nth-child(1) {
  width: 120px;
  min-width: 120px;
}

#user_consignee_info > div > div > div:nth-child(2) {
  width: 100%;
}

#user_payment {
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

#user_payment ol {
  padding-inline-start: 30px;
  list-style: decimal;
}

#user_payment ol li {
  margin: 0 0 0.8rem 0;
}

#user_payment ol li b {
  display: inline-block;
  margin: 0.6rem 0 0 0;
}

#user_payment > div {
  justify-content: center;
  align-items: center;
  margin: 10px 0;
  padding: 0 10px;
}

@media screen and (max-width: 999px) {
  #user_payment > div {
    flex-direction: column;
  }
}
@media screen and (max-width: 999px) {
  #user_payment > div > span:nth-child(1) {
    display: block;
    margin-bottom: 10px;
  }
}
#user_payment > div > span > strong {
  font-size: 18px;
}

#user_other_info {
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

#user_other_info > div {
  display: flex;
  margin: 10px 0;
  padding: 0 10px;
}

.user_address_list {
  padding-top: 20px;
  margin-bottom: 50px;
  font-size: 1rem;
  border-top: 3px solid #ac1d21;
}
.user_address_list > div {
  display: flex;
}
@media screen and (max-width: 999px) {
  .user_address_list > div {
    flex-direction: column;
  }
}
.user_address_list > div:last-child {
  justify-content: center;
  padding: 10px;
  border-bottom: 1px solid #ccc;
  background-color: #ececec;
}
.user_address_list > div:last-child input {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 37px;
  margin-bottom: 0;
  padding: 5px 20px;
  font-size: 1rem;
  color: #fff;
  border: none;
  border-radius: 50px;
  background-color: #b90c0c;
  transition: all 0.3s;
  cursor: pointer;
}
.user_address_list > div > div:first-child, .user_address_list > div > div:nth-child(3) {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex: 0 0 150px;
  margin-bottom: 15px;
  font-size: 14px;
  color: #000;
}
@media screen and (max-width: 999px) {
  .user_address_list > div > div:first-child, .user_address_list > div > div:nth-child(3) {
    justify-content: flex-start;
    flex: 0 0 auto;
    margin-bottom: 3px;
    padding-bottom: 0;
  }
}
.user_address_list > div > div:first-child::after, .user_address_list > div > div:nth-child(3)::after {
  content: "*";
  margin: 0 5px 0 0;
  color: #fff;
}
.user_address_list > div > div:first-child.required::after, .user_address_list > div > div:nth-child(3).required::after {
  color: #ff0000;
}
.user_address_list > div > div:nth-child(2), .user_address_list > div > div:nth-child(4) {
  display: flex;
  align-items: center;
  flex: 0 0 calc((100% - 300px) / 2);
  margin-bottom: 15px;
}
@media screen and (max-width: 999px) {
  .user_address_list > div > div:nth-child(2), .user_address_list > div > div:nth-child(4) {
    flex: 0 0 100%;
  }
}
.user_address_list > div > div:nth-child(2) select, .user_address_list > div > div:nth-child(2) input, .user_address_list > div > div:nth-child(4) select, .user_address_list > div > div:nth-child(4) input {
  height: calc(1.5em + 0.75rem + 2px);
  margin-right: 10px;
  padding: 0.275rem 0.75rem;
  font-size: 1rem;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
}
.user_address_list > div > div:nth-child(2) input, .user_address_list > div > div:nth-child(4) input {
  flex: 0 0 100%;
}

#user_label_collection {
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 20px;
  font-size: 15px;
  border-top: 3px solid #ac1d21;
}
#user_label_collection > div {
  width: 50%;
  padding: 10px 10px 15px 10px;
}
@media screen and (max-width: 999px) {
  #user_label_collection > div {
    width: 100%;
    padding: 10px !important;
  }
}

.user_label_collection-box {
  display: flex;
  flex-direction: row;
  width: 100%;
  padding: 10px 15px;
  background-color: #fff;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 15px 0 rgba(0, 0, 0, 0.19);
  transition: all 0.3s;
}
@media screen and (max-width: 999px) {
  .user_label_collection-box {
    flex-direction: column;
    box-shadow: none;
    transition: none;
    border-bottom: 1px solid #ccc;
  }
}
.user_label_collection-box:hover {
  box-shadow: 1px 2px 8px rgba(123, 123, 123, 0.8);
  transform: translateY(-2px);
}
@media screen and (max-width: 999px) {
  .user_label_collection-box:hover {
    box-shadow: none;
    transition: none;
  }
}
.user_label_collection-box > div:first-child {
  width: 195px;
  min-width: 195px;
  padding-right: 15px;
}
@media screen and (max-width: 999px) {
  .user_label_collection-box > div:first-child {
    width: 100%;
    min-width: auto;
    padding-right: 5px;
  }
}
.user_label_collection-box > div:first-child img {
  display: block;
  width: 100%;
  height: 180px;
}
@media screen and (max-width: 999px) {
  .user_label_collection-box > div:first-child img {
    height: auto;
  }
}
.user_label_collection-box > div:last-child {
  width: 70%;
}
@media screen and (max-width: 999px) {
  .user_label_collection-box > div:last-child {
    width: 100%;
  }
}
.user_label_collection-box > div:last-child > div {
  margin-bottom: 15px;
}
@media screen and (max-width: 999px) {
  .user_label_collection-box > div:last-child > div {
    margin-bottom: 5px;
  }
}
.user_label_collection-box > div:last-child > div:first-child > a {
  font-size: 1rem;
  color: #333;
}
.user_label_collection-box > div:last-child > div > div {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 999px) {
  .user_label_collection-box > div:last-child > div > div {
    padding-bottom: 5px;
  }
}
.user_label_collection-box > div:last-child > div > div:first-child span.goods-price {
  font-weight: bold;
  color: #0000ff;
}
.user_label_collection-box > div:last-child > div > div:nth-child(2) {
  border: 1px solid #ccc;
  border-radius: 0.5rem;
}
.user_label_collection-box > div:last-child > div > div:nth-child(2) span.goods-price {
  font-weight: bold;
  color: #ff3300;
}
.user_label_collection-box > div:last-child > div > div span {
  padding: 2px 10px 2px 5px;
}
.user_label_collection-box > div:last-child > div.function-line .function {
  display: flex;
}
.user_label_collection-box > div:last-child > div.function-line .function a {
  display: block;
  width: 25px;
  height: 25px;
  margin: 0 5px 0 0;
  border: 1px solid rgba(171, 29, 51, 0.25);
  border-radius: 3px;
  overflow: hidden;
}
.user_label_collection-box > div:last-child > div.function-line .function a:hover {
  border: 1px solid #ab1d33;
}
.user_label_collection-box > div:last-child > div.function-line .function a:first-child {
  border: 0;
}
.user_label_collection-box > div:last-child > div.function-line .function a:first-child img:hover {
  left: auto;
  background: none;
}
.user_label_collection-box > div:last-child > div.function-line .function a:first-child.focused img {
  left: -26px;
}
.user_label_collection-box > div:last-child > div.function-line .function a img {
  position: relative;
  top: -1px;
  left: -1px;
  height: 25px;
  transition: all 0.6s;
}
.user_label_collection-box > div:last-child > div.function-line .function a img:hover {
  left: -26px;
  background: #ab1d33;
}
.user_label_collection-box > div:last-child > div.function-line .function a span {
  display: none;
}
.user_label_collection-box > div:last-child > div.function-line i {
  font-style: normal;
  font-size: 12px;
  color: #ddd;
}
@media screen and (max-width: 640px) {
  .user_label_collection-box > div:last-child > div.function-line i {
    font-size: 11px;
    line-height: 100%;
    word-break: break-all;
  }
}
.user_label_collection-box > div:last-child a {
  padding-right: 10px;
}

#user_label_affiliate {
  font-size: 15px;
  border-top: 3px solid #ac1d21;
}
#user_label_affiliate > div {
  display: flex;
  align-items: center;
  padding: 10px;
}
@media screen and (max-width: 999px) {
  #user_label_affiliate > div {
    flex-direction: column;
    align-items: baseline;
  }
}
#user_label_affiliate > div .label {
  width: 140px;
}
@media screen and (max-width: 999px) {
  #user_label_affiliate > div .label {
    padding-bottom: 5px;
  }
}
#user_label_affiliate select, #user_label_affiliate input, #user_label_affiliate textarea {
  padding: 5px 8px;
  font-size: 15px;
}
@media screen and (max-width: 999px) {
  #user_label_affiliate select, #user_label_affiliate input, #user_label_affiliate textarea {
    width: 100%;
  }
}

.points-query {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  margin: 1rem 0;
}

@media screen and (max-width: 999px) {
  .points-query {
    margin: 0 0 1rem 0;
  }
}
@media screen and (max-width: 999px) {
  .points-query span {
    display: block;
    width: 100%;
    text-align: center;
  }
}
.points-query b {
  color: #b50033;
}

.points-query:last-child {
  justify-content: flex-end;
}

.points-active {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

@media screen and (max-width: 999px) {
  .points-active {
    flex-direction: column;
  }
}
@media screen and (max-width: 999px) {
  .points-active-box {
    width: 100%;
  }
}
.points-active-box:first-child {
  margin: 0 0 1rem 0;
  border-radius: 10px;
  border: 1px solid #ccc;
  border-top: 1px solid #ddd;
  overflow: hidden;
}

.points-active-box table {
  width: 120px;
  border-spacing: 0;
}

@media screen and (max-width: 999px) {
  .points-active-box table {
    width: 100%;
  }
}
.points-active-box table tr:first-child {
  background: linear-gradient(0deg, #ffb451 1px, transparent 0%), linear-gradient(#fff 0%, #fae0a5 100%);
}

.points-active-box table tr:first-child th {
  padding: 10px 10px;
  font-size: 1rem;
  font-weight: bold;
  color: #555;
  text-align: center;
}

.points-active-box table tr:first-child th span {
  font-size: 0.8rem;
}

.points-active-box table tr td {
  font-size: 1.5rem;
  font-weight: bold;
  color: #b50033;
}

.points-active-box table th, .points-active-box table td {
  text-align: center;
}

.points-active-box table td {
  padding: 10px 20px;
  font-size: 1rem;
  color: #707070;
}

.points-active-box table td a {
  color: #b50033;
  text-decoration: underline;
}

.points-store {
  display: flex;
}

@media screen and (max-width: 999px) {
  .points-store {
    flex-direction: column-reverse;
  }
}
.points-store-box {
  border-radius: 10px;
  border: 1px solid #ccc;
  border-top: 1px solid #ddd;
  overflow: hidden;
}

.points-store-box--poppup {
  overflow-y: hidden;
}

.points-store-box--poppup table tr:first-child {
  background: linear-gradient(0deg, #ffb451 1px, transparent 0%), linear-gradient(#fff 0%, #fae0a5 100%);
}

.points-store-box--poppup table tr th, .points-store-box--poppup table tr td {
  padding: 10px;
}

.points-store-box--poppup table tr td {
  white-space: normal;
}

@media screen and (max-width: 999px) {
  .points-store-box--poppup table tr td {
    white-space: nowrap;
  }
}
.points-store-box--poppup table tr td b {
  color: #b50033;
}

.points-store-box:first-child {
  flex: 1 1 75%;
  margin: 0 0.5rem 0 0;
}

@media screen and (max-width: 999px) {
  .points-store-box:first-child {
    margin: 0 0 1rem 0;
    overflow: auto;
    overflow-y: hidden;
  }
}
.points-store-box:nth-child(2) {
  flex: 1 1 25%;
  margin: 0 0 0 0.5rem;
}
@media screen and (max-width: 999px) {
  .points-store-box:nth-child(2) {
    margin: 0 0 1rem 0;
  }
}

.points-store-box:nth-child(2) table tr:first-child {
  background: linear-gradient(0deg, #aaa 1px, transparent 0%), linear-gradient(#fff 0%, #ccc 100%);
}

.points-store table {
  width: 100%;
  border-spacing: 0;
}

.points-store table tr:first-child {
  background: linear-gradient(0deg, #ffb451 1px, transparent 0%), linear-gradient(#fff 0%, #fae0a5 100%);
}

.points-store table tr:first-child th {
  font-size: 1rem;
  font-weight: bold;
  color: #555;
  text-align: center;
}

.points-store table th, .points-store table td {
  padding: 10px 20px;
  text-align: center;
  white-space: nowrap;
}

.points-store table td {
  font-size: 1rem;
  color: #707070;
  border-top: 1px solid #ccc;
}

.points-store table td a {
  color: #b50033;
  text-decoration: underline;
}

.more_table {
  height: 23px;
  padding-top: 8px;
  padding-left: 21px;
  font-size: 13px;
  background: url(images/more_table_up.gif) no-repeat;
}

.more_table-bg {
  padding: 10px;
  line-height: 180%;
}

.more_table-bg li {
  padding-left: 20px;
  background: url(images/circle.gif) no-repeat;
  background-position: 0px 5px;
}

.cart-process {
  display: flex;
}

@media screen and (max-width: 999px) {
  .cart-process {
    flex-wrap: wrap;
    width: 100%;
    padding: 0 10px;
  }
}
.cart-process > li {
  display: flex;
}

@media screen and (max-width: 999px) {
  .cart-process > li {
    width: 100%;
  }
}
.cart-process > li:first-child {
  justify-content: center;
  width: 519px;
  padding: 5px;
}

@media screen and (max-width: 999px) {
  .cart-process > li:first-child {
    justify-content: flex-start;
    overflow: hidden;
  }
}
.cart-process > li:nth-child(2), .cart-process > li:nth-child(3) {
  padding: 5px;
}

.cart-process > li > p {
  min-width: 160px;
  padding: 5px;
}

@media screen and (max-width: 999px) {
  .cart-process > li > p {
    width: 100%;
  }
}
#packTable {
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

#packTable > div {
  display: flex;
  padding: 10px 20px;
}

#packTable > divv > div {
  display: flex;
  align-items: center;
}

#packTable > divv > div:nth-child(1) {
  width: 6%;
}

#packTable > divv > div:nth-child(1) > input {
  width: 18px;
  height: 18px;
}

#packTable > divv > div:nth-child(2) {
  width: 15%;
}

#packTable > divv > div:nth-child(3) {
  width: 15%;
}

#packTable > divv > div:nth-child(4) {
  width: 15%;
}

#packTable > divv > div:nth-child(5) {
  width: 49%;
}

#my-collection {
  display: flex;
  flex-wrap: wrap;
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

.my-collection .goods-gallery__list, .related-goods .goods-gallery__list {
  align-items: start;
}

#my-collection > div {
  width: 16.666%;
  padding: 15px;
}

@media screen and (max-width: 999px) {
  #my-collection > div {
    width: 50%;
  }
}
#my-collection > div > .my-collection-desc img {
  display: block;
  width: 100%;
  height: auto;
  margin-bottom: 10px;
  border: 1px solid #eee;
}

#my-collection > div > .my-collection-desc > a > div:last-child {
  display: -webkit-box;
  height: 40px;
  overflow: hidden;
  -webkit-line-clamp: 2;
}

#my-collection > div > .my-collection-desc > a > div:last-child {
  display: -webkit-box;
  height: 40px;
  overflow: hidden;
  -webkit-line-clamp: 2;
}

#my-collection > div > .my-collection-cart {
  margin-top: 10px;
}

#my-collection > div > .my-collection-cart > a {
  position: relative;
  display: block;
  width: 27px;
  height: 27px;
  margin-right: 15px;
  border: 1px solid #AB1D33;
  overflow: hidden;
  transition: all 0.3s;
}

#my-collection > div > .my-collection-cart > a:hover {
  background-color: #AB1D33;
}

#my-collection > div > .my-collection-cart > a:hover img {
  left: -25px;
}

#my-collection > div > .my-collection-cart > a > img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  transition: all 0.3s;
}

#related-accessories {
  display: flex;
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

#related-accessories > div {
  width: 16.666%;
  padding: 15px;
}

@media screen and (max-width: 999px) {
  #related-accessories > div {
    width: 50%;
  }
}
#related-accessories .accessories-desc > a {
  display: block;
}

#related-accessories .accessories-desc > a > div > img {
  display: block;
  width: 100%;
  height: 170px;
  border: 1px solid #eee;
}

#related-accessories .accessories-desc > a > .f6 {
  padding: 5px 0;
}

#related-accessories .accessories-cart p {
  padding-bottom: 5px;
}

#related-accessories .accessories-cart > div > dt {
  width: 123px;
  padding: 10px 25px;
  font-size: 15px;
  color: #F0DFBE;
  letter-spacing: 2.4pt;
  border: none;
  background-color: #b90c0c;
  transition: all 0.3s;
  cursor: pointer;
}

#related-accessories .accessories-cart > div > dt:hover {
  background-color: #d62626;
}

#cardTable {
  font-size: 15px;
  border: 1px solid #bebebe;
  border-top: 3px solid #ac1d21;
}

#cardTable > div {
  display: flex;
  padding: 10px 20px;
}

#cardTable > div > div:nth-child(1) {
  width: 6%;
}

#cardTable > div > div:nth-child(1) > input {
  width: 18px;
  height: 18px;
}

#cardTable > div > div:nth-child(2) {
  width: 20%;
}

#cardTable > div > div:nth-child(3) {
  width: 10%;
}

#cardTable > div > div:nth-child(4) {
  width: 30%;
}

#cardTable > div > div:nth-child(5) {
  width: 30%;
}

.order_shoppingCart_div {
  font-size: 1rem;
  border-top: 3px solid #ac1d21;
}
.order_shoppingCart_div--checkout {
  border-top: 3px solid #ac1d21;
}
.order_shoppingCart_div--checkout > div > div:not(.cart-product) {
  width: 10%;
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div--checkout > div > div:not(.cart-product) {
    display: flex !important;
    justify-content: flex-start;
    width: 50%;
  }
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div--checkout > div.order_content > div:nth-child(3) {
    width: 50%;
    /* justify-content: center; */
  }
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div--checkout > div.order_content > div:nth-child(4) {
    justify-content: flex-start;
    width: 50%;
  }
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div--checkout > div.order_content > div:nth-child(4)::before {
    content: "數量：";
    font-size: 0.8rem;
    color: #666;
  }
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div--checkout > div.order_content > div:nth-child(5)::before {
    content: "積分：";
    font-size: 0.8rem;
    color: #666;
  }
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div--checkout > div.order_content > div:last-child {
    display: none !important;
  }
}
.order_shoppingCart_div .order_title {
  display: flex;
  font-weight: bold;
  color: #333;
  background-color: #ececec;
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div .order_title {
    display: none;
  }
}
.order_shoppingCart_div .order_content {
  display: flex;
  border-bottom: 1px solid #e7e7e7;
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div .order_content {
    flex-wrap: wrap;
    border-bottom: 1px solid #ddd;
  }
}
.order_shoppingCart_div .order_content:last-child {
  border-bottom: 0;
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div .order_content:last-child {
    border-bottom: 1px solid #ddd;
  }
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div .order_content > div:nth-child(2) {
    justify-content: flex-start;
  }
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div .order_content > div:nth-child(2)::before {
    content: "狀態：";
    font-size: 0.8rem;
    color: #666;
  }
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div .order_content > div:nth-child(3)::before {
    content: "單價：";
    font-size: 0.8rem;
    color: #666;
  }
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div .order_content > div:nth-child(4) {
    justify-content: flex-start;
  }
  .order_shoppingCart_div .order_content > div:nth-child(4)::before {
    content: "數量：";
    font-size: 0.8rem;
    color: #666;
  }
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div .order_content > div:nth-child(5)::before {
    content: "小計：";
    font-size: 0.8rem;
    color: #666;
  }
}

.order_shoppingCart_div > div > div {
  display: flex;
  width: 15%;
  padding: 10px;
}
.order_shoppingCart_div > div > div:not(.cart-product) {
  justify-content: center;
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div > div > div {
    justify-content: center;
    align-items: center;
    width: 50%;
  }
}
.order_shoppingCart_div > div > div.cart-product {
  width: 50%;
  font-weight: bold;
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div > div > div.cart-product {
    justify-content: flex-start;
    align-items: stretch;
    width: 100%;
  }
}
.order_shoppingCart_div > div > div.cart-product > a {
  margin-right: 10px;
}
.order_shoppingCart_div > div > div.cart-product > a > img {
  width: 150px;
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div > div > div.cart-product > a > img {
    width: 120px;
  }
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div > div > div.cart-product > div {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
}
.order_shoppingCart_div > div > div.cart-product a {
  color: #333;
}
.order_shoppingCart_div > div > div.cart-product p {
  display: flex;
  margin-top: 10px;
}
.order_shoppingCart_div > div > div.cart-product p a {
  font-weight: normal;
  font-size: 0.9rem;
  color: #666;
}
.order_shoppingCart_div > div > div.cart-product p a:nth-child(2) {
  margin-left: 10px;
  padding-left: 10px;
  border-left: 1px solid #ccc;
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_div > div > div:nth-child(2), .order_shoppingCart_div > div > div:nth-child(3), .order_shoppingCart_div > div > div:nth-child(4), .order_shoppingCart_div > div > div:nth-child(5) {
    justify-content: flex-start;
    background-color: #f4f4f4;
  }
}
.order_shoppingCart_div input {
  height: 20px;
  font-size: 1rem;
}
.order_shoppingCart_total {
  display: flex;
  justify-content: space-around;
  padding: 10px;
  font-size: 1rem;
  border-bottom: 1px solid #ccc;
  background-color: #ececec;
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_total {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}
.order_shoppingCart_total--checkout {
  justify-content: flex-end;
  margin-bottom: 40px;
}
.order_shoppingCart_total > div {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 999px) {
  .order_shoppingCart_total > div {
    margin-bottom: 10px;
  }
}
.order_shoppingCart_total > div:first-child span {
  padding: 0 5px;
  color: #0000ff;
}
.order_shoppingCart_total .order-btn {
  height: 37px;
  margin: 0 5px;
  padding: 5px 20px;
  font-size: 1rem;
  color: #fff;
  border: none;
  border-radius: 50px;
  background-color: #666;
  transition: all 0.3s;
  cursor: pointer;
}
.order_shoppingCart_total .order-btn:hover {
  background-color: #333;
}
.order_shoppingCart_total .order-btn--checkout {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 37px;
  padding: 5px 20px;
  font-size: 1rem;
  color: #fff;
  border: none;
  border-radius: 50px;
  background-color: #b90c0c;
  transition: all 0.3s;
}
.order_shoppingCart_total .order-btn--checkout:hover {
  background-color: #ff0000 !important;
}

/* 回上一頁繼續購物 */
.shoppingCart {
  display: flex;
  justify-content: center;
  padding-top: 20px;
  font-size: 0.9rem;
}
.shoppingCart i {
  margin-right: 10px;
}

.related-goods__title {
  margin-top: 60px;
  padding: 10px;
  border-top: 3px solid #ac1d21;
  font-size: 1rem;
  font-weight: bold;
  color: #333;
  background-color: #ececec;
}

.my-collection__title {
  margin-top: 60px;
  padding: 10px;
  border-top: 3px solid #ac1d21;
  font-size: 1rem;
  font-weight: bold;
  color: #333;
  background-color: #ececec;
}

.related-goods.goods-gallery__box, .my-collection.goods-gallery__box {
  margin-bottom: 0;
}
n
/* 
.related-goods-gallery__container {
  display: block;
  width: 100%;
  overflow: hidden;
}
.related-goods-gallery__item div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  color: #555;
}
.related-goods-gallery__item img {
  max-width: 240px;
  width: 100%;
}
.related-goods-gallery__box {
  position: relative;
  display: block;
}
.related-goods-gallery__btn {
  position: absolute;
  top: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  font-size: 2rem;
  color: #333;
  cursor: pointer;
}
.related-goods-gallery__btn--prev {
  left: 0;
}
.related-goods-gallery__btn--next {
  right: 0;
}
.related-goods-gallery__btn:hover {
  border-radius: 3px;
  background-color: rgba(0, 0, 0, 0.1);
}
.related-goods-gallery__container {
  overflow: hidden;
}
*/
.related-goods .goods-gallery__list, .my-collection .goods-gallery__list {
  align-items: flex-start;
}
/*
.related-goods-gallery__item a {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-weight: bold;
}
.related-goods-gallery__item span {
  font-size: .9rem;
  color: #333;
  text-align: center;
}*/
 
.related-goods .goods-gallery__item > div, .my-collection .goods-gallery__item > div {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.related-goods .goods-gallery__item > div p, .my-collection .goods-gallery__item > div p {
  display: flex;
  align-items: flex-start;
  flex: 0 0 100%;
  width: calc(100% - 2rem);
  margin: 0 1rem;
  line-height: 22px;
}

@media screen and (max-width: 999px) {
  .related-goods .goods-gallery__item > div p, .my-collection .goods-gallery__item > div p {
    justify-content: center;
  }
}

.related-goods .goods-gallery__item > div p:nth-child(2), .my-collection .goods-gallery__item > div p:nth-child(2) {
  color: #000;
}

.related-goods .goods-gallery__item span.quickbuy, .my-collection .goods-gallery__item span.quickbuy {
display: flex;
justify-content: center;
align-items: center;
flex: 0 0 90px;
width: auto;
height: 22px;
margin-left: 0;
padding: 0 3px;
color: #b50033;
border: 1px solid #b50033;
border-radius: 3px;
background-color: #fff;
}



.order_consignee {
  padding-top: 20px;
  font-size: 1rem;
  border-top: 3px solid #ac1d21;
}
.order_consignee > div {
  display: flex;
}
@media screen and (max-width: 999px) {
  .order_consignee > div {
    flex-direction: column;
  }
}
.order_consignee > div:last-child {
  justify-content: center;
  padding: 10px;
  border-bottom: 1px solid #ccc;
  background-color: #ececec;
}
.order_consignee > div > .order_label {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex: 0 0 150px;
  margin-bottom: 15px;
  font-size: 14px;
  color: #000;
}
@media screen and (max-width: 999px) {
  .order_consignee > div > .order_label {
    justify-content: flex-start;
    flex: 0 0 auto;
    margin-bottom: 3px;
    padding-bottom: 0;
  }
}
.order_consignee > div > .order_label::after {
  content: "*";
  margin: 0 5px 0 0;
  color: #fff;
}
.order_consignee > div > .order_label.required::after {
  color: #ff0000;
}
.order_consignee > div > .order_input {
  display: flex;
  align-items: center;
  flex: 0 0 calc((100% - 300px) / 2);
  margin-bottom: 15px;
}
@media screen and (max-width: 999px) {
  .order_consignee > div > .order_input {
    flex: 0 0 100%;
  }
}
.order_consignee > div > .order_input > select, .order_consignee > div > .order_input > input {
  height: calc(1.5em + 0.75rem + 2px);
  margin-right: 10px;
  padding: 0.275rem 0.75rem;
  font-size: 1rem;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
}
.order_consignee > div > .order_input > input {
  flex: 0 0 100%;
}
.order_consignee > div > .order-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 37px;
  margin-bottom: 0;
  padding: 5px 20px;
  font-size: 1rem;
  color: #fff;
  border: none;
  border-radius: 50px;
  background-color: #b90c0c;
  transition: all 0.3s;
  cursor: pointer;
}
.order_consignee > div > .order-btn:hover {
  background-color: #ff0000 !important;
}
.order_consignee > div > .order-btn.delete {
  margin-left: 10px;
}
@media screen and (max-width: 999px) {
  .order_consignee > div > .order-btn.delete {
    margin-top: 10px;
    margin-left: 0;
  }
}
.order_consignee--checkout {
  margin-bottom: 40px;
  border-top: 3px solid #ac1d21;
}
@media screen and (max-width: 999px) {
  .order_consignee--checkout {
    padding-top: 10px;
  }
}
@media screen and (max-width: 999px) {
  .order_consignee--checkout > div {
    flex-direction: row;
    flex-wrap: wrap;
  }
}
.order_consignee--checkout > div:last-child {
  padding: 0;
  background-color: #fff;
}
@media screen and (max-width: 999px) {
  .order_consignee--checkout > div .order_label, .order_consignee--checkout > div .order_input {
    margin-bottom: 0;
  }
}
@media screen and (max-width: 999px) {
  .order_consignee--checkout > div .order_label {
    flex: 0 0 120px;
    align-items: flex-start;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    border-bottom: 1px solid #e7e7e7;
  }
}
@media screen and (max-width: 999px) {
  .order_consignee--checkout > div .order_input {
    flex: 0 0 calc(100% - 120px);
    padding-top: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e7e7e7;
  }
}
.order_consignee--checkout > div.order_consignee-others {
  justify-content: flex-end;
  align-items: center;
  padding: 10px;
  background-color: #ececec;
}
@media screen and (max-width: 999px) {
  .order_consignee--checkout > div.order_consignee-others {
    flex-direction: row;
    justify-content: flex-start;
  }
}
.order_consignee--checkout > div.order_consignee-others a {
  margin: 0 5px;
  padding: 3px 10px;
  font-size: 0.9rem;
  white-space: nowrap;
  border-radius: 8px;
  background-color: #ccc;
}

#shippingTable {
  font-size: 1rem;
  border-top: 3px solid #ac1d21;
}
.shippingMethodTitle {
  align-items: flex-start;
}
.defaultShippingToggle {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 70px;
  min-width: 70px;
  font-size: 14px;
  font-weight: normal;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  border: 0;
  border-radius: 5px;
  background-color: #aaa;
}
.defaultShippingSetting {
  margin-bottom: 18px;
  font-size: 1rem;
}
.defaultShippingDesc {
  color: #008000;
  line-height: 1.6;
}
.defaultShippingTable {
  border-top: 3px solid #ac1d21;
  border-bottom: 1px solid #ccc;
}
.defaultShippingTable > div {
  display: flex;
  padding: 10px 20px;
}
.defaultShippingHead {
  font-weight: bold;
  color: #333;
  background-color: #ececec;
}
.defaultShippingHead > div,
.defaultShippingBody > div {
  display: flex;
  align-items: center;
}
.defaultShippingHead > div:first-child,
.defaultShippingBody > div:first-child {
  flex: 0 0 5%;
}
.defaultShippingHead > div:nth-child(2),
.defaultShippingBody > div:nth-child(2) {
  flex: 0 0 28%;
  font-weight: bold;
}
.defaultShippingHead > div:nth-child(3),
.defaultShippingBody > div:nth-child(3) {
  flex: 0 0 67%;
}
.defaultShippingBody {
  border-top: 1px solid #e7e7e7;
}
.defaultShippingBody input {
  width: 18px;
  height: 18px;
  margin: 0;
}
.defaultShippingActions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  padding: 10px 0 0 0;
}
.saveDefaultShipping {
  padding: 6px 18px;
  color: #fff;
  cursor: pointer;
  background: #ac1d21;
  border: 0;
}
.defaultShippingMsg {
  color: #008000;
}
@media screen and (max-width: 999px) {
  .shippingMethodTitle {
    align-items: center;
  }
  .defaultShippingToggle {
    font-size: 0.8rem;
  }
  .defaultShippingHead {
    display: none !important;
  }
  .defaultShippingTable > div {
    padding: 10px;
  }
  .defaultShippingBody {
    flex-wrap: wrap;
  }
  .defaultShippingBody > div:first-child {
    flex: 0 0 25px;
  }
  .defaultShippingBody > div:nth-child(2) {
    flex: 0 0 80px;
  }
  .defaultShippingBody > div:nth-child(3) {
    flex: 0 0 calc(100% - 105px);
  }
  .defaultShippingActions {
    align-items: flex-start;
    flex-direction: column;
  }
}
#shippingTable > div {
  display: flex;
  padding: 10px 20px;
}

.shippingTable_head {
  display: flex;
  font-weight: bold;
  color: #333;
  background-color: #ececec;
}
@media screen and (max-width: 999px) {
  .shippingTable_head {
    display: none !important;
  }
}
.shippingTable_head > div {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 0 0 10%;
}
.shippingTable_head > div:first-child {
  justify-content: flex-start;
  flex: 0 0 5%;
}
.shippingTable_head > div:nth-child(2) {
  justify-content: flex-start;
  flex: 0 0 15%;
}
.shippingTable_head > div:nth-child(3) {
  justify-content: flex-start;
  flex: 0 0 50%;
}
.shippingTable_body {
  border-bottom: 1px solid #e7e7e7;
}
@media screen and (max-width: 999px) {
  .shippingTable_body {
    flex-wrap: wrap;
    padding: 10px !important;
  }
}
.shippingTable_body > div {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 0 0 10%;
}
@media screen and (max-width: 999px) {
  .shippingTable_body > div {
    flex: 0 0 auto;
    font-size: 0.9rem;
  }
}
.shippingTable_body > div:first-child {
  justify-content: flex-start;
  flex: 0 0 5%;
}
@media screen and (max-width: 999px) {
  .shippingTable_body > div:first-child {
    flex: 0 0 25px;
  }
}
.shippingTable_body > div:nth-child(2) {
  justify-content: flex-start;
  flex: 0 0 15%;
  font-weight: bold;
}
@media screen and (max-width: 999px) {
  .shippingTable_body > div:nth-child(2) {
    flex: 0 0 80px;
    font-size: 1rem;
  }
}
.shippingTable_body > div:nth-child(3) {
  justify-content: flex-start;
  flex: 0 0 50%;
}
@media screen and (max-width: 999px) {
  .shippingTable_body > div:nth-child(3) {
    flex: 0 0 calc(100% - 105px);
    font-size: 1rem;
  }
}
@media screen and (max-width: 999px) {
  .shippingTable_body > div:nth-child(4) {
    margin-top: 5px;
  }
}
@media screen and (max-width: 999px) {
  .shippingTable_body > div:nth-child(4)::before {
    content: "費用：";
  }
}
@media screen and (max-width: 999px) {
  .shippingTable_body > div:nth-child(4)::after {
    content: "/";
    margin: 0 5px;
  }
}
@media screen and (max-width: 999px) {
  .shippingTable_body > div:nth-child(5) {
    margin-top: 5px;
  }
}
@media screen and (max-width: 999px) {
  .shippingTable_body > div:nth-child(5)::before {
    content: "免運條件：";
  }
}
@media screen and (max-width: 999px) {
  .shippingTable_body > div:nth-child(5)::after {
    content: "/";
    margin: 0 5px;
  }
}
@media screen and (max-width: 999px) {
  .shippingTable_body > div:nth-child(6) {
    margin-top: 5px;
  }
}
.shippingTable_body > div > input {
  width: 18px;
  height: 18px;
  margin: 0;
}
.shippingTable_body:nth-last-child(2) {
  border-bottom: 0;
}
.shippingTable_end {
  margin-bottom: 40px;
  padding: 0 !important;
  border-bottom: 1px solid #ccc;
}
.shippingTable_end > div {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  padding: 10px;
  font-size: 1rem;
  background-color: #ececec;
}

#paymentTable {
  font-size: 1rem;
  border-top: 3px solid #ac1d21;
}
#paymentTable > div {
  display: flex;
  padding: 10px 20px;
  border-bottom: 1px solid #ececec;
}
@media screen and (max-width: 999px) {
  #paymentTable > div {
    flex-wrap: wrap;
    padding: 10px !important;
  }
}
#paymentTable > div:first-child {
  display: flex;
  font-weight: bold;
  color: #333;
  background-color: #ececec;
}
@media screen and (max-width: 999px) {
  #paymentTable > div:first-child {
    display: none;
  }
}
#paymentTable > div:last-child {
  border-bottom: 0;
}
#paymentTable > div > div {
  align-items: center;
  flex: 0 0 10%;
}
#paymentTable > div > div:nth-child(1) {
  flex: 0 0 5%;
}
@media screen and (max-width: 999px) {
  #paymentTable > div > div:nth-child(1) {
    flex: 0 0 25px;
  }
}
#paymentTable > div > div:nth-child(1) > input {
  width: 18px;
  height: 18px;
  margin: 0;
}
#paymentTable > div > div:nth-child(2) {
  flex: 0 0 15%;
}
@media screen and (max-width: 999px) {
  #paymentTable > div > div:nth-child(2) {
    flex: 0 0 calc(100% - 25px);
  }
}
#paymentTable > div > div:nth-child(3) {
  flex: 0 0 70%;
}
@media screen and (max-width: 999px) {
  #paymentTable > div > div:nth-child(3) {
    padding-left: 25px;
    flex: 0 0 100%;
    font-size: 0.9rem;
  }
}
#paymentTable > div > div:nth-child(3) ol {
  list-style-type: decimal;
  margin-left: 1rem;
}
#paymentTable > div > div:nth-child(3) ol li {
  margin-bottom: 5px;
  color: #333;
}
#paymentTable > div > div:nth-child(3) ol li:last-child {
  margin-bottom: 0;
}
#paymentTable > div > div:nth-child(4) {
  flex: 0 0 10%;
  text-align: center;
}
@media screen and (max-width: 999px) {
  #paymentTable > div > div:nth-child(4) {
    display: flex;
    align-items: center;
    flex: 0 0 100%;
    margin-top: 5px;
    padding-left: 25px;
  }
}
@media screen and (max-width: 999px) {
  #paymentTable > div > div:nth-child(4)::before {
    content: "手續費";
    margin-right: 5px;
    font-size: 0.9rem;
  }
}

.important-notice {
  margin-bottom: 40px;
  padding: 10px 20px;
  font-size: 1rem;
  border-bottom: 1px solid #ccc;
  background-color: #ececec;
}
.important-notice ol {
  list-style-type: decimal;
  margin-top: 20px;
  margin-left: 1rem;
}
.important-notice ol li {
  margin-bottom: 10px;
}
.important-notice ol li:last-child {
  margin-bottom: 0;
}

.table_other_info {
  margin-bottom: 40px;
  padding-top: 20px;
  padding-bottom: 20px;
  border-top: 3px solid #ac1d21;
  border-bottom: 1px solid #ccc;
  font-size: 1rem;
}
.table_other_info input, .table_other_info select {
  padding: 5px 8px;
  font-size: 1rem;
}
.table_other_info > div {
  display: flex;
}
@media screen and (max-width: 999px) {
  .table_other_info > div {
    margin: 10px;
    padding: 0;
  }
}
.table_other_info > div > div {
  display: flex;
  align-items: center;
}
.table_other_info > div > div:first-child {
  justify-content: flex-end;
}
.table_other_info .order-invoice {
  margin-bottom: 15px;
}
@media screen and (max-width: 999px) {
  .table_other_info .order-invoice {
    flex-direction: column;
    margin: 0;
  }
}
.table_other_info .order-invoice span {
  margin-right: 10px;
}
.table_other_info .order-invoice > div {
  display: flex;
}
.table_other_info .order-invoice > div:first-child {
  flex: 0 0 150px;
}
@media screen and (max-width: 999px) {
  .table_other_info .order-invoice > div:first-child {
    flex: 0 0 auto;
    justify-content: flex-start;
  }
}
.table_other_info .order-invoice > div:first-child::after {
  content: "*";
  margin: 0 5px 0 0;
  color: #fff;
}
.table_other_info .order-invoice > div:first-child.required::after {
  color: #ff0000;
}
.table_other_info .order-invoice > div:first-child strong {
  font-weight: normal;
  font-size: 14px;
  color: #000;
}
.table_other_info .order-invoice > div:last-child {
  flex: 0 0 calc(100% - 150px);
}
@media screen and (max-width: 999px) {
  .table_other_info .order-invoice > div:last-child {
    flex-wrap: wrap;
    flex: 0 0 auto;
  }
}
.table_other_info .order-invoice > div:last-child > input, .table_other_info .order-invoice > div:last-child > select {
  height: calc(1.5em + 0.75rem + 2px);
  margin-right: 40px;
  padding: 0.275rem 0.75rem;
  font-size: 16px;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
}
@media screen and (max-width: 999px) {
  .table_other_info .order-invoice > div:last-child > input, .table_other_info .order-invoice > div:last-child > select {
    flex: 0 0 calc(100% - 80px);
    margin: 0;
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 999px) {
  .table_other_info .order-invoice > div:last-child > span {
    flex: 0 0 80px;
    margin-right: 0;
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 999px) {
  .table_other_info .order-postscript {
    flex-wrap: wrap;
    margin: 0;
  }
}
.table_other_info .order-postscript > div:first-child {
  align-items: baseline;
  flex: 0 0 150px;
}
@media screen and (max-width: 999px) {
  .table_other_info .order-postscript > div:first-child {
    flex: 0 0 100%;
    justify-content: flex-start;
  }
}
.table_other_info .order-postscript > div:first-child::after {
  content: "*";
  margin: 0 5px 0 0;
  color: #fff;
}
.table_other_info .order-postscript > div:first-child.required::after {
  color: #ff0000;
}
.table_other_info .order-postscript > div:first-child strong {
  font-weight: normal;
  font-size: 14px;
  color: #000;
}
.table_other_info .order-postscript > div:last-child {
  flex: 0 0 calc(100% - 150px);
}
@media screen and (max-width: 999px) {
  .table_other_info .order-postscript > div:last-child {
    flex: 0 0 100%;
    margin-top: 3px;
  }
}
.table_other_info .order-postscript > div:last-child > textarea {
  width: 100%;
  padding: 0.275rem 0.75rem;
  font-size: 16px;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
}

.table_other_info .use-integral {
  margin-bottom: 15px;
}

.table_other_info .use-integral > div {
  display: flex;
}

.table_other_info .use-integral--long:first-child {
  padding-bottom: 20px;
  border-bottom: 1px dashed #ccc;
}
.table_other_info .use-integral--long:last-child {
  margin-bottom: 0;
}
@media screen and (max-width: 999px) {
  .table_other_info .use-integral--long:last-child {
    padding-top: 20px;
  }
}
@media screen and (max-width: 999px) {
  .table_other_info .use-integral--long {
    flex-direction: column;
    margin: 0;
  }
}

@media screen and (max-width: 999px) {
  .table_other_info .use-integral--long > div  {
    flex: 0 0 100%;
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 999px) {
  .table_other_info .use-integral--long > div:last-child  {
    margin-bottom: 0;
  }
}
.table_other_info .use-integral--long div.checkcolumn label {
  display: flex;
  align-items: center;
  /* padding: 5px 10px; */
  cursor: pointer;
}
.table_other_info .use-integral--long div.checkcolumn label > input {
  display: none;
}
.table_other_info .use-integral--long div.checkcolumn label span {
  position: relative;
  margin-right: 0;
  margin-left: 0;
  padding-left: 24px;
  font-size: 14px;
}
.table_other_info .use-integral--long div.checkcolumn label span input {
    width: 80px;
    height: calc(1.5em + 0.75rem + 2px);
    margin-right: 10px;
    padding: 0.275rem 0.75rem;
    font-size: 16px;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
}
.table_other_info .use-integral--long div.checkcolumn label span:before,
.table_other_info .use-integral--long div.checkcolumn label span:after {
  content: '';
}
.table_other_info .use-integral--long div.checkcolumn label span:before {
  position: absolute;
  top: calc(50% - 10px);
  left: 0;
  width: 18px;
  height: 18px;
  border: 1px solid #222021;
  vertical-align: top;
}
.table_other_info .use-integral--long div.checkcolumn label span:after {
  position: absolute;
  top: calc(50% - 10px);
  left: 0;
  background: #222021;
  width: 20px;
  height: 20px;
  transition: 300ms;
  opacity: 0;
}
.table_other_info .use-integral--long div.checkcolumn label input:checked+span:after {
  opacity: 1;
}
.table_other_info--point .use-integral--long div b {
    font-size: 14px;
    color: #626262;
}

/* .table_other_info .use-integral--long > div.checkcolumn input {
  margin-left: 50px!important;
  margin-right: 5px!important;
} */
@media screen and (max-width: 999px) {
  .table_other_info .use-integral--long > div.checkcolumn input:first-child {
    margin-left: 0!important;
  }
}
@media screen and (max-width: 999px) {
  .table_other_info .use-integral--long > div.checkcolumn span {
    margin-right: 0;
    margin-left: 0;
    font-size: 14px;
  }
}
.table_other_info .use-integral--long > div strong {
  margin-left: 50px;
  font-size: 14px;
  font-weight: normal;
  color: #000;
}
@media screen and (max-width: 999px) {
  .table_other_info .use-integral--long > div strong {
    flex: 0 0 auto;
    margin-left: 0;
  }
}
.table_other_info .use-integral--long > div a {
  font-size: 14px;
}
.table_other_info .use-integral--long > div span {
  margin-left: 10px;
  margin-right: 5px;
  color: #000;
}

.table_other_info .use-integral > div:first-child {
  flex: 0 0 150px;
}

.table_other_info .use-integral--long > div:first-child {
  flex: 0 0 auto;
}
@media screen and (max-width: 999px) {
  .use-integral.use-integral--long > div:first-child {
    width: 100%!important;
  }
}
.table_other_info .use-integral > div:first-child strong {
  font-weight: normal;
  font-size: 14px;
  color: #000;
}
.table_other_info .use-integral--long > div:first-child strong {
  /* width: 138px; */
  margin-left: 0;
  white-space: nowrap;
  text-align: right;
}
@media screen and (max-width: 999px) {
  .table_other_info .use-integral--long > div:first-child strong {
    flex: 0 0 auto;
    width: auto;
    text-align-last: left;
  }
}
/* .table_other_info .use-integral--long > div:first-child span {
  margin-left: 10px;
  margin-right: 5px;
  color: #000;
} */
.table_other_info .use-integral > div:first-child::after {
  content: '*';
  margin: 0 5px 0 0;
  color: #fff;
}
.table_other_info--point .use-integral > div:first-child::after {
  content: '';
  margin: 0;
  color: #fff;
}
.table_other_info .use-integral > div:last-child > input {
  height: calc(1.5em + 0.75rem + 2px);
  margin-right: 10px;
  padding: 0.275rem 0.75rem;
  font-size: 16px;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
}

.table_other_info .use-integral--long > div > input[type=number], .table_other_info .use-integral--long > div > input[type=text],
.table_other_info .use-integral--long > div > div > input[type=number], .table_other_info .use-integral--long > div > div > input[type=text] {
  width: 100px;
  height: calc(1.5em + 0.75rem + 2px);
  margin-right: 10px;
  padding: 0.275rem 0.75rem;
  font-size: 16px;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
}
.table_other_info--point .use-integral--long > div > input[type=number], .table_other_info .use-integral--long > div > div > input[type=number] {
  width: 80px;
}
@media screen and (max-width: 999px) {
  .table_other_info .use-integral--long > div > div {
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 999px) {
  .table_other_info .use-integral > div:last-child > input[type=text] {
    width: auto;
  }
}
@media screen and (max-width: 999px) {
  .table_other_info .use-integral > div:last-child > input[type=checkbox] {
    width: auto;
    height: auto;
    padding: 0;
  }
}
@media screen and (max-width: 999px) {
  .table_other_info .use-integral > div:last-child > input[type=radio] {
    width: auto;
    height: auto;
    padding: 0;
  }
}
/* @media screen and (max-width: 999px) {
  .table_other_info--point .use-integral--long div strong, .table_other_info--point .use-integral--long div:first-child strong {
    width: 165px;
    flex: 0 0 165px;
  }
} */
.table_other_info--point .use-integral--long .checkcolumn {
  margin-left: 50px;
}
@media screen and (max-width: 999px) {
  .table_other_info--point .use-integral--long .checkcolumn {
    margin-left: 0;
  }
}
.table_other_info--point .use-integral--long .checkcolumn.manual-1 {
  margin-left: 88px;
}
@media screen and (max-width: 999px) {
  .table_other_info--point .use-integral--long .checkcolumn.manual-1 {
    margin-left: 0;
  }
}
.table_other_info--point .use-integral--long .checkcolumn.manual-2 {
  margin-left: 46px;
}
@media screen and (max-width: 999px) {
  .table_other_info--point .use-integral--long .checkcolumn.manual-2 {
    margin-left: 0;
  }
}
.table_other_info--point .use-integral--long .manual-3 {
  margin-left: 35px;
}
@media screen and (max-width: 999px) {
  .table_other_info--point .use-integral--long .manual-3 {
    margin-left: 0;
  }
}
.esc-order_total {
  margin-bottom: 40px;
  padding: 7px 20px 4px 20px;
  font-size: 1rem;
  text-align: right;
  border-top: 3px solid #ac1d21;
  border-bottom: 1px solid #ccc;
  background-color: #ececec;
}
@media screen and (max-width: 999px) {
  .esc-order_total {
    padding: 10px 10px 7px 10px;
  }
}
.esc-order_total .esc-order_total-row:first-child {
  display: flex;
  padding-bottom: 5px;
}
@media screen and (max-width: 999px) {
  .esc-order_total .esc-order_total-row:first-child {
    flex-wrap: wrap;
  }
}
.esc-order_total .esc-order_total-row:first-child .tooltip {
  position: relative;
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-left: 5px;
  font-size: 1rem;
  color: #fff;
  line-height: 16px;
  text-align: center;
  border-radius: 10px;
  background-color: #999;
}

.esc-order_total .esc-order_total-row:first-child .tooltip .tooltiptext {
  visibility: hidden;
  width: 150px;
  background-color: black;
  font-size: .8rem;
  font-style: normal;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
 
  /* Position the tooltip text - see examples below! */
  position: absolute;
  top: -50px;
  left: -67px;
  z-index: 1;
}

.esc-order_total .esc-order_total-row:first-child .tooltip:hover .tooltiptext {
  visibility: visible;
}

.esc-order_total .esc-order_total-row:first-child .tooltip .tooltiptext::after {
  content: " ";
  position: absolute;
  top: 100%; /* At the bottom of the tooltip */
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}
.esc-order_total .esc-order_total-row:nth-child(2) {
  padding-top: 5px;
  padding-bottom: 5px;
  border-top: 2px solid #ccc;
}
.esc-order_total .esc-order_total-row:first-child > div {
  width: calc(100% / 3);
  flex: 0 0 auto;
}
@media screen and (max-width: 999px) {
  .esc-order_total .esc-order_total-row:first-child > div {
    width: 100%;
  }
}
.esc-order_total .esc-order_total-row > div > p {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 3px 0;
}
.esc-order_total .esc-order_total-row > div > p > span {
  flex: 0 0 75px;
  padding-right: 5px;
  color: #000;
}
.esc-order_total .esc-order_total-row:nth-child(2) > div > p > span {
  font-weight: bold;
  color: #0000ff;
}
/* .esc-order_total .esc-order_total-row > div > p:first-child span {
  flex: 0 0 auto;
  padding: 0 5px;
} */
/* .esc-order_total .esc-order_total-row > div > p:last-child span {
  font-weight: bold;
  color: #0000ff;
} */

.esc-order_total input, .esc-order_total select {
  height: calc(1.5em + 0.75rem + 2px);
  margin-right: 40px;
  padding: 0.275rem 0.75rem;
  font-size: 16px;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
}

.esc-order_total .esc-order_total-row input[type=checkbox] {
  height: auto;
  margin-right: 5px;
  padding: 0;
}
.esc-order_total .esc-order_total-row input[type=text] {
  width: 60px;
  height: auto;
  margin-right: 0;
  padding: 0 5px;
  text-align: right;
}

#order_submit {
  display: flex;
  justify-content: center;
  padding-top: 35px;
}
#order_submit input[type=submit] {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 37px;
  padding: 5px 20px;
  font-size: 1rem;
  color: #fff;
  border: none;
  border-radius: 50px;
  background-color: #b90c0c;
  transition: all 0.3s;
  cursor: pointer;
}
#order_submit input[type=submit]:hover {
  background-color: #ff0000;
}

#remember_order_number {
  padding: 40px 200px;
  font-size: 16px;
}

@media screen and (max-width: 999px) {
  #remember_order_number {
    padding: 40px 10px;
  }
}
#remember_order_number > div {
  padding-bottom: 15px;
}

@media screen and (max-width: 999px) {
  #remember_order_number > div {
    line-height: 24px;
  }
}
#remember_order_number > .gobackblock {
  padding-bottom: 0;
}

#remember_order_number > .gobackblock a {
  color: #c1171d;
}

#remember_order_number input[type=submit] {
  padding: 10px 20px;
  font-size: 15px;
  color: #F0DFBE;
  letter-spacing: 2.4pt;
  border: none;
  background-color: #b90c0c;
  transition: all 0.3s;
  cursor: pointer;
}

#remember_order_number input[type=submit]:hover {
  background-color: #d62626;
}

#remember_order_number p {
  display: flex;
  align-items: center;
}

#remember_order_number p > label {
  display: block;
  width: 135px;
}

.gotop {
  position: fixed;
  right: 15px;
  bottom: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 20px;
  font-size: 0.8rem;
  color: #666;
  border-radius: 25px;
  border: 1px solid #666;
  z-index: 10000;
  cursor: pointer;
}
.gotop:active, .gotop:visited {
  color: #666;
}

.mask {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.75);
  z-index: -1;
}

#container {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: 88px;
  padding: 20px;
}
@media screen and (max-width: 999px) {
  #container {
    margin-top: 0;
    padding: 10px;
  }
}
#container.goods {
  max-width: 1500px;
  margin: 88px auto 0 auto;
}
@media screen and (max-width: 999px) {
  #container.goods {
    margin: 0 auto;
  }
}

#container.column {
  flex-direction: column;
}
#container.search-result {
  flex-direction: column;
}

.ur_here {
  position: relative;
  margin: 0 0 10px 0;
  padding: 0 0 0 20px;
  color: #aa8888;
  background-image: url(https://www.5hm1.com.tw/images/icon_arrow_right.png);
  background-position: 0px 3px;
  background-repeat: no-repeat;
}
@media screen and (max-width: 999px) {
  .ur_here {
    margin: 0 0 20px 0;
  }
}
.ur_here a {
  color: #aa8888;
}
.ur_here a:hover {
  color: #cc9966;
  text-decoration: underline;
}
@media screen and (max-width: 999px) {
  .ur_here .goodsForm {
    position: relative;
    padding-top: 10px;
    text-align: left;
  }
}
@media screen and (max-width: 999px) {
  .ur_here .goodsForm * {
    display: inline-block;
  }
}

#pager {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 10px 0;
  color: #aa8888;
}

#pager a {
  margin: 0 5px;
  padding: 5px;
  font-size: 1.2rem;
  color: #aa8888;
  line-height: 180%;
}

#pager span {
  padding: 2px 7px;
  color: #fff;
  border-radius: 3px;
  background-color: #aa8888;
}

#pageLeft {
  /* width: 210px;
  height: 100%;
  margin-right: 30px; */
  position: fixed;
  top: 88px;
  left: -100%;
  width: 240px;
  height: calc(100% - 85px);
  margin-right: 40px;
  padding: 20px;
  border-right: 1px solid #ccc;
  background-color: #fff;
  z-index: 1001;
  overflow-y: auto;
}
@media screen and (max-width: 999px) {
  #pageLeft {
    position: fixed;
    top: 0;
    left: -100%;
    display: block !important;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 51px 0 0 0;
    background-color: #fff;
    overflow-x: hidden;
    overflow-y: scroll;
    transition: all 0.6s;
    z-index: 999;
  }
}
/* #pageLeft::-webkit-scrollbar {
  width: 0;
  background-color: transparent;
} */
#pageLeft.no-show {
  display: none;
}
@media screen and (max-width: 999px) {
  #pageLeft.no-show {
    display: block;
  }
}

#pageLeft2 {
  flex: 0 0 200px;
  width: 200px;
  height: 100%;
  margin-right: 40px;
}
@media screen and (max-width: 999px) {
  #pageLeft2 {
    flex: 0 0 auto;
    width: 100%;
  }
}

/* 購物車+會員中心----------------------------------------------- */
.globalTitle {
  display: flex;
  justify-content: space-between;
  margin-bottom: 5px;
  font-size: 1rem;
  font-weight: bold;
  color: #363636;
}
.globalTitle.notab {
  margin: 40px 0 2rem 0;
  border-bottom: 3px solid #ac1d21;
}
.globalTitle > span {
  display: flex;
  align-items: center;
  font-size: 18px;
}
.globalTitle a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 70px;
  font-size: 14px;
  font-weight: normal;
  color: #fff;
  text-align: center;
  border-radius: 5px;
  background-color: #aaa;
}

.scree {
  padding: 8px 10px;
}
.scree h3 {
  color: #AA0000;
}
.scree p {
  display: flex;
  flex-wrap: wrap;
  padding: 8px 0;
}
.scree p strong {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 3px 0;
}
.scree p span {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 3px;
  padding: 3px 8px;
  color: #FFF;
  background: #AA0000;
}
.scree p a {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 3px;
  padding: 3px 4px;
}
.scree a {
  color: #404040;
}

.goodList {
  display: flex;
  flex-wrap: wrap;
  margin-top: 40px;
}
@media screen and (max-width: 485px) {
  .goodList {
    margin-top: 0;
  }
}
.goodList > form {
  display: flex;
  flex-wrap: wrap;
}
.goodList .box {
  position: relative;
  width: 450px;
  padding: 10px 10px 15px 10px;
  background-color: #fff;
}
@media screen and (max-width: 1440px) {
  .goodList .box {
    width: 50%;
    min-width: 485px;
  }
}
@media screen and (max-width: 1330px) {
  .goodList .box {
    width: 100%;
  }
}
@media screen and (max-width: 485px) {
  .goodList .box {
    min-width: auto;
  }
}
.goodList .box .item {
  position: relative;
  top: 0;
  display: flex;
  align-items: stretch;
  height: 195px;
  padding: 10px 15px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 15px 0 rgba(0, 0, 0, 0.19);
  transition: all 0.3s;
}
@media screen and (max-width: 1440px) {
  .goodList .box .item {
    height: 204px;
  }
}
.goodList .box .item:hover {
  top: -2px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3), 0 3px 8px 0 rgba(0, 0, 0, 0.39);
}
.goodList .box .item .quotation-btn {
  display: none !important;
}
@media screen and (max-width: 999px) {
  .goodList .box .item .quotation-btn {
    position: absolute;
    right: 8px;
    bottom: 8px;
    display: flex !important;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    background-color: #555;
    z-index: 99;
  }
  .goodList .box .item .quotation-btn img {
    width: 20px;
    height: 20px;
  }
}
.goodList .box .item .imgbox {
  display: flex;
  flex: 0 0 150px;
  align-items: center;
}
@media screen and (max-width: 400px) {
  .goodList .box .item .imgbox {
    flex: 0 0 120px;
  }
}
@media screen and (max-width: 360px) {
  .goodList .box .item .imgbox {
    flex: 0 0 80px;
  }
}
.goodList .box .item .imgbox img {
  max-width: 100%;
}
.goodList .box .item .txtbox {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 1 1 auto;
  margin: 0 0 0 0.5rem;
}
.goodList .box .item .txtbox .intro p.pname {
  height: 2.8rem;
  font-size: 1rem;
  color: #333;
  line-height: 1.4rem;
  overflow: hidden;
}
@media screen and (max-width: 1440px) {
  .goodList .box .item .txtbox .intro p.pname {
    height: 2.8rem;
  }
}
.goodList .box .item .txtbox .intro p.pname a {
  color: #333;
}
.goodList .box .item .txtbox .intro p.pname span {
  font-weight: bold;
  color: #000;
}
.goodList .box .item .txtbox .intro p.pname span.watermark {
  position: relative;
  display: inline-block;
  width: 15px;
  height: 15px;
  color: #fff;
  border-radius: 2px;
  background: #aa0000;
}
.goodList .box .item .txtbox .intro p.pname span.watermark::before {
  position: absolute;
  top: 0;
  left: 1px;
  font-size: 0.8rem;
  line-height: 15px;
}
.goodList .box .item .txtbox .intro p.pname span.watermark--promote::before {
  content: "促";
}
.goodList .box .item .txtbox .intro p.pname span.watermark--new::before {
  content: "新";
}
.goodList .box .item .txtbox .intro p.pname span.watermark--best::before {
  content: "推";
}
.goodList .box .item .txtbox .intro p.pname span.watermark--hot::before {
  content: "熱";
}
.goodList .box .item .txtbox .intro p.desc {
  position: relative;
  display: inline-block;
  height: 18px;
  margin: 0.5rem 0 0 0;
  padding: 0 7px;
  font-size: 13px;
  color: #fff;
  letter-spacing: 1px;
  line-height: 18px;
  border-radius: 5px;
  background: #ab1d33;
}
.goodList .box .item .txtbox .intro ul.price {
  display: flex;
  flex-direction: column;
  margin: 0.5rem 0 0 0;
}
.goodList .box .item .txtbox .intro ul.price li {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: 15px;
  color: #0000ff;
}
.goodList .box .item .txtbox .intro ul.price li:first-child span {
  padding: 0 10px 0 5px;
  color: #666;
}
.goodList .box .item .txtbox .intro ul.price li:nth-child(2) {
  margin: 0.25rem 0 0 0;
  border: 1px solid #ccc;
  border-radius: 0.5rem;
  font-weight: bold;
  color: #ff3300;
  overflow: hidden;
}
.goodList .box .item .txtbox .intro ul.price li:nth-child(2) span {
  padding: 2px 10px 2px 5px;
  font-weight: normal;
  color: #666;
}
.goodList .box .item .txtbox .intro ul.price li:nth-child(2) strong {
  font-size: 1.4rem;
}
.goodList .box .item .txtbox .function-line .function {
  display: flex;
}
.goodList .box .item .txtbox .function-line .function a {
  display: block;
  width: 25px;
  height: 25px;
  margin: 0 5px 0 0;
  border: 1px solid rgba(171, 29, 51, 0.25);
  border-radius: 3px;
  overflow: hidden;
}
.goodList .box .item .txtbox .function-line .function a:hover {
  border: 1px solid #ab1d33;
}
.goodList .box .item .txtbox .function-line .function a img {
  position: relative;
  top: -1px;
  left: -1px;
  height: 25px;
  transition: all 0.6s;
}
.goodList .box .item .txtbox .function-line .function a img:hover {
  left: -26px;
  background: #ab1d33;
}
.goodList .box .item .txtbox .function-line .function a span {
  display: none;
}
.goodList .box .item .txtbox .function-line i {
  font-style: normal;
  font-size: 12px;
  color: #ddd;
}
@media screen and (max-width: 640px) {
  .goodList .box .item .txtbox .function-line i {
    font-size: 11px;
    line-height: 100%;
    word-break: break-all;
  }
}
.goodList--grid .box {
  margin-top: 0 !important;
}
@media screen and (max-width: 375px) {
  .goodList--grid .box .item .imgbox {
    flex: 0 0 100px;
  }
}
.goodList--grid .box .item .txtbox .intro p.pname span.watermark {
  display: none;
}
.goodList--grid .box .item .txtbox .intro p.detail {
  display: none;
}
.goodList--grid .box .item .txtbox .function-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 5px 0 0 0;
}
.goodList--grid.no-logging .box .item .txtbox {
  justify-content: flex-start;
}
.goodList--grid.no-logging .box .item .txtbox .function-line {
  padding: 10px 0 0 0;
}
@media screen and (min-width: 486px) {
  .goodList--grid.no-logging .box .item .txtbox .function-line .function a {
    width: 40px;
    height: 40px;
  }
}
@media screen and (min-width: 486px) {
  .goodList--grid.no-logging .box .item .txtbox .function-line .function img {
    height: 40px;
  }
}
@media screen and (min-width: 486px) {
  .goodList--grid.no-logging .box .item .txtbox .function-line .function img:hover {
    left: -41px;
    background: #ab1d33;
  }
}
.goodList--list .box {
  width: 100%;
  margin-top: 0 !important;
  border-bottom: 1px solid #ccc;
}
.goodList--list .box .item {
  height: auto;
  padding: 10px 0;
  box-shadow: none;
}
.goodList--list .box .item:hover {
  top: 0;
  box-shadow: none;
}
@media screen and (max-width: 375px) {
  .goodList--list .box .item .imgbox {
    flex: 0 0 100px;
  }
}
.goodList--list .box .item .txtbox {
  display: flex;
  flex-direction: row;
}
@media screen and (max-width: 640px) {
  .goodList--list .box .item .txtbox {
    flex-direction: column;
  }
}
.goodList--list .box .item .txtbox .intro p.pname {
  height: auto;
}
.goodList--list .box .item .txtbox .intro p.desc {
  margin: 0.5rem 0 0 0;
}
.goodList--list .box .item .txtbox .intro ul.price {
  margin: 1rem 0 0 0;
}
.goodList--list .box .item .txtbox .function-line {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 180px;
  margin-left: 15px;
  padding: 0 15px;
  border-left: 1px dashed #ccc;
}
@media screen and (max-width: 640px) {
  .goodList--list .box .item .txtbox .function-line {
    align-items: flex-start;
    margin-left: 0;
    padding: 10px 0 0 0;
    border-left: 0;
  }
}
.goodList--list .box .item .txtbox .function-line .function {
  margin-bottom: 10px;
}
.goodList--list.no-logging .box .item .txtbox .intro ul.price li:nth-child(2) {
  display: none;
}
.goodList--text .box {
  margin-top: 0 !important;
  padding: 10px;
}
.goodList--text .box .item {
  height: 260px;
  padding: 0;
  box-shadow: none;
}
@media screen and (max-width: 375px) {
  .goodList--text .box .item {
    height: auto;
  }
}
.goodList--text .box .item:hover {
  top: 0;
  box-shadow: none;
}
.goodList--text .box .item .imgbox {
  display: none;
}
.goodList--text .box .item .txtbox {
  margin: 0;
  padding: 15px;
  border: 1px solid #ccc;
}
.goodList--text .box .item .txtbox .intro p.desc {
  margin: 0.5rem 0 0 0;
}
.goodList--text .box .item .txtbox .intro ul.price {
  margin: 1rem 0 0 0;
}
.goodList--text .box .item .txtbox .function-line {
  margin-top: 10px;
}
.goodList--text .box .item .txtbox .function-line .function {
  display: flex;
  flex-wrap: wrap;
}
.goodList--text .box .item .txtbox .function-line .function a {
  width: auto;
  height: auto;
  margin-bottom: 5px;
  padding: 0 5px;
  color: #ab1d33;
}
.goodList--text .box .item .txtbox .function-line .function a img {
  display: none;
}
.goodList--text .box .item .txtbox .function-line .function a span {
  display: block;
}
.goodList--text.no-logging .box .item {
  height: 210px;
}
@media screen and (max-width: 375px) {
  .goodList--text.no-logging .box .item {
    height: auto;
  }
}
.goodList--text.no-logging .box .item .txtbox .intro ul.price li:nth-child(2) {
  display: none;
}

.goodList .box--acc {
  width: 50%;
}
@media screen and (max-width: 485px) {
  .goodList .box--acc {
    width: 100%;
    margin-top: 10px !important;
  }
}
.goodList .box--acc .item {
  width: auto;
  height: 225px;
}
@media screen and (max-width: 485px) {
  .goodList .box--acc .item {
    flex-direction: column;
    align-items: flex-start;
    height: auto;
    padding: 10px;
  }
}
@media screen and (max-width: 485px) {
  .goodList .box--acc .item .imgbox {
    flex: 0 0 100px;
    margin: 0.5rem;
  }
}
@media screen and (max-width: 375px) {
  .goodList .box--acc .item .imgbox {
    flex: 0 0 70px;
  }
}
@media screen and (max-width: 485px) {
  .goodList .box--acc .item .txtbox {
    width: calc(100% - 1rem);
  }
}
@media screen and (max-width: 485px) {
  .goodList .box--acc .item .txtbox .intro p.pname {
    height: auto;
    margin-bottom: 10px;
    min-height: 2.8rem;
  }
}
.goodList .box--acc .item .txtbox .intro small {
  display: flex;
  margin: 10px 0;
  font-size: 0.9rem;
}
.goodList .box--acc .item .txtbox .intro small span {
  width: 95px;
  padding-left: 5px;
  font-size: 1rem;
  font-weight: bold;
  color: #ab1d33;
}
.goodList .box--acc .item .txtbox ul.price {
  display: flex;
  flex-direction: column;
}
.goodList .box--acc .item .txtbox ul.price li {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: 15px;
  color: #0000ff;
}
.goodList .box--acc .item .txtbox ul.price li:first-child span {
  padding: 0 10px 0 5px;
  color: #666;
}
.goodList .box--acc .item .txtbox ul.price li:first-child span:nth-child(2) {
  color: #0000ff;
}
.goodList .box--acc .item .txtbox ul.price li:nth-child(2) {
  margin: 0.25rem 0 0 0;
  border: 1px solid #ccc;
  border-radius: 0.5rem;
  font-weight: bold;
  color: #ff3300;
  overflow: hidden;
}
.goodList .box--acc .item .txtbox ul.price li:nth-child(2) span {
  padding: 2px 10px 2px 5px;
  font-weight: normal;
  color: #666;
}
.goodList .box--acc .item .txtbox ul.price li:nth-child(2) span:last-child {
  padding: 0;
  font-weight: bold;
  color: #ff3300;
}
.goodList .box--acc .item .txtbox ul.price li:nth-child(3) {
  justify-content: space-between;
  padding: 5px 0 0 0;
}
@media screen and (max-width: 485px) {
  .goodList .box--acc .item .txtbox ul.price li:nth-child(3) {
    flex-direction: column;
    align-items: flex-start;
  }
}
.goodList .box--acc .item .txtbox ul.price li:nth-child(3) .function {
  display: flex;
}
.goodList .box--acc .item .txtbox ul.price li:nth-child(3) .function select {
  margin: 0 3px 0 0;
  border-radius: 3px;
}
.goodList .box--acc .item .txtbox ul.price li:nth-child(3) .function a {
  display: block;
  width: 25px;
  height: 25px;
  margin: 0 5px 0 0;
  border: 1px solid rgba(171, 29, 51, 0.25);
  border-radius: 3px;
  overflow: hidden;
}
.goodList .box--acc .item .txtbox ul.price li:nth-child(3) .function a img {
  position: relative;
  top: -1px;
  left: -1px;
  transition: all 0.6s;
}
.goodList .box--acc .item .txtbox ul.price li:nth-child(3) > span {
  padding: 0 5px;
  color: #ab1d33;
  line-height: 25px;
}
.goodList .box--acc .item .txtbox ul.price li:nth-child(3) > span.errmsg {
  padding: 0;
  background: none;
}
@media screen and (max-width: 485px) {
  .goodList .box--acc .item .txtbox ul.price li:nth-child(3) > span.errmsg {
    margin-top: 5px;
  }
}
.goodList .box--acc .item .txtbox ul.price li:nth-child(3) > span.errmsg b {
  display: block;
  padding: 0 5px;
  color: #ab1d33;
  border: 2px solid #ab1d33;
}
@media screen and (max-width: 1390px) {
  .goodList .box--acc .item .txtbox ul.price li:nth-child(3) > span.errmsg b {
    padding: 0 3px;
    font-size: 12px;
  }
}
@media screen and (max-width: 485px) {
  .goodList .box--acc .item .txtbox ul.price li:nth-child(3) > span.errmsg b {
    font-size: 15px;
  }
}

/* graham_20170615 */
.goodsForm {
  position: absolute;
  top: 0px;
  right: 0px;
  padding-bottom: 5px;
  text-align: right;
}

.goodsForm > *:not(#_icon_explain) {
  display: inline-block;
}

.goodsForm select, .goodsForm input, .goodsForm img {
  vertical-align: middle;
}

.search-box > .item {
  display: flex;
  flex-direction: row;
  width: 96%;
  margin: 2%;
  padding: 10px;
  background-color: #fff;
  box-shadow: 1px 2px 12px rgba(0, 0, 0, 0.8);
  transition: all 0.3s;
}

@media screen and (max-width: 999px) {
  .search-box > .item {
    width: 100%;
    margin: 10px;
  }
}
.search-box > .item:hover {
  box-shadow: 0 0 8px rgba(45, 45, 45, 0.8);
  transform: translateY(-2px);
}

.search-box > .item dt.pic {
  width: 150px;
  min-width: 150px;
  height: 150px;
}

@media screen and (max-width: 999px) {
  .search-box > .item dt.pic {
    width: 120px;
    min-width: 120px;
  }
}
.search-box > .item dt.pic > a {
  display: block;
  height: 100%;
}

.search-box > .item dt.pic > a > img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid #ddd;
}

.search-box > .item > div {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding-left: 10px;
}

@media screen and (max-width: 999px) {
  .search-box > .item > div {
    padding-left: 5px;
  }
}
.search-box > .item .name {
  display: flex;
  align-items: center;
  min-height: 35px;
  padding: 0 4px;
  font-size: 16px;
}

.search-box > .item ._newDiv {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  height: 100%;
}

.search-box > .item ._newDiv > .pic {
  display: flex;
}

.search-box > .item ._newDiv > .pic > a {
  position: relative;
  display: block;
  width: 27px;
  height: 27px;
  margin-right: 15px;
  border: 1px solid #AB1D33;
  overflow: hidden;
  transition: all 0.3s;
}

.search-box > .item ._newDiv > .pic > a:hover {
  background-color: #AB1D33;
}

.search-box > .item ._newDiv > .pic > a:hover img {
  left: -25px;
}

.search-box > .item ._newDiv > .pic > a > img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  transition: all 0.3s;
}

.search-box > .item .price {
  margin: 4px 0;
}

.search-box > .item .price > div {
  display: flex;
  justify-content: space-between;
  padding: 6px 3px;
  font-size: 15px;
}

.search-box > .item .price > dt {
  padding: 6px 3px 0;
  font-size: 15px;
}

.search-box > .item .price > .goods-price_box {
  padding-top: 0;
}

.water_mart {
  margin-left: 10px;
  font-size: 14px;
  font-weight: normal;
  color: #FF6600;
}

.watermark_small {
  display: block;
  width: 15px;
  min-width: 15px;
  height: 15px;
  margin-right: 6px;
}

.watermark_promote_small {
  background: url(images/watermark_promote_small.gif) no-repeat;
}

.watermark_new_small {
  background: url(images/watermark_new_small.gif) no-repeat;
}

.watermark_best_small {
  background: url(images/watermark_best_small.gif) no-repeat;
}

.watermark_hot_small {
  background: url(images/watermark_hot_small.gif) no-repeat;
}

#container.search-result .goodList.goodList--grid .box {
  position: relative;
  width: 450px;
  padding: 10px 10px 15px 10px;
  background-color: #fff;
}
@media screen and (max-width: 1440px) {
  #container.search-result .goodList.goodList--grid .box {
    width: 33.3333333333%;
    min-width: auto;
  }
}
@media screen and (max-width: 1330px) {
  #container.search-result .goodList.goodList--grid .box {
    width: 50%;
  }
}
@media screen and (max-width: 900px) {
  #container.search-result .goodList.goodList--grid .box {
    width: 100%;
  }
}
#container.search-result .goodList.goodList--list .box {
  width: 46%;
  margin: 0 2%;
}
@media screen and (max-width: 1440px) {
  #container.search-result .goodList.goodList--list .box {
    width: 100%;
  }
}
@media screen and (max-width: 1440px) {
  #container.search-result .goodList.goodList--text .box {
    width: 50%;
  }
}
@media screen and (max-width: 900px) {
  #container.search-result .goodList.goodList--text .box {
    width: 100%;
  }
}

.searchTop {
  height: 100px;
  margin-bottom: 10px;
  padding: 20px 30px 0 0;
  font-size: 24px;
  color: #cbc4ba;
  text-align: right;
  background: url(images/searchTop.png) no-repeat;
  background-position: 0 75%;
}
@media screen and (max-width: 999px) {
  .searchTop {
    margin-top: 0;
    padding: 20px 0 0 10px;
    font-size: 16px;
    text-align: left;
  }
}

#compareLink {
  text-decoration: underline;
}

#compareBox {
  position: absolute;
  top: 200px;
  right: 0;
  width: 200px;
  padding: 5px;
  background-color: #efefef;
  box-shadow: -2px 2px 5px 0 rgba(0, 0, 0, 0.2);
  transition: right 0.5s;
}
#compareBox.hide {
  right: -200px !important;
}
#compareBox #hidBtn {
  float: left;
  position: relative;
  width: 28px;
  height: 50px;
  margin-left: -33px;
  border-radius: 5px 0 0 5px;
  background-color: #666;
  cursor: pointer;
}
#compareBox #hidBtn::before, #compareBox #hidBtn::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: inline-block;
  width: 10px;
  height: 2px;
  margin: auto;
  background-color: #fff;
}
#compareBox #hidBtn::before {
  transform-origin: right bottom;
  transform: rotate(40deg);
}
#compareBox #hidBtn::after {
  transform-origin: right top;
  transform: rotate(-40deg);
}
#compareBox.right {
  right: -128px;
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  #compareBox.right {
    right: -110px;
  }
}
#compareBox input {
  height: 23px;
  margin: 10px 0 5px 0;
  padding: 0 8px;
  color: #fff;
  line-height: 24px;
  border: none;
  border-radius: 3px;
  background-color: #ab1d33;
  cursor: pointer;
}

#compareList {
  padding: 0;
  background: #FFFFFF;
}
#compareList li {
  padding: 5px 0 5px 5px;
  font-size: 12px;
  color: #333;
  line-height: 100%;
  text-align: left;
  border-bottom: 1px dotted #ccc;
  background: #FFFFFF;
}
#compareList li:last-child {
  border-bottom: 0;
}
#compareList li span {
  display: inline-block;
  vertical-align: middle;
}
#compareList li span:nth-child(1) {
  width: 130px;
  height: 28px;
  margin-right: 15px;
  color: #626262;
  line-height: 28px;
  text-overflow: ellipsis;
  white-space: nowrap !important;
  overflow: hidden;
}
#compareList li span:nth-child(2) {
  position: relative;
  width: 20px;
  height: 20px;
  border-radius: 3px;
  background-color: #333;
  cursor: pointer;
}
#compareList li span:nth-child(2)::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: inline-block;
  width: 60%;
  height: 1px;
  margin: auto;
  background-color: #fff;
}

/* 商品比較頁面 ____________ */
#compare_table_container {
  word-wrap: break-word;
  cursor: -webkit-grab;
}
#compare_table_container img {
  display: block;
  width: 200px;
}
#compare_table_container img[alt*=comment] {
  height: auto;
}

.scroll-style-1::-webkit-scrollbar-track {
  background-color: #F5F5F5;
}

.scroll-style-1::-webkit-scrollbar {
  height: 5px;
  background-color: #F5F5F5;
}

.scroll-style-1::-webkit-scrollbar-thumb {
  background-color: #999;
}

.remove_prd {
  display: block;
  width: 50px;
  margin: 0 auto;
  color: #fff;
  background-color: #b50033;
}

.remove_prd:hover {
  color: #fff;
  backface-visibility: hidden;
  perspective: 1000px;
  animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
  transform: translate3d(0, 0, 0);
}

@keyframes shake {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }
  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }
  30%, 50%, 70% {
    transform: translate3d(-4px, 0, 0);
  }
  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}
.compareCTA {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 120px;
  height: 40px;
  margin: 10px auto;
  border-radius: 5px;
  border: 1px solid #D0D0D0;
  transition: all 0.25s linear;
}

.compareCTA:nth-child(1) {
  color: #fff;
  background: #b50033;
}

.compareCTA:nth-child(2) {
  color: #fff;
  background: #ea5413;
}

.compareCTA:last-child {
  margin-bottom: 50px;
}

/* 商品比較頁面__左右拖曳提示 ____________ */
#Ui_drag_hr {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
}

#Ui_drag_hr > * {
  pointer-events: auto;
}

#Ui_drag_hr input {
  position: absolute;
  left: -200%;
  width: 0;
  height: 0;
  visibility: hidden;
  opacity: 0;
}

#Ui_drag_hr label {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.35);
  opacity: 1;
}

#Ui_drag_hr #hide_inpt:checked ~ * {
  display: none;
}

#Ui_drag_hr .arrow_left, #Ui_drag_hr .arrow_right {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
  width: 200px;
  height: 70px;
  margin: auto;
  transform-origin: center center;
  z-index: 1;
}

#Ui_drag_hr .arrow_left::before, #Ui_drag_hr .arrow_left::before, #Ui_drag_hr .arrow_right::before, #Ui_drag_hr .arrow_right::before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-width: 35px;
  border-style: solid;
}

#Ui_drag_hr .arrow_left {
  background-image: linear-gradient(90deg, #ffa914 0%, rgba(255, 169, 20, 0) 100%);
  animation: Ui_drag_hr_arr_l 2s;
  transform: translate(0px, -35px);
  opacity: 0;
}

#Ui_drag_hr .arrow_left::before {
  margin-left: -70px;
  border-color: transparent #ffa914 transparent transparent;
}

#Ui_drag_hr .arrow_right {
  background-image: linear-gradient(-90deg, #db003e 0%, rgba(219, 0, 62, 0) 100%);
  animation: Ui_drag_hr_arr_r 2s;
  transform: translateX(0px, 35px);
  opacity: 0;
}

#Ui_drag_hr .arrow_right::before {
  margin-left: 200px;
  border-color: transparent transparent transparent #db003e;
}

#Ui_drag_hr .main_hand {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
  width: 100px;
  height: auto;
  margin: auto;
  z-index: 2;
  animation: Ui_drag_hr 2s forwards;
}

@keyframes Ui_drag_hr_arr_l {
  45% {
    transform: translate(-100px, -35px);
    opacity: 1;
  }
  50% {
    transform: translate(0, -35px);
    opacity: 0;
  }
  100% {
    transform: translate(-100px, -35px);
    opacity: 1;
  }
}
@keyframes Ui_drag_hr_arr_r {
  45% {
    transform: translate(100px, 35px);
    opacity: 1;
  }
  50% {
    transform: translate(0, 35px);
    opacity: 0;
  }
  100% {
    transform: translate(100px, 35px);
    opacity: 1;
  }
}
@keyframes Ui_drag_hr {
  0% {
    transform: rotateZ(0deg);
  }
  50% {
    transform: rotateZ(45deg);
    right: -200px;
    left: 0;
  }
  100% {
    transform: rotateZ(-45deg);
    right: 0;
    left: -200px;
  }
}
/* DWT：goods 商品詳細頁----------------------------------------------- */
#goodsInfo {
  margin-bottom: 20px;
}
@media screen and (max-width: 999px) {
  #goodsInfo {
    margin-top: 20px;
  }
}
#goodsInfo .row {
  display: flex;
}
@media screen and (max-width: 999px) {
  #goodsInfo .row {
    flex-direction: column;
  }
}
#goodsInfo .imgInfo {
  width: 500px;
  margin-right: 35px;
}
@media screen and (max-width: 999px) {
  #goodsInfo .imgInfo {
    width: 100% !important;
    padding: 0;
  }
}
#goodsInfo .imgInfo > dt {
  display: block;
  width: 100%;
  border: 1px solid #D0D0D0;
}
#goodsInfo .imgInfo > dt > img {
  display: block;
  width: 100%;
}
@media screen and (max-width: 999px) {
  #goodsInfo .imgInfo .clearfix {
    padding: 0 !important;
  }
}
@media screen and (max-width: 999px) {
  #goodsInfo .imgInfo .MagicThumb {
    width: 100% !important;
  }
}
@media screen and (max-width: 999px) {
  #goodsInfo .imgInfo .thumb {
    width: 100% !important;
    height: initial;
  }
}
#goodsInfo .imgInfo-list {
  height: 195px;
  padding: 19px;
}
#goodsInfo .gallery {
  position: relative;
  display: flex;
}
#goodsInfo .gallery ul {
  display: flex;
}
#goodsInfo .gallery li {
  display: flex;
  align-items: center;
  width: 154px;
  padding: 0 5px;
}
#goodsInfo .gallery li > dt {
  border: 1px solid #D0D0D0;
  cursor: pointer;
}
#goodsInfo .gallery li > dt.onbg {
  border: 1px solid #5CC728;
}
#goodsInfo .gallery li > dt > img {
  display: block;
  width: 100%;
}
#goodsInfo .gallery #demo {
  overflow-x: auto;
}
#goodsInfo .gallery #demo::-webkit-scrollbar {
  width: 0;
  background-color: transparent;
}
#goodsInfo .spanL {
  position: absolute;
  top: 35px;
  left: -15px;
  width: 5px;
  height: 72.5px;
  background: url(https://www.5hm1.com.tw/themes/lativ/images/span_lr.gif) no-repeat 0;
  transform: scale(2);
  cursor: default;
  opacity: 0.5;
}
#goodsInfo .spanR {
  position: absolute;
  top: 35px;
  right: -15px;
  width: 5px;
  height: 72.5px;
  background: url(https://www.5hm1.com.tw/themes/lativ/images/span_lr.gif) no-repeat -4px;
  transform: scale(2);
  cursor: pointer;
}
#goodsInfo .itemInfoList {
  font-family: "Microsoft JhengHei";
  color: #646464;
}
@media screen and (max-width: 999px) {
  #goodsInfo .itemInfoList {
    width: 100% !important;
    margin-top: 20px;
  }
}
#goodsInfo .itemInfoList h2 {
  display: flex;
  flex-direction: column;
  padding-bottom: 8px;
  font-size: 20px;
  font-weight: bold;
  color: #AA4444;
  line-height: 125%;
  border-bottom: 1px solid #ddd;
}
#goodsInfo .itemInfoList h2 span {
  font-size: 1rem;
  color: #333;
}
#goodsInfo .itemInfoList .line {
  margin-block: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid #ddd;
}
#goodsInfo .itemInfoList ul li {
  padding: 3px 0;
  font-size: 0.9rem;
  color: #646464;
}
#goodsInfo .itemInfoList ul li span.unit {
  margin-left: 5px;
}
#goodsInfo .itemInfoList ul.price li {
  position: relative;
  display: flex;
  align-items: flex-end;
  margin-bottom: 10px;
  padding-left: 20px;
}
#goodsInfo .itemInfoList ul.price li > span:first-child {
  display: inline-block;
  width: 130px;
}
#goodsInfo .itemInfoList ul.price li > span.unit {
  margin-left: 5px;
}
#goodsInfo .itemInfoList ul.price li > span.fee {
  margin-left: 5px;
}
#goodsInfo .itemInfoList ul.price li > span b {
  color: #222;
}
#goodsInfo .itemInfoList ul.price li::before {
  content: "";
  position: absolute;
  top: 8px;
  left: 3px;
  display: block;
  width: 10px;
  height: 10px;
  background-color: #ccc;
}
#goodsInfo .itemInfoList ul.price li.promotion {
  display: flex;
  justify-content: flex-start;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #eee;
}
@media screen and (max-width: 1400px) {
  #goodsInfo .itemInfoList ul.price li.promotion {
    flex-direction: column;
    align-items: flex-start;
  }
}
#goodsInfo .itemInfoList ul.price li.promotion .promotion-price {
  display: flex;
  align-items: flex-start;
  height: 48px;
}
#goodsInfo .itemInfoList ul.price li.promotion .promotion-price > span {
  height: 48px;
}
#goodsInfo .itemInfoList ul.price li.promotion .promotion-price > span.promotionPrice, #goodsInfo .itemInfoList ul.price li.promotion .promotion-price > span.unit, #goodsInfo .itemInfoList ul.price li.promotion .promotion-price > span.fee {
  display: flex;
  align-items: center;
}
#goodsInfo .itemInfoList ul.price li.promotion .promotion-price > span:first-child {
  width: 130px;
}
#goodsInfo .itemInfoList ul.price li.promotion .promotion-price > span > b {
  color: #222;
}
#goodsInfo .itemInfoList ul.price li.promotion .countdown {
  display: flex;
  flex-direction: column;
  margin-left: 15px;
  padding: 3px;
  text-align: center;
  font-weight: bold;
  color: #fff;
  border-radius: 5px;
  background: #ec8600;
  box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 1400px) {
  #goodsInfo .itemInfoList ul.price li.promotion .countdown {
    margin-left: 0;
  }
}
#goodsInfo .itemInfoList ul.price li.promotion .timer {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 5px;
  font-weight: bold;
  color: #8d3b0b;
  border-radius: 5px;
  background: #ffbe4e;
}
#goodsInfo .itemInfoList ul.price li.promotion .timer span {
  padding: 0 5px;
  font-size: 0.9rem;
  font-weight: bold;
  color: #fff;
  text-shadow: 1px 1px 2px rgba(82, 31, 1, 0.5);
}
#goodsInfo .itemInfoList ul.price li.time::before {
  display: none;
}
@media screen and (max-width: 1300px) {
  #goodsInfo .itemInfoList ul.price li.have-report {
    flex-wrap: wrap;
  }
}
#goodsInfo .itemInfoList ul.price li .report {
  border-radius: 8px;
  margin: 0 0 0 10px;
  padding: 4px;
  cursor: pointer;
  font-size: 14px;
  background-color: purple;
  color: white;
}
@media screen and (max-width: 1300px) {
  #goodsInfo .itemInfoList ul.price li .report {
    margin-top: 10px;
    margin-left: 130px;
  }
}
#goodsInfo .itemInfoList div.line {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
#goodsInfo .itemInfoList div.price {
  display: inline-block;
  margin: 5px 0 0 20px;
  border: 1px solid #ccc;
  border-radius: 10px;
  overflow: hidden;
}
#goodsInfo .itemInfoList div.price p {
  margin: 0 8px;
}
#goodsInfo .itemInfoList div.price p b {
  color: #AA4444;
}
#goodsInfo .itemInfoList div.price table {
  width: 100%;
  border-collapse: collapse;
}
#goodsInfo .itemInfoList div.price table th {
  padding: 0 20px;
  color: #333;
  background-color: #e4e4e4;
}
#goodsInfo .itemInfoList div.price table td {
  padding: 0 20px;
  color: #626262;
  text-align: center;
  border-bottom: 1px solid #ccc;
}
#goodsInfo .itemInfoList div.price table td:last-child {
  font-weight: bold;
  color: #333;
}
#goodsInfo .itemInfoList div.price table td span.unit {
  margin-left: 5px;
  font-weight: normal;
  color: #626262;
}
#goodsInfo .itemInfoList div.price table tr:last-child td {
  border-bottom: 0;
}
#goodsInfo .itemInfoList .discount {
  color: #aa4444;
}
#goodsInfo .itemInfoList .goods_rank {
  display: flex;
  align-items: center;
}
#goodsInfo .itemInfoList .goods_rank > div:first-child {
  min-width: 80px;
}
#goodsInfo .itemInfoList a {
  color: #2FA8E4;
  text-decoration: underline;
}
#goodsInfo .itemInfoList .goodsPrice {
  font-weight: bold;
  color: #ff3300;
}
#goodsInfo .itemInfoList .totalPrice, #goodsInfo .itemInfoList .promotionPrice {
  font-size: 1.2rem;
  font-weight: bold;
  color: #f00;
}
#goodsInfo .itemInfoList .goodsPrice#ECS_SHOPPRICE {
  color: #00f;
}
#goodsInfo .itemInfoList .marketPrice {
  color: #CC3300;
  text-decoration: line-through;
}
#goodsInfo .itemInfoList #itemBtnList {
  display: flex;
  justify-content: center;
}
#goodsInfo .itemInfoList #itemBtnList > a {
  color: #FFF;
  text-decoration: none;
}
@media screen and (max-width: 999px) {
  #goodsInfo .itemInfoList #itemBtnList > a {
    float: left;
  }
}
#goodsInfo .itemInfoList #itemBtnList > a:first-child > div {
  background: #b50033;
}
#goodsInfo .itemInfoList #itemBtnList > a:first-child > div:hover {
  background-color: #d40c44;
}
#goodsInfo .itemInfoList #itemBtnList > a:last-child > div {
  background: #ea5413;
}
#goodsInfo .itemInfoList #itemBtnList > a:last-child > div:hover {
  background: #ff7134;
}
#goodsInfo .itemInfoList #itemBtnList > a > div {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 135px;
  height: 36px;
  margin: 20px 25px 0;
  font-size: 16px;
  transition: all 0.3s;
}
#goodsInfo .itemInfoList .textInput {
  height: 15px;
  margin-right: 5px;
  padding: 3px;
  border: 1px solid #E6E6E6;
  background: #fff;
}
#goodsInfo .itemInfoList .itemInfoListTable {
  margin-bottom: 8px;
}
#goodsInfo .itemInfoList .itemInfoListTable th {
  width: 100px;
  padding: 2px 8px;
  color: #333;
  text-align: left;
  border-bottom: 2px solid #dadada;
}
#goodsInfo .itemInfoList .itemInfoListTable td {
  padding: 2px 8px;
  color: #999;
  border-bottom: 1px solid #dadada;
}
@media screen and (max-width: 480px) {
  #goodsInfo .itemInfoList .fset .title {
    font-size: 1rem;
  }
  #goodsInfo .itemInfoList .fset div select {
    width: 100%;
    margin: 0 0 0.5rem 0;
    font-size: 1rem;
  }
}
#goodsInfo .itemInfoList fieldset.fset {
  position: relative;
  margin-bottom: 10px;
  padding: 0;
  border: 1px solid #ddd;
  border-radius: 10px;
  background: #f2f2f2;
  box-shadow: 3px 3px 10px #ccc;
}
#goodsInfo .itemInfoList fieldset.fset > div {
  padding: 8px 12px;
}
#goodsInfo .itemInfoList fieldset.fset .title {
  padding: 5px 12px;
  font-size: 0.9rem;
  color: #fff;
  border-radius: 10px 10px 0 0;
  background-color: #5086d1;
}
#goodsInfo .itemInfoList fieldset.fset select {
  margin: 0 5px 5px 0;
  padding: 5px;
}
#goodsInfo .itemInfoList fieldset.fset .filiters {
  margin-bottom: 20px;
}
#goodsInfo .itemInfoList fieldset.fset .filiters:last-child {
  margin-bottom: 0;
}
#goodsInfo .itemInfoList fieldset.fset .filiters p {
  position: relative;
  margin-bottom: 5px;
  font-weight: bold;
}
#goodsInfo .itemInfoList fieldset.fset .filiters p span {
  position: relative;
  display: inline-block;
  padding: 0 5px 0 0;
  background-color: #f2f2f2;
  z-index: 2;
}
#goodsInfo .itemInfoList fieldset.fset .filiters p span b {
  display: inline-block;
  width: 19px;
  height: 19px;
  margin-right: 5px;
  text-align: center;
  border-radius: 10px;
  background-color: #ccc;
}
#goodsInfo .itemInfoList fieldset.fset .filiters p::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  display: block;
  width: 100%;
  height: 1px;
  background-color: #ccc;
  z-index: 1;
}
#goodsInfo .itemInfoList .propertySelect > .property-box1 {
  font-size: 0.9rem;
}
#goodsInfo .itemInfoList .propertySelect > .property-box1 > span {
  display: flex;
  color: #AA4444;
  margin-bottom: 3px;
  font-weight: bold;
}
#goodsInfo .itemInfoList .propertySelect > .property-box1 > span::before {
  content: "!";
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-right: 5px;
  color: #fff;
  text-align: center;
  border-radius: 3px;
  background-color: #ffbe4e;
}

.propertySelect {
  padding: 10px 0;
}

.propertySelect > .property-box {
  display: flex;
  align-items: center;
  padding: 6px 0;
  font-size: 16px;
}

.propertySelect > .property-box1 {
  align-items: center;
  padding: 6px 0;
  font-size: 16px;
}

.propertySelect .catt select {
  padding: 5px 8px;
  font-size: 16px;
}

.propertySelect .catt a {
  float: left;
  position: relative;
  display: block;
  margin-right: 2px;
  margin-left: 2px;
  color: #666;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  border: 1px solid #c8c9cd;
  background-color: #fff;
}

.propertySelect .catt a:hover {
  border: 1px solid #ff6701;
}

.propertySelect .catt a:hover p {
  border: 1px solid #ff6701;
}

.propertySelect .catt a:focus {
  outline-style: none;
}

.propertySelect .catt a p {
  padding: 2px 5px;
  border: #fff 1px solid;
  background-color: #fff;
}

.propertySelect .catt a p.padd {
  padding: 0;
}

.propertySelect .catt .cattsel {
  border: #ff6701 1px solid;
  background: #ff6701;
}

.propertySelect .catt .cattsel a:hover {
  border: 1px solid #ff6701;
}

.propertySelect .catt .cattsel a:hover i {
  background: url(images/test.png) no-repeat scroll right bottom transparent;
}

.propertySelect .catt .cattsel p {
  border: 1px solid #ff6701;
}

.propertySelect .catt .cattsel i {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 16px;
  height: 16px;
  background: url(images/test.png) no-repeat scroll right bottom transparent;
}

.propertySelect .catt em {
  font-style: normal;
}

.goods-li-bg {
  height: 32px;
  margin-top: 10px;
  margin-right: 0;
  background: url(images/good_li_bg.jpg) repeat-x;
}

.goods-li {
  height: 29px;
  margin-left: 2px;
  padding-top: 3px;
  padding-left: 12px;
  font-size: 12px;
  font-weight: bold;
  color: #FFF;
  background: url(images/good_li.jpg) no-repeat;
}

/* -   放大鏡 - */
.MagicZoomBigImageCont {
  border: 1px solid #AA0000;
}

.MagicZoomHeader {
  font: 12px Tahoma, Verdana, Arial, sans-serif;
  color: #fff;
  background: #AA0000;
  text-align: center !important;
}

.MagicZoomPup {
  border: 1px solid #aaa;
  background: #ffffff;
  cursor: hand;
}

.MagicZoomLoading {
  display: none;
  padding: 3px 3px 3px 3px !important;
  color: #444;
  text-align: center;
  border: 1px solid #ccc;
  background: #ffffff;
  opacity: 0.8;
}

.MagicZoomLoading img {
  padding-top: 3px !important;
}

.MagicThumb {
  outline: none;
  cursor: url(images/zoomin.cur), pointer;
}

.MagicThumb span {
  display: none;
}

.MagicThumb-zoomed {
  cursor: default;
}

.MagicThumb-image {
  border: 1px solid #cccccc;
  outline: none;
}

.MagicThumb-image-zoomed {
  cursor: url(images/zoomout.cur), pointer;
}

.MagicThumb-caption {
  padding: 8px 16px;
  font-family: Verdana, Helvetica;
  font-size: 11px;
  color: #333333;
  border: 1px solid #CCCCCC;
  border-top: none;
  background-color: #F0F0F0;
}

.MagicThumb-controlbar {
  display: block;
  height: 18px;
}

.MagicThumb-controlbar a {
  float: left;
  display: block;
  width: 18px;
  height: 18px;
  margin: 0 1px;
  outline: none;
  overflow: hidden;
}

.MagicThumb-controlbar a span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 1000px;
  height: 1000px;
  background: transparent url(images/controlbar.png) no-repeat 0 0;
  outline: none;
}

.MagicThumb-loading {
  margin: 0;
  padding: 2px 2px 2px 22px;
  font-family: sans-serif;
  font-size: 8pt;
  text-decoration: none;
  text-align: left;
  border: 1px solid #000000;
  background: url(images/loader.gif) no-repeat 2px 50% #ffffff;
}

/* message_board.dwt----------------------------------------------- */
.messageBoard {
  float: left;
  width: 100%;
  margin: 20px 10px;
}

.messageBoard .title {
  float: left;
  margin-top: 8px 0;
  font-size: 14px;
  font-weight: bold;
  color: #CD6702;
}

.messageList {
  margin: 20px 30px;
}

.messageList .list {
  margin-bottom: 10px;
  line-height: 190%;
}

.messageList .admin {
  margin: 2px 0;
  color: #999;
}

.messageList .userName {
  font-weight: bold;
  color: #F7941C;
}

.f2 {
  margin-right: 15px;
  font-weight: bold;
  color: #006bd0;
}

/* 積分商城----------------------------------------------- */
.exchange {
  padding: 10px 10px 0 10px;
}

.exchange ul {
  height: 80px;
  margin-bottom: 10px;
}

.exchange li {
  float: left;
  padding-top: 8px;
}

.exchange li.ex_1 {
  width: 80px;
  text-align: center;
}

.exchange li.ex_1 img {
  width: 50px;
  height: 50px;
  padding: 1px;
  border: 1px solid #ccc;
}

.exchange li.ex_2 {
  width: 290px;
  margin-right: 10px;
}

.exchange li.ex_3 {
  width: 290px;
  margin-right: 10px;
}

/* 報價單 quotation.dwt----------------------------------------------- */
.quotation {
  margin-bottom: 50px;
  padding: 50px;
  text-align: center;
  border: 1px solid #E0DDD4;
}

.quotation h6 {
  margin-bottom: 30px;
  font-size: 24px;
}

#h5 {
  display: block;
  margin: 0 0 17px;
  font-size: 14px;
  font-weight: 600;
  color: #000;
  line-height: 1em;
}

.box_1 {
  /* border: 1px solid #ddd; */
  background-color: #fff;
}

.box_2 {
  border: 1px solid #ddd;
  background: url(images/box_2Bg.gif) repeat-x top left;
  background-color: #edf8fe;
}

.boxCenterList {
  padding: 8px;
}

.boxCenterList ul {
  height: 1%;
  margin-bottom: 5px;
}

.boxCenterList li {
  float: left;
  width: 100px;
  line-height: 20px;
}

.boxCenterList li.goodsimg {
  float: left;
  width: 87px;
  margin-right: 10px;
}

.boxCenterList li.goodsimg img {
  display: block;
  width: 85px;
  height: 85px;
}

.alone {
  padding: 0 0 0 10px;
  color: #3f3f3f;
  text-decoration: none;
  background: url(images/bg.gif) no-repeat 0px -170px;
}

.RelaArticle a {
  padding: 0 0 0 10px;
  color: #3f3f3f;
  text-decoration: none;
  background: url(images/bg.gif) no-repeat 0px -170px;
}

.RelaArticle a:hover {
  color: #ff6f3d;
  text-decoration: underline;
}

.colle a {
  padding: 0;
  color: #3f3f3f;
  text-decoration: none;
  background: none;
}

.colle a:hover {
  padding: 0;
  color: #ff6f3d;
  text-decoration: underline;
  background: none;
}

.none {
  display: none;
}

.adblock {
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.adblock div {
  float: left;
  width: 193px;
  margin-right: 9.3px;
}

@media screen and (max-width: 999px) {
  .adblock div {
    width: 50%;
    margin: 0;
    padding: 2.5px;
  }
}
.adblock div:last-child {
  margin-right: 0;
}

.adblock div img {
  width: 100%;
}

#userLogin .parentuserlogin {
  overflow: hidden;
}

#userLogin .parentuserlogin * {
  box-sizing: border-box;
}

#userLogin .parentuserlogin > ul {
  float: left;
  width: 409px;
  margin: 25px 0 25px 150px;
  padding: 20px 0 7px 0;
  border: 1px solid #CCC;
  border-top: 2px solid #ac1d21;
  background-color: #FFFFFF;
}

@media screen and (max-width: 999px) {
  #userLogin .parentuserlogin > ul {
    width: 100%;
    margin-left: 0;
    border-right: 0;
    border-left: 0;
  }
}
#userLogin .parentuserlogin > ul li {
  overflow: hidden;
}

#userLogin .parentuserlogin > ul li p {
  float: left;
}

#userLogin .parentuserlogin > ul li p:first-child {
  width: 142px;
  padding: 5px;
  text-align: right;
}

@media screen and (max-width: 999px) {
  #userLogin .parentuserlogin > ul li p:first-child {
    width: 80px;
  }
}
#userLogin .parentuserlogin > ul li p:last-child {
  width: 265px;
  padding: 5px;
}

@media screen and (max-width: 999px) {
  #userLogin .parentuserlogin > ul li p:last-child {
    width: 218px;
  }
}
#userLogin .parentuserlogin > ul .actionSub {
  padding-left: 152px;
}

@media screen and (max-width: 999px) {
  #userLogin .parentuserlogin > ul .actionSub {
    padding-left: 90px;
  }
}
#userLogin .parentuserlogin > dt {
  float: left;
  padding: 58px 45px;
  margin: 25px 0;
}

@media screen and (max-width: 999px) {
  #userLogin .parentuserlogin > dt {
    display: none;
  }
}
#userLogin .parentuserlogin > div {
  float: left;
  margin: 25px 0;
}

.installment {
  min-width: 100px;
  padding: 5px 8px;
  font-size: 15px;
}

.mMask {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  z-index: 999999999;
}

#com_b {
  display: flex;
}

#com_b > h2 {
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.content-div-box {
  display: flex;
  flex-direction: column;
}

.bought_goods-box {
  display: flex;
  flex-direction: unset;
  flex-wrap: wrap;
}

.bought_goods-box > ul {
  width: 20%;
  padding: 10px;
}

.bought_goods-box > ul > li img {
  display: block;
  width: 100%;
  border: 1px solid #CCC;
}

#_icon_explain {
  height: 20px;
  margin-top: 10px;
}

#_icon_explain img {
  vertical-align: -3px;
}

#_icon_explain span {
  margin-right: 5px;
  margin-left: 5px;
  font-weight: 900;
}

#_icon_explain span:last-child {
  margin-right: 0;
}

.brand-info-box {
  display: flex;
  padding: 0 10px;
}

@media screen and (max-width: 999px) {
  .brand-info-box {
    flex-direction: column;
    padding: 0;
  }
}
.brand-info-box > .brand-info_name {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 200px;
  min-width: 200px;
  padding: 15px 0;
  border: 1px solid #DDD;
}

@media screen and (max-width: 999px) {
  .brand-info-box > .brand-info_name {
    width: 100%;
  }
}
.brand-info-box > .brand-info_name > img {
  display: block;
}

.brand-info-box > .brand-info_name > div {
  margin-top: 5px;
  font-size: 18px;
}

.brand-info-box > .brand-info_list {
  padding: 10px 10px 10px 15px;
  border: 1px solid #DDD;
  border-left: 0;
}

@media screen and (max-width: 999px) {
  .brand-info-box > .brand-info_list {
    border-top: 0;
    border-left: 1px solid #ddd;
  }
}
.brand-info-box > .brand-info_list > p {
  padding: 5px 0;
  font-size: 15px;
}

.brand-info-box > .brand-info_list > div {
  display: flex;
  flex-wrap: wrap;
}

.brand-info-box > .brand-info_list > div > a {
  padding: 5px 0;
}

@media screen and (max-width: 999px) {
  #cycle_images {
    width: 100% !important;
  }
}
@media screen and (max-width: 999px) {
  .content-div .related_products > ul {
    width: 100% !important;
    padding: 0;
  }
}
@media screen and (max-width: 999px) {
  .content-div ul {
    width: 33.3%;
  }
}
@media screen and (max-width: 999px) {
  #speDiv {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    margin-top: -130px;
    margin-left: -150px;
  }
}
@media screen and (max-width: 999px) {
  #containerIndex .parentuserlogin {
    box-sizing: border-box;
  }
}
@media screen and (max-width: 999px) {
  #containerIndex .shoppingCart li:first-child {
    width: 41%;
    padding: 5px 0;
  }
}
@media screen and (max-width: 999px) {
  #containerIndex .shoppingCart li:last-child {
    width: 59%;
    padding: 5px 0;
  }
}
@media screen and (max-width: 999px) {
  #containerIndex #flow_userprocess {
    margin-top: 0;
  }
}
@media screen and (max-width: 999px) {
  #containerIndex #flow_userprocess ul > li {
    left: none;
    width: 100%;
  }
}
@media screen and (max-width: 999px) {
  #containerIndex .globalTitle {
    margin: 10px;
  }
}
@media screen and (max-width: 999px) {
  #containerIndex .table_fee_total tr td:last-child {
    text-align: center;
  }
}
@media screen and (max-width: 999px) {
  #pic_category {
    width: 100%;
    height: 100%;
    min-height: 150px;
    max-height: 180px;
  }
}
@media screen and (max-width: 999px) {
  .credit-balance > div:first-child {
    justify-content: flex-start !important;
    align-items: baseline;
    width: 25% !important;
    padding-top: 7px;
  }
}
@media screen and (max-width: 999px) {
  .credit-balance > div:last-child {
    flex-wrap: wrap;
    width: 75%;
  }
}
@media screen and (max-width: 999px) {
  .credit-balance > div:last-child > input {
    width: 100%;
    margin: 0;
  }
}
@media screen and (max-width: 999px) {
  .use-integral > div:first-child {
    justify-content: flex-start !important;
    align-items: baseline;
    width: 25% !important;
    padding-top: 7px;
  }
}
@media screen and (max-width: 999px) {
  .use-integral > div:last-child {
    flex-wrap: wrap;
    width: 75%;
  }
}
@media screen and (max-width: 999px) {
  .use-integral--long > div:last-child {
    width: 100%;
  }
}
@media screen and (max-width: 999px) {
  .use-integral > div:last-child > input {
    width: 100%;
    margin: 0;
  }
}
@media screen and (max-width: 999px) {
  .stock-treatment > div:first-child {
    justify-content: flex-start !important;
    align-items: baseline;
    width: 25% !important;
    padding-top: 7px;
  }
}
@media screen and (max-width: 999px) {
  .stock-treatment > div:last-child {
    flex-wrap: wrap;
    width: 75%;
  }
}
@media screen and (max-width: 999px) {
  .use_bonus > div:last-child {
    flex-wrap: wrap;
    width: 75%;
  }
}
@media screen and (max-width: 999px) {
  .user_order_list-head {
    display: none !important;
  }
}
@media screen and (max-width: 999px) {
  .user_order_list-body {
    flex-wrap: wrap;
    height: auto !important;
    margin: 10px;
    padding: 10px !important;
    box-shadow: 0 0 10px rgba(111, 111, 111, 0.8);
  }
}
@media screen and (max-width: 999px) {
  .user_order_list-body > div {
    width: 50%;
    margin-bottom: 10px;
    padding: 0 !important;
    text-align: left !important;
  }
}
@media screen and (max-width: 999px) {
  .user_order_list-body > div:nth-child(5) {
    width: 100%;
    margin: 0;
  }
}
@media screen and (max-width: 999px) {
  .user_order_list-body > div a {
    color: #aa0000;
  }
}
article.announcement h3 {
  padding-block: 5px;
  font-size: 1.4rem;
  color: #000;
  text-align: center;
}
article.announcement h3 p {
  display: inline-block;
  padding-bottom: 5px;
  border-bottom-style: double;
  border-bottom-color: #aa0000;
}
article.announcement .main {
  margin-top: 2rem;
  font-size: 1rem;
  line-height: 1.4rem;
  color: #333;
}
@media screen and (max-width: 999px) {
  article.announcement .main {
    line-height: 1.6rem;
  }
}
article.announcement .main p {
  margin-bottom: 1rem;
}
article.announcement .main p.signature {
  margin-top: 2rem;
  text-align: right;
}
article.announcement .main a {
  color: #0000ff;
}
article.announcement .main b {
  color: #000;
}
article.announcement .main strong {
  color: #ff0000;
}
article.announcement .main ul li {
  position: relative;
  margin-bottom: 30px;
  padding-left: 36px;
}
article.announcement .main ul li::before {
  position: absolute;
  top: 0;
  left: 0;
}
article.announcement .main ul li:first-child::before {
  content: "一、";
}
article.announcement .main ul li:nth-child(2)::before {
  content: "二、";
}
article.announcement .main ul li:nth-child(3)::before {
  content: "三、";
}
article.announcement .main ul li:nth-child(4)::before {
  content: "四、";
}
article.announcement .main ul li:nth-child(5)::before {
  content: "五、";
}
article.announcement .main ul li:nth-child(6)::before {
  content: "六、";
}
article.announcement .main ul li:nth-child(7)::before {
  content: "七、";
}

.progressBox {
  display: flex;
  justify-content: space-between;
  width: 100%;
  max-width: 1200px;
  margin: 50px auto;
}
@media (max-width: 1080px) {
  .progressBox {
    flex-direction: column;
    margin: 0;
  }
}
.progressBox .title {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 400px;
}
@media (max-width: 1080px) {
  .progressBox .title {
    width: 100%;
    height: 60px;
  }
}
.progressBox .title::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background: #ccc;
}
.progressBox .title span {
  display: block;
  width: 100%;
}
.progressBox .title span:first-child {
  margin: 8px 0 0 0;
  font-size: 2rem;
  color: #ccc;
}
.progressBox .title span:last-child {
  margin: 5px 0 0 0;
  font-size: 1.5rem;
  text-align: center;
}
.progressBox .title span:last-child strong {
  color: #c30d23;
}
.progressBox .progress-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 1080px) {
  .progressBox .progress-box {
    justify-content: center;
    flex-wrap: wrap;
    margin: 3rem 0;
  }
}
.progressBox .progress-box .stepper {
  position: relative;
  display: flex;
  align-items: center;
}
@media (max-width: 1199px) {
  .progressBox .progress-box .stepper {
    margin: 0 0 0 0;
  }
}
@media (max-width: 539px) {
  .progressBox .progress-box .stepper {
    display: flex;
    flex-direction: column-reverse;
    margin: 0 2rem 0 0;
  }
}
.progressBox .progress-box .stepper::before {
  content: ">";
  margin: 0 1rem;
  font-size: 2rem;
  color: #ccc;
}
@media (max-width: 1199px) {
  .progressBox .progress-box .stepper::before {
    margin: 0 0.5rem;
  }
}
@media (max-width: 539px) {
  .progressBox .progress-box .stepper::before {
    display: none;
  }
}
.progressBox .progress-box .stepper::after {
  position: absolute;
  top: 50%;
  right: -1.5rem;
  display: none;
  content: ">";
  font-size: 1.2rem;
  color: #ccc;
}
@media (max-width: 539px) {
  .progressBox .progress-box .stepper::after {
    display: block;
  }
}
.progressBox .progress-box .stepper:first-child::before {
  display: none;
}
@media (max-width: 539px) {
  .progressBox .progress-box .stepper:last-child {
    margin: 0;
  }
}
.progressBox .progress-box .stepper:last-child::after {
  display: none;
}
.progressBox .progress-box .stepper .desc {
  display: flex;
  flex-direction: column;
}
@media (max-width: 539px) {
  .progressBox .progress-box .stepper .desc {
    align-items: center;
  }
}
.progressBox .progress-box .stepper .desc span:first-child {
  height: 30px;
  font-size: 0.6rem;
  color: #ccc;
}
.progressBox .progress-box .stepper .desc span:first-child strong {
  font-size: 1.8rem;
  font-weight: normal;
  line-height: 2rem;
  letter-spacing: -2px;
}
@media (max-width: 539px) {
  .progressBox .progress-box .stepper .desc span:first-child strong {
    font-size: 1.2rem;
  }
}
.progressBox .progress-box .stepper .desc span:last-child {
  text-align: right;
}
.progressBox .progress-box .stepper .circle {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 60px;
  height: 60px;
  margin: 0 0 0 0.25rem;
  border-radius: 50%;
  background-color: #b8b8b8;
}
@media (max-width: 767px) {
  .progressBox .progress-box .stepper .circle {
    width: 50px;
    height: 50px;
  }
}
.progressBox .progress-box .stepper .circle img {
  max-width: 100%;
  max-height: 100%;
}
.progressBox .progress-box .stepper.active .circle {
  width: 60px;
  height: 60px;
  background-color: #db4658;
}
@media (max-width: 767px) {
  .progressBox .progress-box .stepper.active .circle {
    width: 50px;
    height: 50px;
  }
}
@media screen and (max-width: 999px) {
  .table.spec tr th {
    padding-top: 55px !important;
  }
}
#popmsg {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  overflow: auto;
  z-index: 99;
}
#popmsg > div {
  position: relative;
  top: 50%;
  display: flex;
  flex-direction: column;
  width: 90%;
  max-width: 900px;
  margin: auto;
  font-size: 1rem;
  font-weight: normal;
  color: black;
  border: 2px solid #ab1d33;
  border-radius: 5px;
  background-color: rgb(255, 255, 200);
  transform: translate(0, -50%);
  overflow: hidden;
}
#popmsg > div > div:first-child {
  padding: 5px 0;
  font-size: 1.2rem;
  color: #fff;
  letter-spacing: 5px;
  text-align: center;
  border-bottom: 2px solid #fff;
  background-color: #ab1d33;
}
#popmsg > div > div:nth-child(2) {
  padding: 20px;
  border-top: 2px solid #ab1d33;
}
#popmsg > div > div:nth-child(2) .btn-line {
  padding-top: 20px;
  text-align: center;
}
#popmsg > div > div:nth-child(2) .btn-line button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 120px;
  height: 32px;
  margin: 0 auto;
  color: #000;
  font-size: 16px;
  line-height: 32px;
  text-align: center;
  border: 1px solid #aaa;
  border-radius: 5px;
  background-color: #fff;
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
  cursor: pointer;
}

#popmsg2 {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 99;
}
#popmsg2 > div {
  position: relative;
  top: 50%;
  display: flex;
  flex-direction: column;
  width: 90%;
  max-width: 600px;
  margin: auto;
  font-size: 1rem;
  font-weight: normal;
  color: black;
  text-align: center;
  border: 2px solid #ab1d33;
  border-radius: 5px;
  background-color: #fff;
  transform: translate(0, -50%);
  overflow: hidden;
}
#popmsg2 > div > div:first-child {
  padding: 5px 0;
  font-size: 1.2rem;
  color: #fff;
  letter-spacing: 5px;
  border-bottom: 2px solid #fff;
  background-color: #ab1d33;
}
#popmsg2 > div > div:nth-child(2) {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  padding: 20px;
  border-top: 2px solid #ab1d33;
}
#popmsg2 > div > div:nth-child(2) span:first-child {
  display: inline-block;
  width: 25px;
  height: 25px;
  margin: 0 5px;
  border: 1px solid rgba(171, 29, 51, 0.25);
  border-radius: 3px;
  overflow: hidden;
}
#popmsg2 > div > div:nth-child(2) span:first-child img {
  position: relative;
  top: -1px;
  left: -2px;
  width: 50px;
}
#popmsg2 > div > div:nth-child(2) span:nth-child(2) {
  margin: 0 5px;
  padding: 4px;
  font-size: 14px;
  color: #fff;
  border-radius: 8px;
  background-color: purple;
}
#popmsg2 > div > div:nth-child(3) {
  padding: 20px;
}
#popmsg2 > div > div:nth-child(3) button {
  display: inline-block;
  width: 120px;
  height: 32px;
  color: #000;
  font-size: 1rem;
  text-align: center;
  border: 1px solid #aaa;
  border-radius: 5px;
  background-color: #ddd;
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
  cursor: pointer;
}
#popmsg3 {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 99;
}
#popmsg3 > div {
  position: relative;
  top: 50%;
  display: flex;
  flex-direction: column;
  width: 90%;
  max-width: 600px;
  margin: auto;
  font-size: 1rem;
  font-weight: normal;
  color: black;
  text-align: center;
  border: 2px solid #ab1d33;
  border-radius: 5px;
  background-color: #fff;
  transform: translate(0, -50%);
  overflow: hidden;
}
#popmsg3 > div > div:first-child {
  padding: 5px 0;
  font-size: 1.2rem;
  color: #fff;
  letter-spacing: 5px;
  border-bottom: 2px solid #fff;
  background-color: #ab1d33;
}
#popmsg3 > div > div:nth-child(2) {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  padding: 20px 20px 0 20px;
  border-top: 2px solid #ab1d33;
}
#popmsg3 > div > div:nth-child(2) ol {
  padding-inline-start: 20px;
  list-style: decimal;
}
#popmsg3 > div > div:nth-child(2) ol li {
  margin-bottom: 10px;
  text-align: left;
}
#popmsg3 > div > div:nth-child(2) ol li:last-child {
  margin-bottom: 0;
}
#popmsg3 > div > div:nth-child(2) ol li span {
  color: #ab1d33;
}
#popmsg3 > div > div:nth-child(3) {
  padding: 20px;
}
#popmsg3 > div > div:nth-child(3) button {
  display: inline-block;
  width: 120px;
  height: 32px;
  color: #000;
  font-size: 1rem;
  text-align: center;
  border: 1px solid #aaa;
  border-radius: 5px;
  background-color: #ddd;
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
  cursor: pointer;
}

#popmsg4 {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 99;
}
#popmsg4 > div {
  position: relative;
  top: 50%;
  display: flex;
  flex-direction: column;
  width: 90%;
  max-width: 600px;
  margin: auto;
  font-size: 1rem;
  font-weight: normal;
  color: black;
  text-align: center;
  border: 2px solid #ab1d33;
  border-radius: 5px;
  background-color: #fff;
  transform: translate(0, -50%);
  overflow: hidden;
}
#popmsg4 > div > div:first-child {
  padding: 5px 0;
  font-size: 1.2rem;
  color: #fff;
  letter-spacing: 5px;
  border-bottom: 2px solid #fff;
  background-color: #ab1d33;
}
#popmsg4 > div > div:nth-child(2) {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  padding: 20px 20px 0 20px;
  border-top: 2px solid #ab1d33;
}
#popmsg4 > div > div:nth-child(2) p {
  text-align: left;
}
#popmsg4 > div > div:nth-child(2) p + p {
  margin: 1rem 0;
}
#popmsg4 > div > div:nth-child(2) ol {
  padding-inline-start: 20px;
  list-style: decimal;
}
#popmsg4 > div > div:nth-child(2) ol li {
  margin-bottom: 10px;
  text-align: left;
}
#popmsg4 > div > div:nth-child(2) ol li span {
  color: #ab1d33;
}
#popmsg4 > div > div:nth-child(3) {
  padding: 20px;
}
#popmsg4 > div > div:nth-child(3) button {
  display: inline-block;
  width: 120px;
  height: 32px;
  color: #000;
  font-size: 1rem;
  text-align: center;
  border: 1px solid #aaa;
  border-radius: 5px;
  background-color: #ddd;
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
  cursor: pointer;
}
.addblock {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  overflow: auto;
  z-index: 99999;
}
.addblock .poptablepage {
  position: relative;
  top: 50%;
  display: flex;
  flex-direction: column;
  width: 90%;
  max-width: 600px;
  margin: auto;
  border-radius: 5px;
  font-size: 1rem;
  font-weight: normal;
  color: black;
  border: 2px solid #ab1d33;
  background-color: #fff;
  transform: translate(0, -50%);
  overflow: hidden;
}
.addblock .poptablepage > div:first-child {
  padding: 5px 0;
  font-size: 1.2rem;
  color: #fff;
  letter-spacing: 5px;
  text-align: center;
  border-bottom: 2px solid #fff;
  background-color: #ab1d33;
}
.addblock .poptablepage > div:nth-child(2) {
  display: flex;
  justify-content: center;
  padding: 20px;
  border-top: 2px solid #ab1d33;
}
.addblock .poptablepage p {
  margin-bottom: 15px;
}
.addblock .poptablepage p:last-child {
  margin-bottom: 0;
  text-align: center;
}
.addblock .poptablepage p:last-child input, .addblock .poptablepage p:last-child button {
  display: inline-block;
  width: 120px;
  height: 32px;
  margin: 0 10px;
  font-size: 1rem;
  color: #000;
  text-align: center;
  border: 1px solid #aaa;
  border-radius: 5px;
  background-color: #ddd;
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
  cursor: pointer;
}
.addblock .poptablepage p select, .addblock .poptablepage p input {
  height: 28px;
  font-size: 1rem;
}
.addblock .poptablepage p input[type=text], .addblock .poptablepage p input[type=number] {
  width: calc(100% - 85px);
  border: 1px solid #ccc;
}

.modal {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  padding: 20px;
  font-size: 12px;
  text-align: left;
  line-height: 24px;
  background-color: rgba(0, 0, 0, 0.9);
  overflow: auto;
  z-index: 1002;
}

.modal .close-btn {
  color: #fff;
  text-align: center;
  text-decoration: underline;
  cursor: pointer;
}

.modal .close-btn:hover {
  color: #ffffcc;
}

.routes_tab {
  max-width: 800px;
  margin: 10px auto;
}

.routes_tab ul.tabs {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 0.5rem;
  overflow: hidden;
}

.routes_tab ul.tabs li {
  position: relative;
  width: 96px;
  height: 32px;
  margin: 1px;
  font-size: 16px;
  line-height: 32px;
  border-radius: 2px;
  background: #e1e1e1;
  overflow: hidden;
}

@media screen and (max-width: 999px) {
  .routes_tab ul.tabs li {
    width: calc((100% - 8px) / 4);
  }
}
.routes_tab ul.tabs li a {
  display: block;
  padding: 0 10px;
  text-align: center;
  color: #333;
  text-decoration: none;
}

@media screen and (max-width: 999px) {
  .routes_tab ul.tabs li a {
    padding: 0;
  }
}
.routes_tab ul.tabs li a:hover {
  color: #000;
  background: #ccc;
}

.routes_tab ul.tabs li.active {
  color: #fff;
  background: #cc0000;
}

.routes_tab ul.tabs li.active a {
  color: #fff;
}

.routes_tab ul.tabs li.active a:hover {
  background: #cc0000;
}

.routes_tab div.tab_container {
  width: 100%;
  border-radius: 2px;
  background: #fff;
}

.routes_tab div.tab_container .tab_content {
  display: flex;
  flex-wrap: wrap;
  padding: 10px;
}

.routes_tab .round {
  display: flex;
  align-items: center;
  width: calc(50% - 10px);
  font-size: 16px;
  color: #333;
  border-radius: 8px;
  background: #dee;
  margin: 4px;
  padding: 4px 10px;
  word-wrap: nowrap;
}

.routes_tab .round:hover {
  color: #000;
  background-color: pink;
}

#modal1 div:nth-child(2) {
  display: flex;
  margin-bottom: 20px;
}

#modal1 div:nth-child(2) input[type=text] {
  height: calc(1.5em + 0.75rem + 2px);
  margin-right: 10px;
  padding: 0.275rem 0.275rem;
  font-size: 16px;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
}

#modal1 div:nth-child(2) button {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 37px;
  padding: 5px 10px;
  font-size: 1rem;
  color: #fff;
  border: none;
  border-radius: 50px;
  background-color: #b90c0c;
  transition: all 0.3s;
  cursor: pointer;
}

#modal1 div:nth-child(2) button:nth-child(3) {
  background-color: #999;
}
#modal1 .round.call {
  display: inline-block;
  font-size: 16px;
  color: #333;
  border-radius: 8px;
  background: #dee;
  margin: 0 4px 4px 0;
  padding: 4px 10px;
  word-wrap: nowrap;
}

#modal1 .round.call:hover {
  color: #000;
  background-color: pink;
}