input {
  text-transform: none !important;
  font-family: Arial,"微軟正黑體" !important;
}

.ProjectHeader {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1000;
  height: 100px;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.6);
}
.ProjectHeader:after,
.ProjectHeader:before {
  content: "";
  position: absolute;
  bottom: 0;
  width: 45%;
  height: 2px;
  background-color: #fff;
}
.ProjectHeader:before {
  left: 0;
}
.ProjectHeader:after {
  right: 0;
}
.ProjectHeader .container {
  display: flex;
  height: 100%;
}
.ProjectHeader .container:after {
  content: "";
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  z-index: 0;
  width: 200%;
  height: 50px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.6), hsla(0, 0%, 100%, 0));
}



@media screen and (min-width:1101px) and (max-width:1400px) {
  .ProjectHeader .container{
    padding-left: 0.5em;
    padding-right: 0.5em;
  }
}

@media (max-width: 1100px) {
  .ProjectHeader .container {
    max-width: 100%;
  }
}
.ProjectHeader .ProjectHeader-mobile {
  display: none;
}
.ProjectHeader_area {
  flex-basis: 45%;
  flex-shrink: 0;
  height: 100%;
  transform-origin: center;
}
.ProjectHeader_area-left .menu {
  justify-content: space-around;
}
.ProjectHeader_area-right {
  display: flex;
  justify-content: space-between;
}
.ProjectHeader_area-right .menu {
  flex: 1;
  flex-shrink: 0;
  justify-content: space-around;
  margin-right: auto;
}
.ProjectHeader .logo {
  position: relative;
  left: 5px;
  z-index: 1;
  flex-basis: 10%;
  min-width: 120px;
  padding: 20px 0;
  text-align: center;
}
.ProjectHeader .logo img {
  width: 100%;
  margin: 0 auto;
}
.ProjectHeader .menu {
  display: flex;
  height: 100%;
  color: #fff;
}
.ProjectHeader .menu .menu_itemContent {
  font-weight: 700;
}
.ProjectHeader .menu a {
  display: block;
  letter-spacing: 0.1rem;
}
.ProjectHeader .menu_item {
  flex-shrink: 0;
  height: 100%;
  margin: 0 20px;
}
.ProjectHeader .menu_item .menu_itemContent {
  position: relative;
  height: 100%;
  padding: 35px 0 20px 0;
  cursor: pointer;
}
.ProjectHeader .menu_item .menu_itemContent:after,
.ProjectHeader .menu_item .menu_itemContent:before {
  content: "";
  position: absolute;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.3s;
}
.ProjectHeader .menu_item .menu_itemContent:before {
  top: 40px;
  left: -2px;
  width: 35px;
  padding-top: 34px;
  background-image: url(../img/navbar/navbar-active.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
  transform: translateX(-100%);
}
.ProjectHeader .menu_item .menu_itemContent:after {
  bottom: 0;
  left: 50%;
  width: 120%;
  height: 4px;
  background-color: #d38759;
  border-radius: 4px;
  transform: translateX(-50%);
}
.ProjectHeader .menu_item .menu_itemContent-active,
.ProjectHeader .menu_item .menu_itemContent:hover {
  position: relative;
}
.ProjectHeader .menu_item .menu_itemContent-active:after,
.ProjectHeader .menu_item .menu_itemContent-active:before,
.ProjectHeader .menu_item .menu_itemContent:hover:after,
.ProjectHeader .menu_item .menu_itemContent:hover:before {
  opacity: 1;
}
.ProjectHeader .menu_itemText-zh {
  font-size: 16px;
}
.ProjectHeader .menu_itemText-en {
  font-size: 14px;
  font-weight: 500;
}
.ProjectHeader .menu_itemSubMenu.active .navbar_submenuProduct,
.ProjectHeader .menu_itemSubMenu:hover .navbar_submenuProduct {
  display: flex;
}
.ProjectHeader .functionBar {
  display: flex;
  align-items: stretch;
  height: 100%;
}
.ProjectHeader .functionBar > div {
  display: flex;
  align-items: center;
}
.ProjectHeader .functionBar .navbar_btn {
  display: block;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  margin-right: 10px;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
  border-radius: 50%;
}

.ProjectHeader .functionBar .navbar_btn{
  position: relative;
}

.ProjectHeader .functionBar .navbar_btn .badge{
  display: block;
  width: 1.5em;
  height: 1.5em;
  color: #fff;
  background: #b40610;
  border-radius: 50%;
  font-size: 0.875em;
  line-height: 1.5em;
  font-family: Arial;
  text-align: center;
  position: absolute;
  right: -0.75em;
  top: -0.75em;
}

.ProjectHeader .functionBar_member {
  position: relative;
}
.ProjectHeader .functionBar_member.active .navbar_toolMember {
  display: block;
}
.ProjectHeader .functionBar_member.active:before {
  content: "";
  position: absolute;
  top: 100%;
  z-index: 10;
  width: 250px;
  border-top: 4px solid #f5a87b;
  transform: translateY(-100%);
}
.ProjectHeader .functionBar_member.active:after {
  content: "";
  position: absolute;
  top: calc(100% - 12px);
  left: 6px;
  width: 0;
  height: 0;
  border-color: transparent transparent #f5a87b transparent;
  border-style: solid;
  border-width: 0 10px 12px 10px;
}
.ProjectHeader .functionBar .functionBar_memberBtn {
  width: 38px;
  height: 38px;
  background-image: url(../img/navbar/navbar_member.png);
}

@media (max-width: 1100px) {
  .ProjectHeader .functionBar .functionBar_member {
    position: static;
  }
}
.ProjectHeader .functionBar .functionBar_cartBtn {
  background-image: url(../img/navbar/navbar_cart.png);
}
.ProjectHeader .functionBar_search {
  position: relative;
  flex: 0;
  margin-left: 10px;
  padding-left: 25px;
}
.ProjectHeader .functionBar_search:before {
  content: "";
  position: absolute;
  bottom: 8px;
  left: 0;
  width: 20px;
  height: 20px;
  background-image: url(../img/navbar/navbar_search.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
}
.ProjectHeader .functionBar_search input {
  width: 100px;
  font-size: 16px;
  font-weight: 500;
  color: #fff;
  letter-spacing: 0.1rem;
  background-color: transparent;
  border: none;
}
.ProjectHeader .functionBar_search input:focus,
.ProjectHeader .functionBar_search input:focus-visible {
  border: none;
  outline: none;
}
@media (max-width: 1500px) {
  .ProjectHeader {
    height: 70px;
  }
  .ProjectHeader .logo {
    padding: 10px 0;
  }
  .ProjectHeader .logo img {
    max-width: 100px;
  }
  .ProjectHeader .menu_item .menu_itemContent {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0;
  }
}
@media (max-width: 1100px) {
  .ProjectHeader {
    height: 80px;
    background-color: transparent;
  }
  .ProjectHeader.mb-active .ProjectHeader-pc {
    position: fixed;
    left: 0;
    z-index: 20;
    display: flex;
    gap: 20px;
    width: calc(100% - 80px);
    padding: 20px;
    background-color: #062e17;
  }
  .ProjectHeader.mb-active .ProjectHeader-pc:after {
    left: 100%;
    width: calc(100% - 80px);
    background: linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.6),
      hsla(0, 0%, 100%, 0)
    );
    transform: none;
  }
  .ProjectHeader.mb-active .ProjectHeader-pc .logo {
    flex-basis: auto;
    order: -1;
    width: 70px;
    min-width: auto;
    padding: 0;
  }
  .ProjectHeader.mb-active .ProjectHeader-pc .closeBtn {
    position: absolute;
    top: 30px;
    right: 20px;
    display: block;
    width: 30px;
    height: 30px;
    background-color: #8ca097;
    border-radius: 50%;
  }
  .ProjectHeader.mb-active .ProjectHeader-pc .closeBtn:before {
    content: "";
    position: absolute;
    top: 15%;
    left: 45%;
    height: 20px;
    border-left: 3px solid #052b1b;
    transform: rotate(45deg);
  }
  .ProjectHeader.mb-active .ProjectHeader-pc .closeBtn:after {
    content: "";
    position: absolute;
    top: 15%;
    left: 45%;
    height: 20px;
    border-left: 3px solid #052b1b;
    transform: rotate(-45deg);
  }
  .ProjectHeader.mb-active .ProjectHeader-pc .ProjectHeader_area {
    flex-basis: auto;
    flex-direction: column;
    height: auto;
  }
  .ProjectHeader.mb-active .ProjectHeader-pc .ProjectHeader_area .menu {
    flex-direction: column;
    align-items: flex-start;
    height: auto;
  }
  .ProjectHeader.mb-active .ProjectHeader-pc .ProjectHeader_area-right {
    z-index: 0;
    gap: 20px;
  }
  .ProjectHeader .menu_item .menu_itemContent-active:after,
  .ProjectHeader .menu_item .menu_itemContent-active:before,
  .ProjectHeader .menu_item .menu_itemContent:hover:after,
  .ProjectHeader .menu_item .menu_itemContent:hover:before {
    display: none;
  }
  .ProjectHeader .ProjectHeader-pc {
    display: none;
    flex-direction: column;
  }
  .ProjectHeader .menu {
    gap: 20px;
  }
  .ProjectHeader .menu_itemContent > a,
  .ProjectHeader .menu_itemContent > div {
    display: flex;
    gap: 10px;
    align-items: center;
  }
  .ProjectHeader .menu_item {
    height: auto;
  }
  .ProjectHeader .menu_item .menu_itemContent {
    height: auto;
    padding: 0;
  }
  .ProjectHeader .functionBar {
    flex-wrap: wrap;
    gap: 10px;
    padding: 20px;
    position: relative;
  }

  .ProjectHeader .functionBar .badge {
    display: block;
    width: 1.5em;
    height: 1.5em;
    color: #fff;
    background: #893400;
    border-radius: 50%;
    font-size: 0.875em;
    line-height: 1.5em;
    font-family: Arial;
    text-align: center;
    position: absolute;
    right: 1em;
    top: 0.5em;
  }

  .ProjectHeader .functionBar > :nth-child(3) {
    width: 100%;
  }
  .ProjectHeader .functionBar_search {
    flex: auto;
    margin-top: 20px;
  }
  .ProjectHeader .functionBar_search input {
    width: 100%;
  }
  .ProjectHeader .ProjectHeader-mobile {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .ProjectHeader .ProjectHeader-mobile .logo {
    flex-basis: auto;
    width: 70px;
    min-width: auto;
    padding: 0;
  }
  .ProjectHeader .ProjectHeader-mobile .logo img {
    width: 100%;
  }
  .ProjectHeader .ProjectHeader-mobile .right {
    position: relative;
    z-index: 1;
    display: flex;
    gap: 10px;
    align-items: center;
  }
  .ProjectHeader .ProjectHeader-mobile .right .hamburger {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 30px;
    height: 25px;
    padding: 0;
  }
  .ProjectHeader .ProjectHeader-mobile .right .hamburger span {
    display: block;
    width: 100%;
    height: 2px;
    background-color: #fff;
  }
  .ProjectHeader .ProjectHeader-mobile .right .hamburger span:nth-child(2n) {
    width: 80%;
  }
  .ProjectHeader .ProjectHeader-mobile:after {
    top: 0;
    height: 130%;
    background: linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.8),
      hsla(0, 0%, 100%, 0)
    );
  }
  .ProjectHeader .menu_itemSubMenu:hover .navbar_submenuProduct,
  .ProjectHeader:after,
  .ProjectHeader:before {
    display: none;
  }
  .ProjectHeader .menu_itemSubMenu.active .navbar_submenuProduct {
    display: flex;
  }
}
.ProjectHeader .navbar_toolMember {
  position: absolute;
  top: 100%;
  z-index: 10;
  display: none;
  width: 250px;
  padding: 20px;
  background-color: rgba(5, 43, 27, 0.7);
  border-radius: 0 0 10px 10px;
}
.ProjectHeader .navbar_toolMemberMain {
  display: flex;
}
.ProjectHeader .navbar_toolMemberMain img {
  width: 30px;
}
.ProjectHeader .navbar_toolMemberMain > a {
  display: flex;
  flex-direction: column;
  gap: 5px;
  align-items: center;
  justify-content: center;
  width: 25%;
  font-size: 10px;
  transition: transform 0.3s;
}
.ProjectHeader .navbar_toolMemberMain > a:hover {
  transform: scale(1.1);
}
.ProjectHeader .navbar_toolMemberSub {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-top: 20px;
  padding: 10px 20px 20px 40px;
  font-size: 14px;
  list-style-type: square;
  background-color: rgba(109, 133, 120, 0.8);
}
.ProjectHeader .navbar_toolMemberStatus {
  margin-top: 10px;
  font-size: 14px;
}
.ProjectHeader .navbar_toolMemberStatus a {
  display: block;
  text-align: center;
  border: 1px solid #fff;
  border-radius: 5px;
  transition: all 0.3s;
}
.ProjectHeader .navbar_toolMemberStatus a:hover {
  color: #052b1b;
  background-color: #fff;
}
@media (max-width: 1100px) {
  .ProjectHeader .navbar_toolMember {
    position: fixed;
    top: 100px;
    bottom: 0;
    left: 0;
    z-index: 20;
    width: calc(100% - 80px);
    background-color: #002c18;
  }

  .ProjectHeader .navbar_toolMemberMain{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 0.5em;
  }

  .ProjectHeader .navbar_toolMemberMain > a {
    width: 100%;
    font-size: 16px;
    display: grid;
    grid-template-columns: 1.5em 1fr;
    gap: 1em;
  }

  .ProjectHeader .navbar_toolMemberSub {
    padding: 10px 20px 10px 40px;
    font-size: 16px;
  }
  .ProjectHeader .navbar_toolMemberStatus {
    margin-top: 20px;
    font-size: 16px;
  }
}
.ProjectHeader .navbar_submenu {
  position: absolute;
  right: 0;
  left: 0;
  z-index: 10;
  display: none;
  justify-content: center;
  background-image: url(../img/navbar/navbar_subMenuBg.jpg);
  background-position: 50%;
  background-size: cover;
}
.ProjectHeader .navbar_submenu a {
  display: inline-block;
  cursor: pointer;
  transition: transform 0.3s;
}
.ProjectHeader .navbar_submenu a:hover {
  transform: scale(1.1);
}
.ProjectHeader .navbar_submenu .container {
  width: 100%;
  margin: 0 auto;
}
@media (max-width: 1100px) {
  .ProjectHeader .navbar_submenu {
    position: fixed;
    top: 100px;
    bottom: 0;
    width: calc(100% - 80px);
    background-color: #062e17;
    background-image: none;
  }
  .ProjectHeader .navbar_submenu .container {
    flex-direction: column;
    overflow: auto;
  }
  .ProjectHeader .navbar_submenu .navbar_submenuProductHotType {
    gap: 15px;
    width: 100%;
    padding: 20px 0;
    border-right: 0;
    border-bottom: 1px solid #fff;
  }
  .ProjectHeader
    .navbar_submenu
    .navbar_submenuProductHotType
    .navbar_submenuItemButton {
    width: 250px;
  }
  .ProjectHeader .navbar_submenu .navbar_submenuProductType {
    width: 100%;
    padding: 20px 0;
    border-right: 0;
    border-bottom: 1px solid #fff;
  }
  .ProjectHeader .navbar_submenu .navbar_submenuProductAd {
    flex-direction: column;
    gap: 30px;
    padding: 20px 0;
  }
  .ProjectHeader
    .navbar_submenu
    .navbar_submenuProductAd
    .navbar_submenuProductAdBlock {
    width: 100%;
    padding: 0;
  }
  .ProjectHeader .navbar_submenu .navbar_submenuProductAd img {
    width: 100%;
    max-width: 300px;
  }
  .ProjectHeader
    .navbar_submenu
    .navbar_submenuProductAd
    .navbar_submenuProductAdBlockTitle {
    margin-top: 10px;
    margin-bottom: 0;
  }
  .ProjectHeader
    .navbar_submenu
    .navbar_submenuProductAd
    .navbar_submenuProductAdBlockLink {
    width: auto;
    margin-top: 5px;
  }
}
.ProjectHeader .navbar_submenuProduct {
  flex-shrink: 0;
}
.ProjectHeader .navbar_submenuProductHotType {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  gap: 20px;
  align-items: flex-start;
  width: 25%;
  padding: 20px 20px;
  font-size: 16px;
  border-right: 1px solid #fff;
}
.ProjectHeader .navbar_submenuProductHotType .navbar_submenu-highlight {
  color: #ea9564;
  text-decoration: underline;
}
@media (max-width: 1100px) {
  .ProjectHeader .navbar_submenuProductHotType .navbar_submenu-highlight br {
    display: none;
  }
}
.ProjectHeader .navbar_submenuProductHotType .navbar_submenuItemButton {
  width: 100%;
  padding: 5px 10px;
  font-size: 14px;
  color: #002c18;
  text-align: center;
  background-color: #8ca097;
  border-radius: 5px;
}
.ProjectHeader .navbar_submenuProductHotType .navbar_submenuItemButton-benefit {
  color: #002c18;
  background-color: #ea9564;
}
.ProjectHeader
  .navbar_submenuProductHotType
  .navbar_submenuItemButton-benefit
  span {
  display: inline-block;
  width: 20px;
  height: 8px;
  border-right: 1px solid #002c18;
  border-bottom: 1px solid #002c18;
  transform: skew(30deg);
}
.ProjectHeader .navbar_submenuProductType {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  gap: 20px;
  align-items: flex-start;
  width: 20%;
  padding: 20px 30px;
  font-size: 16px;
  border-right: 1px solid #fff;
}
.ProjectHeader .navbar_submenuProductAd {
  display: flex;
  flex-grow: 1;
  gap: 40px;
  padding: 20px 40px;
  font-size: 14px;
}
.ProjectHeader .navbar_submenuProductAd .navbar_submenuProductAdBlock {
  width: 50%;
}
.ProjectHeader .navbar_submenuProductAd .navbar_submenuProductAdBlockTitle {
  margin-top: 10px;
  margin-bottom: 0;
  font-size: 20px;
  font-weight: 700;
}
.ProjectHeader .navbar_submenuProductAd .navbar_submenuProductAdBlockLink {
  width: 100%;
  margin-top: 10px;
  padding: 3px 10px;
  font-size: 16px;
  color: #002c18;
  text-align: center;
  background-color: #8ca097;
  border-radius: 5px;
}
.ProjectFooter {
  padding-top: 40px;
  color: #fff;
  background-color: #002d18;
}
.ProjectFooter_logoWrap {
  margin-bottom: 40px;
}
.ProjectFooter_logoWrap .ProjectFooter_pic {
  width: 120px;
}
@media (max-width: 960px) {
  .ProjectFooter_logoWrap {
    margin-bottom: 20px;
  }
  .ProjectFooter_logoWrap .ProjectFooter_pic {
    width: 90px;
  }
}
.ProjectFooter_linkPart {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  margin-bottom: 80px;
}
@media (max-width: 960px) {
  .ProjectFooter_linkPart {
    gap: 20px;
    margin-bottom: 40px;
  }
}
.ProjectFooter_linkCategory {
  flex-shrink: 0;
}
.ProjectFooter_linkTitle {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 700;
  color: #9fa49f;
}
@media (max-width: 960px) {
  .ProjectFooter_linkTitle {
    margin-bottom: 5px;
    font-size: 16px;
  }
}
.ProjectFooter_linkList {
  display: flex;
  flex-direction: column;
  gap: 5px;
  font-size: 16px;
  line-height: 1.6;
  letter-spacing: 0.2rem;
}
.ProjectFooter_linkList a {
  display: flex;
}
.ProjectFooter_linkList-text {
  display: flex;
  align-items: center;
  letter-spacing: 0.1rem;
}
.ProjectFooter_linkList-text img {
  width: 1.25em;
  margin-right: 5px;
}
@media (max-width: 960px) {
  .ProjectFooter_linkList {
    font-size: 14px;
  }
}
.ProjectFooter_socialMedia a {
  margin-right: 10px;
}

.ProjectFooter_socialMedia a > svg{
  width: 2.25em;
}

/* @media (max-width: 960px) {
  .ProjectFooter_socialMedia a {
    width: 35px;
  }
} */
.ProjectFooter_note {
  margin-top: 40px;
  padding: 15px 0;
  font-size: 16px;
  /* border-top: 2px solid #fff; */
}
@media (max-width: 960px) {
  .ProjectFooter_note {
    font-size: 14px;
  }
}
.MobileToolBar {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 20;
  display: none;
  height: 70px;
  color: #fff;
  background-color: #052d18;
}
@media (max-width: 1100px) {
  .MobileToolBar {
    display: block;
  }
}
.MobileToolBar .container {
  display: flex;
  justify-content: center;
  max-width: 600px;
  height: 100%;
  max-height: 80px;
}
.MobileToolBar_item {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  gap: 5px;
  align-items: center;
  padding: 10px 0;
  font-size: 12px;
}
.MobileToolBar_item > img {
  display: block;
  width: 35px;
}
.FloatBtn {
  position: fixed;
  right: 20px;
  bottom: 80px;
  z-index: 10;
  max-width: 115px;
}
.FloatBtn a,
.FloatBtn button {
  display: flex;
  justify-content: center;
  margin-bottom: 20px;
  background-color: transparent;
}

.FloatBtn .FloatBtn_cart{
  position: relative;
}

.FloatBtn .FloatBtn_cart .badge {
  display: block;
  width: 1.5em;
  height: 1.5em;
  color: #fff;
  background: #db895b;
  border-radius: 50%;
  font-size: 0.875em;
  line-height: 1.65em;
  font-family: Arial;
  text-align: center;
  position: absolute;
  right: 30px;
  top: -0.5em;
}


