@charset "utf-8";

/* CSS Document */

/* 商品頁庫存顯示 */
.single_variation_wrap p.stock.in-stock {
  display: none;
  opacity: 0;
  transition: all 0.2s ease;
  color: #fe8d00;
}
.single_variation_wrap p.stock.in-stock.stock-show {
  opacity: 1;
  display: block;
}

/*pc mo差異*/
.pcimg {
  display: block;
}
.moimg {
  display: none;
}
/*商品圖蓋上icon - 目前先for環保用*/
.ppicon {
  position: absolute;
}
.ppicon img {
  width: 100%;
}
@media (max-width: 767px) {
  .pcimg {
    display: none;
  }
  .moimg {
    display: block;
  }
  .ppicon img {
    width: 80%;
  }
}

/*220818 上方設計介紹+活動修改樣式*/
div#quote_cash a {
  color: #a20;
  font-size: 15px;
}
.PPdesign {
  border-bottom: 1px solid #999;
  padding-bottom: 10px;
  margin-bottom: 10px;
}
#B3C_D {
  display: none;
}
/*----------------------------*/

/*性別資訊回拋*/
#sc {
  display: none;
}

.ppnote {
  text-align: center;
  font-size: 15px;
  line-height: 40px;
  /*font-weight: bolder;*/
  color: #777;
}
.BKnote {
  display: none;
  text-align: left;
  width: 100%;
}

#B1C img {
  width: 100%;
  margin-bottom: 10px;
}

.cloud {
  width: 14px;
  height: 14px !important;
  border: 1px solid #999;
  border-radius: 40px;
  position: relative;
  margin: 11px calc(50% - 8px);
  line-height: 40px;
}

#pp_ALL {
  width: 100%;
  display: flow-root;
  max-width: 900px;
  font-size: 14px;
  font-family: "微軟正黑體";
  line-height: 22px;
  margin: 0 auto;
}

.pp_ARPANSA_1 {
  width: 55%;
  float: left;
}

.pp_ARPANSA_2 {
  width: 45%;
  float: left;
}

.pp_ARPANSA_t1 div,
.pp_ARPANSA_t1B div {
  float: left;
  line-height: 40px;
  text-align: center;
}

.pp_ARPANSA_t1,
.pp_ARPANSA_t2,
.glass .pp_ARPANSA_t2P{
  width: 100%;
  min-width: 500px;
  float: left;
  background-color: #eee;
  color: #555;
  height: 40px;
  line-height: 40px;
  margin: 0px 5px;
}

.pp_ARPANSA_t1B {
  display: none;
}

.pp_ARPANSA_t1_1,
.pp_ARPANSA_t2_1 {
  width: 20%;
}

.glasses .pp_ARPANSA_t1_1,
.glasses .pp_ARPANSA_t2_1 {
  width: 18.25%;
}

.pp_ARPANSA_t1_2,
.pp_ARPANSA_t2_2 {
  width: 18%;
  text-align: center;
}

.glasses .pp_ARPANSA_t1_2,
.glasses .pp_ARPANSA_t2_2 {
  width: 27.25%;
  text-align: center;
}

.pp_ARPANSA_t1_2,
.glasses .pp_ARPANSA_t1M .pp_ARPANSA_t1_2,
.glasses .pp_ARPANSA_t1M .pp_ARPANSA_t2_2 {
  padding-left: 0%;
  text-align: center !important;
}

.pp_ARPANSA_t1_3,
.pp_ARPANSA_t2_3 {
  width: 20%;
}

.glasses .pp_ARPANSA_t1_3,
.glasses .pp_ARPANSA_t2_3 {
  width: 27.25%;
}

.pp_ARPANSA_t1_3 {
  text-align: center;
}

.pp_ARPANSA_t1_4,
.pp_ARPANSA_t2_4 {
  width: 22%;
}

.glasses .pp_ARPANSA_t1_4,
.glasses .pp_ARPANSA_t2_4 {
  width: 27.25%;
}

.pp_ARPANSA_t1_4 {
  text-align: center;
}

.pp_ARPANSA_t1_5,
.pp_ARPANSA_t2_5 {
  width: 18%;
  padding-left: 2%;
}

.pp_ARPANSA_t2 .pp_ARPANSA_t2_2,
.pp_ARPANSA_t2P .pp_ARPANSA_t2_2 {
  text-align: center !important;
  padding-left: 0px;
}

.pp_ARPANSA_t2 {
  background-color: #fff;
  border-bottom: 1px solid #ccc;
}

