@charset "UTF-8";
/***************************************
    copyright by MakeWeb.com.tw 
***************************************/
.tree_gray_green_v .mw-nav li .arrow-pad {
  padding: 0 0 0 30px;
}

/*-------------------------------------------------
 list_vert
--------------------------------------------------*/
.list_vert .label_combobox_year {
  margin: 10px 0;
  padding: 30px 40px;
  background: #ecf0f1;
  border-left: 5px solid #02759f;
}

.list_vert .label_combobox_year h3 {
  color: #888;
}

.list_vert .menu_content {
  margin: 30px 0 80px 0;
}

.list_vert ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.list_vert {
  display: block;
}

/*-------------------------------------------------
 port-filter
--------------------------------------------------*/
.port-filter {
  overflow: visible;
  border-bottom: 1px solid #e9ecef;
}

.port-filter ul {
  display: table;
  margin: 0px auto;
  padding: 0;
  list-style: none;
}

.port-filter ul li {
  overflow: visible;
  /*overflow: hidden;*/
  display: inline-block;
  position: relative;
  padding: 8px 12px;
}

.port-filter ul a {
  position: relative;
  padding: 8px 16px;
  color: #888;
  font-size: 2rem;
  font-weight: bold;
}

.port-filter ul a:hover,
.port-filter ul a:focus,
.port-filter ul a.current {
  text-decoration: none;
  /*background: #FF0031;*/
  color: #000;
  border-bottom: 3px solid #000;
}

.list_vert .list_tilelist {
  margin: 10px 0;
  padding: 0;
  color: #333;
}
.list_vert .list_tilelist ul {
  display: grid;
  /* grid-template-columns: 1fr 1fr 1fr; */
  grid-template-columns: 300px 300px 300px;
  align-items: baseline;
  gap: 22px;
  justify-items: center;
}
.list_vert .list_tilelist h2 {
  color: #325895;
}

.list_vert .list_tilelist ul > li .item_hot {
  position: absolute;
  right: 0;
  width: 64px;
  /*border: 1px solid #CCC;*/
}
.list_vert .list_tilelist ul > li .item_description {
  /*font-size: 1.5rem;*/
  text-align: center;
  color: #666;
}
.list_vert .list_tilelist ul > li .tag_box {
  display: table;
  margin: 4px auto;
  min-height: 21px;
}
.list_vert .list_tilelist ul > li .item_tag {
  float: left;
  margin: 2px 3px;
  padding: 0 8px;
  color: #fff;
  font-size: 1.2rem;
  background: #ea5b27;
  /*border: 2px solid #999;*/
  border-radius: 16px;
}
.list_vert .list_tilelist ul > li img {
  display: block;
  margin: auto;
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  height: 260px;
}
.list_vert .list_tilelist ul > li .price {
  font-size: 1.4rem;
  display: flex;
  /* gap: 10px; */
  gap: 0px;
  justify-content: center;
  flex-wrap: wrap;
}
.list_vert .list_tilelist ul > li .price del {
  text-decoration: unset;
  color: #c4c4c4;
}
.list_vert .list_tilelist ul > li .price del .original-price {
  text-decoration: line-through;
}
.list_vert .list_tilelist ul > li .price ins {
  text-decoration: unset;
  color: #959494;
}

.list_verti .list_tilelist ul > li a:hover {
  color: #333;
}

.list_vert .list_tilelist ul > li .item_image {
  transition: 0.35s ease-out;
  max-width: 260px;
}

.list_vert .list_tilelist ul > li h4 {
  margin: 6px 0;
  padding: 0;
  color: #000;
  font-weight: lighter;
  /*font-size: 1.6rem;*/
  text-align: center;
  word-wrap: normal;
  max-width: 260px;
}

.slide_box {
  width: 800px;
  margin: auto;
  padding: 30px 0;
}

.slide_box .video_item {
  margin: 0 4px;
}

.slide_box .post_image img {
  width: 100%;
}

.slick-list:after,
.buttons::after {
  clear: both;
  content: "";
  display: table;
}

.other_info {
  display: flex;
  justify-content: center; /* 居中分页导航 */
  align-items: center;
  padding: 10px;
  gap: 10px; /* 为链接之间添加间距 */
  font-family: Arial, sans-serif;
}

.other_info a {
  text-decoration: none; /* 移除链接的下划线 */
  color: #777; /* 设置链接颜色 */
  padding: 8px 12px;
  border: 1px solid #ddd; /* 给链接添加边框 */
  border-radius: 5px;
}

.other_info a:hover {
  background-color: #666; /* 悬停时更改背景色 */
  color: white; /* 悬停时文字变为白色 */
}

.other_info a:hover svg {
  fill: white; /* 悬停时将 SVG 图标的颜色改为白色 */
}

.other_info strong {
  padding: 8px 12px;
  background-color: #777; /* 当前页的背景色 */
  color: white; /* 当前页的文字颜色 */
  border: 1px solid #777;
  border-radius: 5px;
}

.other_info a:first-child,
.other_info a:last-child {
  font-weight: bold; /* 给第一页和最后一页设置较粗的字体 */
  color: #777;
}

.other_info a:first-child:hover,
.other_info a:last-child:hover {
  background-color: #666; /* 修改悬停时第一页和最后一页的颜色 */
  color: white;
}

.other_info a:first-child:hover svg,
.other_info a:last-child:hover svg {
  fill: white; /* 悬停时将 SVG 图标的颜色改为白色 */
}

/*-------------------------------------------- 
	Media Queries 
---------------------------------------------*/
/* Portrait and Landscape */
/*@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) {
}*/
/*iPad Pro*/
@media screen and (max-width: 1279px) {
  .list_vert .list_tilelist ul > li img {
    height: 223px;
  }
  .list_vert .list_tilelist ul{
    grid-template-columns: 1fr 1fr;
  }
}
/*iPad*/
/*iPhone*/
@media screen and (max-width: 767px) {
  .list_vert .list_tilelist ul {
    grid-template-columns: 1fr;
  }
  .list_vert .list_tilelist ul > li img {
    height: 355px;
  }
  .list_vert .label_combobox_year {
    /*margin: 10px 0;*/
    padding: 10px 20px;
    /*background: #ECF0F1;*/
    /*border-left: 5px solid #02759F;*/
  }
  .list_vert .label_combobox_year h1 {
    font-size: 2.3rem;
  }
  .list_vert .label_combobox_year h3 {
    font-size: 1.8rem;
  }
  .port-filter ul li a {
    padding: 8px 0px;
    /*color: #888;*/
    font-size: 1.5rem;
    /*font-weight: bold;*/
  }
  .list_vert li .list_tilelist ul > div .item_image img {
    /*width: 100%;*/
    max-width: 100%;
  }
  .list_vert .list_tilelist ul > div {
    width: 100%; /* 一個一行 */
  }
  .other_info {
    gap: 0;
  }
  .other_info a {
    font-size: 1.2rem;
    padding: 9px;
  }
}