.main-area.top { background-color:#fff;}
.product-arera{ padding: 0px;  margin-top:30px; width: 100%; display: flex; flex-wrap: wrap;}
.main-area.top .product-arera{  margin-top:0px; padding: 0px 20px;  }
.product-arera .main-content {width:calc(100% - 300px);  position: relative;  padding:0px 0px 30px 0px; margin-top:0px; margin-bottom: 30px; border-radius: 20px; background: #fff; /*box-shadow: 0 4px 30px hsla(0,0%,46.7%,.2); */ }
.bg{background-image: linear-gradient(to top, #d8e1e9 0%, #fff 100%);}
@media (min-width: 992px) and (max-width: 1199.98px) { 
.product-arera{ margin-top: -50px;  padding:0px;}
.product-arera .main-content {width:calc(100% - 240px);   margin-top: 40px; }
}
@media (max-width: 992px) {
.product-arera{   margin-top:auto;}
.product-arera .main-content {width:100%;  padding:0px;   margin-top: 0px;  box-shadow: none;  }
}
@media (max-width: 840px) {
.main-area.top .product-arera{margin-top:0px; }	
.product-arera{ margin-top:0px;  padding:0px;}
}
@media (max-width: 767.98px) {
.product-arera{  padding:0px;}
}
 
/*font-size*/
.title { font-size: 1.25rem; font-weight: 700; width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow-wrap: break-word; transition: 375ms cubic-bezier(0.7, 0, 0.3, 1); }
@media (min-width: 768px) {
.title {font-size: 1.5rem; }
}
@media (min-width: 1100px) {
.title {font-size: 1.75rem; }
}
@media (min-width: 1300px) {
.title {font-size: 1.875rem; }
}
@media (min-width: 1600px) {
.title {font-size: 2rem; }
}

.content-wrap{ padding: 0px 30px}
@media (max-width: 992px) {
.content-wrap{ padding: 0px}
}


.type-list { background:#051f4c;padding-top:75px; margin-bottom: 70px;}
@media (max-width: 840px) {
.type-list {  padding-top:25px;  }	
}
@media (max-width: 767.98px) {
.type-list #cssmenu{margin: 10px auto}
}

.bg-pro{  background-color: #e5eaef; border-radius:  30px 350px 30px 30px;}

.product{width: 100%; padding: 50px 0px; display: flex; flex-wrap: wrap; justify-content: flex-start; position: relative; z-index: 1;}
@media (max-width: 992px) {
.product{  width: calc(100% + 40px); margin: auto -20px;  padding:0px 0px 50px 0px;  }    
}

@media (min-width: 1600px) {
.product{width: 100%; padding: 50px ;  margin: auto; }
}

.product li { width:100%; margin: 50px auto;  transition: all 0.3s linear 0s; list-style: none;position: relative; z-index: 1; }
.product li .item{width: 100%; padding: 0px 20px;  display: flex; flex-wrap: wrap; overflow: hidden; background-image: linear-gradient(to top, #d8e1e9 0%, #fff 100%); border-radius:30px; /**/}
.product li:nth-child(even) .item{flex-direction: row-reverse}
/*font-size*/
.product li h3 { margin-bottom: 20px; color:#191970; font-size:2.5rem; font-weight: 900; line-height:2.75rem; overflow: hidden;white-space: pre-line;word-break:normal; word-wrap:break-word; text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp:3;  -webkit-box-orient: vertical;  }
.product li h3 a{color:#191970;}
.product li h3:before{ position: absolute; transition: 0.3s; content: ""; width: 100%; left: 0; bottom: 0; height: 1px; background:#b8bfcd;}
.product li .photo { width: 40%; height: auto; padding:0px; margin: auto;  overflow: hidden;  position: relative; border-radius:30px;  box-shadow: rgba(0, 0, 0, .18) 0 5px 13px 0; }
.product li .photo figure{ width: 100%;  padding-top:100%;height: 0; border-radius:30px; object-fit: cover; overflow: hidden; position: relative; transition: all 0.5s ease 0s; background-color: #fff; } 
.product li .inner-box {width:60%;margin:0 ; padding: 25px 30px 30px 30px;  position: relative; z-index: 9; transition: all .4s ease;   }
.product li .inner-box .inner-txt{ margin: 20px 0px 40px auto;   }
.product li .inner-box .desc { font-size:1.15rem; line-height:1.875rem;font-weight:400; color: #000;overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow-wrap: break-word; transition: 375ms cubic-bezier(0.7, 0, 0.3, 1);}

.product li .inner-box .series{margin: 20px 10px;}
.product li .inner-box .series ul{width: 100%;margin:30px 0px 0px 0px;padding: 0px; display: flex;flex-wrap: wrap; }
.product li .inner-box .series ul li{width:calc(100%/2);margin:0px 0px 20px 0px;padding: 0px;font-size: 1.375rem; font-weight: 900; position: relative  }
.product li .inner-box .series ul li:nth-child(even):after{content: ""; width: 1px; height: 100%; position: absolute; left:-80px; top:0px; background: #777}
.product li .inner-box .series ul li:nth-child(even) ul li:nth-child(even):after{display: none;}
.product li .inner-box .series ul li a{ color:#191970;  }
.product li .inner-box .series ul li ul{margin:20px 0px 0px 0px;}
.product li .inner-box .series ul li ul li{width:100%;margin: 0px 0px 10px 0px;padding: 0px;font-size: 1.125rem; font-weight: 400;  }
.product li .inner-box .series ul li ul li a{ color:#334f60; border-bottom:none  }
.product li .inner-box .series ul li a:hover{ color:#ef430a;  }
.product li .inner-box .btn-1{max-width: 200px;}

.top-title { flex: 1 1 auto; text-transform: uppercase;padding-bottom: 20px; position: relative;  overflow: hidden; transition: 0.3s;}
.top-title:after { position: absolute; transition: 0.3s; content: ""; width:20%; left: 0; bottom: 0; height: 3px; background:#ef430a;}
.top-title:hover { cursor: pointer;}
.top-title:hover:after { width: 100%; left: 0;}
@media (max-width: 1440px) {
.product li .inner-box .desc { font-size: 1.125rem; line-height: 1.5rem;  }   
}
@media (max-width:840px) {
.product li { margin:30px 20px;}   
.product li .photo{  width:60%; padding: 0px;margin: auto; box-shadow: none;background-color: transparent}
.product li .inner-box { width: 100%; margin: 0px auto;padding:30px 20px ;border-radius: 0px 0px 30px 30px;   }   
.product li .inner-box .inner-txt{  width: 100%; margin:20px auto 10px auto;  }  
.product li h3 {font-size:1.875rem;line-height: 2rem; letter-spacing: 0px; }   	
 }
@media (max-width:767.98px) {
.product li { margin:30px 10px;   }
.product li .photo{  width:100%;}
.product li .inner-box { padding:0px 10px;} 
.product li .item{ padding: 0px 20px 20px 20px;  }
.product li h3 { min-height:auto;  font-size:1.375rem; line-height: 1.5rem; }   
.product li .inner-box .desc { font-size: 1rem; line-height: 1.175rem;  }   
.product li .inner-box .series{margin: 20px 0px;}
.product li .inner-box .series ul li{width:100%; }	
}
	
@media (max-width:320px) {
.product li { width: calc(100% - 40px); margin: 50px auto;  }
.product li .item{ padding: 0px 10px 20px 10px;  }
.product li h3 span{font-size: .9rem;}
}

/*--分類new-tag --*/
.new-tag {  width: auto; padding:5px 14px; font-size: 1rem; color: #fff;  text-transform: capitalize;  word-break: keep-all;  position: absolute; z-index: 99;left:0px; top:0px;  background-image: linear-gradient(135deg, #1c73e8 10%, #215285 100%);border-radius:30px 0px 30px 0px;  }
.new-tag a{color:#fff;}
.new-tag-red {  background-image: linear-gradient(135deg, #E91E63 10%, #e91e1e 100%); }
@media (max-width:992px) {
.new-tag {  width: auto; padding:5px 14px; font-size: .75rem; left:auto; right:0px; top: 0px; border-radius:0px 20px 0px 20px;   }
 }
@media (max-width:767.98px) {
.new-tag {  padding:2px 4px; font-size: .5rem;    }
 }
 /*----------------------------------------/
產品清單頁  cms-main-.product-item  
----------------------------------------*/
.product-item { width:100%; margin:0px auto;  padding:20px; display: flex; flex-wrap: wrap; position: relative; }
.product-item li {width:100%; margin:auto auto 80px auto; padding:0px;  list-style: none;  transition: all 0.3s linear 0s; position: relative;   }
.product-item li .item{  width:100%; margin: auto;  padding: 0px;  display: flex; flex-wrap: wrap;align-self: flex-start;  align-content: flex-start; align-items: flex-start;  transition: all 0.3s linear 0s;     }
.product-item li .photo { width:40%; padding: 30px; background-image: linear-gradient(to bottom, #d8e1e9 0%, #fff 100%); }
.product-item li figure{  width:100%; padding-bottom:100%; height: 0; overflow: hidden; position: relative; z-index: 1; transition: all 0.5s ease 0s;  }
 
.product-item .inner{ width:60%;  padding:0px 0px 20px 30px; position: relative;} 
.product-item .inner h3{ width: 100%;margin:10px 0px 20px 0px; font-weight:900; font-size: 2rem;  color:#191971; line-height:1.5rem;overflow: hidden;white-space: pre-line;word-break:normal; word-wrap:break-word; text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 3;  -webkit-box-orient: vertical; }
.product-item .inner h3:before{ position: absolute; transition: 0.3s; content: ""; width: 100%; left: 0; bottom: 0; height: 1px; background:#b8bfcd;}
.product-item .inner h3 a{ color:#172987; }
.product-item .inner h4{ width: 100%;margin: 10px 0px 20px 0px; font-weight:900; font-size: 1.5rem;  color:#191970; line-height:1.5rem;overflow: hidden;white-space: pre-line;word-break:normal; word-wrap:break-word; text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 3;  -webkit-box-orient: vertical; }
.product-item .inner p{ width: 100%; margin:5px 0px 10px 0px;  font-size:1.15rem; line-height: 1.5rem; font-weight: 400; color:#3b3b3b;} 
.product-item .inner-txt{padding: 10px 0px;}
/*hover*/
.product-item li:hover h3 a ,.product-item li:hover p a{color:#ef430a;}
.product-item li:hover img { transform: scale(1.05);  opacity: 1; }
 @media only screen and (max-width:1180px){
.product-item .inner h3{  font-size:1.875rem;  }
}
 
@media (max-width:992px) {
.product-item { padding:0px;  }	
.product-item li figure{ border-radius:20px;  }
.product-item .inner a p{   line-height: 1.125rem;  } 
}
 @media (max-width:840px) {
.product-item .inner h3{  font-size: 1.875rem; line-height: 2rem;  }
.product-item .inner h4{   font-size: 1.375rem;   }
	 
}
@media (max-width: 767.98px) {
.product-item { width: calc( 100% + 20px); margin:0px -10px;   }	 
.product-item li { margin: 10px; height: auto;}
.product-item li .photo { width:100%; padding: 30px;   }
.product-item .inner{ width:100%;  padding:0px 0px 10px 0px; } 
.product-item .inner h3{ font-size: 1.375rem; line-height: 1.5rem; margin:10px 0px; }
.product-item .inner h4{ font-size: 1.15rem; margin-bottom: 10px;}
.product-item .inner p{ font-size:1rem; line-height: 1.375rem; } 
}
 
/*---------------------------------
best-wrap
----------------------------------------*/
.best-wrap{  width: 100%;  margin:0 auto; padding:20px 0px;  background-image: linear-gradient(to bottom, #fff 0%, #e2e2e2 100%);   }
.best-wrap .product-item {width: 100%;  height: auto;  margin:0; text-align: left}
.best-wrap .product-item li{ width: 100%; margin: 10px; } 
.best-wrap .product-item li figure{max-width: 80%;}
.best-wrap .product-item .inner{ width: 100%;}
.best-wrap .product-item .inner h3{ font-size: 150% }
.best-wrap .slick-dots li {  width: 8px; height: 8px;  margin: 0 7.5px;  vertical-align: 6px; }
 i.arrow-r { width: 40px; height: 40px; top: auto; bottom: 10px; right: 0; margin: 3px 10px auto auto ; position: absolute;background: url("../images/icon/arrow-right-f.svg") no-repeat right top;   -webkit-transition: -webkit-transform .2s;  transition: -webkit-transform .2s; transition: transform .2s; transition: transform .2s, -webkit-transform .2s}
@media only screen and (max-width:1180px){
.best-wrap .product-item .inner h3{  font-size:1rem; line-height:1.5rem; }
}
@media only screen and (max-width:992px){
.best-wrap{ background-image: none;}
}
@media (max-width: 767.98px) {
.best-wrap .product-item{ width: calc(100% + 40px); margin:0px -20px;}	
 }

@media (max-width:320px) {
.best-wrap .product-item{ width: 100%; margin:0px;}	
.best-wrap .product-item li {width: calc(100%  - 20px);  margin:0px 10px;   }
}
  
/*----------------------------------------/
產品詳細內容區塊
----------------------------------------*/
.product-wrapper { width: 100%; margin:auto; padding:80px 0px;  display: flex;  flex-wrap: wrap; justify-content: space-between;  position: relative;}
@media (max-width:767.98px) {
.product-wrapper {padding:20px 0px;}
}
/*----------------------------------------/
圖片輪播區塊
----------------------------------------*/
.clearfix:after{clear:both;content:".";display:block;font-size:0;height:0;line-height:0;visibility:hidden;}
.clearfix{display:block;zoom:1}
.product-left{width:calc(50% - 30px);  padding: 0px 15px;  background-color:transparent;  }
.product-left::-webkit-scrollbar { display: none;-webkit-appearance: none;}
.product-left::-webkit-scrollbar:vertical { width: 6px; }
.product-left::-webkit-scrollbar:horizontal {  height: 12px;}
.product-left::-webkit-scrollbar-thumb { background-color:#000; border-radius: 5px; border:solid 2px #dfe7eb;}
.product-left::-webkit-scrollbar-track { border-radius: 0px;  background-color:#fff;}
 
.product-right{width:50%;  padding:0px 0px 0px 40px;  margin:0px auto;    }
@media (max-width:840px) {
.product-left{width:calc(100% - 30px);  }
.product-right{ width:100%; margin: auto; padding: 10px 0px;  }
}
@media (max-width:767.98px) {
.product-right{  padding: 10px 0px;}
}
.box-for{width: 100%; padding:40px; }
.box-for  figure{  width: 100%; padding-bottom: 100%; height: 0; overflow: hidden; position: relative; z-index: 1; transition: all 0.5s ease 0s;  }

.product-design{width: 100%; }
.slider-for{  width:100%; margin: 0px ; padding: 0px; list-style: none;  }
.slider-for li{ position: relative; width: 100%;  margin:0px;padding:0px;  }
.slider-for li figure{  height: 100%; padding-bottom:50%;  overflow: hidden; position: relative; z-index: 1; transition: all 0.5s ease 0s;  }
.slider-for .slick-prev,.slider-for .slick-next{  top:35%;}
@media (max-width:840px) {
.slider-for{  order: 2 }  
.slider-for li{  padding:0px;}    
}
@media (max-width:767.98px) {
.box-for{ padding:0px; }
.slider-for .slick-prev{ left:-15px;}
.slider-for .slick-next{ right:-15px;}   
}

 /*----------------------------------------/
btn區塊
----------------------------------------*/
 
.product-info{ width:100%; padding:30px 0px 0px 0px; display: flex; flex-wrap: wrap;   align-items:center;  }
@media (max-width:767.98px) {
.product-info{ padding:0px; }
}
.product-info-title { width:67%;  padding:0px 0px 20px 0px; margin: auto;   -webkit-box-sizing: border-box; box-sizing: border-box;  z-index:2; }
.product-info-title h1 {margin: 0px 0px 15px 0px;  font-weight:900; font-size:4rem;line-height: 3.75rem; letter-spacing:2px;  color:#191971; }
.product-info-title h1:before { position: absolute; transition: 0.3s; content: ""; width: 100%; left: 0; bottom: 0; height: 1px; background: #b8bfcd;}
.product-info-title h2{ margin-bottom: 20px; font-size:2.5rem; font-weight: 400;   word-spacing: normal; word-break:normal; }
.product-info-title h2 a{ background: linear-gradient(to right, #ff4600 30%,#913136 50%, #2c1c68 80%); background: -webkit-linear-gradient(to right, #ff4600 30%,#913136 50%, #2c1c68 80%); background-clip: text; -webkit-background-clip: text; color: transparent!important;  }
.product-info-title h2:hover{  text-decoration: underline;}
.product-info-title p{ font-size:1.15rem;line-height: 1.75rem; font-weight: 700;  margin-bottom: 20px; } 

@media (max-width:1024px) {
.product-info-title { width:100%;  padding: 40px 0px 0px 0px;  }
}
@media (max-width: 992px) {
.product-info-title h1 { font-size:3rem; }	
.product-info-title h2{ margin-bottom: 10px; font-size:1.125rem;}
}
@media (max-width:767.98px) {
.product-info-title {padding: 0px 20px 40px 20px;   }    
.product-info-title h1 { font-size:2rem;line-height:2.75rem;  }
.product-info-title p{ font-size:1.125rem;line-height: 1.5rem;   }   
}
@media (max-width:640px) {
.product-info-title {padding: 0px;}      
}
@media (max-width:320px) {
 .product-info-title h1 { font-size:1.75rem;line-height:2rem;  }  
.product-info-title p{ font-size:1rem; line-height: 1.375rem;}      
}
@media (max-width:280px) {
 .product-info-title h1 { font-size:1.5rem;line-height:1.75rem;  }  
}


.pdd-toggle-area{width:33%;margin:20px 0px 0px 0px; display: flex; flex-wrap: nowrap; align-items: center;  }
.pdd-toggle-area .btn{ width: calc(100%/2 - 10px); margin-right:10px; }
@media (max-width:1024px) {
.pdd-toggle-area{width:100%; margin:20px auto;  }
	
}

@media (max-width:320px) {
.pdd-toggle-area{flex-wrap: wrap; }
.pdd-toggle-area .btn{ width: calc(100% - 10px); margin-right:auto;margin-bottom: 10px; }
}
  

.product-info-subwrap{ padding: 20px 0px;  display: flex; flex-wrap: nowrap; border-top: solid 1px #000;border-bottom: solid 1px #000;}
@media (max-width:992px) {
.product-info-subwrap{flex-wrap: wrap;}
}

.product-taxonomy { width:100%; padding: 0px;  z-index: 999;}
 
.product-info-sub{ width: auto; flex-grow: 1; flex-basis: auto; }
.tax-items{ display: flex; flex-direction: row; flex-wrap: wrap; gap: 15px 30px;  width: 100%;  padding: 1em;border-radius:5px; background:#f2f4f7; }
.tax-item { width: auto; flex-grow: 1; flex-basis: auto; }
.term-label {  font-weight:900; color: #d52b1e; margin-bottom: 0;}
.terms { font-weight: 700; font-size: 0.9rem;}


.intro-icons-wrap{ width: auto; flex-grow: 1; flex-basis: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row;  -webkit-box-pack:flex-start;  -ms-flex-pack: end; justify-content:  flex-start;  -webkit-box-align:  flex-start;-ms-flex-align: flex-start; align-items: flex-start;}

.pro-icon {  display: -webkit-box; display: -ms-flexbox;  display: flex;  -ms-flex-wrap: wrap; flex-wrap: wrap;  -webkit-box-orient: vertical;  -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;  -webkit-box-pack: center;  -ms-flex-pack: center; justify-content: center;  -webkit-box-align: center; -ms-flex-align: center;  align-items: center;  width: auto; min-width: 69px; height: 72px; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; border-radius: 27px; overflow: hidden; border: 1px solid #191971; margin-right: 17px;}

@media (max-width: 992px) {
	.intro-icons-wrap{ margin-bottom: 10px;}
.pro-icon { width: auto; height: 62px; border-radius: 24px; }
}
.pro-icon:last-child { margin-right: 0;
}
.pro-icon-ip {   color: #fff;  font-size: 1.35rem; line-height: 1em; font-weight: 700; background: #191971;;  }
@media (min-width: 768px) and (max-width: 991px) {
.pro-icon-ip { font-size: 1.15rem;}
}
@media (max-width: 767px) {
.pro-icon-ip{ font-size: 1rem;}
}
.pro-icon-volt { font-size:1rem; line-height: 1rem; font-weight: 700;}
@media (max-width: 991px) {
.pro-icon-volt { font-size: .85rem; }
}
@media (max-width: 767px) {
.pro-icon-volt { font-size: .65rem;  }
}
.pro-icon-volt span { padding: 0px 10px;  height: 50%;  width: 100%; display: block; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center;  -ms-flex-align: center; align-items: center;}
.pro-icon-volt span.volt { background:#191971; color: #fff;}
.pro-icon-volt span.volt-label { background-color: #fff; color: #003474;}
 .tab-content {padding:0px;}
@media (max-width:767.98px) {
.tab-content {padding:0px;}
}

.product-description{ width: 100%; padding:0px; color:#3b3b3b;  }
.product-description p { margin: 5px 0px;font-size:1.15rem; line-height: 1.5rem; font-weight: 400; color:#3b3b3b; word-wrap:normal; word-spacing: normal; word-break:normal; }
.product-description span {  margin: 5px 0px; font-size:0.85rem;  font-weight: 400; color:#888;  word-spacing: normal; word-break:normal;}
.product-description p strong{color:#000;}

.specbox { width: 100%;padding:0px; margin: 10px; }
.specbox li{ width: 100%;padding:0px 0px 5px 0px; font-size:1.15rem; line-height: 1.5rem; font-weight: 400;}
.item-txt{padding:0px 0px 20px 0px;}
.item-txt .name{  font-size:1.15rem; line-height: 1.5rem; font-weight: 700;  }
 

@media (max-width:840px) {
.product-description p {  font-size:1rem;  }
.specbox li{ font-size:1rem; }
.item-txt .name{  font-size:1rem;   }
 }

.product-intro-name { margin-bottom: 50px; }
.product-intro-name h1 {margin: 0px 0px 30px 0px; padding-bottom: 15px; font-weight:900; font-size:4rem;line-height: 3.75rem; letter-spacing:2px;  color:#191971;position: relative }
.product-intro-name h1:before { position: absolute; transition: 0.3s; content: ""; width: 100%; left: 0; bottom: 0; height: 1px; background: #b8bfcd;}
.product-intro-name h1:after { position: absolute; transition: 0.3s; content: ""; width:20%; left: 0; bottom: 0; height: 3px; background:#ef430a;}
.product-intro-name h2{ font-size:1.75rem; font-weight: 700;   word-spacing: normal; word-break:normal; }
.product-intro-name p{ font-size:1.15rem;line-height: 1.75rem; font-weight: 700;  margin-bottom: 20px; } 
@media (max-width: 1199px) {
.product-intro-name { margin-bottom: 35px; }
}
@media (max-width:840px) {
.product-intro-name h1 {  font-size:3rem; }
.product-intro-name h2{ font-size:1.375rem; }
}
@media (max-width:767.98px) {
.product-intro-name h1 { font-size:2rem; }
}
.product-intro-title { -ms-flex-preferred-size: 66%; flex-basis: 66%;}
 
/*----------------------------------------/
自訂編輯區塊
----------------------------------------*/
.edit{width: 100%; max-width: 1160px; padding:15px 5px; margin: auto;}
.edit h4 img{display: block; width: 100%; max-width:600px;  margin: 15px auto!important;}
.edit .description{display: block; width: 100%; max-width:680px;  margin: 15px auto!important;}
.w5{ width: 50%; display: flex; flex-wrap: wrap; align-items: center;}
 
.spec{ width: 100%;  margin: auto; list-style: none; padding:50px 0px; counter-reset: index; }
.spec li { width: calc(100% - 56px); padding: 0px; margin-bottom: 15px; display: block;   counter-increment: index; position: relative;}
.spec li::before { margin-right: 20px; padding:5px; z-index: 3; content: counters(index, ".", decimal-leading-zero); font-size: 1.125rem; text-align: center;  font-weight: 700; font-variant-numeric: tabular-nums; align-self:center; ; background-attachment: fixed;  -webkit-background-clip: text; -webkit-text-fill-color: #fff;  background:#215284; border-radius:99rem;}
.spec li:hover{ background:#f8f7f7;}
.spec li .m-tag{ margin: 2px 5px; height: 26px; padding:0px 5px 2px 5px; background-color: #f66a2c; border-radius:10px; color: #fff; text-align: center;  position: relative;}
@media (max-width:768px) {
.spec li::before {display: block; margin: 0px; width:40px; height: 40px;}
.spec li { width:100%; }
}
 
.prod-group {margin-bottom: 70px;}
.prod-group-wrap{ display: -webkit-box; display: -ms-flexbox;  display: flex;  -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: horizontal;  -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row;  -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch;}

.prod-group-w5 { margin-bottom: 35px; padding-left: 0; padding-right:50px; -ms-flex-preferred-size: 50%; flex-basis: 50%; }
.prod-group-w10{ margin-bottom: 35px; padding-left: 0; padding-right: 0; -ms-flex-preferred-size: 100%; flex-basis: 100%; }
@media (max-width: 767px) {
.prod-group-w5 { margin-bottom: 35px; padding-left: 0; padding-right:0px; -ms-flex-preferred-size: 100%; flex-basis: 100%; }
}
 

/*table css*/
:root { --stickyBackground: #fff; --borderColor: #fff;}
.table-wrapper { width: 100%;  height: auto;  margin: 0px auto 30px 0px;  overflow: auto; }
@media (max-width: 991.98px) {
.table-wrapper { width: 100%; height: 320px; border: 1px solid var(--borderColor); overflow: auto;}
}
.datatable { width: 100%; border-spacing: 0; margin: auto; border: 1px solid var(--borderColor);}
@media (max-width: 991.98px) {
.datatable { width: 100%;}
}

.datatable thead { font-size: 12px; line-height: 16px; letter-spacing: 0; font-weight:700; }
.datatable tbody { font-size: .9rem;}
.datatable th {font-size:1rem; padding:15px 10px; white-space: nowrap; border-bottom: 2px solid var(--borderColor);  border-right: 2px solid var(--borderColor); }
.datatable td { font-size:.9rem; padding:15px 10px; white-space: nowrap; border-bottom: 2px solid var(--borderColor);  border-right: 2px solid var(--borderColor);}
.datatable tr td{ color:#191971;   font-weight: 700; }
.datatable tr  {background-color:#d4dde6;}
.datatable tr:nth-child(even) {background-color:#f0f0f0; }
.datatable tr:nth-child(even) td{color:#191971;  }
.datatable tr td:first-child{ font-weight:900;  }
.datatable tr.sticky {color: #fff; font-weight: 700; position: sticky;  top: 0;  z-index: 1;  background: linear-gradient(to right, #ff4600 0%, #191971 50%, #191971 100%);box-shadow: 0 0 6px rgba(0,0,0,0.25);}
.datatable th.sticky,.datatable td.sticky {  color: #000;  font-weight: 700;  position: sticky; left: 0; background: var(--stickyBackground);}
.datatable th.sticky::after,.datatable td.sticky::after {  content: ""; position: absolute; right: -6px; top: 0; bottom: -1px;  width: 5px; border-left: 1px solid var(--borderColor); background: linear-gradient(90deg, rgba(0,0,0,0.08) 0%, rgba(0,0,0,0) 100%);}
.datatable th.sticky::before,.datatable td.sticky::before { content: ""; position: absolute; left: -6px; top: 0; bottom: -1px;  width: 5px; border-right: 1px solid var(--borderColor); background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.08) 100%);}
 @media (max-width:320px) {
.datatable tr.sticky {   position: relative;  }
.datatable th.sticky,.datatable td.sticky {  position: relative; }
}
.w-list{ width: 100%; margin: auto; padding:0px; list-style: none}
.w-list li{ display: block; padding-left: 20px;  margin-bottom: 10px; font-size: 1rem;   font-size: min(max(3.5vw, .9rem),1rem);font-weight:400; line-height: 1.5; letter-spacing: normal; color: #000;  position: relative; }
.w-list li:before { width: 8px; height:8px; content: "";  left:0px; top:8px;position: absolute; background: linear-gradient(45deg, #ff4600 0%,  #ed4952 30%, #191971 100%); border-radius: 2px;}
.w-list li p{font-size: 1rem;   font-size: min(max(3.5vw, .875rem), 1rem);}
 @media (max-width:767.98px) {
 .w-list{  padding: 0px; }    
}
 
.spec-box{position: relative}
.spec-box .title-left{  width: 100%!important;  display: block; margin: 0; padding:20px 0px 10px 0px;   cursor: pointer; position: relative; }
.spec-box .title-left::before {position: absolute;  right:0px; top:30px; margin-right: 10px; content: ""; display: inline-block; vertical-align: middle; margin-top:10px; width:16px; height:16px; background-color:transparent;  border-top: 4px solid #ffa908; border-right: 4px solid #ffa908; -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); -webkit-transition: transform .5s; transition: transform .5s; }


.spec-box .spec-table {   height: auto; }
.spec-box.active .title-3::before { -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
.spec-box.active .spec-table { max-height: 0; overflow: hidden; padding:0px; }

/*video.html*/
.video { width:600px;margin: 50px auto; display: flex; flex-wrap: wrap; justify-content: center; align-content: center; align-items: center;  position: relative; transition: all 0.3s linear 0s; 
border: 1px solid #fff3eb;background: #fffaee;  box-shadow: 0px 2px 4px rgba(172, 184 ,204 ,.25), 0px 4px 4px rgba(172, 184 ,204 ,.2), 0px 8px 8px rgba(172, 184 ,204 ,.15), 0px 16px 16px rgba(172, 184 ,204 ,.1), 0px 24px 24px rgba(172, 184 ,204 ,.25);mix-blend-mode: multiply; border-radius:15px;  overflow: hidden;  }
.video figure{ position: relative; width:100%;  height: 0; padding:75% 0px 0px 0px; overflow: hidden;object-fit: contain;background-color: #fff; box-shadow: 0px 1px 9px rgba(0,0,0,.1);  transition: all 0.5s ease 0s; }
.video figure img { max-width: 100%; height: auto; transition: all .35s ease;  }
.video:hover figure{  transform: scale(1.05)}
.video-title { width: 100%; max-height: 56.7px; margin: auto; padding:10px 0px; color:#565656; font-size:1rem; line-height: 1.375rem;  font-weight:400; overflow: hidden; word-break:normal;  text-overflow: ellipsis;  display: -webkit-box; -webkit-line-clamp: 2;  -webkit-box-orient: vertical; }
.video .btn-play {   margin: auto; z-index:99; }  
@media (max-width: 768px) {
.video { width:100%; padding:0px; }   
.video li{ width: calc(100%/2 - 50px); margin: 50px 25px;  }
}

@media (max-width: 767.98px) {
.video { width: 100%; margin: 30px auto;}
.fancybox-slide--iframe .fancybox-content { padding: 0px;  width: 100%!important; height: 80%; max-width: calc(100% - 10px); max-height: calc(100% - 100px);}
}
/*application.html*/
.application-item { width:100%; margin:30px auto; padding:0px; position: relative; z-index: 99;}
.application-item li { width:calc(100%  - 30px); margin:50px 15px;padding:0px; list-style: none;   transition: all 0.5s ease 0s;  position: relative; z-index: 9;}
.application-item li .item{width: 100%; display: flex; flex-wrap: wrap;  align-items: flex-start;}
.application-item li:nth-child(even) .item{ flex-direction: row-reverse}
.application-item li:nth-child(even) .item-inner{  margin: auto auto auto -10%;}
.application-item li .item-inner{width:40%; margin: auto -10% auto auto; padding:40px;  display: flex; flex-wrap: wrap; justify-content: flex-start; align-content: flex-start;position: relative;z-index: 9; border-radius:50px;   background-color: #f6f6f6;  } 
.application-item li .item-pic{ width: 60%; display: flex; flex-wrap: wrap; justify-content: center; align-items:center;}
.application-item li .item-pic figure{ width: 100%; padding-bottom: 62.25%; height: 0; overflow: hidden; position: relative;  z-index: 1; transition: all 0.5s ease 0s; /*clip-path: polygon(0 5%, 100% 0, 100% 85%, 0% 100%);  */ border-radius:30px;  }
.application-item li .item-pic figure img { max-width: 100%; height: auto; margin: auto; transition: all 0.5s ease 0s; border-radius:30px;  }
.application-item li .item-pic figure:hover img { transform: scale(1.1);  opacity: 1; }
.application-item li h3{flex: 0 0 100%; padding:0px 0px 0px 20px; margin:0px 0px 20px 0px;  font-size:2rem; font-size: min(max(3.5vw, 1.15rem), 2rem);font-weight:700; line-height:3rem;  word-break: normal; word-wrap: break-word; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;overflow: hidden; position: relative; background: linear-gradient(to right, #ff4600 30%,#913136 50%, #2c1c68 80%); background: -webkit-linear-gradient(to right, #ff4600 30%,#913136 50%, #2c1c68 80%); background-clip: text; -webkit-background-clip: text; color: transparent!important; }
.application-item li h3:before { width:8px;  height:8px;  content: ""; position: absolute; top: 12px; left: 0; background-color:#191971; border-radius: 50%;}
.application-item li  h3:first-letter{ color:#191971;}
.application-item li p{ margin:5px 0px; padding: 0px;  font-size:1.125rem; line-height: 1.5rem;  font-weight: 400;color:#334f60;  overflow: hidden; word-break: normal; word-wrap: break-word; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;} 
.application-item li .item-inner-txt{ width: 100%;  padding:0px;margin:0px 0px 40px 0px;  position: relative;} 
@media (max-width:1024px) {
.application-item li {margin:30px 15px;}   
}
@media (max-width:840px) {
.application-item li { width: 100%; margin:0px auto; padding: 0px;}   
.application-item li .item{ margin:30px auto 50px auto;padding:0px; flex-direction: column-reverse}
.application-item li .item-inner,.application-item li:nth-child(even) .item-inner{width:100%; margin:-10% 0px 0px 0px; padding:60px 40px 40px 40px;   } 
.application-item li .item-pic{ width:100%; }   
.application-item li:nth-child(even) .item{ flex-direction:column-reverse}
}
@media (max-width:767.98px) {
.application-item li .item-inner,.application-item li:nth-child(even) .item-inner{ padding:40px 20px 20px 20px;   } 
.application-item li h3{  font-size:1.125rem; line-height: 1.5rem;  }
.application-item li p{   font-size:.875rem;line-height: 1.15rem;  } 
}
@media (max-width:320px) {
.application-item li .item-inner{ padding:30px 10px;}   
}


/*product-list-sec.html*/
.modTable { overflow-x: scroll; padding: 40px 0px;}
@media (max-width: 991px) {
.modTable { padding:0px 0px  40px 0px;}
}
.modTable table { border: none;}
.modTable th { font-size:1.15rem; line-height: 1em; border-right: 4px solid #fff;  border-bottom: 4px solid #fff;}
.modTable td {  font-size:1.15rem; line-height: 1em; border-right: 4px solid #fff;  border-bottom: 4px solid #fff;}
@media (min-width: 768px) and (max-width: 991px) {
.modTable td, .modTable th { font-size: .75rem; }
}
.modTable th {padding:25px; text-align: left; font-weight: 900; color:#85bed8; background:#003285;}
@media (min-width: 768px) and (max-width: 991px) {
.modTabl th { padding: 10px 15px 8px 15px; }
}
.modTable td { padding: 18px 25px 15px 25px;}
@media (min-width: 768px) and (max-width: 991px) {
.modTable td {  padding: 14px 15px 11px 15px; }
}
.modTable-center { text-align: center;}
.modTable-prodName { text-align: left;}
.modTable-lab { background-color:#a8bad7; color:#000; text-align: center;}
.modTable-intro { background-color: #D2D83D;}
.modTable-mod {  padding-left: 0 !important;}
.modTable-serie {  padding-left: 0 !important; color: #D2D83D; background-color: #fff;}
.modTable-prodName a {   color: #003474; font-weight: 700; text-decoration: underline !important;}
.modTable-prodName label { float: right; color:#ef430a; font-weight: 700;  text-transform: uppercase; opacity: 0;  cursor: pointer;
}
@media (max-width: 991px) {
.modTable-prodName label { display: none; }
}
.modTable-prodName .arrow {float: right;  width: 69px; height: 12px;  display: inline-block; margin-left: 20px; background-image: url(../images/icon/arrow-b.svg); background-repeat: no-repeat; background-position: center; background-size: cover;}
@media (max-width: 991px) {
.modTable-prodName .arrow { margin-top: 10px; }
}
.modTable-tabWrap:nth-of-type(odd) td {background-color: #f6f6f6;}
.modTable-tabWrap:nth-of-type(even) td {background-color: #ebeff2;}
.modTable-tabWrap:hover { background-color: #003474; color: #fff; -webkit-transition: all .15s linear;  -o-transition: all .15s linear; transition: all .15s linear;}
.modTable-tabWrap:hover .arrow { background-image: url(../images/icon/arrow-b-f.svg); -webkit-transition: all .1s linear; -o-transition: all .1s linear; transition: all .1s linear;}
.modTable-tabWrap:hover td { color: #fff;background-color: transparent;}
.modTable-tabWrap:hover label { opacity: 1; color:#ef430a; -webkit-transition: opacity .1s linear; -o-transition: opacity .1s linear; transition: opacity .1s linear;}
.modTable-tabWrap:hover .modTable-prodName a{color: #fff}
.modTable-legenda { margin-top: 40px;  color: #003474; font-size: 1.125rem;font-weight: 700; }