.pp_ARPANSA_t2 a:link,
.pp_ARPANSA_t2 a:visited,
.pp_ARPANSA_t2P a:link,
.pp_ARPANSA_t2P a:visited {
  color: inherit;
}

.pp_ARPANSA_t2 div,
.pp_ARPANSA_t2P div {
  float: left;
  line-height: 40px;
  text-align: center;
  height: 40px;
}

.pp_ARPANSA_t2 div img,
.pp_ARPANSA_t2P div img {
  vertical-align: middle;
  border-style: solid;
}

.pp_ARPANSA_t2:hover .cloud {
  border-color: #ff7e00;
}

.pp_ARPANSA_t2:hover .tri {
  border-color: transparent transparent transparent #ff7e00;
}

.pp_ARPANSA_t2:hover {
  background-color: #fff0dd;
  color: #ff7e00;
}

.glasses .pp_ARPANSA_t2:hover {
  background-color: inherit;
  color: #555;
}

.pp_ARPANSA_t2:nth-last-child(1),
.pp_ARPANSA_t2P:nth-last-child(1) {
  border-bottom: 0px;
  margin-bottom: 10px;
}

.pp_ARPANSA_t2_1 img {
  width: 24px;
  border-width: 1px;
  border-style: solid;
  vertical-align: middle;
}

.pp_ARPANSA_t2A {
  display: none;
}

.pp_B ul {
  text-align: left;
}

.pp_NOTE_t1 ul {
  line-height: 40px;
}

.pp_SIZE_t1 {
  width: calc(100% - 300px);
  float: left;
  color: #555;
  line-height: 24px;
  text-align: center;
}

.pp_SIZE_t1 a:link,
.pp_SIZE_t1 a:visited {
  text-decoration: none;
}

.pp_SIZE_t2 {
  width: 100%;
  float: left;
  color: #555;
  text-align: center;
}

.pp_SIZE_table td,
.pp_SIZE_table2 td,
.pp_SIZE_table3 td {
  border-bottom: 1px solid #ccc;
  /*line-height:40px; height:40px;*/
}

.pp_SIZE_table tr:hover {
  background: #fff0dd;
}

.pp_SIZE_table,
.pp_SIZE_table2,
.pp_SIZE_table3 {
  width: 100%;
  text-align: center;
  line-height: 40px;
}

.pp_SIZE_table_tt {
  text-align: left;
  line-height: 24px;
}

.pp_SIZE_table_tt li {
  margin-bottom: 10px;
}

.pp_SUG_t3 .SS1 {
  width: calc(25%);
  float: left;
}

.pp_SUG_t3 .SS2 {
  width: calc(25%);
  float: left;
}

.pp_SUG_t3 {
  width: calc(100% - 2px);
  float: left;
}

.pp_SUG_table .SST {
  border-bottom: 0px solid #fff;
}

.pp_SUG_table {
  width: 100%;
  display: flow-root;
}

.PPblock {
  width: calc(100%);
  border-bottom: 1px solid #999;
  padding: 10px;
  margin-bottom: 10px;
  overflow: hidden;
}

.ppinfo {
  width: 100%;
  float: left;
}

.ppinfo li {
  list-style: unset;
}

.PPtitle,
.PPtitle2,
.PPtitleB {
  font-size: 18px;
  font-weight: bolder;
  line-height: 40px;
  display: flow-root;
  float: left;
  cursor: pointer;
}

.PPtitle h2,
.PPtitleB h2 {
  float: left;
  width: auto;
}

.PPtitle,
.PPtitleB {
  width: calc(100% - 10px);
  padding-left: 10px;
}

/* 260224-原商品頁下方資訊呈現-start */
/* .PPtitle::after {
  content: " ─ ";
  float: right;
  margin-right: 10px;
  size: 16px;
}

.PPtitleB::after {
  content: " ＋ ";
  float: right;
  margin-right: 2px;
  font-size: 28px;
} */

/* 260224-原商品頁下方資訊呈現-end */

.PPtitle2 {
  width: 100%;
  margin-top: 20px;
}

/* 260224-調整商品頁下方資訊呈現-start */
.PPtitle::after {
  content: " ＋ ";
  float: right;
  margin-right: 2px;
  font-size: 28px;
}

.PPtitleB::after{
  content: " ─ ";
  float: right;
  margin-right: 10px;
  size: 16px;
}

#B2C .ppinfo,#B4C .ppinfo,#uv100products-sizeC .ppinfo,#B3C .ppinfo {
  display: none;
} 

#B4C .ppinfo {
  overflow: scroll;
}



.SS1 .SST,
.SS2 .SST,
.SS3 .SST,
.SS4 .SST {
  background-color: #eee;
  float: left;
  line-height: 40px;
  height: 42px;
}