@media (max-width: 1100px) {
  .FloatBtn {
    right: 10px;
    max-width: 80px;
  }
  .FloatBtn a img {
    width: 40px;
  }
  .FloatBtn a,
  .FloatBtn button {
    margin-bottom: 10px;
  }

  .FloatBtn .FloatBtn_cart .badge{
    right: 0.8em;
    font-size: 0.8em;
  }

}
*,
:after,
:before {
  box-sizing: border-box;
}
blockquote,
body,
dd,
dl,
figure,
h1,
h2,
h3,
h4,
ol,
p,
ul {
  margin: 0;
}
ol,
ul {
  padding: 0;
  list-style: none;
}
img,
svg {
  display: block;
  max-width: 100%;
  height: auto;
}
a {
  color: currentColor;
  text-decoration: none;
}
body {
  text-rendering: optimizeSpeed;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
input::-moz-placeholder {
  font: inherit;
  color: currentColor;
}
button,
input,
input::placeholder,
select,
textarea {
  font: inherit;
  color: currentColor;
}
@font-face {
  font-family: Microsoft JhengHei Modify;
  unicode-range: u+7db0, u+78a7, u+7b75;
  font-style: normal;
  font-weight: 700;
  src: local("Yu Gothic UI Bold"), local("MS Gothic");
}
@font-face {
  font-family: Microsoft JhengHei Modify;
  src: local("Microsoft JhengHei UI"), local("Microsoft JhengHei");
}
@font-face {
  font-family: Microsoft JhengHei;
  src: local("Microsoft JhengHei UI"), local("Microsoft JhengHei");
}
@media (max-width: 1200px) {
  .container {
    max-width: 1200px;
  }
}
@media (max-width: 960px) {
  .container {
    max-width: 1000px;
  }
}
@media (max-width: 768px) {
  .container {
    max-width: 600px;
  }
}
@media (max-width: 576px) {
  .container {
    max-width: 100%;
  }
}
.row {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -20px;
}
[class*="col-"] {
  padding: 0 20px;
}
.col-1 {
  width: 8.33333%;
}
.col-2 {
  width: 16.66667%;
}
.col-3 {
  width: 25%;
}
.col-4 {
  width: 33.33333%;
}
.col-5 {
  width: 41.66667%;
}
.col-6 {
  width: 50%;
}
.col-7 {
  width: 58.33333%;
}
.col-8 {
  width: 66.66667%;
}
.col-9 {
  width: 75%;
}
.col-10 {
  width: 83.33333%;
}
.col-11 {
  width: 91.66667%;
}
.col-12 {
  width: 100%;
}
@media (max-width: 1400px) {
  .col-xxl-1 {
    width: 8.33333%;
    padding: 0 20px;
  }
  .col-xxl-2 {
    width: 16.66667%;
    padding: 0 20px;
  }
  .col-xxl-3 {
    width: 25%;
    padding: 0 20px;
  }
  .col-xxl-4 {
    width: 33.33333%;
    padding: 0 20px;
  }
  .col-xxl-5 {
    width: 41.66667%;
    padding: 0 20px;
  }
  .col-xxl-6 {
    width: 50%;
    padding: 0 20px;
  }
  .col-xxl-7 {
    width: 58.33333%;
    padding: 0 20px;
  }
  .col-xxl-8 {
    width: 66.66667%;
    padding: 0 20px;
  }
  .col-xxl-9 {
    width: 75%;
    padding: 0 20px;
  }
  .col-xxl-10 {
    width: 83.33333%;
    padding: 0 20px;
  }
  .col-xxl-11 {
    width: 91.66667%;
    padding: 0 20px;
  }
  .col-xxl-12 {
    width: 100%;
    padding: 0 20px;
  }
}
@media (max-width: 1200px) {
  .col-xl-1 {
    width: 8.33333%;
    padding: 0 20px;
  }
  .col-xl-2 {
    width: 16.66667%;
    padding: 0 20px;
  }
  .col-xl-3 {
    width: 25%;
    padding: 0 20px;
  }
  .col-xl-4 {
    width: 33.33333%;
    padding: 0 20px;
  }
  .col-xl-5 {
    width: 41.66667%;
    padding: 0 20px;
  }
  .col-xl-6 {
    width: 50%;
    padding: 0 20px;
  }
  .col-xl-7 {
    width: 58.33333%;
    padding: 0 20px;
  }
  .col-xl-8 {
    width: 66.66667%;
    padding: 0 20px;
  }
  .col-xl-9 {
    width: 75%;
    padding: 0 20px;
  }
  .col-xl-10 {
    width: 83.33333%;
    padding: 0 20px;
  }
  .col-xl-11 {
    width: 91.66667%;
    padding: 0 20px;
  }
  .col-xl-12 {
    width: 100%;
    padding: 0 20px;
  }
}
@media (max-width: 960px) {
  .col-lg-1 {
    width: 8.33333%;
    padding: 0 20px;
  }
  .col-lg-2 {
    width: 16.66667%;
    padding: 0 20px;
  }
  .col-lg-3 {
    width: 25%;
    padding: 0 20px;
  }
  .col-lg-4 {
    width: 33.33333%;
    padding: 0 20px;
  }
  .col-lg-5 {
    width: 41.66667%;
    padding: 0 20px;
  }
  .col-lg-6 {
    width: 50%;
    padding: 0 20px;
  }
  .col-lg-7 {
    width: 58.33333%;
    padding: 0 20px;
  }
  .col-lg-8 {
    width: 66.66667%;
    padding: 0 20px;
  }
  .col-lg-9 {
    width: 75%;
    padding: 0 20px;
  }
  .col-lg-10 {
    width: 83.33333%;
    padding: 0 20px;
  }
  .col-lg-11 {
    width: 91.66667%;
    padding: 0 20px;
  }
  .col-lg-12 {
    width: 100%;
    padding: 0 20px;
  }
}
@media (max-width: 768px) {
  .col-md-1 {
    width: 8.33333%;
    padding: 0 20px;
  }
  .col-md-2 {
    width: 16.66667%;
    padding: 0 20px;
  }
  .col-md-3 {
    width: 25%;
    padding: 0 20px;
  }
  .col-md-4 {
    width: 33.33333%;
    padding: 0 20px;
  }
  .col-md-5 {
    width: 41.66667%;
    padding: 0 20px;
  }
  .col-md-6 {
    width: 50%;
    padding: 0 20px;
  }
  .col-md-7 {
    width: 58.33333%;
    padding: 0 20px;
  }
  .col-md-8 {
    width: 66.66667%;
    padding: 0 20px;
  }
  .col-md-9 {
    width: 75%;
    padding: 0 20px;
  }
  .col-md-10 {
    width: 83.33333%;
    padding: 0 20px;
  }
  .col-md-11 {
    width: 91.66667%;
    padding: 0 20px;
  }
  .col-md-12 {
    width: 100%;
    padding: 0 20px;
  }
}
@media (max-width: 576px) {
  .col-sm-1 {
    width: 8.33333%;
    padding: 0 20px;
  }
  .col-sm-2 {
    width: 16.66667%;
    padding: 0 20px;
  }
  .col-sm-3 {
    width: 25%;
    padding: 0 20px;
  }
  .col-sm-4 {
    width: 33.33333%;
    padding: 0 20px;
  }
  .col-sm-5 {
    width: 41.66667%;
    padding: 0 20px;
  }
  .col-sm-6 {
    width: 50%;
    padding: 0 20px;
  }
  .col-sm-7 {
    width: 58.33333%;
    padding: 0 20px;
  }
  .col-sm-8 {
    width: 66.66667%;
    padding: 0 20px;
  }
  .col-sm-9 {
    width: 75%;
    padding: 0 20px;
  }
  .col-sm-10 {
    width: 83.33333%;
    padding: 0 20px;
  }
  .col-sm-11 {
    width: 91.66667%;
    padding: 0 20px;
  }
  .col-sm-12 {
    width: 100%;
    padding: 0 20px;
  }
}
.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}
.animated.infinite {
  animation-iteration-count: infinite;
}
.animated.hinge {
  animation-duration: 2s;
}
.fadeIn {
  animation-name: fadeIn;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fadeInUp {
  animation-name: fadeInUp;
}
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translate3d(0, 20%, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fadeInDown {
  animation-name: fadeInDown;
}
@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translate3d(0, -20%, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fadeInLeft {
  animation-name: fadeInLeft;
}
@keyframes fadeInLeft {
  0% {
    opacity: 0;
    transform: translate3d(-20%, 0, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fadeInRight {
  animation-name: fadeInRight;
}
@keyframes fadeInRight {
  0% {
    opacity: 0;
    transform: translate3d(20%, 0, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.textBounce {
  transform-origin: center bottom;
  animation-name: textBounce;
}
@keyframes textBounce {
  0%,
  to {
    transform: translateZ(0);
  }
  20% {
    transform: translate3d(15px, -15px, 0);
  }
  35% {
    transform: translate3d(-7px, 6px, 0);
  }
  43% {
    transform: translate3d(10px, -20px, 0);
  }
  55% {
    transform: translate3d(-5px, 8px, 0);
  }
  61% {
    transform: translate3d(12px, -25px, 0);
  }
  72% {
    transform: translate3d(-10px, 10px, 0);
  }
  84% {
    transform: translate3d(12px, -16px, 0);
  }
  90% {
    transform: translate3d(-10px, 5px, 0);
  }
}
.bounce {
  transform-origin: center bottom;
  animation-name: bounce;
}
@keyframes bounce {
  0%,
  20%,
  53%,
  80%,
  to {
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: translateZ(0);
  }
  40%,
  43% {
    transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    transform: translate3d(0, -30px, 0);
  }
  70% {
    transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    transform: translate3d(0, -15px, 0);
  }
  90% {
    transform: translate3d(0, -4px, 0);
  }
}
.shake {
  animation-name: shake;
}
@keyframes shake {
  0%,
  to {
    transform: translateZ(0);
  }
  10%,
  30%,
  50%,
  70%,
  90% {
    transform: translate3d(-10px, 0, 0);
  }
  20%,
  40%,
  60%,
  80% {
    transform: translate3d(10px, 0, 0);
  }
}
.move-x {
  animation: move-x;
  animation-duration: 0.8s;
  animation-timing-function: ease;
  animation-iteration-count: infinite;
  animation-direction: alternate-reverse;
}
@keyframes move-x {
  0% {
    transform: translateX(0);
  }
  to {
    transform: translateX(50%);
  }
}
body {
  display: flex;
  flex-direction: column;
  min-width: 320px;
  height: 100%;
  overflow: auto;
  font-family: Cinzel, "Noto Serif TC", serif, Roboto, Arial,
    Microsoft JhengHei Modify, Microsoft JhengHei, PingFangTC, sans-serif;
  font-size: 18px;
  line-height: 1.6;
  color: #052d18;
  background-color: #f5f5f5;
}
@media (max-width: 1100px) {
  body {
    padding-bottom: 70px;
  }
}
.notSans {
  font-family: Noto Sans TC, sans-serif;
}
.notoSerif {
  font-family: "Noto Serif TC", serif;
}
button,
input,
label,
select {
  cursor: pointer;
}
a {
  display: inline-block;
}
button {
  background-color: transparent;
  border: none;
}
ul {
  padding: 0;
}
.Page {
  position: relative;
  overflow: hidden;
  line-height: 1.6;
  color: #052d18;
  background-color: #fff;
  background-image: url(../img/bg_contentHeader.png), url(../img/bg_down.png);
  background-repeat: no-repeat, no-repeat;
  background-position: top, bottom;
  background-size: cover auto, cover auto;
}
@media (max-width: 1100px) {
  .Page {
    font-size: 16px;
  }
}
.container {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 60px;
}
@media (max-width: 960px) {
  .container {
    padding: 0 20px;
  }
}
.container-page {
  padding-top: 240px;
}
@media (max-width: 1100px) {
  .container-page {
    /* padding-top: 240px; */
    padding-top: 80px;
  }
}
.page_commonTitleArea {
  margin-bottom: 80px;
}
.page_commonTitleArea .Title {
  margin-bottom: 40px;
}
@media (max-width: 960px) {
  .page_commonTitleArea{
    margin-bottom: 3.25em;
  }

  .page_commonTitleArea .Title {
    margin-bottom: 20px;
  }
}
.memberCenter_progressBar {
  display: flex;
  justify-content: space-between;
  width: 60%;
  margin: 0 auto 40px auto;
}
@media (max-width: 1100px) {
  .memberCenter_progressBar {
    width: 100%;
    max-width: 800px;
    margin: 0 auto 20px auto;
  }
}
.memberCenter_progressBar-step {
  position: relative;
  width: 32%;
}
.memberCenter_progressBar-step-icon {
  position: relative;
  width: 45px;
  max-width: 67px;
  margin-bottom: 20px;
  background-color: #acacac;
  border-radius: 50%;
}
.memberCenter_progressBar-step:before {
  content: "";
  position: absolute;
  top: 25%;
  left: 50%;
  width: 96%;
  height: 5px;
  background-color: #acacac;
  transform: translate(-50%, -100%);
}
.memberCenter_progressBar-step p {
  font-size: 16px;
  font-weight: 700;
  color: #acacac;
  letter-spacing: 0.2em;
}
.memberCenter_progressBar-step-active .memberCenter_progressBar-step-icon {
  background-color: #8ca097;
}
.memberCenter_progressBar-step-active:before {
  background-color: #002c18;
}
.memberCenter_progressBar-step-active p {
  color: #002c18;
}
@media (max-width: 960px) {
  .memberCenter_progressBar-step {
    width: 33%;
  }
  .memberCenter_progressBar-step-icon {
    width: 40px;
    margin-bottom: 10px;
  }
  .memberCenter_progressBar-step:before {
    height: 3px;
  }
  .memberCenter_progressBar-step p {
    font-size: 14px;
    letter-spacing: normal;
  }
}
.memberCenter_progressBar-step:nth-child(2)
  .memberCenter_progressBar-step-icon {
  margin: 0 auto 20px auto;
}
.memberCenter_progressBar-step:nth-child(2) p {
  text-align: center;
}
@media (max-width: 960px) {
  .memberCenter_progressBar-step:nth-child(2)
    .memberCenter_progressBar-step-icon {
    margin: 0 auto 10px auto;
  }
}
.memberCenter_progressBar-step:nth-child(3)
  .memberCenter_progressBar-step-icon {
  margin: 0 0 20px auto;
}
.memberCenter_progressBar-step:nth-child(3) p {
  text-align: right;
}
@media (max-width: 960px) {
  .memberCenter_progressBar-step:nth-child(3)
    .memberCenter_progressBar-step-icon {
    margin: 0 0 10px auto;
  }
}
.LoginSignUp {
  color: #002c18;
}
.LoginSignUp_links {
  display: flex;
  gap: 20px;
  justify-content: center;
  margin-top: 40px;
  margin-bottom: 40px;
  font-size: 18px;
  font-weight: 700;
}
.LoginSignUp_links > a {
  width: 50%;
  padding: 10px;
  color: #fff;
  text-align: center;
  background-image: url(../img/login/login_btnbg2.jpg);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: cover;
}
.LoginSignUp_links > a.active {
  color: #002c18;
  background-image: url(../img/login/login_btnbg1.jpg);
}
.LoginSignUp_formWrap {
  width: 57%;
  margin: 0 auto;
}
@media (max-width: 1100px) {
  .LoginSignUp_formWrap {
    width: 100%;
  }
}
.LoginSignUp_socialMedia {
  margin-bottom: 40px;
}
@media (max-width: 960px) {
  .LoginSignUp_socialMedia {
    margin-bottom: 40px;
  }
}
.LoginSignUp_line {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 60px;
  margin: 0 auto;
  padding: 10px;
  text-align: center;
  /* background-color: #56b662; */
  background-color: #00C300;
  border-radius: 8px;
}
.LoginSignUp_line img {
  max-width: 100%;
  height: 100%;
}
@media (max-width: 960px) {
  .LoginSignUp_line {
    width: 100%;
    height: 60px;
  }
}
.LoginSignUp_title {
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.1em;
}
@media (max-width: 960px) {
  .LoginSignUp_title {
    margin-bottom: 10px;
    font-size: 20px;
  }
}
.LoginSignUp_member-form > label {
  display: block;
  margin-bottom: 20px;
}
@media (max-width: 960px) {
  .LoginSignUp_member-form > label {
    margin-bottom: 10px;
  }
}
.LoginSignUp_member-form .name {
  position: relative;
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  letter-spacing: 0.1em;
}
.LoginSignUp_member-form .name:after {
  content: "";
  display: block;
  width: 18px;
  height: 15px;
  margin-top: 8px;
  margin-left: 5px;
  background-image: url(../img/login/login_star.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
  transform: translateY(-40%);
}
@media (max-width: 960px) {
  .LoginSignUp_member-form .name {
    margin-bottom: 10px;
    font-size: 16px;
  }
}
.LoginSignUp_member-form input[type="password"],
.LoginSignUp_member-form input[type="text"] {
  width: 100%;
  padding: 5px 20px;
  font-size: 16px;
  color: #5a5a5a;
  background-color: transparent;
  border: 1px solid #5a5a5a;
  border-radius: 8px;
  outline: none;
}
@media (max-width: 960px) {
  .LoginSignUp_member-form input[type="password"],
  .LoginSignUp_member-form input[type="text"] {
    padding: 8px 10px;
    font-size: 16px;
  }
}
.LoginSignUp_member-form input[type="password"] {
  letter-spacing: 1em;
}
.LoginSignUp_member-form input::-moz-placeholder {
  letter-spacing: 0.15em;
}
.LoginSignUp_member-form input::placeholder {
  letter-spacing: 0.15em;
}
.LoginSignUp_member-form-utils {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 80px;
  font-size: 16px;
}
@media (max-width: 960px) {
  .LoginSignUp_member-form-utils {
    margin-bottom: 20px;
    font-size: 16px;
  }
}
.LoginSignUp_member-form .checkbox_wrap {
  position: relative;
  display: flex;
  align-items: center;
  padding-left: 30px;
  font-size: 16px;
  color: #5a5a5a;
  letter-spacing: 0.1em;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.LoginSignUp_member-form .checkbox_wrap > input {
  position: absolute;
  width: 0;
  height: 0;
  cursor: pointer;
  opacity: 0;
}
.LoginSignUp_member-form .checkbox_wrap .checkmark {
  position: absolute;
  top: 2px;
  left: 0;
  width: 20px;
  height: 20px;
  background-color: transparent;
  border: 1px solid #5a5a5a;
  border-radius: 8px;
}
.LoginSignUp_member-form .checkbox_wrap .checkmark:after {
  content: "";
  position: absolute;
  top: 3px;
  left: 6px;
  display: none;
  width: 5px;
  height: 10px;
  border: solid #fff;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}
@media (max-width: 960px) {
  .LoginSignUp_member-form .checkbox_wrap {
    padding-left: 25px;
    font-size: 16px;
  }
  .LoginSignUp_member-form .checkbox_wrap .checkmark {
    width: 16px;
    height: 16px;
    border-radius: 4px;
  }
  .LoginSignUp_member-form .checkbox_wrap .checkmark:after {
    top: 2px;
    left: 4px;
    width: 5px;
    height: 10px;
    border-width: 0 2px 2px 0;
  }
}
.LoginSignUp_member-form .checkbox_wrap input:checked ~ .checkmark {
  background-color: #002c18;
}
.LoginSignUp_member-form .checkbox_wrap input:checked ~ .checkmark:after {
  display: block;
}
.LoginSignUp_member-form .forgetPwd {
  font-weight: 700;
  color: #002d18;
  letter-spacing: 0.1em;
}
.LoginSignUp_member-form-divider {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  font-size: 16px;
  color: #252525;
}
@media (max-width: 960px) {
  .LoginSignUp_member-form-divider {
    margin-bottom: 10px;
    font-size: 16px;
  }
}
.LoginSignUp_member-form-divider span {
  padding: 0 40px;
  letter-spacing: 0.1em;
}
.LoginSignUp_member-form-divider:after,
.LoginSignUp_member-form-divider:before {
  content: "";
  position: relative;
  display: block;
  flex: 1;
  height: 1px;
  background-color: #002c18;
}
.LoginSignUp_member-form-btn {
  width: 100%;
  margin-bottom: 20px;
  padding-top: 5px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.8;
  text-align: center;
  background-color: #9caca3;
  transition: transform 0.3s;
}
.LoginSignUp_member-form-btn:hover {
  transform: scale(1.05);
}
@media (max-width: 960px) {
  .LoginSignUp_member-form-btn {
    margin-bottom: 10px;
    font-size: 20px;
  }
}
.LoginSignUp_member-form-btn span {
  display: inline-block;
  width: 1em;
}
.LoginSignUp_member-form-btn-secondary {
  color: #fff;
  background-color: #002d18;
}
#app {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 100vh;
}
.app__view {
  flex: 1;
  width: 100%;
}
.Index {
  overflow: hidden;
}
.Index .kv {
  position: relative;
  z-index: 1;
}
.Index .kv:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 8%;
  height: 145px;
  background-image: url(../img/index/index_kvIcon.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
  transform: translate(-50%, 50%);
}
.Index .kv .slick-dots {
  position: absolute;
  bottom: 90px;
  left: 45px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.Index .kv .slick-dots button {
  width: 6px;
  height: 50px;
  padding: 0;
  font-size: 0;
  background-color: #06301c;
  border-radius: 10px;
  transition: all 0.2s;
}
.Index .kv .slick-dots > .slick-active button {
  height: 25px;
  color: #d28758;
  background-color: #d28758;
}
@media (max-width: 960px) {
  .Index .kv:after {
    display: none;
  }
  .Index .kv .slick-dots {
    display: none !important;
  }
}
.Index .productIntro {
  position: relative;
  padding-top: 100px;
  padding-bottom: 60px;
  font-size: 16px;
  background-image: url(../img/index/product1_bg.png),
    url(../img/index/product3_bg.jpg);
  background-repeat: no-repeat, repeat;
  background-position: 0 100%, 50%;
  background-size: 1920px, cover;
}
@media (max-width: 960px) {
  .Index .productIntro {
    padding-top: 60px;
  }
}
@media (max-width: 1100px) {
  .Index .productIntro .container {
    max-width: 1000px;
  }
}
.Index .productIntro_marque {
  margin-bottom: 30px;
}
.Index .productIntro .marque {
  position: relative;
  height: 85px;
  margin-left: 20%;
  padding: 25px 0 25px 45px;
  background-color: #012e18;
}
.Index .productIntro .marque:before {
  content: "";
  position: absolute;
  top: -4.5px;
  left: -85px;
  width: 103px;
  height: 104px;
  background-image: url(../img/index/marque_icon.png);
  background-repeat: no-repeat;
  background-size: contain;
}
.Index .productIntro .marque_wrap {
  width: 100%;
  overflow: hidden;
}
.Index .productIntro .marque .content {
  display: inline-block;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 5px;
  white-space: nowrap;
  animation: marquee 15s linear infinite;
}
@media (max-width: 960px) {
  .Index .productIntro .marque {
    height: 55px;
    padding: 10px 0 10px 10px;
  }
  .Index .productIntro .marque:before {
    top: -3px;
    left: -56px;
    width: 56px;
    height: 67px;
  }
  .Index .productIntro .marque .content {
    font-size: 20px;
  }
  .Index .productIntro .marque .content_highLight {
    font-size: 16px;
  }
}
@keyframes marquee {
  0% {
    transform: translateX(100%);
  }
  to {
    transform: translateX(-100%);
  }
}

@media (max-width: 960px) {
  
  .Index .productIntro .marque .content {
    animation: marquee 18s linear infinite;
  } 

  @keyframes marquee {
    0% {
      transform: translateX(20%);
    }
    to {
      transform: translateX(-100%);
    }
  }
}

.Index .productIntro .productList {
  padding: 60px 0;
}
.Index .productIntro .productList .productList_container {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.Index .productIntro .productList .productItem:nth-child(2n) {
  flex-direction: column;
}
.Index
  .productIntro
  .productList
  .productItem:nth-child(2n)
  .productThumb:before {
  top: -20px;
}
.Index .productIntro .productItem {
  display: flex;
  flex-direction: column-reverse;
  width: 25%;
  padding: 10px 20px;
}
.Index .productIntro .productItem_desc,
.Index .productIntro .productItem_thumb {
  padding: 10px 0 20px;
}
.Index .productIntro .productItem_desc {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
.Index .productIntro .productItem:hover .action {
  opacity: 1;
}
@media (max-width: 1100px) {
  .Index .productIntro .productItem {
    width: 50%;
    padding: 10px;
  }
  .Index .productIntro .productItem_desc,
  .Index .productIntro .productItem_thumb {
    max-width: 250px;
    margin: 0 auto;
    padding: 5px 0;
  }
}
.Index .productIntro .productThumb {
  position: relative;
}
.Index .productIntro .productThumb:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  display: block;
  width: 1px;
  height: 18%;
  background-color: #000;
}
.Index .productIntro .productThumb img {
  margin: 0 auto;
}
.Index .productIntro .productDesc {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  color: #523628;
}
.Index .productIntro .productDesc_icon {
  display: block;
  width: 20px;
  height: 25px;
  margin: 0 auto 5px;
  background-image: url(../img/index/icon_seaweed.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
}
@media (max-width: 1100px) {
  .Index .productIntro .productDesc_icon {
    width: 15px;
    height: 20px;
  }
}
.Index .productIntro .productDesc_title {
  margin-bottom: 5px;
  font-size: 20px;
  font-weight: 700;
  text-align: center;
}
.Index .productIntro .productDesc_desc {
  display: -webkit-box;
  flex-grow: 1;
  margin-bottom: 10px;
  overflow: hidden;
  font-size: 16px;
  line-height: 1.2;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.Index .productIntro .productDesc_price {
  display: flex;
  justify-content: space-between;
}
.Index .productIntro .slick-dots {
  position: absolute;
  right: 0;
  bottom: 0;
  display: flex;
  gap: 10px;
  color: transparent;
}
.Index .productIntro .slick-dots li {
  width: 30px;
  height: 30px;
}
.Index .productIntro .slick-dots button {
  width: 100%;
  background-image: url(../img/index/icon_sliderDot.png);
  background-position: 50%;
  background-size: cover;
}
.Index .productIntro .slick-dots .slick-active button {
  background-image: url(../img/index/icon_sliderDot-active.png);
}
.Index .productIntro .price {
  display: flex;
  flex-shrink: 0;
  gap: 5px;
  align-items: center;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.1rem;
}
.Index .productIntro .price span {
  font-size: 20px;
}
@media (max-width: 1100px) {
  .Index .productIntro .price {
    font-size: 12px;
  }
  .Index .productIntro .price span {
    font-size: 16px;
  }
}
.Index .productIntro .action {
  display: flex;
  gap: 10px;
  opacity: 0;
  transition: opacity 0.3s;
}
.Index .productIntro .action_icon-cart {
  width: 35px;
  height: 35px;
  background-image: url(../img/index/icon_cart.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
}
.Index .productIntro .action_icon-cart:hover {
  background-image: url(../img/index/icon_cart-active.png);
}
@media (max-width: 1100px) {
  .Index .productIntro .action_icon-cart {
    width: 24px;
    height: 24px;
  }
}
.Index .productIntro .action_icon-bag {
  width: 35px;
  height: 35px;
  background-image: url(../img/index/icon_bag.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
}
.Index .productIntro .action_icon-bag:hover {
  background-image: url(../img/index/icon_bag-active.png);
}
@media (max-width: 1100px) {
  .Index .productIntro .action_icon-bag {
    width: 24px;
    height: 24px;
  }
}
@media (max-width: 1100px) {
  .Index .productIntro .action {
    gap: 5px;
  }
}
.Index .productIntro .deco {
  position: relative;
  width: 35px;
  height: 12px;
  margin: 10px auto;
}
.Index .productIntro .deco:after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-right: 3px solid #e08859;
  border-bottom: 2px solid #e08859;
  transform: skew(45deg);
}
@media (max-width: 1100px) {
  .Index .productIntro .deco {
    transform: scale(0.8);
  }
}
.Index .productIntro .slick-arrow {
  position: absolute;
  top: 0;
  width: 35px;
  height: 35px;
  color: transparent;
  cursor: pointer;
  background-repeat: no-repeat;
  background-size: contain;
  opacity: 1;
  transition: opacity 0.3s;
}
.Index .productIntro .slick-arrow:hover {
  opacity: 0.8;
}
.Index .productIntro .slick-arrow.slick-prev {
  right: 45px;
  background-image: url(../img/index/icon_marqueeL.png);
}
.Index .productIntro .slick-arrow.slick-next {
  right: 0;
  background-image: url(../img/index/icon_marqueeR.png);
}
.Index .adGrid {
  position: relative;
  padding: 40px 0 40px;
  background-image: url(../img/index/ad_bg.jpg);
  background-repeat: no-repeat;
  background-position: 0;
  background-size: cover;
}
.Index .adGrid .container {
  display: flex;
  flex-wrap: wrap;
  max-width: 1200px;
}
.Index .adGrid_img {
  display: block;
  width: 33.33%;
}
.Index .adGrid_img img {
  display: block;
}
@media (max-width: 1100px) {
  .Index .adGrid {
    padding: 40px 0 40px 0;
  }
}
.Index .productGift {
  position: relative;
  padding: 60px 0 60px 0;
}
@media (max-width: 960px) {
  .Index .productGift {
    padding: 40px 0 40px 0;
  }
}
.Index .productGift .setList {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (max-width: 960px) {
  .Index .productGift .setList {
    max-width: 600px;
    margin: 0 auto;
  }
}
.Index .productGift .setItem {
  display: flex;
  flex-direction: column;
  width: 50%;
}
.Index .productGift .setItem_thumb {
  margin: 0 auto;
  padding: 10px 20px;
}
.Index .productGift .setItem_desc {
  max-width: 250px;
  margin: 0 auto;
}
.Index .productGift .setItem:hover .action {
  opacity: 1;
}
.Index .productGift .setItem:nth-child(odd) .setItem_thumb {
  padding-right: 15%;
}
.Index .productGift .setItem:nth-child(2n) .setItem_thumb {
  padding-left: 15%;
}
@media (max-width: 1100px) {
  .Index .productGift .setItem {
    width: 100%;
    padding: 10px;
  }
  .Index .productGift .setItem_desc,
  .Index .productGift .setItem_thumb {
    margin: 0 auto;
    padding: 5px 0;
  }
}
.Index .productGift .setThumb {
  position: relative;
}
.Index .productGift .setThumb img {
  margin: 0 auto;
}
.Index .productGift .setThumb_action {
  position: absolute;
  bottom: -5px;
  left: 50%;
  display: flex;
  justify-content: flex-end;
  width: 250px;
  transform: translateX(-50%);
}
.Index .productGift .setDesc {
  color: #523628;
}
.Index .productGift .setDesc_title {
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  letter-spacing: 0.1rem;
}
.Index .productGift .setDesc_desc {
  display: -webkit-box;
  margin-bottom: 10px;
  overflow: hidden;
  font-size: 16px;
  line-height: 1.2;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.Index .productGift .setDesc_price {
  display: flex;
  justify-content: space-between;
}
.Index .productGift .price {
  display: flex;
  flex-shrink: 0;
  gap: 5px;
  align-items: center;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.1rem;
}
.Index .productGift .price span {
  font-size: 20px;
}
@media (max-width: 1100px) {
  .Index .productGift .price {
    font-size: 12px;
  }
  .Index .productGift .price span {
    font-size: 16px;
  }
}
.Index .productGift .price--delete {
  text-decoration: line-through;
}
.Index .productGift .action {
  display: flex;
  gap: 10px;
  opacity: 0;
  transition: opacity 0.3s;
}
.Index .productGift .action_icon-cart {
  width: 35px;
  height: 35px;
  background-image: url(../img/index/icon_cart.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
}
.Index .productGift .action_icon-cart:hover {
  background-image: url(../img/index/icon_cart-active.png);
}
@media (max-width: 1100px) {
  .Index .productGift .action_icon-cart {
    width: 24px;
    height: 24px;
  }
}
.Index .productGift .action_icon-bag {
  width: 35px;
  height: 35px;
  background-image: url(../img/index/icon_bag.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
}
.Index .productGift .action_icon-bag:hover {
  background-image: url(../img/index/icon_bag-active.png);
}
@media (max-width: 1100px) {
  .Index .productGift .action_icon-bag {
    width: 24px;
    height: 24px;
  }
}
@media (max-width: 1100px) {
  .Index .productGift .action {
    gap: 5px;
  }
}
.Index .productGift .deco {
  position: relative;
  width: 35px;
  height: 12px;
  margin: 10px auto;
}
.Index .productGift .deco:after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-right: 3px solid #e08859;
  border-bottom: 2px solid #e08859;
  transform: skew(45deg);
}
@media (max-width: 1100px) {
  .Index .productGift .deco {
    transform: scale(0.8);
  }
}
.Index .productGiftTitle {
  position: relative;
  margin-bottom: 30px;
}
.Index .productGiftTitle img {
  width: 40%;
  min-width: 300px;
  max-width: 540px;
}
.Index .productGiftTitle:before {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 0;
  width: 18%;
  height: 1px;
  background-color: #012d17;
}
.Index .productGiftPromote {
  padding: 40px 0 70px;
}
@media (max-width: 960px) {
  .Index .productGiftPromote {
    padding: 20px 0 20px;
  }
}
.Index .productFeature {
  position: relative;
  padding: 0 0 300px 0;
  background-image: url(../img/index/feature_bg.jpg);
  background-repeat: no-repeat;
  background-position: bottom;
  background-size: cover;
}
@media (max-width: 1100px) {
  .Index .productFeature {
    padding: 0 0 200px 0;
  }
}
@media (max-width: 960px) {
  .Index .productFeature {
    /* padding: 20px 0 200px 0; */
    padding: 20px 0 40px 0;
  }
}
.Index .productFeature_promote {
  display: flex;
  gap: 20px;
  margin-bottom: 40px;
  color: #fff;
  transform: translateY(-50%);
}
.Index .productFeature_promoteItem {
  width: 50%;
  font-size: 24px;
  font-weight: 500;
  line-height: 2.75;
  text-align: center;
  letter-spacing: 0.2rem;
  background-image: url(../img/index/feature_iconBg.jpg);
  background-repeat: no-repeat;
  background-position: top;
  background-size: cover;
}
@media (max-width: 960px) {
  .Index .productFeature_promote {
    flex-wrap: wrap;
    margin-bottom: 20px;
    transform: translateY(0);
  }
  .Index .productFeature_promoteItem {
    width: 100%;
    font-size: 20px;
  }
}
.Index .productFeature_gallery-col {
  display: flex;
  margin-bottom: 40px;
  padding: 0;
}
.Index .productFeature_gallery-col:last-child {
  margin-bottom: 0;
}
.Index .productFeature_gallery-col-3 {
  gap: 40px;
}
.Index .productFeature_galleryItem {
  flex: 1;
}
.Index .productFeature_galleryItem img {
  width: 100%;
}
@media (max-width: 1100px) {
  .Index .productFeature_gallery-col {
    margin-bottom: 20px;
  }
  .Index .productFeature_gallery-col-3 {
    gap: 20px;
  }
}
@media (max-width: 960px) {
  .Index .productFeature_gallery-col-3 {
    gap: 0;
  }
}
.Index .productBg {
  background-image: url(../img/index/product3_bg.jpg);
  background-repeat: no-repeat;
  background-position: top;
  background-size: cover;
}
.Index .productRecommend {
  position: relative;
  margin-top: -50px;
}
.Index .productRecommend_item {
  position: relative;
  display: flex;
  width: 72%;
  margin: 0 auto;
  transform: translateY(-8%);
}
.Index .productRecommend_item-pic {
  flex-shrink: 0;
}
.Index .productRecommend_item-info {
  display: flex;
  align-items: center;
  line-height: 1.5;
  color: #523628;
  letter-spacing: 0.15rem;
}
.Index .productRecommend_item-infoWrap {
  padding: 100px 15px 0;
}
.Index .productRecommend_item-infoTitle {
  font-size: 20px;
  font-weight: 700;
}
.Index .productRecommend_item-infoText {
  margin-bottom: 40px;
  font-size: 16px;
}
.Index .productRecommend_item-infoArrow {
  position: relative;
  width: 50px;
  height: 12px;
}
.Index .productRecommend_item-infoArrow:after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-right: 3px solid #e08859;
  border-bottom: 2px solid #e08859;
  transform: skew(45deg);
}
.Index .productRecommend_item-infoArrow:before {
  content: "";
  position: absolute;
  top: 0;
  right: -10px;
  z-index: -1;
  width: 32px;
  height: 32px;
  background-color: #000;
  border-radius: 50%;
  transform: translate(10%, -20%);
}
@media (max-width: 1100px) {
  .Index .productRecommend_item {
    width: 100%;
  }
}
@media (max-width: 1100px) {
  .Index .productRecommend_item {
    flex-wrap: wrap;
    justify-content: center;
    padding: 40px 0;
    transform: translateY(0);
  }
  .Index .productRecommend_item .container {
    max-width: 600px;
  }
  .Index .productRecommend_item-pic {
    flex-shrink: 1;
  }
}
.Index .productRecommend_item a {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
@media (max-width: 960px) {
  .Index .productRecommend_item {
    width: 100%;
    padding: 20px 0;
    transform: translateY(0);
  }
  .Index .productRecommend_item-infoWrap {
    padding: 20px 15px 0;
  }
}
.Index .productAll {
  position: relative;
  padding: 60px 0;
  overflow: hidden;
}
@media (max-width: 960px) {
  .Index .productAll {
    padding: 40px 0;
  }
  .Index .productAll .container {
    max-width: 800px;
  }
}
.Index .productAll_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 95%;
  margin: 0 auto;
}
@media (max-width: 1100px) {
  .Index .productAll_list {
    width: 100%;
    max-width: 800px;
  }
}
.Index .productAll_item {
  flex-shrink: 0;
  width: 20%;
  cursor: pointer;
}
@media (max-width: 1100px) {
  .Index .productAll_item {
    width: 33.333333%;
  }
}
@media (max-width: 1100px) {
  .Index .productAll_item {
    width: 50%;
  }
}
.Index .productAll_itemWrap {
  position: relative;
  max-width: 250px;
  margin: 0 auto;
}
.Index .productAll_itemWrap > a {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
@media (max-width: 1100px) {
  .Index .productAll_itemWrap {
    max-width: auto;
  }
}
.Index .productAll_itemTop {
  position: relative;
  margin-bottom: 0;
}
.Index .productAll_itemTop:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 0;
  width: 134%;
  padding-top: 128%;
  background-image: url(../img/index/product3_item-activeBg.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
  opacity: 0;
  transition: opacity 0.3s;
  transform: translate(-50%, -50%);
}
.Index .productAll_itemTop-pic {
  position: relative;
  z-index: 1;
}
.Index .productAll_itemBottom {
  padding: 0 20px 10px 20px;
  color: #523628;
  text-align: center;
}
.Index .productAll_itemBottom-textWrapTitle {
  margin-bottom: 5px;
  font-size: 20px;
  font-weight: 700;
}
.Index .productAll_itemBottom-textWrapText {
  margin-bottom: 10px;
  font-size: 16px;
}
.Index .productAll_itemBottom-textWrapPrice {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.Index .productAll_itemBottom-textWrapPrice p {
  position: relative;
  display: flex;
  align-items: center;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.1rem;
}
.Index .productAll_itemBottom-textWrapPrice p:first-child:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 110%;
  height: 1px;
  background-color: #523628;
  transform: translate(-50%, -50%);
}
.Index .productAll_itemBottom-textWrapPrice span {
  margin-left: 5px;
  font-size: 20px;
}
@media (max-width: 1100px) {
  .Index .productAll_itemBottom {
    padding: 10px 10px;
  }
}
.Index .productAll_itemBtns {
  text-align: center;
  opacity: 0;
  transition: opacity 0.3s;
}
.Index .productAll_itemBtns button {
  width: 15%;
  max-width: 40px;
  margin: 0 10px;
  padding-top: 15%;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
  border-radius: 50%;
}
.Index .productAll_itemBtns-cart {
  background-image: url(../img/index/icon_cart.png);
}
.Index .productAll_itemBtns-cart:hover {
  background-image: url(../img/index/icon_cart-active.png);
}
.Index .productAll_itemBtns-bag {
  background-image: url(../img/index/icon_bag.png);
}
.Index .productAll_itemBtns-bag:hover {
  background-image: url(../img/index/icon_bag-active.png);
}
.Index .productAll_item:hover .productAll_itemBtns,
.Index .productAll_item:hover .productAll_itemTop-arrow,
.Index .productAll_item:hover .productAll_itemTop:after {
  opacity: 1;
}
.Index .slogan {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 900px;
  padding: 20px;
  background-image: url(../img/index/slogan_bg.jpg);
  /* background-image: url(../img/index/slogan_bg.png); */
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: cover;
}
.Index .slogan_decoration {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1920px;
  transform: translateX(-50%);
}
@media (max-width: 960px) {
  .Index .slogan {
    min-height: 600px;
  }
  .Index .slogan_decoration {
    width: 960px;
  }
}
.Index .slogan .slogan_amin {
  min-width: 320px;
  max-width: 400px;
}
.Title {
  display: flex;
  justify-content: center;
  font-size: 40px;
  color: #002c18;
  text-align: right;
}
.Title_en,
.Title_zh {
  margin-bottom: 0;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.1em;
}
.Title_zh {
  font-size: 24px;
  font-weight: 700;
}
.Title_zh span {
  position: relative;
}
.Title_zh span:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 3px;
  height: 100%;
  background-color: #002c18;
  transform: translate(-500%, -50%) skew(35deg);
  transform-origin: center;
}
@media (max-width: 960px) {
  .Title {
    font-size: 30px;
  }
  .Title_zh {
    font-size: 18px;
  }
}
.breadcrumb {
  justify-content: center;
}
.breadcrumb,
.breadcrumb_wrap {
  display: flex;
}
.breadcrumb_item,
.breadcrumb_item > a {
  display: flex;
  align-items: center;
  font-size: 15px;
  font-weight: 500;
  color: #002c18;
  letter-spacing: 0.2rem;
}
.breadcrumb_item > a {
  margin: 0 5px;
}
.breadcrumb_item > a img {
  margin-right: 5px;
}
@media (max-width: 960px) {
  .breadcrumb_item,
  .breadcrumb_item > a {
    font-size: 13px;
  }
}
.CartProcess1 {
  padding-top: 50px;
  padding-bottom: 100px;
}
.CartProcess1_btn {
  font-size: 20px;
  font-weight: 700;
  line-height: 2;
  color: #002c18;
  text-align: center;
  letter-spacing: 0.2em;
  background-color: #8ca097;
  border-radius: 5px;
}
.CartProcess1_btn-small {
  padding: 0 20px;
  font-size: 14px;
}
.CartProcess1_title {
  margin-bottom: 20px;
  font-size: 24px;
  font-weight: 700;
  color: #002c18;
  letter-spacing: 0.2em;
}
@media (max-width: 1100px) {
  .CartProcess1_title {
    margin-bottom: 10px;
    padding: 0;
  }
}
.CartProcess1_content {
  display: flex;
  justify-content: space-between;
  margin-bottom: 40px;
  padding-bottom: 40px;
  border-bottom: 1px solid #8ca097;
}
@media (max-width: 1100px) {
  .CartProcess1_content {
    flex-wrap: wrap;
    justify-content: center;
  }
}
@media (max-width: 960px) {
  .CartProcess1_content {
    margin-bottom: 20px;
    padding-bottom: 20px;
  }
}
.CartProcess1_orderList {
  /* width: 48%; */
  width: 58%;
}
@media (max-width: 1100px) {
  .CartProcess1_orderList {
    width: 100%;
    margin-bottom: 40px;
  }
}
.CartProcess1_orderItem {
  position: relative;
  display: flex;
  background-color: #fff;
  border-bottom: 1px solid #002c18;
}
.CartProcess1_orderItem:nth-child(odd) {
  background-color: #f6f6f6;
}
.CartProcess1_orderItem:last-child {
  border-bottom: none;
}
.CartProcess1_orderItem-pic {
  display: flex;
  align-items: center;
  justify-content: center;
}
.CartProcess1_orderItem-pic > img {
  max-width: 200px;
}
.CartProcess1_orderItem-info {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: center;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.8;
  color: #523628;
  letter-spacing: 0.2em;
}
.CartProcess1_orderItem-price {
  display: flex;
  width: 100%;
}
.CartProcess1_orderItem-price div:first-child {
  margin-right: 25%;
}
@media (max-width: 960px) {
  .CartProcess1_orderItem {
    flex-wrap: wrap;
  }
  .CartProcess1_orderItem-pic {
    width: 100%;
    margin-bottom: 5px;
  }
  .CartProcess1_orderItem-info {
    width: 100%;
    padding: 20px;
    font-size: 16px;
  }
  .CartProcess1_orderItem-price {
    flex-wrap: wrap;
    width: 100%;
    margin-bottom: 10px;
  }
  .CartProcess1_orderItem-price div:first-child {
    margin-right: 0;
  }
  .CartProcess1_orderItem-price div {
    width: 100%;
  }
}
.CartProcess1_orderItem-amount {
  font-size: 16px;
}
.CartProcess1_orderItem-amount .customSelect {
  position: relative;
  display: inline-block;
}
.CartProcess1_orderItem-amount .customSelect select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: 0 40px;
  line-height: 1.5;
  color: #523628;
  cursor: pointer;
  background-color: #ccd0cf;
  border: 1px solid transparent;
  border-radius: 5px;
}
.CartProcess1_orderItem-amount .customSelect:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 20%;
  width: 6px;
  height: 6px;
  border-right: 2px solid #523628;
  border-bottom: 2px solid #523628;
  transform: translateY(-60%) rotate(45deg);
  transform-origin: center;
}
.CartProcess1_orderItem-delete {
  /* position: absolute;
  top: 20px;
  right: 20px;
  z-index: 1;
  width: 20px;
  height: 20px;
  background-image: url(../img/icon_delete.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain; */

  position: absolute;
  top: 0px;
  right: 0px;
  z-index: 1;
  width: 90px;
  height: 90px;
  background-image: url(../img/icon_delete.png);
  background-repeat: no-repeat;
  background-position: 55px 25px;
  background-size: 20px;
}

.CartProcess1_orderItem:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  border: 65px solid transparent;
  border-color: transparent transparent transparent #bcc6c1;
  transform: translate(50%, -50%) rotate(-45deg);
  transform-origin: center;
}
.CartProcess1_discount {
  /* width: 48%; */
   width: 38%;
  padding-bottom: 20px;
  font-size: 16px;
  font-weight: 700;
  color: #002c18;
  letter-spacing: 0.15em;
  background-color: #fff;
}
@media (max-width: 1200px) {
  .CartProcess1_discount {
    width: 100%;
  }
}
.CartProcess1_discount-title {
  padding: 10px 30px;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  background-color: #002c18;
}
.CartProcess1_discount-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 20px;
}
.CartProcess1_discount-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.CartProcess1_discount-item:last-child {
  margin-bottom: 0;
}
.CartProcess1_discount-itemTitle-sub {
  font-size: 14px;
  color: #898989;
}
.CartProcess1_discount-itemTitle-unused > div:first-child {
  text-decoration: line-through;
}
@media (max-width: 480px) {
  .CartProcess1_discount {
    font-size: 16px;
  }
  .CartProcess1_discount-list,
  .CartProcess1_discount-title {
    padding: 10px;
  }
  .CartProcess1_discount-item {
    flex-wrap: wrap;
    margin-bottom: 5px;
  }
  .CartProcess1_discount-itemTitle {
    width: 100%;
    margin-bottom: 5px;
  }
  .CartProcess1_discount-itemTitle-sub {
    font-size: 12px;
  }
  .CartProcess1_discount-itemContent {
    width: 100%;
    text-align: right;
  }
}
.CartProcess1_discount-itemContent .customSelect {
  position: relative;
  display: inline-block;
}
.CartProcess1_discount-itemContent .customSelect select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: 0 40px;
  line-height: 1.5;
  color: #898989;
  cursor: pointer;
  background-color: transparent;
  border: 1px solid #898989;
  border-radius: 5px;
}
.CartProcess1_discount-itemContent .customSelect:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 10px;
  width: 6px;
  height: 6px;
  border-right: 2px solid #898989;
  border-bottom: 2px solid #898989;
  transform: translateY(-60%) rotate(45deg);
  transform-origin: center;
}
.CartProcess1_discount-itemContent .customSelect {
  font-size: 14px;
  font-weight: 400;
  color: #898989;
}
.CartProcess1_discount-itemContent .customSelect select {
  height: 28px;
  padding: 0 130px 0 24px;
}
.CartProcess1_discount-itemContent-input {
  display: flex;
  gap: 5px;
  width: 100%;
  margin-bottom: 5px;
}
.CartProcess1_discount-itemContent-input input {
  width: 190px;
  height: 28px;
  font-size: 14px;
  font-weight: 400;
  color: #898989;
  text-align: center;
  border: 1px solid #898989;
  border-radius: 5px;
}
.CartProcess1_discount-itemContent-input button {
  flex-shrink: 0;
  width: auto;
}
.CartProcess1_discount-itemContent-text {
  font-size: 14px;
  color: #898989;
  text-align: right;
  letter-spacing: 0.05em;
}
@media (max-width: 960px) {
  .CartProcess1_discount-itemContent .customSelect {
    width: 100%;
  }
  .CartProcess1_discount-itemContent .customSelect select {
    width: 100%;
    padding: 0 20px 0 20px;
  }
  .CartProcess1_discount-itemContent-input {
    display: flex;
  }
  .CartProcess1_discount-itemContent-input input {
    margin-right: 10px;
  }
}
.CartProcess1_discount-item-gift {
  flex-wrap: wrap;
}
.CartProcess1_discount-item-gift .CartProcess1_discount-itemTitle {
  margin-bottom: 10px;
}
.CartProcess1_discount-itemTag {
  width: 55%;
  margin-left: auto;
  font-size: 14px;
  line-height: 2;
  color: #fff;
  text-align: center;
  background-color: #db895b;
}
@media (max-width: 960px) {
  .CartProcess1_discount-itemTag {
    width: 100%;
  }
}
.CartProcess1_discount .CartProcess1_btn-go-product {
  display: block;
  margin-right: 20px;
  margin-left: auto;
  padding: 0 40px;
  font-size: 18px;
}
@media (max-width: 960px) {
  .CartProcess1_discount .CartProcess1_btn-go-product {
    margin-right: auto;
    padding: 0 20px;
  }
}
.CartProcess1_charge {
  display: flex;
  justify-content: center;
  margin-top: 50px;
}

.CartProcess1_charge .CartProcess1_charge-wrap{
  flex:1;
  padding-left: 30px;
  padding-right: 30px;
}

.CartProcess1_charge-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: 700;
  color: #002c18;
  letter-spacing: 0.1em;
}
.CartProcess1_charge-total-data {
  margin-left: 80px;
  font-size: 28px;
  color: #db895b;
}
@media (max-width: 960px) {
  .CartProcess1_charge-total-data {
    margin-left: 5px;
  }
}
.CartProcess1_charge-bonus {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 40px;
  font-size: 16px;
  font-weight: 700;
  color: #898989;
  letter-spacing: 0.1em;
}
.CartProcess1_charge-bonus-data {
  margin-left: 30px;
}
@media (max-width: 960px) {
  .CartProcess1_charge-bonus {
    margin-bottom: 20px;
    font-size: 16px;
  }
  .CartProcess1_charge-bonus-data {
    margin-left: 5px;
  }
}
.CartProcess1_btn-go-checkout {
  display: block;
}
.CartProcess2 {
  padding-bottom: 100px;
}
.CartProcess2_title {
  margin-bottom: 20px;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 0.2em;
}
.CartProcess2_total {
  padding: 40px 0;
  text-align: center;
  border-top: 1px solid #002c18;
  border-bottom: 1px solid #002c18;
}
@media (max-width: 960px) {
  .CartProcess2_total {
    margin-bottom: 20px;
    padding: 20px 0;
  }
}
.CartProcess2_total-charge {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 700;
  color: #002c18;
  letter-spacing: 0.1em;
}
.CartProcess2_total-charge-data {
  margin-left: 10px;
  font-size: 28px;
  color: #db895b;
}
.CartProcess2_total-cart {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 700;
  color: #898989;
  letter-spacing: 0.2em;
}
.CartProcess2_total-cart .num {
  margin: 0 20px;
  font-size: 28px;
}
.CartProcess2_total-cart .CartProcess2_toggle-cartBtn {
  display: block;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin-left: 10px;
  padding: 0;
  transform-origin: center;
}
.CartProcess2_total-cart .CartProcess2_toggle-cartBtn:after {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  border-top: 2px solid #898989;
  border-right: 2px solid #898989;
  transform: rotate(-45deg) translateY(50%);
  transform-origin: center;
}
.CartProcess2_total-cart .CartProcess2_toggle-cartBtn.active {
  transform: rotate(180deg);
}
@media (max-width: 960px) {
  .CartProcess2_total-cart {
    font-size: 20px;
  }
  .CartProcess2_total-cart .num {
    margin: 0 10px;
    font-size: 24px;
  }
  .CartProcess2_total-cart .CartProcess2_toggle-cartBtn:after {
    width: 8px;
    height: 8px;
  }
}
.CartProcess2_cart {
  display: none;
  margin-bottom: 40px;
}
.CartProcess2_cart.active {
  display: block;
}
@media (max-width: 960px) {
  .CartProcess2_cart {
    margin-bottom: 20px;
  }
}
.CartProcess2_cart-header {
  font-size: 16px;
  font-weight: 700;
  text-align: center;
}
@media (max-width: 960px) {
  .CartProcess2_cart-header {
    display: none !important;
  }
}
.CartProcess2_cart-row {
  display: flex;
}
@media (max-width: 960px) {
  .CartProcess2_cart-row {
    flex-wrap: wrap;
  }
}
.CartProcess2_cart-body {
  color: #523628;
  letter-spacing: 0.08em;
}
.CartProcess2_cart-body .CartProcess2_cart-row {
  background-color: #fff;
  border-bottom: 1px solid #002c18;
}
.CartProcess2_cart-body .CartProcess2_cart-row:nth-child(odd) {
  background-color: #f6f6f6;
}
.CartProcess2_cart-body .CartProcess2_cart-row:last-child {
  border-bottom: none;
}
.CartProcess2_cart-body .product_name {
  width: 100%;
  font-size: 20px;
  font-weight: 700;
}
.CartProcess2_cart-body .product_content {
  width: 100%;
  display: none;
}
.CartProcess2_cart-body .product_discount {
  font-size: 18px;
  font-weight: 700;
}
@media (max-width: 1100px) {
  .CartProcess2_cart-body .product_discount {
    font-size: 16px;
  }
}
.CartProcess2_cart-body .product_amount,
.CartProcess2_cart-body .product_price,
.CartProcess2_cart-body .product_total-price {
  font-weight: 700;
}
.CartProcess2_cart-cell {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 20px 10px;
}
.CartProcess2_cart-cell:before {
  position: absolute;
  top: 50%;
  left: 20px;
  font-size: 16px;
  font-weight: 500;
  transform: translateY(-50%);
}
.CartProcess2_cart-cell:first-child {
  /* width: 20%; */
  width: 12%;
}
.CartProcess2_cart-cell:nth-child(2) {
  width: 25%;
}
.CartProcess2_cart-cell:nth-child(3) {
  flex: 1;
  width: 15%;
}
.CartProcess2_cart-cell:nth-child(4) {
  width: 15%;
}
.CartProcess2_cart-cell:nth-child(5) {
  width: 10%;
}
.CartProcess2_cart-cell:nth-child(6) {
  width: 15%;
}
@media (max-width: 960px) {
  .CartProcess2_cart-cell {
    padding: 5px 20px;
  }
  .CartProcess2_cart-cell:first-child {
    width: 100%;
  }
  .CartProcess2_cart-cell:nth-child(2) {
    width: 100%;
    text-align: center;
  }
  .CartProcess2_cart-cell:nth-child(3) {
    flex: 1;
    width: 100%;
  }
  .CartProcess2_cart-cell:nth-child(4) {
    align-items: flex-end;
    width: 100%;
  }
  .CartProcess2_cart-cell:nth-child(4):before {
    content: "單件價格";
  }
  .CartProcess2_cart-cell:nth-child(5) {
    align-items: flex-end;
    width: 100%;
  }
  .CartProcess2_cart-cell:nth-child(5):before {
    content: "數量";
  }
  .CartProcess2_cart-cell:nth-child(6) {
    align-items: flex-end;
    width: 100%;
  }
  .CartProcess2_cart-cell:nth-child(6):before {
    content: "小計";
  }
}
.CartProcess2_discount {
  width: 100%;
  background-color: #fff;
  border-bottom: 1px solid #002c18;
}
.CartProcess2_discount-title {
  padding: 10px 30px;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.15em;
  background-color: #002c18;
}
.CartProcess2_discount-list {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 20px;
}
.CartProcess2_discount-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.CartProcess2_discount-item:last-child {
  margin-bottom: 0;
}
.CartProcess2_discount-itemTitle-sub {
  color: #898989;
}
.CartProcess2_discount-itemTitle-unused > div:first-child {
  text-decoration: line-through;
}
@media (max-width: 1100px) {
  .CartProcess2_discount {
    width: 100%;
  }
}
@media (max-width: 960px) {
  .CartProcess2_discount-list {
    gap: 10px;
    padding: 20px;
  }
}
@media (max-width: 480px) {
  .CartProcess2_discount {
    padding-bottom: 10px;
  }
  .CartProcess2_discount-list,
  .CartProcess2_discount-title {
    padding: 10px;
  }
  .CartProcess2_discount-item {
    flex-wrap: wrap;
    margin-bottom: 5px;
  }
  .CartProcess2_discount-itemTitle {
    width: 100%;
    margin-bottom: 5px;
  }
  .CartProcess2_discount-itemContent {
    width: 100%;
    text-align: right;
  }
}
.CartProcess2_final {
  width: 40%;
  min-width: 500px;
  margin-bottom: 40px;
  margin-left: auto;
  font-weight: 500;
  line-height: 2;
}
.CartProcess2_final-price {
  padding: 20px;
  border-bottom: 1px solid #002c18;
}
.CartProcess2_final-price-row {
  display: flex;
  justify-content: space-between;
}
.CartProcess2_final-coupon {
  padding: 20px;
}
@media (max-width: 960px) {
  .CartProcess2_final {
    width: 100%;
    min-width: auto;
    margin-bottom: 10px;
  }
}
.CartProcess2_divide-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin-bottom: 40px;
  padding: 30px;
  border-top: 1px solid #898989;
  border-bottom: 1px solid #898989;
}
.CartProcess2_divide-btn:after {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  border-top: 2px solid #898989;
  border-right: 2px solid #898989;
  transform: rotate(-45deg) translateY(50%);
  transform-origin: center;
}
@media (max-width: 960px) {
  .CartProcess2_divide-btn {
    margin-bottom: 20px;
    padding: 10px 0;
  }
  .CartProcess2_divide-btn:after {
    width: 8px;
    height: 8px;
  }
}
.CartProcess2_client button,
.CartProcess2_footer button {
  display: flex;
  justify-content: center;
  padding: 10px 20px;
  font-weight: 700;
  text-align: center;
  letter-spacing: 0.1em;
  border: 1px solid #9caca3;
  border-radius: 10px;
}
.CartProcess2_client button.active,
.CartProcess2_footer button.active {
  background-color: #8ca097;
  border: 1px solid #8ca097;
}
@media (max-width: 960px) {
  .CartProcess2_client button,
  .CartProcess2_footer button {
    padding: 5px 10px;
  }
}
.CartProcess2_client {
  display: flex;
  justify-content: space-between;
  margin-bottom: 40px;
}
.CartProcess2_client-delivery,
.CartProcess2_client-payment {
  width: 48%;
}
@media (max-width: 1100px) {
  .CartProcess2_client {
    flex-wrap: wrap;
  }
  .CartProcess2_client-delivery,
  .CartProcess2_client-payment {
    width: 100%;
    margin-bottom: 5px;
  }
}
@media (max-width: 960px) {
  .CartProcess2_client {
    margin-bottom: 20px;
  }
}
.CartProcess2_client .checkbox_wrap {
  position: relative;
  display: flex;
  align-items: center;
  padding-left: 35px;
  color: #5a5a5a;
  letter-spacing: 0.1em;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.CartProcess2_client .checkbox_wrap > input {
  position: absolute;
  width: 0;
  height: 0;
  cursor: pointer;
  opacity: 0;
}
.CartProcess2_client .checkbox_wrap .checkmark {
  position: absolute;
  top: 2px;
  left: 0;
  width: 25px;
  height: 25px;
  background-color: transparent;
  border: 1px solid #5a5a5a;
  border-radius: 8px;
}
.CartProcess2_client .checkbox_wrap .checkmark:after {
  content: "";
  position: absolute;
  top: 5px;
  left: 9px;
  display: none;
  width: 5px;
  height: 10px;
  border: solid #fff;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}
@media (max-width: 960px) {
  .CartProcess2_client .checkbox_wrap {
    padding-left: 25px;
    font-size: 16px;
  }
  .CartProcess2_client .checkbox_wrap .checkmark {
    width: 16px;
    height: 16px;
    border-radius: 4px;
  }
  .CartProcess2_client .checkbox_wrap .checkmark:after {
    top: 2px;
    left: 4px;
    width: 5px;
    height: 10px;
    border-width: 0 2px 2px 0;
  }
}
.CartProcess2_client .checkbox_wrap input:checked ~ .checkmark {
  background-color: #002c18;
}
.CartProcess2_client .checkbox_wrap input:checked ~ .checkmark:after {
  display: block;
}
.CartProcess2_client .radio_wrap {
  position: relative;
  display: flex;
  align-items: center;
  letter-spacing: 0.1em;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.CartProcess2_client .radio_wrap > input {
  position: absolute;
  width: 0;
  height: 0;
  cursor: pointer;
  opacity: 0;
}
.CartProcess2_client .radio_wrap .checkmark {
  width: 100%;
  padding: 10px 20px;
  text-align: center;
  background-color: transparent;
  border: 1px solid #9caca3;
  border-radius: 8px;
}
@media (max-width: 960px) {
  .CartProcess2_client .radio_wrap .checkmark {
    /* padding: 5px 20px; */
    padding: 5px;
  }
}
.CartProcess2_client .radio_wrap input:checked ~ .checkmark {
  background-color: #8ca097;
  border: 1px solid #8ca097;
}
.CartProcess2_client-form-item {
  margin-bottom: 20px;
  font-size: 16px;
}
.CartProcess2_client-form-item.required label:after {
  content: "*";
  margin-left: 10px;
  padding-top: 5px;
  color: #c22d19;
}
.CartProcess2_client-form-item-radio {
  display: flex;
  justify-content: space-between;
}
.CartProcess2_client-form-item-radio label {
  width: 49%;
}
.CartProcess2_client-form-item label[for="agree-read"] {
  margin-bottom: 40px;
  font-size: 16px;
}

@media (max-width: 960px) {
  .CartProcess2_client-form-item-radio{
    gap: 5px;
  }
}

/* 0213 */
.CartProcess2_client-form-item .address-select-wrap {
  display: flex;
  margin-bottom: 20px;
}

.CartProcess2_client-form-item .address-select-wrap .customSelect {
  position: relative;
  display: inline-block;
  width: 33.333%;
  margin-right: 20px;
  text-align: left;
}

.CartProcess2_client-form-item  .address-select-wrap .customSelect select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: 0 40px;
  line-height: 1.5;
  /* color: #000; */
  cursor: pointer;
  /* background-color: transparent; */
  border: 1px solid #f6f6f6 !important;
  color: #b7b7b7;
  letter-spacing: 0.1em;
  background-color: #f6f6f6;
  border-radius: 5px;
}
.CartProcess2_client-form-item  .address-select-wrap .customSelect:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 20%;
  width: 6px;
  height: 6px;
  border-right: 2px solid #b7b7b7;
  border-bottom: 2px solid #b7b7b7;
  transform: translateY(-60%) rotate(45deg);
  transform-origin: center;
}
.CartProcess2_client-form-item  .address-select-wrap .customSelect {
  display: block;
  width: 33.333%;
  margin-right: 20px;
  text-align: left;
}
.CartProcess2_client-form-item  .address-select-wrap .customSelect select {
  width: 100%;
  height: 100%;
  padding: 0 20px;
  border-radius: 10px;
}

.CartProcess2_client-form-item .address-select-wrap input {
  width: 33.333% !important;
  padding: 10px 20px;letter-spacing: 0.1em;
  background-color: transparent;
  border: 1px solid rgb(183, 183, 183);
  border-radius: 10px;
  color: #b7b7b7;
}

@media (max-width: 960px) {
  .CartProcess2_client-form-item {
    margin-bottom: 10px;
    font-size: 16px;
  }
  .CartProcess2_client-form-item label[for="agree-read"] {
    margin-bottom: 20px;
    font-size: 14px;
  }
}
.CartProcess2_client label {
  display: flex;
  margin-bottom: 5px;
  font-weight: 700;
}
.CartProcess2_client input[type="text"],
.CartProcess2_client textarea {
  width: 100%;
  padding: 10px 20px;
  color: #b7b7b7;
  letter-spacing: 0.1em;
  background-color: #f6f6f6;
  border: none;
  border-radius: 10px;
}
.CartProcess2_client input[type="text"]::-moz-placeholder,
.CartProcess2_client textarea::-moz-placeholder {
  color: #b7b7b7;
}
.CartProcess2_client input[type="text"]::placeholder,
.CartProcess2_client textarea::placeholder {
  color: #b7b7b7;
}
.CartProcess2_client textarea {
  min-height: 180px;
}
.CartProcess2_client-paymentOptions {
  margin-bottom: 40px;
}
.CartProcess2_client-paymentOption {
  width: 100%;
  margin-bottom: 20px;
  color: rgba(1, 1, 1, 0.55);
}
.CartProcess2_client-paymentOption.active {
  color: #232323;
}
.CartProcess2_client-paymentData {
  margin-bottom: 40px;
}
.CartProcess2_client-agreement {
  padding: 40px 0;
  border-top: 1px solid #002c18;
  border-bottom: 1px solid #002c18;
}
.CartProcess2_client-agreement label {
  margin-bottom: 0;
}
.CartProcess2_client-agreement a {
  color: #9caca3;
}
.CartProcess2_client-agreement .CartProcess2_client-form-item {
  margin-bottom: 0;
}
.CartProcess2_client-agreement .CartProcess2_client-form-item > span {
  display: block;
  margin-left: 38px;
  font-size: 12pt;
}
@media (max-width: 960px) {
  .CartProcess2_client-paymentOptions {
    margin-bottom: 30px;
  }
  .CartProcess2_client-paymentOption {
    margin-bottom: 10px;
  }
  .CartProcess2_client-creditCard {
    margin-bottom: 20px;
  }
  .CartProcess2_client-agreement {
    padding: 20px 0;
  }
  .CartProcess2_client-agreement .CartProcess2_client-form-item > span {
    margin-left: 24px;
    font-size: 12px;
  }
}
.CartProcess2_footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.CartProcess2_footer a,
.CartProcess2_footer button {
  font-weight: 700;
  letter-spacing: 0.1em;
}
.CartProcess2_footer button {
  min-width: 10em;
  text-align: center;
}
.CartProcess2_footer a {
  display: flex;
  align-items: center;
}
.CartProcess2_footer a .deco {
  position: relative;
  width: 40px;
  height: 12px;
  margin-right: 10px;
}
.CartProcess2_footer a .deco:after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-bottom: 1px solid #002c18;
  border-left: 2px solid #002c18;
  transform: skew(-45deg);
}
@media (max-width: 960px) {
  .CartProcess2_footer button {
    min-width: 8em;
    font-size: 18px;
    text-align: center;
  }
  .CartProcess2_footer a {
    font-size: 16px;
  }
  .CartProcess2_footer a .deco {
    margin-right: -5px;
    transform: scale(0.5);
  }
}
.CartProcess3 {
  padding-bottom: 100px;
}
.CartProcess3 .container {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.CartProcess3_check {
  width: 60px;
}
.CartProcess3_content {
  margin-top: 20px;
  font-size: 20px;
  font-weight: 700;
  text-align: center;
}
.CartProcess3_orderNumber {
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: 400;
}
.CartProcess3_note {
  max-width: 800px;
  margin-top: 40px;
  padding: 40px;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  text-align: center;
  background-image: url(../img/cartProcess3/cartProcess3_noteBg.jpg);
  background-position: 50%;
}
.CartProcess3_noteTitle {
  font-size: 20px;
}
.CartProcess3_links {
  display: flex;
  gap: 80px;
  max-width: 800px;
  margin-top: 80px;
}
.CartProcess3_links a {
  min-width: 200px;
  padding: 5px 20px;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  background-color: #9baba1;
  border-radius: 5px;
}
.CartProcess3_links a:nth-child(2) {
  color: #fff;
  background-color: #052b17;
}
@media (max-width: 960px) {
  .CartProcess3_content {
    font-size: 22px;
  }
  .CartProcess3_orderNumber {
    font-size: 18px;
  }
  .CartProcess3_note {
    margin-top: 40px;
    padding: 20px 10px;
    font-size: 18px;
  }
  .CartProcess3_noteTitle {
    font-size: 22px;
  }
  .CartProcess3_links {
    gap: 30px;
    width: 100%;
    max-width: 400px;
    margin-top: 40px;
  }
  .CartProcess3_links a {
    width: 50%;
    min-width: auto;
    font-size: 18px;
  }
}
.ProductContent {
  padding-bottom: 100px;
  font-size: 16px;
}
.ProductContent .productHeader {
  height: 240px;
}
.ProductContent .productTop_breadcrumb {
  margin-top: 60px;
}
.ProductContent .productIntro {
  padding-top: 80px;
}
.ProductContent .productIntro_wrap {
  display: flex;
}
@media (max-width: 1100px) {
  .ProductContent .productIntro_wrap {
    flex-wrap: wrap;
  }
}
.ProductContent_content-menu {
  width: 25%;
  min-width: 300px;
  margin-right: 3%;
  padding-right: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
}
@media (max-width: 1100px) {
  .ProductContent_content-menu {
    width: 100%;
    margin-bottom: 20px;
    padding: 0;
  }
}
.ProductContent_content-menuTitle {
  margin-bottom: 20px;
  font-size: 20px;
}
.ProductContent_content-menuItem {
  margin-bottom: 10px;
  font-size: 16px;
  cursor: pointer;
}
.ProductContent_content-menuItem.ProductContent_content-menuItem-toggle
  .ProductContent_content-menuItemTitle
  span {
  position: relative;
  display: inline-block;
  padding-right: 25px;
}
.ProductContent_content-menuItem.ProductContent_content-menuItem-toggle
  .ProductContent_content-menuItemTitle
  span:after {
  content: "+";
  position: absolute;
  top: -2px;
  right: 0;
  display: block;
  font-size: 1.5em;
  line-height: 1;
  color: currentColor;
}
.ProductContent_content-menuItem.ProductContent_content-menuItem-toggle
  .ProductContent_content-menuItemSub {
  display: none;
  padding: 10px 20px;
  line-height: 2;
  color: rgba(101, 126, 112, 0.4);
}
.ProductContent_content-menuItem.ProductContent_content-menuItem-toggle
  .ProductContent_content-menuItemSub
  > .active,
.ProductContent_content-menuItem.ProductContent_content-menuItem-toggle
  .ProductContent_content-menuItemSubItem:hover {
  color: #657e70;
}
@media (max-width: 1100px) {
  .ProductContent_content-menuItem.ProductContent_content-menuItem-toggle
    .ProductContent_content-menuItemSub {
    padding: 10px;
  }
}
.ProductContent_content-menuItem.ProductContent_content-menuItem-toggle.active
  .ProductContent_content-menuItemTitle {
  color: #ea9564;
}
.ProductContent_content-menuItem.ProductContent_content-menuItem-toggle.active
  .ProductContent_content-menuItemTitle
  span:after {
  content: "-";
}
.ProductContent_content-menuItem.ProductContent_content-menuItem-toggle.active
  .ProductContent_content-menuItemSub {
  display: block;
}
.ProductContent_content-menuItemTitle:hover {
  color: #ea9564;
}
.ProductContent .introduce {
  display: flex;
  flex-wrap: wrap;
  width: 75%;
}
.ProductContent .introduce_slider {
  flex-shrink: 0;
  width: 45%;
}
@media (max-width: 1100px) {
  .ProductContent .introduce_slider {
    width: 100%;
    max-width: unset;
  }
}
.ProductContent .introduce_desc {
  width: 55%;
  padding-top: 30px;
  padding-left: 4%;
}
@media (max-width: 1100px) {
  .ProductContent .introduce_desc {
    width: 100%;
    padding-left: 0;
  }
}
@media (max-width: 1100px) {
  .ProductContent .introduce {
    width: 100%;
    margin-top: 30px;
  }
}
.ProductContent .slider_main {
  padding: 5px;
}
.ProductContent .slider_sub {
  display: flex;
}
.ProductContent .slider_sub .sub {
  padding: 0 5px;
}
.ProductContent .line {
  margin: 30px 0;
}
.ProductContent .desc {
  padding: 0 30px 30px;
}
.ProductContent .desc_price {
  display: flex;
  gap: 30px;
}
.ProductContent .desc .title {
  font-size: 20px;
  font-weight: 700;
  color: #523628;
}
.ProductContent .desc .price {
  display: flex;
  flex-shrink: 0;
  gap: 5px;
  align-items: center;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.1rem;
}
.ProductContent .desc .price--delete {
  text-decoration: line-through;
}
.ProductContent .desc_mount {
  margin-top: 15px;
}
.ProductContent .desc .mount {
  display: flex;
  align-items: center;
  /* gap: 30px; */
  gap: 15px;
}
.ProductContent .desc .mount_icon {
  width: 24px;
  height: 24px;
  font-size: 24px;
  line-height: 24px;
  text-align: center;
  cursor: pointer;
  border: 1px solid #000;
  border-radius: 50%;
}
.ProductContent .desc .mount_number {
  font-weight: 700;
}

.ProductContent .desc input.mount_number{
  width: 60px;
  height: 35px;
  text-align: center;
  border: 1px solid #ccc;
  border-radius: 4px;
}

.ProductContent .desc_action {
  margin-top: 20px;
}
.ProductContent .desc .action {
  /* display: flex;
  flex-wrap: wrap; */
  display: grid;
  grid-template-columns: 1fr 1fr 2.5em;
  gap: 10px;
}

.ProductContent .desc .action .btn{
  padding-left: 0em;
  padding-right: 0em;
}

@media (max-width: 1100px) {
  .ProductContent .desc {
    padding: 0;
  }
}
.ProductContent .contentText {
  padding: 0 30px;
}
.ProductContent .contentText .text {
  font-weight: 700;
  color: #002c18;
  white-space: pre-line;
}
.ProductContent .contentText .text--highLight {
  color: #523628;
}
@media (max-width: 1100px) {
  .ProductContent .contentText {
    padding: 0;
  }
}
.ProductContent .productDesc {
  padding-top: 80px;
}
.ProductContent .productDesc .image {
  padding: 30px 0;
}
.ProductContent .productDesc .title {
  font-size: 24px;
  font-weight: 700;
  color: #523628;
}
.ProductContent .productDesc .content {
  color: #002c18;
}
.ProductContent .productDesc .back {
  display: flex;
  justify-content: flex-end;
}
.ProductContent .productDesc .back a {
  padding: 0 50px;
  line-height: 30px;
  color: #002c18;
  background-color: #9caca3;
  border: 1px solid #9caca3;
  border-radius: 4px;
}
@media (max-width: 1100px) {
  .ProductContent .productDesc {
    padding-top: 0;
  }
}
.ProductContent .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 50px;
  line-height: 30px;
  color: #002c18;
  white-space: nowrap;
  cursor: pointer;
  background-color: #9caca3;
  border: 1px solid #9caca3;
  border-radius: 4px;
}
.ProductContent .btn--border {
  background-color: #fff;
  border: 1px solid #002c18;
}
.ProductContent .btn--min {
  padding: 0 5px;
}
.ProductContent .icon {
  display: block;
  width: 25px;
  height: 25px;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
}
.ProductContent .icon_heart {
  background-image: url(../img/productContent/icon_like.png);
}
.ProductContent .icon_back {
  background-image: url(../img/productContent/icon_arrowL.png);
}
.PageControl {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  margin: 0 auto;
  font-weight: 700;
}
@media (max-width: 480px) {
  .PageControl {
    flex-direction: column;
    align-items: center;
  }
}
.PageControl-pages {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 16px;
}
.PageControl-pages > button {
  width: 30px;
  height: 30px;
  border-radius: 50%;
}
.PageControl-pages > button.active,
.PageControl-pages > button:hover {
  background-color: #a9b7b7;
}
.PageControl > button {
  flex-shrink: 0;
  width: 120px;
  padding: 5px 20px;
  font-size: 14px;
  border: 1px solid #002c18;
  border-radius: 5px;
}
.ProductList_content-menuItem.ProductList_content-menuItem-toggle.active
  .ProductList_content-menuItemTitle {
  color: #ea9564;
}
.Login {
  padding-bottom: 100px;
}
.Login .container {
  max-width: 1000px;
}
.SignUp {
  padding-bottom: 100px;
}
.SignUp .container {
  max-width: 1000px;
}
.SignUp .LoginSignUp_member-form label.last {
  margin-bottom: 40px;
}
.SignUp_goLogin {
  font-size: 18px;
  font-weight: 700;
  color: #252525;
  text-align: center;
}
.SignUp_goLogin a {
  margin-left: 5px;
  color: #002c18;
}
.RegistTerm .container {
  padding-bottom: 100px;
}
.RegistTerm__content {
  margin: 0 auto;
}
@media (max-width: 1100px) {
  .RegistTerm__content {
    width: 100%;
  }
}
.RegistTerm_block ~ .RegistTerm_block {
  margin-top: 40px;
}
.RegistTerm__title {
  font-size: 24px;
  font-weight: 700;
  color: #002c18;
}
.RegistTerm__info {
  padding-top: 10px;
  font-size: 16px;
  color: #002c18;
}
.RegistTerm__agree {
  padding-top: 40px;
  font-size: 18px;
  font-weight: 700;
  color: #002c18;
}
.RegistTerm__agree label {
  padding: 5px 20px;
  background-color: #9caca3;
  border-radius: 8px;
}
.RegistTerm__next {
  display: flex;
  justify-content: flex-end;
  padding-top: 60px;
  font-size: 18px;
  color: #fff;
}
.RegistTerm__nextBtn {
  display: flex;
  gap: 20px;
  align-items: center;
  justify-content: center;
  width: 180px;
  padding: 5px 0;
  font-weight: 700;
  background-color: #db895b;
  border-radius: 8px;
}
.RegistTerm__nextBall {
  position: relative;
  width: 20px;
  height: 20px;
  background-color: #002c18;
  border-radius: 100%;
}
.RegistTerm__nextBall:before {
  top: 12px;
  left: -8px;
  width: 20px;
  height: 1px;
}
.RegistTerm__nextBall:after,
.RegistTerm__nextBall:before {
  content: "";
  position: absolute;
  background-color: #fff;
  border-radius: 1px;
}
.RegistTerm__nextBall:after {
  top: 5px;
  left: 8px;
  width: 1px;
  height: 10px;
  transform: rotate(-50deg);
}
.Tabs {
  border-color: #333;
  border-style: solid;
  border-width: 1px 0;
}
.Tabs__container {
  margin: 0 auto;
  padding: 0 20px;
}
.Tabs__content {
  display: flex;
  gap: 6%;
  justify-content: center;
}
@media (max-width: 960px) {
  .Tabs__content {
    flex-direction: column;
    gap: 0;
    align-items: flex-start;
    padding: 10px 0;
    font-size: 18px;
  }
}
.Tabs__content a {
  position: relative;
  padding: 20px 0;
  font-size: 16px;
  color: #333;
}
@media (max-width: 960px) {
  .Tabs__content a {
    padding: 5px 0;
  }
}
.Tabs__content .active {
  font-weight: 700;
  color: #002c18;
}
.Tabs__content .active:after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: #d3865a;
  border-radius: 1px;
}
.Coupon {
  padding-bottom: 100px;
}
.Coupon__wrap {
  margin: 40px auto 0;
}
@media (max-width: 1100px) {
  .Coupon__wrap {
    width: 100%;
  }
}
.Coupon__title {
  font-size: 24px;
  font-weight: 700;
  color: #002c18;
}
.Coupon__tabs {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-top: 20px;
}
.Coupon__tabs button {
  padding: 5px 20px 0;
  font-size: 16px;
  font-weight: 700;
  color: #666;
}
.Coupon__tabs button.active {
  color: #fff;
  background-color: #d3865a;
  border-radius: 30px;
}
.Coupon__search {
  display: flex;
  margin-top: 20px;
}
.Coupon__searchInput {
  flex-shrink: 1;
  padding: 5px 20px;
  border: 1px solid #002c18;
  border-radius: 8px;
}
.Coupon__searchBtn {
  flex-shrink: 0;
  margin-left: 5px;
  padding: 5px 25px;
  font-size: 16px;
  font-weight: 700;
  color: #002c18;
  background-color: #9caca3;
  border-radius: 8px;
}
@media (max-width: 960px) {
  .Coupon__searchInput {
    width: 100%;
  }
}
.Coupon__couponList {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  max-width: 1000px;
  margin: 40px auto 0;
}
@media (max-width: 960px) {
  .Coupon__couponList {
    grid-template-columns: repeat(1, 1fr);
    max-width: 500px;
    margin: 40px auto 0;
  }
}
@media (max-width: 480px) {
  .Coupon__couponList {
    max-width: 360px;
  }
}
.Coupon__coupon {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  padding: 30px 30px 50px;
  color: #fff;
  background-image: url(../img/coupon/coupon_itemBg.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
}
@media (max-width: 480px) {
  .Coupon__coupon {
    padding: 28px 15px 25px;
  }
}
.Coupon__price {
  display: flex;
  grid-column: span 1;
  align-items: center;
  justify-content: center;
  font-size: 42px;
}
@media (max-width: 480px) {
  .Coupon__price {
    font-size: 25px;
  }
}
.Coupon__price span {
  align-self: flex-end;
  margin-bottom: 10px;
  font-size: 20px;
}
@media (max-width: 480px) {
  .Coupon__price span {
    font-size: 16px;
  }
}
.Coupon__info {
  grid-column: span 2;
  margin-left: 15px;
}
.Coupon__infoTitle {
  font-size: 18px;
  font-weight: 700;
}
@media (max-width: 480px) {
  .Coupon__infoTitle {
    font-size: 16px;
  }
}
.Coupon__infoDateTitle {
  margin-top: 10px;
  font-size: 12px;
  font-weight: 700;
}
@media (max-width: 480px) {
  .Coupon__infoDateTitle {
    margin-top: 0;
  }
}
.Coupon__infoDate {
  font-size: 16px;
}
@media (max-width: 480px) {
  .Coupon__infoDate {
    font-size: 12px;
  }
}
.Collect {
  padding-bottom: 100px;
}
.Collect__wrap {
  margin: 0 auto;
  margin-top: 40px;
}
@media (max-width: 1100px) {
  .Collect__wrap {
    width: 100%;
  }
}
.Collect__title {
  margin-bottom: 40px;
  padding: 0 10px;
  font-size: 24px;
  font-weight: 700;
  color: #002c18;
}
@media (max-width: 1100px) {
  .Collect__title {
    margin-bottom: 20px;
  }
}
.Collect_cart-header {
  font-weight: 700;
  color: #002c18;
  background-color: #fff;
}
@media (max-width: 960px) {
  .Collect_cart-header {
    display: none !important;
  }
}
.Collect_cart-row {
  display: flex;
}
@media (max-width: 960px) {
  .Collect_cart-row {
    position: relative;
    flex-wrap: wrap;
  }
}
.Collect_cart-body {
  color: #002c18;
}
.Collect_cart-body .Collect_cart-row {
  background-color: #fff;
  border-bottom: 1px solid #002c18;
}
.Collect_cart-body .Collect_cart-row:nth-child(odd) {
  background-color: #f6f6f6;
}
.Collect_cart-body .Collect_cart-row:last-child {
  border-bottom: none;
}
.Collect_cart-body .product_pic {
  text-align: center;
}
.Collect_cart-body .product_name {
  width: 100%;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
}
.Collect_cart-body .product_amount {
  width: 100%;
  font-weight: 700;
}
.Collect_cart-body .product_amount .customSelect {
  position: relative;
  display: inline-block;
}
.Collect_cart-body .product_amount .customSelect select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: 0 40px;
  line-height: 1.5;
  color: #002c18;
  cursor: pointer;
  background-color: #cbd3ce;
  border: 1px solid transparent;
  border-radius: 5px;
}
.Collect_cart-body .product_amount .customSelect:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 20%;
  width: 6px;
  height: 6px;
  border-right: 2px solid #002c18;
  border-bottom: 2px solid #002c18;
  transform: translateY(-60%) rotate(45deg);
  transform-origin: center;
}
.Collect_cart-body .product_price {
  font-weight: 700;
}
.Collect_cart-body .product_status {
  width: 100%;
}
.Collect_cart-body .product_status button {
  display: block;
  width: 100%;
  margin-bottom: 20px;
  padding: 5px 10px;
  font-weight: 700;
  color: #fff;
  text-align: center;
  background-color: #012d19;
  border-radius: 10px;
}
.Collect_cart-body .product_status button.secondary {
  color: #002c18;
  background-color: #9caca3;
}
@media (max-width: 960px) {
  .Collect_cart-body .product_status button {
    margin-bottom: 10px;
    padding: 5px 10px;
    font-size: 16px;
  }
}
.Collect_cart-body .product_delete button {
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 1;
  width: 20px;
  height: 20px;
  background-image: url(../img/icon_delete.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
}
.Collect_cart-body .product_delete:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  border: 65px solid transparent;
  border-color: transparent transparent transparent #bcc6c1;
  transform: translate(50%, -50%) rotate(-45deg);
  transform-origin: center;
}
.Collect_cart-cell {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 20px 10px;
}
.Collect_cart-cell:before {
  position: absolute;
  top: 50%;
  left: 20px;
  font-size: 0.8em;
  font-weight: 500;
  transform: translateY(-50%);
}
.Collect_cart-cell:first-child {
  width: 20%;
}
.Collect_cart-cell:nth-child(2) {
  flex: 1;
  width: 25%;
}
.Collect_cart-cell:nth-child(3),
.Collect_cart-cell:nth-child(4) {
  width: 15%;
}
.Collect_cart-cell:nth-child(5) {
  width: 18%;
}
.Collect_cart-cell:nth-child(6) {
  width: 8%;
}
@media (max-width: 960px) {
  .Collect_cart-cell {
    padding: 5px 20px;
  }
  .Collect_cart-cell:first-child {
    width: 100%;
  }
  .Collect_cart-cell:nth-child(2) {
    width: 100%;
    text-align: center;
  }
  .Collect_cart-cell:nth-child(3),
  .Collect_cart-cell:nth-child(4),
  .Collect_cart-cell:nth-child(5) {
    width: 100%;
  }
  .Collect_cart-cell.product_delete {
    position: absolute;
    top: 0;
    right: 0;
  }
}
.Bonus {
  padding-bottom: 100px;
}
.Bonus__title {
  margin-top: 40px;
  padding: 0 10px;
  font-size: 24px;
  color: #002c18;
}
.Bonus__title,
.Bonus_total {
  margin-bottom: 20px;
  font-weight: 700;
}
.Bonus_total {
  font-size: 16px;
  text-align: right;
  letter-spacing: 0.1em;
}
.Bonus_total span {
  font-size: 24px;
  color: #d3865a;
}
.Bonus_table {
  margin-bottom: 40px;
}
.Bonus_table-header {
  font-size: 16px;
  font-weight: 700;
  line-height: 2;
  color: #002c18;
  text-align: center;
  background-color: #fff;
}
@media (max-width: 960px) {
  .Bonus_table-header {
    display: none !important;
  }
}
.Bonus_table-row {
  display: flex;
}
@media (max-width: 1100px) {
  .Bonus_table-row {
    position: relative;
    flex-wrap: wrap;
  }
}
.Bonus_table-body {
  color: #002c18;
  letter-spacing: 0.08em;
}
.Bonus_table-body .Bonus_table-row {
  background-color: #fff;
  border-top: 1px solid #002c18;
}
.Bonus_table-body .Bonus_table-row:nth-child(odd) {
  background-color: #f6f6f6;
}
.Bonus_table-body .text {
  font-size: 16px;
  font-weight: 500;
  text-align: center;
  letter-spacing: 0.1em;
}
@media (max-width: 960px) {
  .Bonus_table-body .text {
    padding: 0 10px;
    text-align: left;
  }
}
.Bonus_table-cell {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 20px 10px;
}
.Bonus_table-cell:before {
  flex-shrink: 0;
  width: 150px;
  padding-left: 10px;
  font-size: 16px;
  font-weight: 500;
}
.Bonus_table-cell:first-child {
  width: 18%;
}
.Bonus_table-cell:nth-child(2) {
  width: 20%;
}
.Bonus_table-cell:nth-child(3) {
  flex: 1;
  width: 25%;
}
.Bonus_table-cell:nth-child(4),
.Bonus_table-cell:nth-child(5) {
  width: 12%;
}
.Bonus_table-cell:nth-child(6) {
  width: 18%;
}
@media (max-width: 960px) {
  .Bonus_table-cell {
    flex-direction: row;
    justify-content: flex-start;
    min-height: 40px;
    padding: 5px 10px;
    padding-left: 0;
  }
  .Bonus_table-cell:before {
    display: block;
  }
  .Bonus_table-cell:first-child {
    width: 100%;
  }
  .Bonus_table-cell:first-child:before {
    content: "日期";
  }
  .Bonus_table-cell:nth-child(2) {
    width: 100%;
  }
  .Bonus_table-cell:nth-child(2):before {
    content: "訂單編號";
  }
  .Bonus_table-cell:nth-child(3) {
    width: 100%;
  }
  .Bonus_table-cell:nth-child(3):before {
    content: "連結到訂單";
  }
  .Bonus_table-cell:nth-child(4) {
    width: 100%;
  }
  .Bonus_table-cell:nth-child(4):before {
    content: "轉入點數";
  }
  .Bonus_table-cell:nth-child(5) {
    width: 100%;
  }
  .Bonus_table-cell:nth-child(5):before {
    content: "使用點數";
  }
  .Bonus_table-cell:nth-child(6) {
    width: 100%;
  }
  .Bonus_table-cell:nth-child(6):before {
    content: "    到期日";
  }
}
.Member {
  padding-bottom: 100px;
}
.Member__wrap {
  margin: 0 auto;
  padding-top: 60px;
}
@media (max-width: 1100px) {
  .Member__wrap {
    width: 100%;
    padding-top: 40px;
  }
}
.Member_avatar {
  display: flex;
  align-items: center;
  width: 445px;
  margin: 0 auto 40px auto;
  padding: 10px 20px;
  font-size: 24px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.1em;
  background-image: url(../img/member/member_peopleBg.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: cover;
  border-radius: 10px;
}
.Member_avatar-pic {
  position: relative;
  margin-right: 20px;
}
.Member_avatar-pic button {
  position: absolute;
  right: 0;
  bottom: 0;
}
.Member_avatar-type {
  font-size: 16px;
  font-weight: 500;
  color: #a4c2b4;
}
@media (max-width: 960px) {
  .Member_avatar {
    width: 100%;
  }
}
.Member_title {
  margin-bottom: 20px;
  font-size: 24px;
  font-weight: 700;
  color: #002c18;
  letter-spacing: 0.2em;
}
@media (max-width: 960px) {
  .Member_title {
    margin-top: 20px;
    margin-bottom: 10px;
  }
}
.Member_footer button,
.Member_info button {
  display: flex;
  justify-content: center;
  padding: 5px 20px;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  letter-spacing: 0.1em;
  border: 1px solid #9caca3;
  border-radius: 10px;
}
.Member_footer button.active,
.Member_info button.active {
  background-color: #8ca097;
  border: 1px solid #8ca097;
}
@media (max-width: 960px) {
  .Member_footer button,
  .Member_info button {
    padding: 5px 10px;
  }
}
.Member_info {
  display: flex;
  justify-content: space-between;
  margin-bottom: 80px;
}
.Member_info-data,
.Member_info-password {
  width: 48%;
}
@media (max-width: 960px) {
  .Member_info {
    flex-wrap: wrap;
  }
  .Member_info-data,
  .Member_info-password {
    width: 100%;
    margin-bottom: 5px;
  }
}
@media (max-width: 960px) {
  .Member_info {
    margin-bottom: 20px;
  }
}
.Member_info .radio_wrap {
  position: relative;
  display: flex;
  align-items: center;
  letter-spacing: 0.1em;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.Member_info .radio_wrap > input {
  position: absolute;
  width: 0;
  height: 0;
  cursor: pointer;
  opacity: 0;
}
.Member_info .radio_wrap .checkmark {
  width: 100%;
  padding: 10px 20px;
  text-align: center;
  background-color: transparent;
  border: 1px solid #9caca3;
  border-radius: 8px;
}
@media (max-width: 960px) {
  .Member_info .radio_wrap .checkmark {
    padding: 5px 20px;
  }
}
.Member_info .radio_wrap input:checked ~ .checkmark {
  background-color: #8ca097;
  border: 1px solid #8ca097;
}
.Member_info-form-item {
  margin-bottom: 20px;
  font-size: 16px;
  letter-spacing: 0.1em;
}
.Member_info-form-item.required label:after {
  content: "*";
  margin-left: 10px;
  padding-top: 5px;
  color: #c22d19;
}
.Member_info-form-item-radio {
  display: flex;
  justify-content: flex-start;
}
.Member_info-form-item-radio label {
  width: 120px;
  margin-right: 20px;
}
.Member_info-form-item label[for="agree-read"] {
  margin-bottom: 40px;
  font-size: 14px;
}
@media (max-width: 960px) {
  .Member_info-form-item {
    margin-bottom: 10px;
    font-size: 16px;
  }
  .Member_info-form-item label[for="agree-read"] {
    margin-bottom: 20px;
  }
}
.Member_info label {
  display: flex;
  margin-bottom: 5px;
  font-weight: 700;
}
.Member_info input[type="date"],
.Member_info input[type="password"],
.Member_info input[type="text"],
.Member_info textarea {
  width: 100%;
  padding: 10px 20px;
  color: #000;
  letter-spacing: 0.1em;
  background-color: transparent;
  border: 1px solid #b7b7b7;
  border-radius: 10px;
}
.Member_info input[type="date"]::-moz-placeholder,
.Member_info input[type="password"]::-moz-placeholder,
.Member_info input[type="text"]::-moz-placeholder,
.Member_info textarea::-moz-placeholder {
  color: #b7b7b7;
}
.Member_info input[type="date"]::placeholder,
.Member_info input[type="password"]::placeholder,
.Member_info input[type="text"]::placeholder,
.Member_info textarea::placeholder {
  color: #b7b7b7;
}
.Member_info textarea {
  min-height: 180px;
}
.Member_info .address-select-wrap {
  display: flex;
  margin-bottom: 20px;
}
.Member_info .address-select-wrap .customSelect {
  position: relative;
  display: inline-block;
}
.Member_info .address-select-wrap .customSelect select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: 0 40px;
  line-height: 1.5;
  color: #000;
  cursor: pointer;
  background-color: transparent;
  border: 1px solid #b7b7b7;
  border-radius: 5px;
}
.Member_info .address-select-wrap .customSelect:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 20%;
  width: 6px;
  height: 6px;
  border-right: 2px solid #b7b7b7;
  border-bottom: 2px solid #b7b7b7;
  transform: translateY(-60%) rotate(45deg);
  transform-origin: center;
}
.Member_info .address-select-wrap .customSelect {
  display: block;
  width: 33.333%;
  margin-right: 20px;
  text-align: left;
}
.Member_info .address-select-wrap .customSelect select {
  width: 100%;
  height: 100%;
  padding: 0 20px;
  border-radius: 10px;
}
.Member_info .address-select-wrap input {
  width: 33.333%;
}
.Member_footer {
  display: flex;
  align-items: center;
  justify-content: center;
}
.Member_footer button {
  min-width: 10em;
  font-size: 18px;
}
@media (max-width: 960px) {
  .Member_footer button {
    width: 100%;
    font-size: 18px;
  }
}
.ReturnsAndRefunds {
  padding-bottom: 100px;
  font-size: 16px;
}
.ReturnsAndRefunds_pageTitle {
  margin-bottom: 10px;
  font-size: 24px;
}
.ReturnsAndRefunds_block ~ .ReturnsAndRefunds_block {
  margin-top: 40px;
}
.ReturnsAndRefunds_subTitle {
  margin-bottom: 20px;
  font-size: 20px;
  font-weight: 700;
  border-bottom: 1px solid #052d18;
}
.ReturnsAndRefunds_text ~ .ReturnsAndRefunds_text {
  margin-top: 20px;
}
.ReturnsAndRefunds_text ul {
  padding-left: 25px;
  line-height: 1.8;
  list-style-type: square;
}
.ReturnsAndRefunds_text-highlight {
  color: #b27c4e;
}
.PaymentInstructions {
  font-size: 16px;
}
.PaymentInstructions .container {
  padding-bottom: 100px;
}
.PaymentInstructions_pageTitle {
  margin-bottom: 10px;
  font-size: 24px;
}
.PaymentInstructions_block ~ .PaymentInstructions_block {
  margin-top: 40px;
}
@media (max-width: 1100px) {
  .PaymentInstructions_block ~ .PaymentInstructions_block {
    margin-top: 50px;
  }
}
.PaymentInstructions_subTitle {
  margin-bottom: 20px;
  font-size: 20px;
  font-weight: 700;
  border-bottom: 1px solid #052d18;
}
.PaymentInstructions_text ~ .PaymentInstructions_text {
  margin-top: 20px;
}
.OrderStatus {
  padding-bottom: 100px;
}
.OrderStatus_pageTitle {
  margin-top: 40px;
  margin-bottom: 40px;
  font-size: 24px;
}
.OrderStatus_item {
  padding: 0 35px 30px;
  background-color: #fff;
  transition: background-color 0.5s;
}
.OrderStatus_item.active {
  background-color: #f6f6f6;
}
.OrderStatus_item.active .OrderStatus_itemGoods {
  display: block;
}
.OrderStatus_item.active .OrderStatus_itemTriggerArrow {
  transform: rotate(45deg);
}
.OrderStatus_item ~ .OrderStatus_item {
  border-top: 1px solid #052d18;
}
@media (max-width: 960px) {
  .OrderStatus_item {
    padding: 0 10px 20px;
  }
}
.OrderStatus_itemStatus {
  display: flex;
  align-items: center;
}
.OrderStatus_itemStatus span {
  padding: 0 30px;
  color: #fff;
  background-color: rgba(1, 45, 25, 0.5);
}
.OrderStatus_itemStatus.unpaid span {
  background-color: #d3865a;
}

.OrderStatus_content {
  display: grid;
  /* grid-template-columns: 33% 33% 33%; */
  grid-template-columns: repeat(4,25%);
  gap: 5px 0;

  /* display: flex;
  flex-wrap: wrap;
  gap: 0.75em 3.5em; */

  margin-top: 25px;
  margin-right: 15%;
  margin-bottom: 15px;
}

@media screen and (min-width:1101px) and (max-width: 1400px){
  .OrderStatus_content {
    /* grid-template-columns: repeat(3,33%); */
    margin-right: 0;
  }

  .OrderStatus_content .OrderStatus_text_action{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }
} 


@media (max-width: 1100px) {
  .OrderStatus_content {
    margin-right: 0;
  }

}
@media (max-width: 960px) {
  .OrderStatus_content {
    /* display: block; */
    display: flex;
    flex-direction: column;
    margin-top: 20px;
  }

  .OrderStatus_content .OrderStatus_text_action{
    order: 1;
  }
}
.OrderStatus_text-highlight {
  color: #523628;
}
.OrderStatus_itemTrigger {
  text-align: right;
}
.OrderStatus_itemTrigger button {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  padding: 5px 20px;
  text-align: center;
  letter-spacing: 5px;
  background-color: #9caca3;
  border-radius: 5px;
}
.OrderStatus_itemTriggerArrow {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-top: 1px solid #052d18;
  border-left: 1px solid #052d18;
  transition: transform 0.2s;
  transform: rotate(-135deg) translateX(5px);
}
.OrderStatus_itemGoods {
  display: none;
  margin-top: 30px;
  padding: 30px 20px 0;
  background-color: #fff;
}
@media (max-width: 960px) {
  .OrderStatus_itemGoods {
    margin-top: 20px;
    padding: 0;
  }
}
.OrderStatus_itemGood,
.OrderStatus_itemGoodsHeader {
  display: flex;
  text-align: center;
}
.OrderStatus_itemGood > div:first-child,
.OrderStatus_itemGood > div:nth-child(2),
.OrderStatus_itemGoodsHeader > div:first-child,
.OrderStatus_itemGoodsHeader > div:nth-child(2) {
  width: 10%;
}
.OrderStatus_itemGood > div:nth-child(3),
.OrderStatus_itemGoodsHeader > div:nth-child(3) {
  width: 25%;
}
.OrderStatus_itemGood > div:nth-child(4),
.OrderStatus_itemGoodsHeader > div:nth-child(4) {
  width: 10%;
}
.OrderStatus_itemGood > div:nth-child(5),
.OrderStatus_itemGoodsHeader > div:nth-child(5) {
  width: 30%;
}

@media (min-width:961px){
  .OrderStatus_itemGoodsHeader,
  .OrderStatus_itemGood{
    display: grid;
    grid-template-columns: 100px 1fr repeat(3,250px);
    align-items: center;
  }

  .OrderStatus_itemGoodsHeader > div,
  .OrderStatus_itemGood > div{
    width: 100% !important;
    height: auto !important;
  }

  .OrderStatus_itemGoodsHeader > div:nth-child(2),
  .OrderStatus_itemGood > div:nth-child(2){
    text-align: left !important;
  }

  .OrderStatus_itemGoodsHeader > div:nth-child(2){
    padding-left: 0.25em;
  }

}

@media screen and (min-width:961px) and (max-width:1300px){
  .OrderStatus_itemGoodsHeader,
  .OrderStatus_itemGood{
    grid-template-columns: 100px 1fr repeat(3,8em);
  }
}

@media (max-width: 960px) {
  .OrderStatus_itemGood,
  .OrderStatus_itemGoodsHeader {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 10px;
  }
  .OrderStatus_itemGood > div,
  .OrderStatus_itemGoodsHeader > div {
    width: 100%;
    text-align: left;
  }
  .OrderStatus_itemGood > div:before,
  .OrderStatus_itemGoodsHeader > div:before {
    content: var(--text);
    display: inline-block;
    width: 50px;
  }
  .OrderStatus_itemGood > div:first-child,
  .OrderStatus_itemGoodsHeader > div:first-child {
    width: 100%;
    max-width: 300px;
  }
  .OrderStatus_itemGood > div:nth-child(2),
  .OrderStatus_itemGoodsHeader > div:nth-child(2) {
    --text: "品名：";
    width: 100%;
  }
  .OrderStatus_itemGood > div:nth-child(3),
  .OrderStatus_itemGoodsHeader > div:nth-child(3) {
    width: 100%;
    --text: "數量：";
  }
  .OrderStatus_itemGood > div:nth-child(4),
  .OrderStatus_itemGoodsHeader > div:nth-child(4) {
    width: 100%;
    --text: "單價：";
  }
  .OrderStatus_itemGood > div:nth-child(5),
  .OrderStatus_itemGoodsHeader > div:nth-child(5) {
    width: 100%;
    --text: "小計：";
  }
}
@media (max-width: 960px) {
  .OrderStatus_itemGoodsHeader {
    display: none;
  }
}
.OrderStatus_itemGood ~ .OrderStatus_itemGood {
  border-top: 1px solid #052d18;
}
.OrderStatus_itemGood {
  align-items: center;
  min-height: 100px;
  color: #523628;
  text-align: center;
}
.OrderStatus_itemGood > div {
  height: 100%;
}
.OrderStatus_itemGood img {
  width: 100%;
}
.Store {
  padding-bottom: 100px;
  font-size: 16px;
}
.Store_block {
  padding-bottom: 50px;
}
.Store_block:last-child .Store_content {
  border-bottom: 0;
}
@media (max-width: 1024px) {
  .Store_block {
    max-width: 600px;
    margin: 0 auto;
    padding-bottom: 30px;
  }
}
.Store_imgs {
  display: grid;
  grid-template-areas: "a b" "a c";
  grid-template-columns: 6fr 2fr;
  gap: 20px;
}
.Store_imgs > div {
  background-image: var(--bg);
  background-position: 50%;
  background-size: cover;
}
.Store_imgs img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.Store_imgs > div:first-child {
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  -ms-grid-column: 1;
  grid-area: a;
}
.Store_content > .Store_imgs > div:first-child {
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
}
.Store_imgs > div:first-child img {
  width: 100%;
}
.Store_imgs > div:nth-child(2) {
  grid-area: b;
}
.Store_content > .Store_imgs > div:nth-child(2),
.Store_imgs > div:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.Store_imgs > div:nth-child(3) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
  grid-area: c;
  background-image: var(--bg);
}
.Store_content > .Store_imgs > div:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}
@media (max-width: 1024px) {
  .Store_imgs {
    grid-template-areas: "a a" "b c";
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .Store_imgs > div:first-child {
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
  .Store_imgs > div:nth-child(2) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .Store_imgs > div:nth-child(3) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
}
.Store_content {
  display: grid;
  grid-template-areas: "a b c f" "a d e f";
  grid-template-columns: 3fr 4fr 5fr 2fr;
  gap: 20px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 50px 0;
  border-bottom: 1px solid #052d18;
}
.Store_content > div {
  display: flex;
  gap: 10px;
  align-items: center;
  font-family: "Noto Serif TC", serif, Roboto, Arial, Microsoft JhengHei Modify,
    Microsoft JhengHei, PingFangTC, sans-serif;
}
@media (max-width: 1024px) {
  .Store_content {
    grid-template-areas: "a f" "b b" "c c" "d d" "e e";
    grid-template-columns: 5fr 1fr;
    gap: 5px;
    padding: 10px;
  }
  .Store_content > .Store_imgs > div:first-child {
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
  }
  .Store_content > .Store_imgs > div:nth-child(2) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
  .Store_content > .Store_imgs > div:nth-child(3) {
    -ms-grid-row: 5;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
}
.Store_contentCompany {
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  -ms-grid-column: 1;
  grid-area: a;
  justify-content: center;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 5px;
  border-right: 3px solid #8b9c97;
}
.Store_content > .Store_contentCompany {
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
}
@media (max-width: 1024px) {
  .Store_contentCompany {
    justify-content: flex-start;
    letter-spacing: 0;
    border-right: 0;
  }
}
.Store_contentPhone {
  grid-area: b;
}
.Store_content > .Store_contentPhone,
.Store_contentPhone {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.Store_contentMail {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
  grid-area: c;
}
.Store_content > .Store_contentMail {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}
.Store_contentTime {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
  grid-area: d;
}
.Store_contentLocation {
  -ms-grid-row: 3;
  -ms-grid-column: 5;
  grid-area: e;
}
.Store_contentLink {
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  -ms-grid-column: 7;
  grid-area: f;
  justify-content: center;
}
@media (max-width: 1024px) {
  .Store_contentCompany {
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
  .Store_content > .Store_contentCompany {
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
  }
  .Store_contentPhone {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .Store_content > .Store_contentPhone {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
  .Store_contentMail {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
  .Store_content > .Store_contentMail {
    -ms-grid-row: 5;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
  .Store_contentTime {
    -ms-grid-row: 7;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
  .Store_contentLocation {
    -ms-grid-row: 9;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
  .Store_contentLink {
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    -ms-grid-column: 3;
  }
}
.Store_contentLink a {
  display: block;
  width: 100%;
  max-width: 60px;
  height: 15px;
  border-right: 2px solid #c49178;
  border-bottom: 2px solid #c49178;
  transform: skewX(40deg);
}
.Store_PageControl {
  max-width: 1100px;
}
@media (max-width: 1100px) {
  .Store_PageControl {
    margin-bottom: 100px;
  }
}
@media (max-width: 1024px) {
  .Store_PageControl {
    max-width: 600px;
    margin-bottom: 50px;
  }
}
.StoreContent {
  padding-bottom: 100px;
  font-size: 16px;
}
.StoreContent_block {
  padding-bottom: 50px;
}
@media (max-width: 1100px) {
  .StoreContent_block {
    max-width: 600px;
    margin: 0 auto;
    padding-bottom: 20px;
  }
}
.StoreContent_imgs {
  display: grid;
  grid-template-areas: "a b" "a c";
  grid-template-columns: 6fr 2fr;
  gap: 20px;
}
.StoreContent_imgs > div {
  background-image: var(--bg);
  background-position: 50%;
  background-size: cover;
}
.StoreContent_imgs img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.StoreContent_imgs > div:first-child {
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  -ms-grid-column: 1;
  grid-area: a;
}
.StoreContent_content > .StoreContent_imgs > div:first-child {
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
}
.StoreContent_imgs > div:first-child img {
  width: 100%;
}
.StoreContent_imgs > div:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
  grid-area: b;
}
.StoreContent_content > .StoreContent_imgs > div:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.StoreContent_imgs > div:nth-child(3) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
  grid-area: c;
  background-image: var(--bg);
}
.StoreContent_content > .StoreContent_imgs > div:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}
@media (max-width: 1100px) {
  .StoreContent_imgs {
    grid-template-areas: "a a" "b c";
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .StoreContent_imgs > div:first-child {
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
  .StoreContent_imgs > div:nth-child(2) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .StoreContent_imgs > div:nth-child(3) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
}
.StoreContent_payWay {
  display: flex;
  gap: 20px;
  justify-content: flex-end;
  max-width: 1100px;
  margin: 0 auto;
  margin-top: 50px;
  font-weight: 700;
  color: #fff;
  text-align: center;
}
.StoreContent_payWay li {
  min-width: 120px;
  padding: 8px 10px;
  line-height: 18px;
  background-color: #d38659;
  border-radius: 10px;
}
@media (max-width: 1100px) {
  .StoreContent_payWay {
    gap: 10px;
    margin-top: 20px;
  }
  .StoreContent_payWay li {
    min-width: auto;
    padding: 5px 10px;
    font-size: 16px;
  }
}
.StoreContent_content {
  display: grid;
  grid-template-areas: "a b c f" "a d e f";
  grid-template-columns: 3fr 4fr 5fr 2fr;
  gap: 20px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 50px 0;
}
.StoreContent_content > div {
  display: flex;
  gap: 10px;
  align-items: center;
  font-family: "Noto Serif TC", serif, Roboto, Arial, Microsoft JhengHei Modify,
    Microsoft JhengHei, PingFangTC, sans-serif;
}
@media (max-width: 1100px) {
  .StoreContent_content {
    grid-template-areas: "a f" "b b" "c c" "d d" "e e";
    grid-template-columns: 5fr 1fr;
    gap: 5px;
    padding: 10px;
  }
  .StoreContent_content > .StoreContent_imgs > div:first-child {
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
  }
  .StoreContent_content > .StoreContent_imgs > div:nth-child(2) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
  .StoreContent_content > .StoreContent_imgs > div:nth-child(3) {
    -ms-grid-row: 5;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
}
.StoreContent_contentCompany {
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  -ms-grid-column: 1;
  grid-area: a;
  justify-content: center;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 5px;
  border-right: 3px solid #8b9c97;
}
.StoreContent_content > .StoreContent_contentCompany {
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
}
@media (max-width: 1100px) {
  .StoreContent_contentCompany {
    justify-content: flex-start;
    letter-spacing: 0;
    border-right: 0;
  }
}
.StoreContent_contentPhone {
  grid-area: b;
}
.StoreContent_content > .StoreContent_contentPhone,
.StoreContent_contentPhone {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.StoreContent_contentMail {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
  grid-area: c;
}
.StoreContent_content > .StoreContent_contentMail {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}
.StoreContent_contentTime {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
  grid-area: d;
}
.StoreContent_contentLocation {
  -ms-grid-row: 3;
  -ms-grid-column: 5;
  grid-area: e;
}
@media (max-width: 1100px) {
  .StoreContent_contentCompany {
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
  .StoreContent_content > .StoreContent_contentCompany {
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
  }
  .StoreContent_contentPhone {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .StoreContent_content > .StoreContent_contentPhone {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
  .StoreContent_contentMail {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
  .StoreContent_content > .StoreContent_contentMail {
    -ms-grid-row: 5;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
  .StoreContent_contentTime {
    -ms-grid-row: 7;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
  .StoreContent_contentLocation {
    -ms-grid-row: 9;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
}
.StoreContent_mainLinks {
  display: flex;
  gap: 40px;
  max-width: 1100px;
  margin: 0 auto;
}
.StoreContent_mainLinks a {
  display: flex;
  flex-grow: 1;
  gap: 20px;
  align-items: center;
  justify-content: center;
  padding: 10px 20px;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  background-color: #052d18;
  transition: all 0.3s;
}
.StoreContent_mainLinks a:hover {
  transform: scale(1.05);
}
.StoreContent_mainLinks .StoreContent_mainLinkArrow {
  display: block;
  width: 50px;
  height: 15px;
  margin-top: -10px;
  border-right: 2px solid #d38659;
  border-bottom: 2px solid #d38659;
  transform: skewX(30deg);
}
@media (max-width: 1100px) {
  .StoreContent_mainLinks {
    gap: 10px;
    margin-top: 20px;
  }
  .StoreContent_mainLinks a {
    gap: 10px;
    padding: 10px 5px;
  }
  .StoreContent_mainLinks .StoreContent_mainLinkArrow {
    width: 30px;
    height: 10px;
    margin-top: -5px;
  }
}
.StoreContent_note {
  max-width: 1100px;
  margin: 0 auto 100px;
  margin-top: 100px;
  font-weight: 600;
}
.StoreContent_note h3 {
  margin-bottom: 10px;
  font-size: 20px;
}
@media (max-width: 1100px) {
  .StoreContent_note {
    margin-top: 40px;
    margin-bottom: 40px;
  }
}
.StoreContent_map iframe {
  width: 100%;
  height: 550px;
}
@media (max-width: 1100px) {
  .StoreContent_map iframe {
    height: 300px;
  }
}
.StoreContent_backHandler {
  display: flex;
  justify-content: flex-end;
  margin-top: 50px;
  font-weight: 700;
}
.StoreContent_backHandler .link {
  display: flex;
  gap: 20px;
  align-items: center;
  padding: 5px 40px;
  background-color: #9caca2;
  border-radius: 5px;
  transition: transform 0.3s;
}
.StoreContent_backHandler .link:hover {
  transform: scale(1.05);
}
.StoreContent_backHandler .arrow {
  display: block;
  width: 8px;
  height: 8px;
  border-top: 1px solid #052d18;
  border-left: 1px solid #052d18;
  transform: rotate(-45deg);
}
.About {
  padding-bottom: 100px;
}
.About_info {
  position: relative;
  justify-content: flex-start;
  margin: 160px 0;
}
@media (max-width: 1100px) {
  .About_info {
    margin: 0;
  }
}
.About_info .container {
  display: flex;
  flex-wrap: wrap;
}
.About_infoText {
  width: 44%;
  padding-top: 80px;
  padding-right: 80px;
}
.About_infoText .title {
  display: flex;
  flex-shrink: 0;
  flex-wrap: wrap;
  align-content: flex-start;
  margin-bottom: 20px;
}
.About_infoText h1 {
  font-size: 40px;
}
.About_infoText .establish {
  margin-left: 10px;
  padding-top: 20px;
  font-size: 24px;
}
.About_infoText .note {
  font-size: 24px;
}
.About_infoText .text {
  color: #523628;
}
@media (max-width: 1100px) {
  .About_infoText {
    padding: 0 20px 0 0;
  }
  .About_infoText .title {
    flex-direction: column;
    margin-bottom: 20px;
  }
  .About_infoText h1 {
    font-size: 30px;
  }
  .About_infoText .establish {
    margin-left: 0;
    padding-top: 0;
    font-size: 18px;
  }
  .About_infoText .note {
    font-size: 16px;
  }
}
@media (max-width: 960px) {
  .About_infoText {
    width: 100%;
    padding: 20px 0;
  }
}
.About_infoImg {
  position: absolute;
  top: 50%;
  right: 0;
  width: 56%;
  transform: translateY(-50%);
}
.About_infoImg img {
  width: 100%;
}
@media (max-width: 1100px) {
  .About_infoImg {
    position: static;
    transform: none;
  }
}
@media (max-width: 960px) {
  .About_infoImg {
    width: 100%;
  }
}
.About_mission {
  padding: 150px 0;
}
@media (max-width: 1100px) {
  .About_mission {
    padding: 100px 0;
  }
}
@media (max-width: 960px) {
  .About_mission {
    padding: 60px 0;
  }
}
.About_mission .container {
  display: flex;
}
@media (max-width: 960px) {
  .About_mission .container {
    flex-wrap: wrap;
  }
}
.About_mission h2 {
  flex-shrink: 0;
  width: 400px;
  padding-right: 20px;
  font-size: 40px;
}
@media (max-width: 1100px) {
  .About_mission h2 {
    width: auto;
    font-size: 30px;
  }
}
@media (max-width: 960px) {
  .About_mission h2 {
    width: 100%;
    padding: 0;
  }
}
.About_mission p {
  color: #523628;
}
@media (max-width: 960px) {
  .About_mission p {
    margin-top: 20px;
  }
}
.About_image {
  display: flex;
  gap: 50px;
  padding: 0 60px;
}
@media (max-width: 1100px) {
  .About_image {
    gap: 20px;
  }

  /* for 檢驗 第二塊 */
  .About_image_style_block02{
    margin-top: -7em;
  }
  .About_image_style_block02{
    flex-direction: column;
  }

  .About_image_style_block02 .About_mission_style_02{
    display: none;
  }

  .About_image_style_block02 .About_mission{
    padding-top: 1em;
    padding-bottom: 1em;
  }

  .About_image_style_block02 .wow:nth-child(2) .image{
    margin-bottom: 2em;
  }

}
@media (max-width: 960px) {
  .About_image {
    padding: 0 20px;
  }
}
.About_slogan {
  display: flex;
  justify-content: center;
  padding: 200px 60px;
}
@media (max-width: 1100px) {
  .About_slogan {
    padding: 100px 40px;
  }
}
.About_slogan > div {
  width: 600px;
  max-width: 50%;
}
@media (max-width: 960px) {
  .About_slogan > div {
    max-width: 100%;
  }
}
.About_registerGift {
  background-image: url(../img/about/about_banner.png);
  background-position: 50%;
  background-size: cover;
}
.About_registerGift .container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 200px 60px;
}
@media (max-width: 1100px) {
  .About_registerGift .container {
    min-height: 500px;
    padding: 100px 60px;
  }
}
.About_registerGift h2 {
  position: relative;
  display: inline;
  font-size: 40px;
}
.About_registerGift h2:after {
  content: "";
  position: absolute;
  top: calc(50% - 2px);
  left: calc(100% + 30px);
  width: 200px;
  height: 4px;
  background-color: #0e2a1e;
}
.About_registerGift .note {
  display: flex;
  gap: 10px;
  align-items: center;
  font-size: 18px;
  font-weight: 700;
}
.About_registerGift .note .highlight {
  font-size: 40px;
}
.About_registerGift .link {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  margin-top: 20px;
  padding: 5px 90px;
  font-size: 18px;
  font-weight: 700;
  background-color: #d3875a;
  border-radius: 15px;
  transition: transform 0.3s;
}
.About_registerGift .link:hover {
  transform: scale(1.05);
}
.About_registerGift .link .highlight {
  font-size: 28px;
}
.About_registerGift .link .arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  background-color: #fff;
  border-radius: 50%;
}
.About_registerGift .link .arrow > span {
  display: block;
  width: 8px;
  height: 8px;
  margin-left: -5px;
  border-top: 2px solid #052d18;
  border-right: 2px solid #052d18;
  transform: rotate(45deg);
}
@media (max-width: 1100px) {
  .About_registerGift {
    background-position: 35%;
  }
  .About_registerGift h2 {
    font-size: 30px;
  }
  .About_registerGift h2:after {
    left: calc(100% + 20px);
    width: 140px;
    height: 3px;
  }
  .About_registerGift .note {
    flex-wrap: wrap;
    gap: 10px;
  }
  .About_registerGift .link {
    gap: 15px;
    margin-top: 0;
    padding: 5px 30px 0;
  }
  .About_registerGift .link .arrow {
    width: 30px;
    height: 30px;
  }
}
.About_lineGift {
  font-size: 20px;
  font-weight: 700;
  color: #fff4e5;
  background-color: #9caca3;
}
.About_lineGift .container {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  align-items: center;
  justify-content: center;
  padding: 10px 60px;
}
.About_lineGift h2 {
  font-size: 40px;
  color: #fff;
}
.About_lineGift .highlight {
  font-size: 40px;
}
@media (max-width: 1100px) {
  .About_lineGift {
    font-size: 18px;
  }
  .About_lineGift .container {
    gap: 20px;
    padding: 10px 20px;
  }
  .About_lineGift .highlight,
  .About_lineGift h2 {
    font-size: 30px;
  }
}
@media (max-width: 960px) {
  .About_lineGift h2 {
    width: 100%;
    text-align: center;
  }
  .About_lineGift .container {
    gap: 5px;
    line-height: 1.6em;
  }
}
.About_good {
  display: flex;
  color: #523628;
}
.About_goodItem {
  flex-shrink: 0;
  width: 50%;
}
.About_good .note {
  padding: 20px 20px 40px 100px;
}
.About_good .title {
  font-size: 20px;
  font-weight: 700;
  color: #052d18;
}
.About_good .price {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.About_good .originPrice {
  margin-right: 40px;
  text-decoration: line-through;
}
.About_good .benefit {
  font-size: 18px;
  font-weight: 700;
}
@media (max-width: 1100px) {
  .About_good {
    flex-wrap: wrap;
  }
  .About_good .note {
    padding: 20px;
  }
}
@media (max-width: 480px) {
  .About_goodItem {
    width: 100%;
  }
}
.About_links {
  display: flex;
  gap: 10px;
  color: #fff;
}
.About_links a {
  display: flex;
  gap: 20px;
  align-items: center;
  justify-content: center;
  width: 50%;
  padding: 20px;
  font-size: 20px;
  font-weight: 700;
  background-color: #052d18;
}
.About_links a:hover .arrow {
  left: 20px;
}
.About_links .arrow {
  position: relative;
  top: -5px;
  left: 0;
  display: block;
  width: 50px;
  height: 12px;
  border-right: 2px solid #d3875a;
  border-bottom: 2px solid #d3875a;
  transition: left 0.3s;
  transform: skew(40deg);
}
@media (max-width: 960px) {
  .About_links {
    flex-direction: column;
    gap: 20px;
  }
  .About_links a {
    width: 100%;
    padding: 10px 20px;
  }
}
.Seaweed {
  padding-bottom: 100px;
  font-size: 16px;
}
.Seaweed_list {
  margin-bottom: 40px;
}
.Seaweed_item ~ .Seaweed_item {
  border-top: 1px solid #052d18;
}
.Seaweed_item:hover .Seaweed_picArrow {
  opacity: 1;
}
.Seaweed_item:hover .Seaweed_arrow {
  opacity: 0;
}
.Seaweed_link {
  display: flex;
  gap: 50px;
  align-items: center;
  padding: 20px 30px;
}
@media (max-width: 1100px) {
  .Seaweed_link {
    gap: 20px;
    padding: 30px 20px;
  }
}
@media (max-width: 960px) {
  .Seaweed_link {
    flex-direction: column;
    gap: 10px;
    padding: 20px 0;
  }
}
.Seaweed_time {
  flex-shrink: 0;
  width: 100px;
  font-weight: 500;
}
@media (max-width: 960px) {
  .Seaweed_time {
    width: 100%;
  }
}
.Seaweed_pic {
  position: relative;
  flex-shrink: 0;
  width: 380px;
}
.Seaweed_pic img {
  width: 100%;
}
@media (max-width: 1100px) {
  .Seaweed_pic {
    width: 250px;
  }
}
@media (max-width: 960px) {
  .Seaweed_pic {
    width: 100%;
  }
}
.Seaweed_picArrow {
  position: absolute;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  background-color: #dd855f;
  border-radius: 50%;
  opacity: 0;
  transition: opacity 0.3s;
  transform: translate(40%, 40%);
}
.Seaweed_picArrow span {
  position: relative;
  display: block;
  width: 60%;
  height: 20%;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: skew(45deg) translate(-8%, -30%);
}
@media (max-width: 1100px) {
  .Seaweed_picArrow {
    width: 30px;
    height: 30px;
  }
}
.Seaweed_content {
  position: relative;
  display: flex;
  flex-direction: column;
  align-self: stretch;
  justify-content: center;
}
.Seaweed_content h2 {
  margin-bottom: 10px;
  font-size: 20px;
  -webkit-line-clamp: 1;
}
.Seaweed_content h2,
.Seaweed_content p {
  display: -webkit-box;
  overflow: hidden;
  white-space: pre-line;
  -webkit-box-orient: vertical;
}
.Seaweed_content p {
  -webkit-line-clamp: 2;
}
@media (max-width: 960px) {
  .Seaweed_content {
    padding-bottom: 20px;
  }
  .Seaweed_content h2 {
    margin-bottom: 0;
    -webkit-line-clamp: 2;
  }
  .Seaweed_content p {
    -webkit-line-clamp: 3;
  }
}
.Seaweed_arrow {
  position: absolute;
  right: 0;
  bottom: 0;
  display: block;
  width: 60px;
  height: 15px;
  border-right: 2px solid #dd855f;
  border-bottom: 2px solid #dd855f;
  transition: opacity 0.3s;
  transform: skew(45deg);
  animation: ani-arrow 2s infinite;
}
@media (max-width: 1100px) {
  .Seaweed_arrow {
    width: 40px;
    height: 10px;
  }
}
.SeaweedContent {
  padding-bottom: 100px;
  font-size: 16px;
}
.SeaweedContent .SeaweedContent_content {
  display: flex;
  flex-wrap: wrap;
  padding: 100px 0 200px;
}
@media (max-width: 960px) {
  .SeaweedContent .SeaweedContent_content {
    padding: 0 0 100px;
  }
}
.SeaweedContent .SeaweedContent_img {
  width: 45%;
}
.SeaweedContent .SeaweedContent_img img {
  width: 100%;
}
@media (max-width: 960px) {
  .SeaweedContent .SeaweedContent_img {
    width: 100%;
  }
}
.SeaweedContent .SeaweedContent_main {
  width: 55%;
}
.SeaweedContent .SeaweedContent_main img {
  width: 100%;
}
@media (max-width: 960px) {
  .SeaweedContent .SeaweedContent_main {
    width: 100%;
    padding-top: 40px;
  }
}
.SeaweedContent .container {
  padding: 0 200px 0 40px;
}
@media (max-width: 1100px) {
  .SeaweedContent .container {
    padding: 0 100px 0 40px;
  }
}
@media (max-width: 960px) {
  .SeaweedContent .container {
    padding: 0 20px;
  }
}
.SeaweedContent .SeaweedContent_title {
  font-size: 24px;
}
.SeaweedContent .SeaweedContent_tool {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-top: 60px;
}
.SeaweedContent .SeaweedContent_like {
  display: flex;
  gap: 5px;
  align-items: center;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  color: #f68a58;
}
.SeaweedContent .SeaweedContent_like:hover img {
  transform: scale(1.3);
}
.SeaweedContent .SeaweedContent_like img {
  display: block;
  width: 15px;
  transition: transform 0.3s;
}
.SeaweedContent .SeaweedContent_prePage {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  margin-top: 40px;
  padding: 5px 40px;
  font-weight: 700;
  background-color: #9baba1;
  border-radius: 5px;
  transition: transform 0.3s;
}
.SeaweedContent .SeaweedContent_prePage:hover {
  transform: scale(1.1);
}
.SeaweedContent .SeaweedContent_prePage .arrow {
  position: relative;
  top: -2px;
  display: block;
  width: 10px;
  height: 10px;
  border-bottom: 1px solid #052d18;
  border-left: 1px solid #052d18;
  transform: rotate(45deg);
}
.SeaweedContent .SeaweedContent_recommend {
  display: flex;
  flex-wrap: wrap;
  border-top: 1px solid #052d18;
}
.SeaweedContent .SeaweedContent_recommendTitle {
  flex-shrink: 0;
  width: 25%;
  padding: 40px 5% 40px 20px;
  font-size: 22px;
  font-weight: 700;
  text-align: right;
}
@media (max-width: 1100px) {
  .SeaweedContent .SeaweedContent_recommendTitle {
    width: 100%;
    padding: 20px 40px;
    text-align: left;
  }
}
@media (max-width: 960px) {
  .SeaweedContent .SeaweedContent_recommendTitle {
    max-width: 540px;
    margin: 0 auto;
    padding: 20px 20px;
  }
}
.SeaweedContent .SeaweedContent_recommendList {
  flex-grow: 1;
  width: 75%;
}
@media (max-width: 960px) {
  .SeaweedContent .SeaweedContent_recommendList {
    width: 100%;
  }
}
.SeaweedContent .SeaweedContent_recommendItem {
  --color: #052d18;
  --color2: #dd855f;
  display: flex;
  padding: 20px 40px 20px 0;
  color: var(--color);
  transition: background-color 0.3s;
}
.SeaweedContent .SeaweedContent_recommendItem ~ .SeaweedContent_recommendItem {
  border-top: 1px solid #052d18;
}
.SeaweedContent .SeaweedContent_recommendItem:hover {
  --color: #fff;
  --color2: #fff;
  background-color: #052d18;
}
@media (max-width: 1100px) {
  .SeaweedContent .SeaweedContent_recommendItem {
    padding: 20px 40px;
  }
}
@media (max-width: 960px) {
  .SeaweedContent .SeaweedContent_recommendItem {
    flex-direction: column;
    flex-wrap: wrap;
    padding: 20px;
  }
}
.SeaweedContent .SeaweedContent_recommendTime {
  flex-shrink: 0;
  width: 100px;
  padding: 20px;
}
@media (max-width: 1100px) {
  .SeaweedContent .SeaweedContent_recommendTime {
    padding: 0;
  }
}
@media (max-width: 960px) {
  .SeaweedContent .SeaweedContent_recommendTime {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    padding: 0;
  }
}
.SeaweedContent .SeaweedContent_recommendContent {
  flex-grow: 1;
  padding: 20px 40px;
}
@media (max-width: 1100px) {
  .SeaweedContent .SeaweedContent_recommendContent {
    padding: 0 20px;
  }
}
@media (max-width: 960px) {
  .SeaweedContent .SeaweedContent_recommendContent {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    padding: 0 0;
  }
}
.SeaweedContent .SeaweedContent_recommendSubTitle {
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: 700;
}
@media (max-width: 960px) {
  .SeaweedContent .SeaweedContent_recommendSubTitle {
    margin-bottom: 0;
  }
}
.SeaweedContent .SeaweedContent_recommendText {
  display: -webkit-box;
  overflow: hidden;
  white-space: pre-line;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.SeaweedContent .SeaweedContent_recommendImg {
  flex-shrink: 0;
  width: 300px;
}
.SeaweedContent .SeaweedContent_recommendImg img {
  width: 100%;
}
@media (max-width: 960px) {
  .SeaweedContent .SeaweedContent_recommendImg {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    margin-top: 20px;
  }
}
.SeaweedContent .SeaweedContent_recommendArrow {
  position: relative;
  flex-shrink: 0;
  align-self: flex-end;
  width: 60px;
  height: 10px;
  margin-right: 150px;
  margin-bottom: 30px;
  margin-left: 30px;
  border-right: 2px solid var(--color2);
  border-bottom: 2px solid var(--color2);
  transition: all 0.3s;
  transform: skew(45deg);
  animation: ani-arrow 2s infinite;
}
@media (max-width: 1100px) {
  .SeaweedContent .SeaweedContent_recommendArrow {
    margin-right: 0;
  }
}
@media (max-width: 960px) {
  .SeaweedContent .SeaweedContent_recommendArrow {
    margin: 20px 0 10px;
  }
}
.NewsContent {
  font-size: 16px;
}
.NewsContent .NewsContent_content {
  display: flex;
  flex-wrap: wrap;
  padding: 100px 0;
}
@media (max-width: 960px) {
  .NewsContent .NewsContent_content {
    padding: 0 0 100px;
  }
}
.NewsContent .NewsContent_video {
  width: 45%;
}
.NewsContent .NewsContent_video > div {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
}
.NewsContent .NewsContent_video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.NewsContent .NewsContent_video > div img{
  position: absolute;
  top: 0;
  left: 0;
  margin: auto;
  max-height: 100%;
  right: 0;
  bottom: 0;
}

@media (max-width: 960px) {
  .NewsContent .NewsContent_video {
    width: 100%;
    margin-top: 9dvw;
    margin-bottom: -1em;
  }
}
.NewsContent .NewsContent_main {
  width: 55%;
}
.NewsContent .NewsContent_main img {
  width: 100%;
}
@media (max-width: 960px) {
  .NewsContent .NewsContent_main {
    width: 100%;
    padding-top: 40px;
  }
}
.NewsContent .container {
  padding: 0 200px 0 40px;
}
@media (max-width: 1100px) {
  .NewsContent .container {
    padding: 0 100px 0 40px;
  }
}
@media (max-width: 960px) {
  .NewsContent .container {
    padding: 0 20px;
  }
}
.NewsContent .NewsContent_title {
  font-size: 24px;
}
.NewsContent .NewsContent_tool {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-top: 60px;
}
.NewsContent .NewsContent_like {
  display: flex;
  gap: 5px;
  align-items: center;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  color: #f68a58;
}
.NewsContent .NewsContent_like:hover img {
  transform: scale(1.3);
}
.NewsContent .NewsContent_like img {
  display: block;
  width: 15px;
  transition: transform 0.3s;
}
.NewsContent .NewsContent_prePage {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  margin-top: 40px;
  padding: 5px 40px;
  font-weight: 700;
  background-color: #9baba1;
  border-radius: 5px;
  transition: transform 0.3s;
}
.NewsContent .NewsContent_prePage:hover {
  transform: scale(1.1);
}
.NewsContent .NewsContent_prePage .arrow {
  position: relative;
  top: -2px;
  display: block;
  width: 10px;
  height: 10px;
  border-bottom: 1px solid #052d18;
  border-left: 1px solid #052d18;
  transform: rotate(45deg);
}
.NewsContent .NewsContent_recommend {
  display: flex;
  flex-wrap: wrap;
  border-top: 1px solid #052d18;
}
.NewsContent .NewsContent_recommendTitle {
  flex-shrink: 0;
  width: 25%;
  padding: 40px 5% 40px 20px;
  font-size: 22px;
  font-weight: 700;
  text-align: right;
}
@media (max-width: 1100px) {
  .NewsContent .NewsContent_recommendTitle {
    width: 100%;
    padding: 20px 40px;
    text-align: left;
  }
}
@media (max-width: 960px) {
  .NewsContent .NewsContent_recommendTitle {
    max-width: 540px;
    margin: 0 auto;
    padding: 20px 20px;
  }
}
.NewsContent .NewsContent_recommendList {
  flex-grow: 1;
  width: 75%;
}
@media (max-width: 960px) {
  .NewsContent .NewsContent_recommendList {
    width: 100%;
  }
}
.NewsContent .NewsContent_recommendItem {
  --color: #052d18;
  --color2: #dd855f;
  display: flex;
  padding: 20px 40px 20px 0;
  color: var(--color);
  transition: background-color 0.3s;
}
.NewsContent .NewsContent_recommendItem ~ .NewsContent_recommendItem {
  border-top: 1px solid #052d18;
}
.NewsContent .NewsContent_recommendItem:hover {
  --color: #fff;
  --color2: #fff;
  background-color: #052d18;
}
@media (max-width: 1100px) {
  .NewsContent .NewsContent_recommendItem {
    padding: 20px 40px;
  }
}
@media (max-width: 960px) {
  .NewsContent .NewsContent_recommendItem {
    flex-direction: column;
    flex-wrap: wrap;
    padding: 20px;
  }
}
.NewsContent .NewsContent_recommendTime {
  flex-shrink: 0;
  width: 100px;
  padding: 20px;
}
@media (max-width: 1100px) {
  .NewsContent .NewsContent_recommendTime {
    padding: 0;
  }
}
@media (max-width: 960px) {
  .NewsContent .NewsContent_recommendTime {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    padding: 0;
  }
}
.NewsContent .NewsContent_recommendContent {
  flex-grow: 1;
  padding: 20px 40px;
}
@media (max-width: 1100px) {
  .NewsContent .NewsContent_recommendContent {
    padding: 0 20px;
  }
}
@media (max-width: 960px) {
  .NewsContent .NewsContent_recommendContent {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    padding: 0 0;
  }
}
.NewsContent .NewsContent_recommendSubTitle {
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: 700;
}
@media (max-width: 960px) {
  .NewsContent .NewsContent_recommendSubTitle {
    margin-bottom: 0;
  }
}
.NewsContent .NewsContent_recommendText {
  display: -webkit-box;
  overflow: hidden;
  white-space: pre-line;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.NewsContent .NewsContent_recommendImg {
  flex-shrink: 0;
  width: 300px;
}
.NewsContent .NewsContent_recommendImg img {
  width: 100%;
}
@media (max-width: 960px) {
  .NewsContent .NewsContent_recommendImg {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    margin-top: 20px;
  }
}
.NewsContent .NewsContent_recommendArrow {
  position: relative;
  flex-shrink: 0;
  align-self: flex-end;
  width: 60px;
  height: 10px;
  margin-right: 150px;
  margin-bottom: 30px;
  margin-left: 30px;
  border-right: 2px solid var(--color2);
  border-bottom: 2px solid var(--color2);
  transition: all 0.3s;
  transform: skew(45deg);
  animation: ani-arrow 2s infinite;
}
@media (max-width: 1100px) {
  .NewsContent .NewsContent_recommendArrow {
    margin-right: 0;
  }
}
@media (max-width: 960px) {
  .NewsContent .NewsContent_recommendArrow {
    margin: 20px 0 10px;
  }
}
.Contact {
  overflow: inherit;
}
.Contact_info {
  padding-top: 80px;
}
.Contact_info .container {
  position: relative;
  display: flex;
}
.Contact_info .Contact_title {
  position: sticky;
  top: 120px;
  flex-shrink: 0;
  align-self: flex-start;
  width: 550px;
  padding: 20px 20px;
  font-size: 24px;
  font-weight: 500;
}
.Contact_info .Contact_title span {
  display: block;
  font-size: 16px;
  color: #d3865a;
}
.Contact_info .Contact_note {
  padding: 20px;
  border-bottom: 1px solid #083620;
}
.Contact_info .Contact_content {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 20px;
}
.Contact_info .Contact_contentCompany {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.Contact_info .Contact_contentTitle {
  font-size: 20px;
}
.Contact_info .Contact_communityLinks {
  display: flex;
  gap: 10px;
}
.Contact_info .Contact_contentLocation,
.Contact_info .Contact_contentMail,
.Contact_info .Contact_contentPhone,
.Contact_info .Contact_contentTime {
  display: flex;
  gap: 10px;
  align-items: center;
}
.Contact_info .Contact_contentLocation img,
.Contact_info .Contact_contentMail img,
.Contact_info .Contact_contentPhone img,
.Contact_info .Contact_contentTime img {
  width: 20px;
}
.Contact_info .Contact_map {
  width: 100%;
  height: 300px;
  margin-top: 20px;
}
@media (max-width: 1024px) {
  .Contact_info .container {
    flex-direction: column;
  }
  .Contact_info .Contact_title {
    position: static;
    width: auto;
    padding: 0 0;
    font-size: 24px;
  }
  .Contact_info .Contact_note {
    padding: 20px 0;
    font-size: 16px;
  }
  .Contact_info .Contact_content {
    gap: 10px;
    padding: 20px 0;
  }
  .Contact_info .Contact_communityLinks a {
    width: 35px;
  }
}
.Contact_form {
  background-image: url(../img/contact/contact_messageBg.jpg);
}
.Contact_form .container {
  position: relative;
  display: flex;
}
.Contact_form .Contact_title {
  position: sticky;
  top: 120px;
  flex-shrink: 0;
  align-self: flex-start;
  width: 550px;
  padding: 20px;
  font-size: 30px;
  font-weight: 500;
  color: #d3865a;
}
.Contact_form .Contact_formContent {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  gap: 20px;
  padding: 20px 30px 20px 40px;
}
.Contact_form label {
  display: block;
  width: 100%;
}
.Contact_form input,
.Contact_form select,
.Contact_form textarea {
  width: 100%;
  padding: 8px 20px;
  border: 0;
}
.Contact_form .Contact_formQuestion {
  margin-bottom: 5px;
  padding-left: 10px;
}
.Contact_form .Contact_formVerify {
  display: flex;
  gap: 10px;
}
.Contact_form .Contact_formVerifyCode {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 100px;
  color: #fff;
  background-color: #000;
}
.Contact_form .Contact_sendBtn {
  display: inline-block;
  align-self: flex-end;
  margin-top: 20px;
  padding: 5px 40px;
  background-color: #9caca2;
  border-radius: 5px;
}
@media (max-width: 1024px) {
  .Contact_form .container {
    flex-direction: column;
  }
  .Contact_form .Contact_title {
    position: static;
    width: auto;
    padding: 20px 0;
    font-size: 24px;
  }
  .Contact_form .Contact_formContent {
    gap: 10px;
    padding: 20px 0;
  }
}
.Contact_links {
  display: flex;
}
.Contact_links .Contact_item {
  width: 50%;
  padding: 150px 20px 150px 100px;
  background-position: 50%;
  background-size: cover;
}
.Contact_links .Contact_item:first-child {
  background-image: url(../img/contact/contact_item1Bg.jpg);
}
.Contact_links .Contact_item:nth-child(2) {
  background-image: url(../img/contact/contact_item2Bg.jpg);
}
.Contact_links .Contact_linkTitle {
  font-size: 30px;
  font-weight: 500;
  line-height: 1.2;
}
.Contact_links .Contact_linkTitle span {
  display: block;
  margin-top: 10px;
  font-size: 20px;
}
.Contact_links .Contact_linkA {
  margin-top: 20px;
  padding: 5px 50px;
  background-color: #9caca2;
  border-radius: 5px;
}
@media (max-width: 1024px) {
  .Contact_links {
    flex-direction: column;
  }
  .Contact_links .Contact_item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
    min-height: 300px;
    padding: 40px;
  }
}
.News {
  padding-bottom: 100px;
  font-size: 16px;
}
.News_followerWrap {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  pointer-events: none;
}
.News_follower {
  position: relative;
  width: 400px;
  height: 225px;
}
.News_follower.active .News_followerArrow {
  opacity: 1;
}
.News_follower.active .News_followerVideo {
  display: block;
}
.News_followerArrow {
  position: absolute;
  top: calc(50% - 25px);
  right: -25px;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  background-color: #df885c;
  border-radius: 50%;
  opacity: 0;
}
.News_followerArrow span {
  display: block;
  width: 30px;
  height: 10px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: translate(-5px, -50%) skew(45deg);
}
.News_followerVideo {
  position: absolute;
  display: none;
  width: 400px;
  height: 225px;
  pointer-events: none;
  will-change: transform, opacity;
}
.News_followerVideo iframe {
  display: block;
  width: 400px;
  height: 225px;
  border: 0;
}
.News_item {
  display: flex;
  gap: 20px;
  padding: 60px 0;
}
.News_item ~ .News_item {
  border-top: 1px solid #334941;
}
.News_item.active {
  opacity: 1;
}
.News_time {
  flex-shrink: 0;
  width: 100px;
}
.News_title {
  flex-shrink: 0;
  width: 22%;
  font-size: 20px;
}
.News_content {
  display: flex;
  flex-direction: column;
}
.News_arrow {
  width: 60px;
  height: 10px;
  margin-top: 30px;
  margin-left: auto;
  border-right: 2px solid #df885c;
  border-bottom: 2px solid #df885c;
  transform: skew(45deg);
  animation: ani-arrow 1s infinite;
}
.News_pageController {
  margin-top: 40px;
}
@media (max-width: 960px) {
  .News_item {
    flex-wrap: wrap;
    gap: 10px;
    padding: 30px 0;
  }
  .News_time,
  .News_title {
    width: 100%;
  }

  .News_content{
    word-break: break-all;
  }

}
.Detection {
  padding-bottom: 100px;
  font-size: 16px;
}
.Detection_block {
  position: relative;
}
.Detection_block ~ .Detection_block {
  margin-top: 100px;
}
.Detection .Detection_mainTitle {
  position: relative;
  z-index: 1;
  font-size: 24px;
}
.Detection .Detection_note {
  position: relative;
  z-index: 1;
}
.Detection .Detection_decoration {
  position: absolute;
  top: 0;
  right: 20px;
  z-index: 0;
  width: 150px;
}
.Detection .Detection_video {
  position: relative;
}
.Detection .Detection_video iframe {
  width: 100%;
  height: 600px;
}
.Detection .Detection_item {
  display: flex;
}
.Detection .Detection_item .Detection_content {
  display: flex;
  flex-grow: 1;
  align-items: center;
  justify-content: flex-end;
}
.Detection .Detection_item .Detection_content > div {
  width: 100%;
  padding-right: 20px;
  padding-left: 60px;
}
.Detection .Detection_item .Detection_title {
  font-size: 24px;
}
.Detection .Detection_item .Detection_title span {
  font-size: 30px;
}
.Detection .Detection_item .Detection_links {
  display: flex;
  gap: 20px;
  align-items: flex-end;
  margin-top: 40px;
  font-weight: 700;
}
.Detection .Detection_item .Detection_links a {
  display: flex;
  gap: 15px;
  align-items: center;
  margin-bottom: 20px;
  color: #df885c;
}
.Detection .Detection_item .Detection_links .arrow {
  display: block;
  width: 40px;
  height: 10px;
  border-right: 2px solid #df885c;
  border-bottom: 2px solid #df885c;
  transform: skew(45deg);
  animation: ani-arrow 1s infinite;
}
@keyframes ani-arrow {
  0% {
    transform: skew(45deg) translateX(0);
  }
  50% {
    transform: skew(45deg) translateX(-10px);
  }
  to {
    transform: skew(45deg) translateX(0);
  }
}
.Detection .Detection_item .Detection_img {
  flex-shrink: 0;
  width: 50%;
}
.Detection .Detection_itemPureText {
  width: 100%;
  padding: 0 60px;
}
.Detection .Detection_itemPureText .Detection_content > div {
  width: 100%;
  max-width: 1550px;
  margin: 0 auto;
  padding: 60px 0;
}
.Detection .Detection_slogan .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 1300px;
  margin: 0 auto;
}
.Detection .Detection_slogan .text {
  margin: 20px 0 40px auto;
  font-size: 30px;
  font-weight: 500;
}
.Detection .Detection_slogan .textPic {
  margin-top: 100px;
}
@media (max-width: 960px) {
  .Detection {
    background-size: 90em;
    padding-bottom: 100px;
  }
  .Detection_block {
    margin: 40px 0;
  }
  .Detection_block ~ .Detection_block {
    margin-top: 0;
  }
  .Detection .Detection_decoration {
    display: none;
  }
  .Detection .Detection_video {
    margin-top: 0;
  }
  .Detection .Detection_video iframe {
    height: 300px;
  }
  .Detection .Detection_item {
    flex-direction: column;
  }
  .Detection .Detection_item .Detection_links {
    gap: 10px;
    margin-top: 20px;
  }
  .Detection .Detection_item .Detection_links img {
    width: 100px;
  }
  .Detection .Detection_item .Detection_content {
    justify-content: flex-start;
    width: 100%;
  }
  .Detection .Detection_item .Detection_content > div {
    padding: 0 20px;
  }
  .Detection .Detection_item .Detection_img {
    width: 100%;
    margin-top: 20px;
  }
  .Detection .Detection_itemPureText {
    padding: 0 0;
  }
  .Detection .Detection_slogan .text {
    margin: 20px 0 10px auto;
  }
  .Detection .Detection_slogan .textPic {
    max-width: 600px;
  }
}
.Detection_slider {
  padding-top: 100px;
  background-image: url(../img/detection/detection_sliderBg.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: cover;
  display: none;
}
.Detection_sliderContentWrap {
  position: relative;
  max-width: 1600px;
  margin: 0 auto;
}
.Detection_sliderPrev {
  position: absolute;
  top: 50%;
  left: 40px;
  z-index: 1;
}
.Detection_sliderNext {
  position: absolute;
  top: 50%;
  right: 40px;
  z-index: 1;
}
.Detection_sliderItem {
  padding: 0 10px;
  transition: transform 0.3s;
  transform: scale(0.8);
}
.Detection_sliderItem.slick-current {
  transform: scale(1.1);
}
.Detection_sliderDots {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  margin-top: 50px;
}
.Detection_sliderDot {
  width: 100px;
  height: 100px;
  overflow: hidden;
}
.Detection_sliderDot img {
  width: 100%;
  height: 100%;
  -o-object-position: center;
  object-position: center;
  /* -o-object-fit: cover;
  object-fit: cover; */
  object-fit: contain;
}
@media (max-width: 768px) {
  .Detection_sliderItem,
  .Detection_sliderItem.slick-current {
    transform: scale(1);
  }
  .Detection_sliderDot {
    width: 60px;
    height: 60px;
  }
}
.ProductList {
  padding-bottom: 100px;
  font-size: 16px;
}
.ProductList_content {
  display: flex;
  padding: 80px 0;
  color: #002c18;
}

.SearchList_content{
  padding-top: 0;
}

@media (max-width: 1100px) {
  .ProductList_content {
    flex-wrap: wrap;
    justify-content: center;
    padding: 0;
  }
}

.ProductList_content-menu {
  width: 25%;
  min-width: 300px;
  margin-right: 3%;
  padding-right: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
}
@media (max-width: 1100px) {
  .ProductList_content-menu {
    width: 100%;
    margin-bottom: 20px;
    padding: 0;
  }
}
.ProductList_content-menuTitle {
  margin-bottom: 20px;
  font-size: 20px;
}
.ProductList_content-menuItem {
  margin-bottom: 10px;
  font-size: 16px;
  cursor: pointer;
}
@media (max-width: 1100px) {
  .ProductList_content-menuItem {
    margin-bottom: 5px;
  }
}
.ProductList_content-menuItem.ProductList_content-menuItem-toggle
  .ProductList_content-menuItemTitle
  span {
  position: relative;
  display: inline-block;
  padding-right: 25px;
}
.ProductList_content-menuItem.ProductList_content-menuItem-toggle
  .ProductList_content-menuItemTitle
  span:after {
  content: "+";
  position: absolute;
  top: -2px;
  right: 0;
  display: block;
  font-size: 1.5em;
  line-height: 1;
  color: currentColor;
}
.ProductList_content-menuItem.ProductList_content-menuItem-toggle
  .ProductList_content-menuItemSub {
  display: none;
  padding: 10px 20px;
  font-size: 16px;
  line-height: 2;
  color: rgba(101, 126, 112, 0.4);
}
.ProductList_content-menuItem.ProductList_content-menuItem-toggle
  .ProductList_content-menuItemSub
  > .active,
.ProductList_content-menuItem.ProductList_content-menuItem-toggle
  .ProductList_content-menuItemSubItem:hover {
  color: #657e70;
}
@media (max-width: 1100px) {
  .ProductList_content-menuItem.ProductList_content-menuItem-toggle
    .ProductList_content-menuItemSub {
    padding: 10px;
    font-size: 16px;
  }
}
.ProductList_content-menuItem.ProductList_content-menuItem.active
  .ProductList_content-menuItemTitle {
  color: #ea9564;
}
.ProductList_content-menuItem.ProductList_content-menuItem-toggle.active
  .ProductList_content-menuItemTitle
  span:after {
  content: "-";
}
.ProductList_content-menuItem.ProductList_content-menuItem-toggle.active
  .ProductList_content-menuItemSub {
  display: block;
}
.ProductList_content-menuItemTitle:hover {
  color: #ea9564;
}
.ProductList_content-product {
  flex: 1;
}
.ProductList_content-product-ad {
  margin-bottom: 20px;
}
.ProductList_content-product-ad img {
  width: 100%;
  height: auto;
}
@media (max-width: 1100px) {
  .ProductList_content-product-ad {
    margin: 0 auto 10px auto;
  }
}
.ProductList_content-product-filters {
  position: relative;
  margin-bottom: 10px;
}
.ProductList_content-product-filters > div:first-child {
  display: flex;
  justify-content: flex-end;
}
@media (max-width: 960px) {
  .ProductList_content-product-filters > div:first-child {
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 10px;
  }
}
.ProductList_content-product-filter {
  position: relative;
  margin-left: 10px;
  font-size: 14px;
  border: 1px solid #002c18;
  border-radius: 40px;
}
@media (max-width: 960px) {
  .ProductList_content-product-filter {
    width: 100%;
    margin-bottom: 5px;
    margin-left: 0;
    text-align: center;
  }
}
.ProductList_content-product-filter:hover {
  color: rgba(0, 44, 24, 0.45);
  border: 1px solid rgba(0, 44, 24, 0.45);
}
.ProductList_content-product-filter select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  /* width: auto; */
  width: 100%;
  padding: 5px 25px 5px 15px;
  text-align: center;
  letter-spacing: 0.15em;
  background-color: transparent;
  border: none;
  border-radius: 40px;
}
.ProductList_content-product-filter select:focus-visible {
  outline: none;
}
.ProductList_content-product-filter.select:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 10%;
  width: 6px;
  height: 6px;
  border-right: 2px solid #002c18;
  border-bottom: 2px solid #002c18;
  transform: translateY(-60%) rotate(45deg);
  transform-origin: center;
}
.ProductList_content-product-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
@media (max-width: 960px) {
  .ProductList_content-product-list {
    justify-content: space-between;
  }
}
.ProductList_content-product-item {
  width: 32%;
  /* height: 550px; */
  min-height: 550px;
  /* margin-bottom: 20px; */
  border-radius: 40px;
}
@media (max-width: 960px) {
  .ProductList_content-product-item {
    width: 50%;
    height: auto;
    min-height: auto;
    margin-bottom: 10px;
  }
}
.ProductList_content-product-item .productPic {
  position: relative;
}
.ProductList_content-product-item .productPic .hover {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0;
  transition: opacity 0.3s;
}
.ProductList_content-product-item .productInfo {
  padding: 20px 10%;
  border-bottom-right-radius: 25px;
  border-bottom-left-radius: 25px;
}
@media (max-width: 960px) {
  .ProductList_content-product-item .productInfo {
    padding: 10px 10px 20px 10px;
  }
}
.ProductList_content-product-item .productName {
  position: relative;
  padding-top: 40px;
  font-size: 18px;
  font-weight: 700;
  color: #523628;
  text-align: center;
  letter-spacing: 0.2em;
}
.ProductList_content-product-item .productName:before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 24px;
  height: 30px;
  background-image: url(../img/productList/productList_itemIcon.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: contain;
  transform: translateX(-50%);
}
@media (max-width: 960px) {
  .ProductList_content-product-item .productName {
    padding-top: 30px;
  }
  .ProductList_content-product-item .productName:before {
    width: 20px;
  }
}
.ProductList_content-product-item .productIntro {
  position: relative;
  margin-bottom: 20px;
  color: #523628;
  letter-spacing: 0.1em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
@media (max-width: 960px) {
  .ProductList_content-product-item .productIntro {
    margin-bottom: 10px;
  }
}
.ProductList_content-product-item .deco {
  position: relative;
  width: 35px;
  height: 12px;
  margin: 10px auto;
}
.ProductList_content-product-item .deco:after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-right: 3px solid #e08859;
  border-bottom: 2px solid #e08859;
  transform: skew(45deg);
}
@media (max-width: 1100px) {
  .ProductList_content-product-item .deco {
    transform: scale(0.8);
  }
}
.ProductList_content-product-item .productControl {
  display: none;
}
.ProductList_content-product-item.active .productPic .hover,
.ProductList_content-product-item:hover .productPic .hover {
  opacity: 1;
}
.ProductList_content-product-item.active .productInfo,
.ProductList_content-product-item:hover .productInfo {
  background-color: rgba(101, 126, 112, 0.4);
}
.ProductList_content-product-item.active .productName:before,
.ProductList_content-product-item:hover .productName:before {
  background-image: url(../img/productList/productList_itemIcon-h.png);
}
.ProductList_content-product-item.active .deco,
.ProductList_content-product-item:hover .deco {
  display: none;
}
.ProductList_content-product-item.active .productControl,
.ProductList_content-product-item:hover .productControl {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.ProductList_content-product-item.active .productControl > a,
.ProductList_content-product-item.active .productControl > button,
.ProductList_content-product-item:hover .productControl > a,
.ProductList_content-product-item:hover .productControl > button {
  position: relative;
  z-index: 1;
  flex: 1;
  min-width: 96px;
  font-weight: 700;
  line-height: 1.8;
  color: #002c18;
  text-align: center;
  border: 1px solid #002c18;
  border-radius: 4px;
}
.ProductList_content-product-item.active .productControl > a:hover,
.ProductList_content-product-item.active .productControl > button:hover,
.ProductList_content-product-item:hover .productControl > a:hover,
.ProductList_content-product-item:hover .productControl > button:hover {
  background-color: #9caca3;
  border: 1px solid #9caca3;
}
.ProductContent .icon_heart_hover {
  background-image: url(../img/productContent/icon_like_hover.png);
}

/* Mobile JS Toggle 動作 */
.ProductList_content-menuToggle{
  display: none;
}
.ProductList_content-menuToggle button{
  position: relative;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: auto;
  width: 100%;
  padding: 5px 25px 5px 15px;
  text-align: center;
  letter-spacing: 0.15em;
  background-color: transparent;
  border: none;
  border-radius: 40px;
  border: 1px solid #002c18;
  background: #fff;
}

.ProductList_content-menuToggle button::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 10%;
  width: 6px;
  height: 6px;
  border-right: 2px solid #002c18;
  border-bottom: 2px solid #002c18;
  transform: translateY(-60%) rotate(45deg);
  transform-origin: center;
  transition: 0.25s;
}

.ProductList_content-menuToggle.current button::after {
  transform: translateY(-60%) rotate(-135deg);
}

@media (max-width: 1100px) {
  .ProductList_content {
    flex-wrap: wrap;
    justify-content: center;
    padding: 0;
  }

  .ProductList_content-menuToggle{
    display: block;
  }
  
  .js-menuList{
    display: none;
  }
  .js-menuList.active{
    display: block;
  }

  .ProductList_content-menuItemList{
    padding: 1em;
  }
}

/* 20250910 消息列表(水平) */
.newslist_group{
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-left: 0;
  margin-bottom: 0;
  border-radius: .25rem;
}

.newslist_group_item {
  position: relative;
  display: block;
  padding: .75rem 1.25rem;
  background-color: #fff;
  /* border: 1px solid rgba(0,0,0,.125); */
}

.newslist_group_item a{
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.newslist_group_item.active{
  border-bottom: 1px solid rgba(0,0,0,.125);
}

.newslist_group_item.active a{
  color: #ea9564;
}

.newslist_group_item:first-child {
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
}

.newslist_group_horizontal > .newslist_group_item:first-child {
  border-bottom-left-radius: .25rem;
  border-top-right-radius: 0;
}

.newslist_group_horizontal > .newslist_group_item + .newslist_group_item {
  border-top-width: 1px;
  border-left-width: 0;
}

@media (min-width: 1101px) {
  .newslist_group{
    justify-content: center;
  }
  
  .newslist_group_horizontal {
    -ms-flex-direction: row;
    flex-direction: row;
  }
}