/* list_product */
.list_product ul { font-size: 0; }
.list_product ul {display: inline-table;transition: 0.9s;}
.list_product ul li {transition: 0.9s;overflow: hidden;display: inline-block;vertical-align: top;width: calc((100%/4) - 0px);position: relative;counter-increment: step-counter;}
.list_product ul li:hover .img img {-webkit-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05);-webkit-transition: all .5s ease-in-out;-o-transition: all .5s ease-in-out;transition: all .5s ease-in-out;}
.list_product ul li a{z-index: 5;}
.list_product ul li .producta{position: absolute;width: 100%;height: 100%;display: block;top: 0;left: 0;z-index: 5;}
.list_product ul li a.more {padding: 0px 10px 2px;display: inline-block;border-bottom: 1px #6b6b6b solid;}
.list_product ul li a.more font {margin-right: 40px;display: inline-block;font-family: 'DM Serif Display', serif;letter-spacing: 1.5px;font-weight: 400;text-transform: uppercase;font-size: 15px;color: #ffffff;}
.list_product ul li a.more font:after{content: "";display:inline-block;position: relative;transform: translateX(32px);z-index: 11;width: 0;height: 0;border-style: solid;border-width: 4px 0 4px 8px;border-color: transparent transparent transparent #ffffff;transition: 0.6s;}
.list_product ul li a.more svg.arrow{display: none;}
#content .list_article section:nth-child(odd) { background: #f1f4f6; }
#content .list_article section:nth-child(odd) .img { margin: 0 0 0 5%; order: 1; }
.list_product ul li >div {overflow: hidden;position: relative;z-index: 2;}
.list_product ul li .img:before {position: absolute;width: 100%;height: 100%;background: rgb(0 0 0 / 8%);display: block;top: 0;left: 0;opacity: 0;z-index: 4;content: "";}
.list_product ul li .img img {position: relative;width: 100%;height: 520px;object-fit: cover;z-index: 1;}
.list_product ul li .info {color: #fff;width: 100%;display: flex;text-align: center;flex-direction: column;align-items: center;padding: 100px 0 80px;background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%,rgb(0 0 0 / 72%) 100%);position: absolute;left: 0;right: 0;bottom: 0;}
.list_product ul li .info .price {position: absolute;background: rgb(0 0 0 / .6);left: 0;padding: 0px 10px 2px;-webkit-backdrop-filter: blur(8px);backdrop-filter: blur(8px);}
.list_product ul li .info .price font { margin: 6px 15px; display: inline-block; font-weight: 300; color: #fff; }
.list_product ul li .info .price font.old { color: rgb(255 255 255 / .4); }
.list_product ul li .info h3 {font-weight: bold;margin-bottom: 10px;height: 40px;font-size: 22px;letter-spacing: 3.5px;}
.list_product ul li .info article {height: 43px;font-weight: 400;font-size: 14px;-webkit-line-clamp: 2;}

/* productdetail */
.workframe {position: relative;margin: 0 auto;width: 1500px;font-size: 0;z-index: 1;color: #d2d2d2;}
#productdetail { font-size: 0; }
#productdetail #imglist {overflow: hidden;position: relative;}
#productdetail #imglist .infobar{
  letter-spacing: 1px;
  width: calc(100% - 60px);
  padding: 30px;
  position: absolute;
  bottom: 30px;
  left: 0;
  z-index: 5;
  font-family: "source-han-serif-tc";
  font-weight: 300;
  color: #fff;
  transition: 0.9s;
}
#productdetail #imglist .infobar h2{
    font-size: 55px;
    font-weight: bold;
    padding: 10px 0px;
}
#productdetail #imglist .infobar .txt b{
    font-size: 19px;
    font-weight: bold;
    letter-spacing: 2px;
}
#productdetail #imglist .infobar span {position: absolute;width: 70px;height: 1px;background: #fff;display: block;left: 30px;top: 135px;z-index: 3;-webkit-transition-duration: .2s;transition-duration: .2s;}
#productdetail #imglist .infobar article{
    line-height: 160%;
    letter-spacing: 10px;
    font-size: 18px;
    font-weight: bold;
    padding: 5px 0 0;
}
#productdetail #imglist:hover h3{color:#242734;}
#productdetail #imglist img {width: 100%;object-fit: cover;}
#productdetail #imglist .slider-nav {
    margin-top: 4vw;
    -moz-column-count: 4;
    -moz-column-gap: 15px;



    -webkit-column-count: 4;
    -webkit-column-gap: 0px;
    column-count: 4;
    column-gap: 0px;
}
#productdetail #imglist .slider-nav img {margin: 0 10px 0 0;width: 100%;height: 100%;}
#productdetail #productinfo .cat a { font-size: 14px; color: #9b9b9b; }
#productdetail #productinfo #community { margin-bottom: 15px; border-bottom: 1.5px #ccc dashed; }
#productdetail #productinfo #community ul { margin: 35px 0 10px; }
#productdetail .shopbox p { margin: 20px 0; font-size: 0; }
#productdetail .shopbox p label { margin-right: 15px; display: inline-block; font-weight: 300; font-size: 15px; color: #5d5d5d; }
#productdetail .shopbox p select { padding: 5px; border: 1px #e5e5e5 solid; display: inline-block; }
#productdetail #orderfunction a , #productdetail #orderfunction input { padding: 2px 13px; border: 1px #e5e5e5 solid; display: inline-block; color: #000; vertical-align: middle; }
#productdetail #orderfunction input { width: 30px; border-width: 1px 0; text-align: center; }
#productdetail .price font { margin-right: 10px; display: inline-block; line-height: 100%; font-family: 'Source Sans Pro', sans-serif; font-size: 12px; color: #565656; vertical-align: text-bottom; }
#productdetail .price font.offer { font-size: 18px; color: #262626; }
#productdetail .price font.old { text-decoration: line-through; }
#productinfo .buyBtns {text-align: center;font-size: 0;margin: 40px 0 10px;}
#productinfo .buyBtns a {padding: 6px 0;width: 10%;display: inline-block;text-align: center;color: #fff;}
#productinfo .buyBtns a.ask {color: #1f1f1f;position: relative;padding: 15px 100px;border: 1px #383838 solid;display: inline-block;color: #ffffff;}
#productinfo .buyBtns a:hover {background: #484848ad;color: #dedede;}
/* productTabs */
#productTabs ul.tabs { margin: 70px 0 35px; border-bottom: 1px #ddd solid; font-size: 0; }
#productTabs ul.tabs li { display: inline-block; vertical-align: top; }
#productTabs ul.tabs li a { padding: 7px 40px; display: inline-block; color: #1f1f1f; }
#productTabs ul.tabs li.active { background: #1f1f1f; transform: skewX(-10deg); }
#productTabs ul.tabs li.active a { color: #fff; transform: skewX(10deg); }
@media screen and (max-width: 1500px){
	.workframe {width: 90%;}
}
@media screen and (max-width: 1440px){
	.list_product >.info { margin: 0 5%; }
	.list_product ul li .img img {
    height: 340px;
}
	.list_product ul li .info {padding: 25px 15px 40px;width: calc(100% - 20px);bottom: -10px;}
}
@media screen and (min-width: 1281px){
	.list_product ul li:hover .img:before { opacity: 1; }
	.list_product ul li:hover .img img {filter: brightness(.5);-webkit-filter: brightness(.5);}
}
@media screen and (max-width: 1160px){
	.list_product ul li { width: 50%; }
	#productinfo .buyBtns a.ask{padding: 10px 40px;width: 40%;}
	#productdetail #imglist .slider-nav { -moz-column-count: 3; -webkit-column-count: 3; column-count: 3; }
}

@media screen and (max-width: 960px){
	#productdetail #imglist .infobar{position: inherit;width: calc(100% - 0px);padding: 20px 0px;}
	#productdetail #imglist .infobar h2{font-size: 35px;}
	#productdetail #imglist .infobar .txt b{font-size: 17px;}
	#productdetail #imglist .infobar span{left: 0px;top: 140px;}
	#productdetail #imglist .infobar article{font-size: 16px;letter-spacing: 7px;padding: 19px 0 0;}
}
@media screen and (max-width: 768px){
	#productdetail { text-align: center; }
	#productdetail .row , #productdetail #imglist { margin-right: 0; width: 100%; }
	#productdetail #imglist img {}
	#productdetail #productinfo { margin-top: 5vw; }
	#productdetail #imglist .slider-nav {-moz-column-count: 2;-webkit-column-count: 2;column-count: 2;}
}
@media screen and (max-width: 640px){
	.list_product ul li { width: 100%; }
	#productdetail #imglist img { height: 60vw; }
}
@media screen and (max-width: 480px){
	.list_product ul li .img img {height: 78vw;}
	#productdetail #imglist .slider-nav {-moz-column-count: 1;-webkit-column-count: 1;column-count: 1;}
}