.SS1 {
  width: calc(16%);
  float: left;
  line-height: 35px;
  text-align: center;
}

.SS1 div,
.SS3 div {
  border-bottom: 1px solid #ccc;
  float: left;
  width: 100%;
  line-height: 40px;
}

.SS2 div,
.SS4 div {
  border-bottom: 1px solid #ccc;
  float: left;
  width: 100%;
  line-height: 40px;
}

.SS2,
.SS4 {
  width: calc(10.5%);
  float: left;
  line-height: 35px;
  text-align: center;
}

.SS3 {
  width: calc(16% - 2px);
  float: left;
  display: none;
  line-height: 40px;
  text-align: center;
}

.SS5 {
  line-height: 24px;
  width: 100%;
  float: left;
}

.SS5 a:link,
.SS5 a:visited {
  color: #555;
}

.SST span {
  font-size: 10px;
}

.tri {
  width: 0;
  height: 0 !important;
  border-style: solid;
  border-width: 5px 0px 5px 8px;
  border-color: transparent #fff transparent #999;
  margin: 2px 29%;
}

.pp_ARPANSA_t1M .pp_ARPANSA_t1_1 {
  display: none;
}

.pp_ARPANSA_t1M .pp_ARPANSA_t1_4 {
  display: block;
}

.glasses .pp_ARPANSA_t1M div {
  float: left;
  width: 33%;
}

.pp_ARPANSA_t1M {
  width: calc(100%);
  float: left;
  background-color: #eee;
  color: #555;
  height: 40px;
  line-height: 40px;
}

.pp_ARPANSA_t2M .pp_ARPANSA_t2_1 {
  display: none;
}

.pp_ARPANSA_t2M {
  background-color: #fff;
  border-bottom: 1px solid #ccc;
  float: left;
  width: calc(100%);
  height: 40px;
  line-height: 40px;
}

.pp_ARPANSA_t2P {
  background-color: #fff;
  border-bottom: 1px solid #ccc;
  float: left;
  width: calc(100%);
  height: 40px;
  line-height: 40px;
}

.glasses .pp_ARPANSA_t2M div {
  float: left;
  line-height: 40px;
  text-align: center;
  height: 40px;
  width: 33%;
  color: #555;
}

/*.pp_ARPANSA_t2M,.pp_ARPANSA_t1M{width:100%;float:left;background-color:#EEE;color:#555;}*/
.pp_ARPANSA_t2M:nth-last-child(1) {
  border-bottom: 0px;
  margin-bottom: 10px;
}

.glass div {
  text-align: center;
}

.glasses .pp_ARPANSA_t1,
.glasses .pp_ARPANSA_t2P {
  width: 100%;
  margin: 0px;
}

.glasses .pp_ARPANSA_t1M .pp_ARPANSA_t1_2,
.glasses .pp_ARPANSA_t1M .pp_ARPANSA_t2_2 {
  padding-left: 0%;
}

.glasses .PPtitle2 {
  display: none;
}

/*.glasses{width:50%;float:left;}*/
#uv100products-size {
  height: 110px;
  position: absolute;
  top: -110px;
}

#Bsize {
  position: relative;
}

/*div#Bsize2,div#Bsize2C{ display:none!important;}*/
a.check_video span {
  color: #ff7e00;
}

a.check_video img {
  vertical-align: middle;
  width: 14px;
  border: none;
}

#uv100products-sizeC {
  background: #fff;
  display: block !important;
}

.mfp-content #uv100products-sizeC {
  padding-top: 40px;
}
.mfp-content #uv100products-sizeC .ppinfo {
  display: block !important;
}

.D1,
.D2,
.D3,
.D4 {
  width: 60%;
  float: left;
  font-family: "微軟正黑體";
}

.pp_SIZE_t2s {
  width: 40%;
  float: left;
  text-align: center;
}

.D5 {
  width: 100%;
  float: left;
  font-family: "微軟正黑體";
}

.DL {
  float: left;
  line-height: 35px;
  text-align: center;
  background: #fff;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
}

.DL div {
  width: 120px;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}
.D1 .DL div {
  width: 150px;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

.DR {
  display: flex;
  overflow-x: auto;
  flex: 1 1 auto;
  width: calc(100% - 142px);
  border-top: 1px solid #ccc;
}
.D1 .DR {
  width: calc(100% - 172px);
}
.DD2 {
  float: left;
  line-height: 35px;
  text-align: center;
  width: 100%;
}

.DD2,
.DD2 div {
  width: calc(100%);
  min-width: 90px;
}

.DD2 div {
  float: left;
  width: 100%;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

.DDT {
  background: #eee;
}

.ppinfo ul {
  margin-bottom: 15px;
}

#B2C a:link {
  float: left;
  min-width: 50px;
  border: 1px solid #ccc;
  margin-right: 10px;
  text-align: center;
  color: #666;
  text-decoration: none;
  border-radius: 5px;
  padding: 5px;
}

#B2C a:hover {
  background: #eee;
}

