.pro-banner .slick-current { opacity: 1;  transition: all .5s ease; -webkit-transition: all .5s ease; moz-transition: all .5s ease;  -o-transition: all .5s ease;  -ms-transition: all .5s ease; box-shadow:0px 5px 16px rgba(0,0,0,.5)   }	
.pro-banner figure{ opacity: 0.5;  transition: all .5s ease; -webkit-transition: all .5s ease; moz-transition: all .5s ease;  -o-transition: all .5s ease;  -ms-transition: all .5s ease;}	
 
.series { width:100%;  height: 100%;   display: flex;  flex-wrap: wrap; justify-content: space-between; margin:3% auto 10% auto; align-items:flex-start; align-content: flex-start; }
.series li{ position: relative; width: 100%; display: flex; background-color: #fff; overflow: hidden;  margin-bottom: 4px; border-radius: 16px;overflow: hidden;}
.series li figure { z-index: 100;  width: 100%;  height: auto;  	cursor: pointer;}
.series li figure img { position: relative; display: block; min-height: 100%; max-width: 100%;margin: 0;}
.series li figure figcaption { padding: 2em; color: #fff; text-transform: uppercase; font-size: 1.25em; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
.series li figure figcaption::before,.series li figure figcaption::after { pointer-events: none;}
.series li figure figcaption,.series li figure figcaption > a { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
/* For some effects it will show as a button */
.series li figure figcaption > a { z-index: 1000; text-indent: 200%; white-space: nowrap; font-size: 0; opacity: 0;}
.series li figure h3 {font-size:1.75rem;  word-spacing: -0.15em; font-weight: 500;  color: #fff;  text-shadow: 2px 2px 1px rgba(0,0,0,0.85);  }
.series li figure h3 span { font-weight: 700;}
.series li figure h3,.series li figure p {margin: 0;}
.series li figure p { letter-spacing: 1px; font-size: 85%;color: #fff;text-shadow: 0 1px 2px rgba(0,0,0,0.5);  }
/***** Bubba *****/
/*---------------*/
figure.effect-bubba { background: -webkit-linear-gradient(top, rgba(72,76,97,0) 0%, rgba(72,76,97,0.8) 75%); background: linear-gradient(to bottom, rgba(72,76,97,0) 0%, rgba(72,76,97,0.8) 75%);}
figure.effect-bubba img { opacity:.75; -webkit-transition: opacity 0.35s; transition: opacity 0.35s;}
figure.effect-bubba:hover img { opacity: 1;}
figure.effect-bubba figcaption::before,figure.effect-bubba figcaption::after { position: absolute; top: 20px; right: 20px; bottom:20px; left: 20px; content: ''; opacity: 1; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s;}
figure.effect-bubba figcaption::before { border-top: 1px solid #fff; border-bottom: 1px solid #fff; -webkit-transform: scale(0,1); transform: scale(0,1);}
figure.effect-bubba figcaption::after { border-right: 1px solid #fff; border-left: 1px solid #fff; -webkit-transform: scale(1,0); transform: scale(1,0);}
figure.effect-bubba h3 { padding-top: 30%; -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; -webkit-transform: translate3d(0,-20px,0); transform: translate3d(0,-20px,0);}
figure.effect-bubba p {padding: 10px 0; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(0,20px,0); transform: translate3d(0,20px,0);}
figure.effect-bubba:hover figcaption::before,figure.effect-bubba:hover figcaption::after { opacity: 1; -webkit-transform: scale(1); transform: scale(1);}
figure.effect-bubba:hover h3,figure.effect-bubba:hover p {  opacity: 1; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}

@media (min-width:1002px) {
     
.series li:nth-child(1){ width: calc(50% - 30px);margin:30px 15px;}
.series li:nth-child(2){ width: calc(50% - 30px);margin:30px 15px; }
 .series li { width: calc(50% - 30px);margin:30px 15px;  }
}



.product { width:100%;   position: relative;  margin:3% auto;  display: flex; flex-wrap: wrap; align-items: flex-start;  }
.product li{  display: flex;  flex-wrap: wrap;  align-items: flex-start;  width: calc(100%/4 - 30px);  margin:40px 15px; padding:0px;  background:rgba(255,255,255,.9); position: relative;  transition: all 0.5s ease 0s;box-shadow:0px 1px 10px rgba(208,171,103,.2);     }
.product li a{  display: flex; flex-wrap: wrap; align-items: center;justify-content: center; }
.product li img{ width:100%; max-width:100%; height: auto; display: flex; margin: auto; align-items: flex-start;   transition: all 0.5s ease 0s;background-image: linear-gradient(145deg, #fff 30%, rgba(225,225,225,.5) 100%);}
.product li img:hover{  transform: scale(.99);  margin: auto; }
.product li:hover h3{transform: scale(0.9); color:#ff2c4b; }
.product li h3{ width: 100%; justify-content: center; margin:20px auto; font-size:1rem; font-weight:400;  text-align: center; line-height:1.4rem;  color:#212121;   transition: all 0.5s ease 0s;  text-transform: capitalize; overflow: hidden;  word-break: break-all;  text-overflow: ellipsis;  display: -webkit-box; -webkit-line-clamp:2;  -webkit-box-orient: vertical;min-height: 44px; }
.product li p{ font-size:0.75rem; color:#726A6A; line-height:1.2rem;  margin: 0 auto 10px auto; text-align: center;overflow: hidden; word-break: break-all;  text-overflow: ellipsis;  display: -webkit-box; -webkit-line-clamp: 3;  -webkit-box-orient: vertical;}
span.price{ display: flex; width:50%;  justify-content: center; margin: 0 auto 10px auto;font-size:.935rem; font-weight:700;  color:#ff2c4b;  }
span.old-price{  font-size:.875rem;   color:#acacac;text-decoration: line-through;  }
.product li:after,.product li:before {pointer-events: none; content: ''; width: 100%; height: 100%; box-sizing: border-box;  position: absolute; top: 0;  left: 0;  transform: scale(0); transition: 0.5s;}
.product li:after { border-top: 2px solid #ff8a8b;  border-right: 2px solid #ff8a8b; transform-origin: 100% 0%;}
.product li:before { border-bottom: 2px solid #ff8a8b; border-left: 2px solid #ff8a8b;  transform-origin: 0 100%;}
.product li:hover:after,.product li:hover:before { transform: scale(1);}
.pro-box{ flex:0 0 100%; padding:0; display: flex; flex-wrap: wrap;  border: 1px solid #f2f2f2; border-bottom: 0;}
.pro-box .sepc_type {margin: 0 10px 10px;border-radius: 5px;font-size: 18px;padding-top: 3px;padding-bottom: 3px;}
.pro-box .sepc_type:focus {box-shadow: unset;}
.pro-box .sepc_type option {font-size: inherit;}
.tool { width: 100%; height:100%; padding:0px;  margin: auto;  display: flex; flex-wrap: wrap;  border-top: solid 1px #f2f2f2;border-bottom: solid 1px #f2f2f2;  }
.tool a{  height: 40px;   margin: 0; background: #fff;   }
.tool a span{line-height: 40px;font-size: 14px;}
.tool a:nth-of-type(1) { width: 50%;  border-right: solid 1px #f2f2f2; }
.tool a:nth-of-type(2) { width: 50%;}
.tool a:hover:nth-of-type(1) { background: #343434; color: #ccc;}
.tool a:hover:nth-of-type(2) { background: #ff0b51;color: #ccc; }
.tool i.fa-shopping-cart{width: 25px;height: 30px;display: block;margin: auto px auto 0;background:url("../images/icon/icon-shopping-w.svg") no-repeat center 3px;background-size: 20px 20px;}
.tool i.fa-heart{width: 17px;height: 17px;display: block;margin: auto 5px auto 0;background:url(../images/icon/love.svg) no-repeat center 0px;}
.tool i.fa-delete{width:30px;height:30px;display: block;  margin: auto 5px auto 0;  background:url(../images/icon/del.svg) no-repeat center 0px; background-size:26px 26px;  }
.tool a:hover i.fa-shopping-cart{  background-image:url("../images/icon/icon-shopping-b.svg");  }
.tool a:hover i.fa-heart{background-image:url(../images/icon/love-b.svg) ;  }
.tool a:hover i.fa-delete{background-image:url(../images/icon/del-s.svg) ;  }


.note { position: absolute; top: 0; left: 0; height: auto; border-radius:0;  padding:5px 10px; font-size: 0.9rem; font-weight:700; line-height: 1.5em;text-shadow: 0px 1px 0px rgba(0,0,0,.5);  z-index:9;  }
.note:after { content: ''; position: absolute; left: 0; top:0; z-index: -1;  width: 0;  height: 0; border-style: solid; border-width: 80px 80px 0 0; border-color: #ff0b51 transparent transparent transparent;}
.note.on-sale {  color: #fff; border-color:#aa2d2b;   }
.note.no-stock { color: #fff;   border-color:#c19e57; }



@media (max-width:1024px) {
.product li{  width: calc(100%/3 - 10px);  margin:10px 5px;  } 
}
@media (max-width:768px) {
.product li{   width: calc(100%/2 - 10px); }
.tool i.fa-shopping-cart{width:26px;height:26px;  background-size:22px 22px;   }
.tool i.fa-heart{width:26px;height:26px; background-size:22px 22px;  }
.note {   font-size: 0.75rem; font-weight:400;}
.note:after { border-width: 60px 60px 0 0;  }
.tool i.fa-delete {width:26px;height:26px;  background-size:22px 22px;}
}
@media only screen and (max-width:470px){
  .tool a {
    height: unset;
  }
  .product li a{
    flex-direction: column;
  }
  .tool i {
    margin: 0 !important;
    margin-top: 5px !important;
  }
  .tool a span {
    line-height: 30px;
  }
}
@media only screen and (max-width:375px){
  .tool a span {
    font-size: 14px;
}
}
@media only screen and (max-width:320px){
  .tool a span {
    line-height: 20px;
    font-size: 13px;
}
}
 
 /*best-wrap============================================================*/
.best-wrap{  width: 100%; max-width: 1280px;  margin:0 auto; padding:0px 0px 40px 0px;  display:flex; flex-wrap: wrap; justify-content: center; align-content: flex-start;  }
.best-wrap .product { width:100%;   margin:2% auto;  }
 .product-wrap  { width: 100%; max-width:1280px; display: flex; flex-wrap: wrap; padding:15px; margin:0 auto 20px auto; position: relative;   z-index:12;  }


 /* promotion  ============================================================*/
.promotion { width:100%;margin:10px auto 20px auto; padding:8px 5px; font-size:0.875rem; font-weight:400; display: flex;  flex-wrap: wrap; flex-direction: row; justify-content: flex-start;  align-content: flex-start; border:1px solid #c9d7de;  background:#fff;  border-radius: 5px;}
.promotion a{color:#e36369; }
.coupon{  width:35%;margin:0px; padding:3px; color:#a5b2b9; text-align: center; border-right: 1px solid #a5b2b9;}
.label { width:65%; margin:5px;padding:3px;    }
 a.ticket{padding:2px 5px; margin:0px 5px;  color:#fff; border: solid 1px #a5b2b9; background:#a5b2b9;}

 /* Products Detail ============================================================*/
.leftwrap {width: 50%; display:flex;  flex-wrap: wrap; margin:0 auto; padding:0px 20px;  position: relative; z-index: 1; justify-content: flex-start; align-content: flex-start; }
.leftwrap ul.slider{ width: 100%; height: auto; display:flex; margin:0 auto 30px auto;  }
.leftwrap ul.slider li img{width: 90%; margin:0px auto; }
/****rightwrap============================================================*/
.rightwrap { width:50%;  display:flex; margin:0px auto 80px auto; padding-left:30px; flex-wrap: wrap; flex-direction: column;   position: relative; z-index: 1;}
.rightwrap h1{  margin: 5% 0 0 0;  padding:0 0 2px 20px; font-size:2rem;font-weight: 700; text-align: left; color:#50585c;  display:flex; position: relative; z-index: 999;  background: linear-gradient(transparent 80%, #ffeaea 70%); }
.rightwrap h1:after { position: absolute; top: 50%; left:0; transform:translateY(-50%); content: ''; width: 10px; height:10px;  background-color:#ffeaea; border-radius:100%;}

.product-info { width: 100%;margin:0 auto; padding:10px; display: flex;  flex-wrap: wrap; align-content: flex-start; text-shadow: none;}
.product-info p {margin-bottom: 10px; font-size:0.9rem; line-height: 1.5rem; font-weight:400; color:#50585c; }
.product-info ul { width: 100%;margin:0 auto; display:flex; flex-wrap: wrap;   flex-direction: column; justify-content: flex-start; }
.product-info ul li {margin:5px auto;  width: 100%;  display:flex; flex-wrap: wrap; font-size:0.875rem; font-weight:400; }
.product-info li span{ display: inline-flex;}
.product-info li select, .product-info li input { width: 90%; max-width:200px;  height: 30px; padding: 5px; border: solid 1px #ccc; border-radius:0px;  }
.product-info li.short-description {  display:flex;  flex-wrap: wrap;   padding:10px;  margin: 0px;  border-bottom: 1px dashed #e8e8e8; }
.product-info li span.field { width:20%;   align-items: center;  padding:0px; }
.product-info li span.value{ width: 80%;    align-items: center;   }
.store { display:flex;  flex-wrap: wrap; }
.store img{ display:flex;width: auto; height: 20px; margin: 5px; }

.product-info li.product-tag { border-bottom: 1px dashed #e8e8e8;}
.tag{ display:flex; margin:5px; padding:8px 15px;  width:auto;  font-size: 0.875rem;  justify-content: center;  align-items: center; color:#fff;; background:#a5b2b9; border-radius: 5px;  }
.product-price { margin:10px 0px 10px 0px!important;  padding:5px 0px; display:flex; flex-wrap: wrap; flex-direction: row;  position: relative;  text-align: left;font-size:1.375rem; color:#990808;  font-family: "Times New Roman", "serif";}
.product-price .origin { width:auto; margin: 10px; color: #999;  font-size: 1rem; text-decoration: line-through; }
.product-price .sale { font-size: 2rem; font-weight:700; color: #990808; }
.product-price .sale span{ font-size: 14px; font-weight:400; color:#990808; }
.product-info li.add { flex-direction: row; justify-content: flex-start;  margin:20px 10px;}
.product-info li.shipping{ display:flex; padding:10px 10px 20px 100px;  margin: 0px;background: url(../images/icon/shipping.svg) no-repeat left top; background-size: 80px;  }
.product-info li.shipping p { display:flex;  margin-bottom: 1px; font-size:0.75rem; color: #47382a; line-height: 1.65em; font-weight: 400; }
.product-info li.add select { width: 90%; max-width:200px;  height: 30px; padding: 5px; border: solid 1px #ccc; border-radius:0px;  }
.product-info li span.size{ width: 70%; display: flex;  flex-wrap: wrap;   flex-direction: row; justify-content: flex-start; align-items: center;}
.product-info li span.order{ width: 100%; margin: 5px auto; display: flex;  flex-wrap: wrap;   flex-direction: row; justify-content: flex-start; align-items: center;}
.product-info li span.order button{  flex: 0 0 31%; margin: auto ; }
.product-info li span.surplus {   align-items: center; padding-left: 10px; font-size:0.875rem;  text-align: center;  color:#c74060; }
.product-variation { cursor: pointer;font-size: 0.85rem; display: inline-block;  min-width: 5rem;  -moz-box-sizing: border-box; box-sizing: border-box; padding: 0 .75rem; height: 2.125rem; line-height: 1;  margin: 0 8px 8px 0; color: rgba(0,0,0,.8); text-align: center; white-space: nowrap;  border-radius: 2px;  border: 1px solid rgba(0,0,0,.09); position: relative;  background: #fff; outline: 0;}
.product-variation:hover{ border: 1px solid #990808; color: #990808;}
.product-info li span.extra{ display:flex; margin:0px 5px; padding: 3px 15px; font-size:0.875rem; text-align: center; color:#fff; background:#a99e73;    border:solid 1px #a99e73; }
.product-info li span.extr-txt { display:flex; margin:0px 5px; padding: 3px; font-size:0.875rem; color: #000;   }
.product-info li span.extr-txt a{text-decoration: underline; color:#a99e73;}
 
.quantity { height: 36px; width:40%; margin:8px 0; display: flex;  flex-direction: row; justify-content: space-between; align-content: center; border:solid 1px #50585c; border-radius: 10px;}
.quantitybutton { display: flex;  width:40px;  height: 34px;font-size:1.125rem; font-weight:700;  padding: 0;}
.plus {display: flex;  flex-wrap: wrap; justify-content: center; align-content: center;    border-top-right-radius: 9px;border-bottom-right-radius: 9px;  border-left:  solid 1px #50585c;  }
.minus {display: flex;  flex-wrap: wrap; justify-content: center; align-content: center;   border-top-left-radius: 9px;border-bottom-left-radius: 9px;  border-right:  solid 1px #50585c;}
.plus:hover,.minus:hover { color: #ffffff; background:#343434; cursor: pointer; transition: all .3s ease-in-out;}
.quantity p { display: flex; flex-wrap: wrap; justify-content: center;  align-content: center; height:34px;  font-size:1.125rem; font-weight:400;  }

.rightwrap ol.page { width: 100%;  margin:10px auto; display: flex;  flex-wrap: wrap; flex-grow: row; }
.rightwrap ol.page li {  flex: 0 0 30%;   list-style-type: none; margin:0 auto 2% 5px;  }
.rightwrap ul.social-icons{ width: 100%;  margin: 0px auto; display: flex;  flex-wrap: wrap; font-size:0.875rem;   color: #9b784f; }
.rightwrap ul.social-icons li a:hover{ transform: scale(1.1); opacity:1;  }
.rightwrap ul.social-icons li{display: flex; width: auto; color: #50585c;}
.rightwrap ul.social-icons li.facebook a,.rightwrap ul.social-icons li.instagram a, .rightwrap ul.social-icons li.line a{ width:24px; height: 24px; background-size:auto 20px ;   }
 @media (max-width:768px) {
.product-info {padding:0px; }    
.product-info li.add { width: 100%; }
.product-info li.add span.field { width:100%; margin-right: 0px; }
.product-info li.add span.value{ width: 100%; margin:20px auto; }
.product-info li.add span.value a.btn{ width: 50%;}	
.product-info li.add span.value a.btn.btn-love{ padding-left:0px; }	
.quantity { width: 70%;	}
.product-info li span.order button{  flex: 0 0 45%; margin:10px 5px ; }
.container {padding: 0px;}   
#parentHorizontalTab{padding:30px 0px;}
 .leftwrap{ width: 100%; display: flex;   }	
.rightwrap { width: 100%; display: flex; padding: 0px; margin: 0px auto;}
.promotion { width:100%; flex-direction: column;}
.coupon{  width:100%; border-right: none;  border-bottom: 1px solid #a5b2b9;}
.label { width: 100%; padding:3px;  }
.product-info li span.field { width:40%;   padding:0px;  margin-right:5px; }
.product-info li span.value{ width: 56%;  display: inline-flex;  font-weight:400;  color: #52575c;   }
 .fix{  width: 100%; background: #fff;left:0px; bottom:0; position: fixed; z-index: 9999; visibility: visible; opacity: 1; }
.product-info li span.order.fix button{  width: calc(50% - 60px); margin: 15px 8px; }    
.product-info li span.order.fix button:last-child{ display: none;}  
     
     
}
 


/*------------information---------------------*/
.information { width: 100%;  margin: 0 auto;}
 /***tab size*/
.edit{ width:100%; max-width:1280px;   margin:10px auto;padding:10px; }
.edit-title{ text-align: center;font-size:1.35rem; font-weight: 700;}
.edit-title span{ position: relative; display: inline-block; padding-bottom:0.5em; border-bottom: 1px solid black;}
.edit-title span::before,.edit-title span::after { position: absolute; top: 100%;  left:50%; transform:translateX(-50%);  content: ''; border: 10px solid transparent;}
.edit-title span::before { border-top: 10px solid black;}
.edit-title span::after { margin-top: -1px; border-top: 10px solid white;}
.edit p{ margin:2% auto; font-size:1rem; line-height:2rem; color:#47382a;}
.edit p strong{ padding-bottom:2em; font-weight: 700;  color:#990808; }



hr.separator-no-padding {  margin-top: 0px; margin-bottom: 0px;}
hr { margin: 27px 0px 27px 0px; border: 0;  border-top-width: 1px; border-style: solid; border-color: #eaeaea;}

ul.list>li { text-align: center; display: flex;}
ul.list li p.num { font-size: 1rem;  width: 100px;  margin-right: 4px; padding-top: 50px; line-height: 1.6;}
ul.list li p.title { font-size: 1.25rem; font-weight: 700; width: 300px; margin: 0 4px; padding: 50px 25px 0 25px; line-height: 1.6; color: black; }
ul.list li p.textarea,ul.list li ol,ul.list li ul { font-size: 1rem; width: 763px; margin-left: 4px; padding: 50px 0 50px 40px;  text-align: justify; line-height: 1.6;}
ul.list li>* {  border-bottom: solid 1px #ccc;}
ul.list li:first-child>* {  border-top: solid 2px #000;}
ul.list li:last-child>* { border-bottom: solid 2px #000;}


/* Grid ======================================================================= */
.md-row { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -15px; }
.flex-center{  justify-content: center; align-items: center; margin: auto;}
.flex-right{justify-content: flex-end;}
.flex-v{align-items: flex-start; align-content: flex-start;justify-content: center; }
[class^="md-gd-"] { padding: 10px 15px; }
.md-gd-1 { width: 8.33333%; }
.md-gd-2 { width: 16.66667%; }
.md-gd-3 { width: 25%; }
.md-gd-4 { width: 33.33333%; }
.md-gd-5 { width: 41.66667%; }
.md-gd-6 { width: 50%; }
.md-gd-7 { width: 58.33333%; }
.md-gd-8 { width: 66.66667%; }
.md-gd-9 { width: 75%; }
.md-gd-10 { width: 83.33333%; }
.md-gd-11 { width: 91.66667%; }
.md-gd-12 { width: 100%; }
.one-pic {padding:0;}
@media all and (max-width: 959px) { 
.md-row { margin: 0 -5%; }
.md-reverse{ flex-direction: column-reverse;}
[class^="md-gd-"] { width: 100% !important; padding: 10px 5%; } 
.one-pic {
    padding: 10px 5%;
}
  }
@media all and (max-width:768px) { 
  .md-gd-2 { width:50% !important;  }
  
}

/* tab edit custom ======================================================================= */
.padding-v{padding: 40px 0;;}

.quad-block-padding { padding: 144px;}
@media (max-width: 1699px) {
.quad-block-padding { padding: 108px; }
}
@media (max-width: 1499px) {
.quad-block-padding { padding: 72px; }
}
@media (max-width: 959px) {
.quad-block-padding {  padding: 54px 36px 54px 36px; }
}
.custom-wrap{padding:2vh 2vw; }
.bg-gray{background:rgb(77, 77, 77);}
.bg-gray-2{background: #ECEFF0;}
.bg-gray-3{background: #ECEAE9;}
.bg-light{background: linear-gradient(to bottom, #D5DEE7 0%, #E8EBF2 50%, #E2E7ED 100%), linear-gradient(to bottom, rgba(0,0,0,0.02) 50%, rgba(255,255,255,0.02) 61%, rgba(0,0,0,0.02) 73%), linear-gradient(33deg, rgba(255,255,255,0.20) 0%, rgba(0,0,0,0.20) 100%);
 background-blend-mode: normal,color-burn; }
.bg-green{background-image: linear-gradient(135deg, #67a2d2 0%, #afffa3 100%);}
.bg-white{background:#FFF;}
.bg-yellow{background:#F7EDDC;}
.bg-lightyellow{background:#FDF3E4;}
.bg-pink{background:#FF9999;}
.bg-black{background:#1D1D1D;}
.bg-brown{background: #866E5F;}
.bg-blue{background: #9BB4D7;}


.bg-block-2{ background:url("../images/index/tab-2.jpg") no-repeat left bottom; background-size: cover; }
.bg-block-3{ background:url("../images/index/tab-3.jpg") no-repeat 20%; background-size: cover; }
.bg-block-4{ background:url("../images/index/tab-4.jpg") no-repeat 20%; background-size: cover; }
.bg-block-5{ background:url("../images/index/pd001.png") no-repeat 20%; background-size: cover; }
.bg-block-6{ background:url("../images/index/pd004.jpg") no-repeat 20%; background-size: cover; }
.bg-block-7{ background:url("../images/index/pd005.jpg") no-repeat 20%; background-size: cover; }
.bg-block-8{ background:url("../images/index/pd006.jpg") no-repeat 20%; background-size: cover; }
.bg-block-9{ background:url("../images/index/pd010.jpg") no-repeat 20%; background-size: cover; }
.bg-block-10{ background:url("../images/index/pd013.jpg") no-repeat 20%; background-size: cover; }
.bg-block-11{ background:url("../images/index/pd015.png") no-repeat 20%; background-size: cover; }
.bg-block-12{ background:url("../images/index/pd018.jpg") no-repeat 20%; background-size: cover; }
.bg-block-both .md-row { margin: 0; }
.font-large{ font-size:3rem; font-weight:700;  }
.font-m{font-size:.875rem; font-weight:700;}
.font-s{font-size:1rem; font-weight:700;}
.text-shadow{text-shadow:0px 1px 3px rgba(0,0,0,.3); }
.block-9-space {height: 300px;}
.bg-block-both .flex-center {
    align-items: baseline;
    text-align: left;
}
.bg-block-both .flex-center span { color: #FF0000;}


.section { position: relative; width: 100%; box-sizing: border-box; text-align: center; background-position: center; background-size: cover;}
.title-h1 { font-size: 2.35rem; line-height:2.5rem; margin: 35px auto;  font-weight: 700;}
.title-h1 h4{ font-size: 2.75rem;   font-weight: 700;}
.title-h1 p{font-size: 1.5rem; margin:1% auto; line-height:2rem; }
.title-h2 { font-size: 24px; line-height:2.5rem; margin: 35px auto;font-weight: 700;}


.icon-1{width: 100px; height:82px;margin: auto auto 20px auto; background: url("../images/icon/index-01.svg") no-repeat center top; background-size: 100px 82px; }
.icon-2{width: 100px; height:82px;margin: auto auto 20px auto; background: url("../images/icon/index-02.svg") no-repeat center top; background-size: 100px 82px; }
.icon-3{width: 100px; height:82px;margin: auto auto 20px auto; background: url("../images/icon/index-03.svg") no-repeat center top; background-size: 100px 82px; }
.icon-4{width: 100px; height:82px;margin: auto auto 20px auto; background: url("../images/icon/index-04.svg") no-repeat center top; background-size: 100px 82px; }

@media all and (max-width:768px) { 
.title-h1,.title-h1 h4,.title-h1 p,.title-h2{ font-size: 110%; line-height:1.5rem;}
.text-border-w {text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;}
}
.progress{ background-color: #50585c; color: #fff; padding:5px;  }
 




  /*blog-wrp
======================*/
.blog-wrp { width: 100%; padding:0px 15px; margin:4% auto 0 auto; position: relative; }
.blog { width: 100%;  max-width:1360px;  margin: auto; display: flex; flex-wrap: wrap; flex-direction: row; justify-content: flex-start; align-content: center; }
.blog li{ display: flex;  flex-wrap: wrap;  width: calc(100%/2 - 20px); margin: 30px 10px; padding:0px;   transition: all 0.3s linear 0s;    position: relative;}
.blog li figure { position: relative; overflow: hidden;  width:100%; max-width:80%; height: auto; align-items: flex-start;   transition: all 0.5s ease 0s; margin: 0 auto;}
.blog li figure img {  width: 100%; max-width: 100%; transition: all 0.3s;}
.blog li:hover figure img { transform: scale(1.1);  }
.blog li .inner { position: relative; width: 100%;   padding:10px; }
.news-title { margin: 0; padding:10px 0px; color: #50585c; font-size:1rem;  transform: scale(1);transition: all 0.3s;  }
.news-title:hover{ color:#ff0b51;  transform: scale(1.05);}
.blog li div.tag { display: flex; flex-wrap: wrap; flex-direction: row; transition: all 0.3s cubic-bezier(0.37, 0.75, 0.61, 1.05) 0s; overflow: hidden; text-transform: capitalize;  word-break: keep-all; background: none; width: 100%; padding-left:0px; margin: 0;}
.blog li div.tag a{ color: #c9ab79; margin:4px; font-size:0.75rem;  }
.blog li div.tag a:hover{color:#ff0b51;}

@media (min-width:1024px) {
.blog li{  width: calc(100%/3 - 30px);  margin:40px 15px;  } 

}
@media (min-width:1160px) {
.blog li{  width: calc(100%/4 - 30px); margin:40px 15px; /*border:solid 1px rgba(208,171,103,.3);*/ }
}

/* 加價購 */
#lower-picked {margin: 20px 0;}
.relatedAll {display: flex;align-items: center;}
.relatedAll_input{width: 20px;height: 20px;margin-right: 10px;}
.relatedAll_input input{width: 20px; height: 20px;}
.relatedAll_img{max-width: 90px;margin-right: 10px;}
.relatedAll_txtbox{line-height: 1.5;}