#B2C a:visited {
  color: #666;
  border: 1px solid #ccc;
}

#sss div {
  width: calc(25%);
  text-align: center;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  float: left;
  line-height: 25px;
}
#sss {
  width: 100%;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  float: left;
}
#slist {
  width: 100% !important;
  border: none !important;
}
/*
#B3C li {
	margin-left: -18px;list-style: unset;
}
*/
/*#uv100products-size{ position:inherit;}*/
/*
.sizeS {
	width: 150px;
	border: 1px solid #CCC;
	border-radius: 5px;
	text-align: center;
	position: absolute;
	right: 0px;
}
*/
.rsL {
  width: calc(90%);
  float: left;
}

.rsR {
  width: calc(10%);
  float: right;
  text-align: center;
}

.rsarea {
  float: left;
  margin-bottom: 10px;
  width: 100%;
}

/*.rsT{text-align:right; float:right; }*/
.rsT a {
  border: 1px solid #ccc;
  border-radius: 3px;
  padding: 5px;
  line-height: 30px;
}

.rs4 {
  width: calc(33%);
  float: left;
}

.rs4 input {
  width: calc(100% - 50px);
}

.rs2 {
  width: calc(33%);
  float: left;
  text-align: center;
}

.rs2 div {
  border: 1px solid #ddd;
  line-height: 22px;
  max-width: 60px;
  width: 100%;
  margin: 7px auto 0px;
  cursor: pointer;
  border-radius: 3px;
}

.real-size {
  font-size: 14px;
  line-height: 24px;
  font-family: "微軟正黑體";
  margin: 30px 5px;
  width: 100%;
}

#ss {
  width: 100%;
  text-align: center;
}

#ss div.ssMain2 {
  width: 100%;
  background: #eee;
  text-align: center;
  border: none;
  line-height: 50px;
  margin-bottom: 10px;
  float: left;
}

#ssug {
  width: 100%;
  float: left;
  margin: 15px 0px;
}

.rsbt {
  border: 1px solid #ccc;
  border-radius: 3px;
}

.rsarea a {
  text-decoration: none;
  color: #666;
}

#pp_FUNC a {
  padding: 3px;
  border: 1px solid #ccc;
}

img.mfp-img {
  max-height: none !important;
}
.w-100 {
  width: 100%;
}
@media only screen and (max-width: 767px) {
  .D1,
  .D2,
  .D3,
  .D4 {
    width: 100%;
  }

  .DD2,
  .DD2 div {
    width: calc(100%);
  }

  .D5 .DL {
    filter: drop-shadow(2px 0px 6px #ccc);
    background: #fff;
  }

  .D5 {
    overflow: hidden;
  }

  .D5 .DD2 div {
    width: 100px;
  }

  .pp_ARPANSA_t1,
  .pp_ARPANSA_t2,
  .pp_ARPANSA_t2P {
    width: 100%;
  }

  .glasses .pp_ARPANSA_t1_2,
  .glasses .pp_ARPANSA_t2_2 {
    width: 25%;
    text-align: center;
  }

  .pp_SIZE_t1,
  .pp_SIZE_t2,
  .pp_SIZE_t2s {
    width: 100%;
  }

  .pp_SIZE_t2 img {
    width: 300px;
  }

  .SS1 {
    width: calc(30%);
    margin-bottom: 10px;
  }

  .SS2,
  .SS4 {
    width: calc(17.5%);
    margin-bottom: 10px;
  }

  .SS3 {
    display: block;
    width: calc(30%);
    margin-bottom: 10px;
  }

  .SST span {
    display: none;
  }



  .pp_ARPANSA_t1,
  .pp_ARPANSA_t2,
  .pp_ARPANSA_t1B {
    margin: 0px;
  }

  .glasses {
    width: 100%;
    float: left;
  }

  .glasses .pp_ARPANSA_t1M .PPtitle,
  .glasses .PPtitle2 {
    display: block;
  }

  .pp_ARPANSA_t1M .pp_ARPANSA_t1_1 {
    display: block;
  }

  .pp_ARPANSA_t2M .pp_ARPANSA_t2_1 {
    display: block;
  }

  .glasses .pp_ARPANSA_t1M div,
  .glasses .pp_ARPANSA_t2M div {
    width: 25%;
    text-align: center;
    padding-left: 0%;
  }

  .pp_ARPANSA_t1_5 {
    display: none;
  }

  .pp_ARPANSA_t1_5,
  .pp_ARPANSA_t2_5 {
    padding: 0px;
  }

  .pp_ARPANSA_t2_5 {
    display: none;
  }

  .pp_ARPANSA_t1 div,
  .pp_ARPANSA_t2 div,
  .glasses .pp_ARPANSA_t1 div,
  .glasses .pp_ARPANSA_t2P div {
    width: 25%;
  }

  .pp_ARPANSA_t2_5 .cloud {
    width: 14px;
  }

  .glasses .pp_ARPANSA_t2P .pp_ARPANSA_t2_3 {
    overflow: hidden;
  }

  .glasses .pp_ARPANSA_t2_4,
  .glasses .pp_ARPANSA_t1_4 {
    display: block;
  }

  .pp_ARPANSA_t1_2,
  .pp_ARPANSA_t2_2 {
    padding-left: 0%;
    text-align: center;
  }

  .pp_SIZE_table {
    font-size: 10px;
  }

  #uv100products-size {
    height: 70px;
    position: absolute;
    top: -70px;
  }

  .rs4 input {
    width: 60px;
  }
}

.video-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*新國際認證*/
#CSAA {
  width: 70%;
}
#CSBB {
  width: 100%;
  display: none;
}
#AAimg {
  position: relative;
  text-align: center;
}
#Aimg,
#Bimg {
  position: absolute;
  z-index: 99999;
  width: 120px;
  top: 10px;
  right: 10px;
  border: 1px solid #ff7e00;
  border-radius: 20px;
  background: #ff7e00;
  color: #fff;
  text-align: center;
  padding: 3px;
  text-decoration: none;
}
@media (max-width: 768px) {
  #CSAA {
    width: 100%;
  }
}
@media only screen and (min-width: 768px) {
  .mfp-content {
    /*left: calc(50% - 440px)!important;*/
    max-width: 880px;
  }
}
#Origin {
  display: none;
}

.reply-comment {
  border-top: none !important;
  padding-top: 0 !important;
  margin-left: 3rem !important;
}

.product-actions-wrapper {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.product-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0.5rem;
  padding-left: 0;
}



/*.mfp-hide{
	display:block!important;
}*/


/* .size-chart-table {
  border-collapse: separate;
  border-spacing: 0;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  margin-bottom: 0;
} */

.size-chart-table .PS-Header {
  background: #eee ;
}

.size-chart-table th,
.size-chart-table td {
  font-weight: 400 !important;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  min-width: 90px;
}

.size-chart-table th:first-child,
.size-chart-table td:first-child {
  width: 120px;
  min-width: 120px;
  position: sticky;
  left: 0;
  background: #fff;
  z-index: 1;
  /* 用 box-shadow 模擬右邊框，避免滾動時消失 */
  box-shadow: -2px 0 0 #ccc, 0.5px 0 0 #ccc;
}

.size-chart-table .PS-Header th:first-child {
  background: #eee ;
}


.D1 .size-chart-table th:first-child,
.D1 .size-chart-table td:first-child {
  width: 150px;
  min-width: 150px;
}

/* 外層容器 */
.size-chart-wrapper {
  overflow-x: auto;
  max-width: 100%;
}

/* 外層容器 - 橫向滾動 */
.size-chart-wrapper {
  overflow-x: auto;
  max-width: 100%;
}

/* 用 div 模擬表格 */
.size-chart-table {
  display: table;
  border-collapse: separate;
  border-spacing: 0;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  width: 100%;
}

.size-chart-table .size-row {
  display: table-row;
}

.size-chart-table .size-cell {
  display: table-cell;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 8px;
  min-width: 90px;
  font-weight: 400;
  text-align: center;
  vertical-align: middle;
}

/* 標題列 */
.size-chart-table .size-row.PS-Header {
  background: #eee;
}

/* 第一欄固定 */
.size-chart-table .size-cell.size-col-0 {
  position: sticky;
  left: 0;
  background: #fff;
  z-index: 1;
  width: 120px;
  min-width: 120px;
  box-shadow: 1px 0 0 #ccc;
}

/* 標題列的第一欄 */
.size-chart-table .PS-Header .size-cell.size-col-0 {
  background: #eee;
}

/* D1 類型寬度調整 */
.D1 .size-chart-table .size-cell.size-col-0 {
  width: 150px;
  min-width: 150px;
}