﻿/* ==== product Main CSS === */
.item-content{width: 100%; padding:0px 0px 30px 0px; position: relative;z-index: 0; }
.item-nav{width: 100%; margin: -40px auto auto auto; padding:0px; }
 .banner {margin:0px; position: relative; padding: 0px 0px 50px 0px;z-index: 1;  }
/* ==== 0915-Slider Style === */
.banner-item{width: 100%; max-width: 100%; margin: 0px auto; height: auto; padding:0px;display: flex; flex-wrap: wrap;justify-content: center;  position: relative;  animation:fadeIn .5s both .5s; }
.banner-item li .slider-item { padding: 40px 0px 0px 0px; margin: auto; display: flex; flex-wrap: wrap;justify-content: space-between; }
.slider-item{ position: relative; display: block; margin:0px auto; padding: 0px 20px; width: 100%;  max-width: calc((100% - 40px)/12*12 + 40px);  border-bottom: solid 1px #BCC0C0;}
.banner-item li{ width: 100%; height: 100%; margin: 0px auto; padding:0px;  position: relative; transition: all .5s ease; list-style: none; }
.banner-item li .slider-img { width:50%; height: auto;  margin:auto 0px; padding:40px 0px 0px 0px; position: relative;  }
.banner-item li figure {  width:100%;  height:auto;  margin:58px 0px 0px 40px;padding:0px;position: relative;  }
.banner-item li figure img { margin: 0px;  animation:fadeInRight 1s both 1s}
.banner-item li figure::before{content: ""; width: 55%; height:526px; display: block; position: absolute; left:-5%; top:-22%;  border: solid 4px  #f15921; ; z-index: -1;animation:fadeInDown 1s both 1s;}
.banner-item li figure::after{  width:200%; content: attr(data-content);color: #fff; font-size: 180px; font-weight: 500; word-wrap: normal; font-family: 'MuseoModerno', cursive; letter-spacing: 6px; left:-65%; top:-8%;position: absolute; z-index:0;animation:fadeInUp 1s both 1s;}
.slogan {width:calc(50% - 20%); height: auto;   margin: 15% auto auto auto; position: relative; z-index: 99; display: flex; flex-wrap: wrap; animation:fadeInDown 1s both 1s; }   
.slogan::before{ content: attr(data-content);color: #000;   font-size: 130px;  font-size: min(max(11vw, 90px), 130px); font-weight: 500;  letter-spacing: 3px;font-family: 'MuseoModerno', cursive; writing-mode: vertical-lr;position: absolute; left:-25%; top:0;  transform:rotate(180deg);   }
.slogan::after{ content: "" ; width: 2px; height: 280px; background-color: #000;position: absolute; left:30%; top:-10%;  transform:rotate(45deg);  }
.slogan .txt-content{ width: 100%; margin: auto; padding: 0px; }
.slogan .txt-content h1{ margin: 0px 0px 20px 0px; padding:0;  font-size:40px; font-size: min(max(3.5vw, 30px), 40px); line-height:2.875rem; font-weight:500; text-align: left;  letter-spacing: 1px; color:#000;  }
.slogan .txt-content h2{ width:auto;margin:50px auto  0px auto; padding:0px 0px 0px 100px;font-size:40px; font-size: min(max(3.5vw, 16px), 40px);line-height:2.875rem; font-weight:500; color: #f15921; letter-spacing: 1px;   }
.txt-inner p{font-size:1rem; font-size: min(max(2vw, .875rem), 1rem);line-height: 1.5rem; letter-spacing: 1px; text-align: left; font-weight:400; color:#6d6d6d;   }
.txt-inner{ display: none;}
.slogan .txt-inner{display: block;}
.slogan .txt-inner P{ width:calc(100% - 10px);margin:50px 0px 0px 10px; padding:0;}
 
.about-blur { position: absolute;left:0; top:0; width: 100%; height: 100vh; z-index: -5;}
.img-blur { position: absolute; right:2%; top:-5%; width: 45%; height: 100%; z-index: -5;}
.img-blur-bg {max-width: 100%;height: 100%;background-position:center;background-repeat: no-repeat; background-size: cover; opacity: 1;}
@media (min-width: 768px) {
.slider-item{ max-width:1280px;}
}

@media(max-width: 1400px) {
.slider-item,.banner-nav { transform: scale(.9)}
}
@media(max-width: 1180px) {
.slider-item{ padding: 20px 40px 0px 0px;  }
.banner-item li figure { width:auto;  max-height: 100%;  }
.banner-item li figure::before{content: ""; width: 55%; height:100%;  }
.banner-item li figure::after{ font-size:146px; }    
}

@media(max-width:1024px) {
.banner-item{margin: auto;   }
.slider-item,.banner-nav { transform: scale(.95)}
}
@media(max-width: 992px) {
.banner-item li  { transform: scale(.9)}
.banner-item li figure{  margin-left: 5%;  }
.banner-item li .slogan {width:calc(50% - 10%); height: auto;  margin: auto 5%;  }   
/*.banner-item li .slogan::before{ font-size: 90px;    }
*/ .banner-item li figure::after{   font-size:100px; }
}
@media(max-width: 840px) {
.banner {margin-top:70px;}
.banner-item li .slider-item { padding: 0px;   }
.slider-item,.banner-nav { transform: scale(1)}
.banner-item li .slogan {width:calc(50% - 10%); height: auto;  margin:14% auto auto auto;  }   
.slogan::before{ left:-20%;   }
}

@media(max-width: 768px) {
.banner-item{ padding: 0px 20px; }
 .banner-item li figure::after{ font-size:82px; }
.banner-item li .slogan { margin:10% auto auto auto;  }  
 .slogan .txt-inner P{ width:calc(100% - 10px);margin:24px 0px 0px 10px; padding:0;}
  .slogan::before{ left:-24%;   }

}
@media(max-width:640px) {
.banner { padding: 0px 20px 20px 20px;}
.banner-item li  { transform: scale(1)}
.banner-item li .slider-item { padding:0px; flex-direction: column-reverse; }
.banner-item li .slogan {width:100%; height: auto;  margin:10% auto; position: relative; }   
.banner-item li .slider-img{width:100%; margin-top: 20px; }
.banner-item li figure::before,.banner-item li .slogan::before{ display: none;}
.banner-item li figure::after{  left:-20%; top:auto; bottom:-60%; font-size:130px;  }
.banner-item li figure{margin: auto;}  
 .banner-item li figure img { width: 100%; height: auto; animation:none; }

.slogan .txt-content{ width:100%; display: flex;flex-wrap: wrap; order: 1;}  
.slogan::after{ content: "" ; width: 2px; height: 100%; background-color: #000;position: absolute; left:50%; top:0;  transform:rotate(45deg);  }
.slogan .txt-content h1{   font-size: 20px; line-height: 2rem;margin: 0px auto; padding:0; }
.slogan .txt-content h2{ font-size: 20px;  line-height: 2rem;margin: 0px auto; padding:0;  }    
.slogan .txt-inner{ display: none;}
.txt-inner{ display: block;}
.txt-inner P{ width:100%;margin:20px 0px 0px 0px; font-size: 14px; }
}
.slogan-depiction{ width:50%;}
.slogan-depiction ul{ width: calc(100% - 50px); margin: 0px 0px 5px 50px; padding: 0px; list-style: none;}
.slogan-depiction ul li{ width: 100%; margin: 0px; padding: 0px; font-size: 15px;line-height: 1.5rem; color: #6d6d6d; font-weight: 500;}

.banner-nav{ width: 100%;  margin: auto; padding:5% 180px;  list-style:none;  animation: fadeIn 1s both 1s;}
.banner-nav .slick-slider{ width: 100%; margin:0px auto; padding:0px!important;position: relative;  }
.banner-nav li{ width: calc(100%); margin:0px; padding:0px 20px;  }
.banner-nav li:focus{ outline: none;}
.banner-nav li .item { width:auto;  margin: auto; display: flex; flex-wrap: wrap; justify-content: center; position: relative;  }
.banner-nav li .item:after { content:""; position: absolute;left:65%;  bottom: 26%; width:96%; height: 1px; background: #c0c0c0; }  
.banner-nav li:last-child .item:after { display: none }  
.banner-nav li span {position: relative;  padding: 10px 6px 40px 6px; font-size: 1.125rem; font-size: min(max(2vw, .875rem), 1.125rem); line-height: 1.25;letter-spacing: 1px; font-weight: 500;  text-align: center;  color:#c0c0c0; }
.banner-nav li span:before { content:""; position: absolute;  left: 50%;  bottom:16px; transform: translate(-50%, 0px);width: 6px; height: 6px; background: #c0c0c0; border-radius:99rem; }
/*.banner-nav li.slick-current span{ color:#f15921;} 
.banner-nav li.slick-current span:after{ content:""; position: absolute; left: 50%;  bottom: 0px; transform: translate(-50%, 0px);width:38px; height: 38px; border-radius:99rem;border: solid 1px #f15921;} 
.banner-nav li.slick-current span:before{ background: #f15921; } */
.banner-nav li.slick-focus span{ color:#f15921;} 
.banner-nav li.slick-focus span:after{ content:""; position: absolute; left: 50%;  bottom: 0px; transform: translate(-50%, 0px);width:38px; height: 38px; border-radius:99rem;border: solid 1px #f15921;} 
.banner-nav li.slick-focus span:before{ background: #f15921; } 
 @media(max-width: 1440px) {
.banner-nav {padding:3% 100px; }
 }

 @media(max-width: 1366px) {
.banner-nav {padding:3% 40px; }
 }
@media(max-width: 1180px) {
.banner-nav{ margin-top: -35px; padding:5%  0px;  }
}
@media(max-width: 1024px) {
.banner-nav{   margin-top: -15px;    }
}
@media(max-width: 992px) {
.banner-nav{margin-top: -30px;}
.banner-nav li span { padding: 10px 0px 40px 0px;   }
.banner-nav li .item:after { left:72%;  bottom: 26%; width:96%; height: 1px; background: #c0c0c0; }  
}
@media(max-width: 768px) {
.banner-nav{margin-top: -30px;}
.banner-nav li span {  height: 80px; padding: 10px 10px 90px 10px;   }
.banner-nav li .item:after { left:80%;  bottom: 18%;   }  
}
@media(max-width:640px) {
.banner-nav{margin-top:80px; border-top: none;}
.banner-nav li{ width: calc(100% - 10px); margin:0px 10px 0px 0px; padding:0px; border: solid 1px #dddbe0 }
.banner-nav li.slick-focus {border: solid 1px #f15921;} 
.banner-nav li span { width:100%; height: auto; padding: 10px; font-size: 14px; color: #000; }
.banner-nav li .item:after,.banner-nav li span:before,.banner-nav li span:before, .banner-nav li.slick-current span:after,.banner-nav li.slick-current span:before,.banner-nav li.slick-focus span:after, .banner-nav li.slick-focus span:before{display: none;} 
}
@media (min-width:1920px) {
.banner-nav li .item:after { left:62%;  bottom: 26%; width:100%;   }  
}
.main-area{ background: #fff;  }
.cms-bg{background-image: linear-gradient(to top, #fff 0%, #fbfdf6 90% ,#fff 100%);}
/*--分類new-tag --*/
.tag {  width: auto; padding:20px; font-size: 1.125rem; color: #4a4a4a; transition: all 0.3s cubic-bezier(0.37, 0.75, 0.61, 1.05) 0s; overflow: hidden; text-transform: capitalize;  word-break: keep-all; z-index: 9; position: absolute; left:0px; top: 0px;  }
.tag a{color:#4a4a4a;}
 
.grid-box{padding: 20px 20px 100px 120px;  margin: auto;}
.grid-wrap { display: flex; flex-wrap: wrap; justify-content: flex-start;width: 100%;position: relative;}
.grid-half{ width: calc(100% / 2);padding: 0px; position: relative;}
@media (max-width:767.98px) {
.grid-half{ width: 100%; }    
}
.en-title{  position: absolute;  width:70%;  top:-160px; left: -70px;  font-size: 180px;color: #fff; z-index: -1;  }
.product-description{width: 100%;padding:0px; margin: 0px; position: relative; border-top:solid 1px #c0c0c0;}
/*-------mold01.html----------*/
.t-section {  padding: 20px 0; margin: 60px 20px;  }
.title-area{width: 80%; margin: auto; text-align: center; color: #6d6d6d;}
.title-area> p { width: 100%; color: #6d6d6d; line-height: 1.6; letter-spacing: 1.6px; font-size: 1rem;  }

@media (max-width:1440px) {
.t-section { width: 100%; padding:0px; margin:30px 0px;  }
}

@media (max-width:1024px) {
.t-section { width: 100%; padding:0px 20px; margin:30px 0px;  }
}
@media (max-width:640px) {
.t-section {   padding:0px; margin:30px 0px;  }
}

.mold-wrapper{}
@media (max-width:640px) {
.mold-wrapper{ padding:0px 40px;}
}
/*-------mold01.html----------*/
.prd-area{width: 94%; margin: auto; padding-top: 80px; position: relative; }
.prd-wrap{  width: calc(100%/2);  display: flex; flex-wrap: wrap; transition: all 1.5s cubic-bezier(0.34, 1.56, 0.64, 1);  transition-delay: .3s; position: relative;}
.prd-wrap::first-of-type{margin-left: 0px;}
.text-box { width:calc(100%/2 - 40px); margin-right:40px; }
.text-box-noe{margin-right: 0px;}
@media (max-width:1440px) {
.prd-area{width: 100%;  }
.text-box { width:calc(100%/2 - 30px); margin-right:30px; }    
}
@media (max-width:1024px) {
.prd-wrap{ /* width: calc(126%/2);*/  width:100%;  display: flex; flex-wrap: wrap; transition: all 1.5s cubic-bezier(0.34, 1.56, 0.64, 1);  transition-delay: .3s; position: relative;}
}

.prd-wrap .text-box  p { width: 100%; color: #6d6d6d; line-height: 1.6; letter-spacing:1px; font-size: 1rem; font-size: min(max(3vw, .875rem), 1rem); }
/*charts style */
.charts-wrap{ width: 50%;  display: flex;flex-wrap: wrap;   transition: all 1.5s cubic-bezier(0.34, 1.56, 0.64, 1);  transition-delay: .1s; position: relative;}
.charts-1{ width:1000px; height: 1000px; background: none;position: absolute; z-index: 0;   animation-duration: 360s;}
.charts-1 svg{margin: -20% auto auto -12%; background: rgba(255,255,255,.0); /*transform: rotate(75deg);*/z-index: 1; }
.charts-1 rect{ fill: rgba(255, 255, 255,.0);}
.charts-box{  right:30%;  margin-top:0; position: absolute; z-index: 9; } 
.charts-line{  width: 1px; height:120px; background:#f15921;  transform: rotate(45deg); right:-5%; top:25%; position: absolute; z-index: 9; }
.charts-title{ width: 100%; height: auto; text-align: right; margin-top: 160%; display: block;}
.charts-title h3{font-size: 60px; color: #c0c0c0;font-weight: 500; font-family: 'MuseoModerno', cursive;}
.charts-title p{font-weight: 700; }
.charts-mask{ width: 50%; height: 400px; position: absolute; right: 0px; top:0; margin-top: 40%; z-index: 2;/* background-image: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(0,0,0,.1) 30%, rgba(0,0,0,.1) 50% ,rgba(255,255,255,0) 100%);*/ background:  url("../images/mold/mask.png")  no-repeat 40px top; background-size: auto 100%}



/* cms-title-block h1 =======================================================================	*/
.charts-block{ width: calc(100% - 350px);  height: auto; margin:200px 0px 0px -2%;  display: flex;  flex-direction: column; position: relative;z-index: 0; }
.charts-block:after{content: ""; display: block; width: 102%; height: 2px; margin: 0px auto; position: absolute; bottom:58px; background-color:#f15921;   }
.charts-block h2 {display: block;  margin:0px; padding:0px; font-size:180px;line-height:160px; color:#f15921; font-weight:500; position: relative; z-index: 0; }
.charts-block h3{display: block; margin:0px; padding:0px 0px 0px 20px; font-size:30px; font-weight:500; position: relative; letter-spacing: 3px; }
.charts-block .percentage{ width:100px; height: 60px; font-size:100px;line-height:110px; color:#000; position: absolute; left: 220px; z-index: 9 }


@media (min-width:1600px) {
.charts-wrap{transform: scale(.95)}
.charts-box{  right:20%;  margin-top:5%; } 
}

@media (min-width:1900px) {
.charts-wrap{transform: scale(1)}
.charts-1 svg{margin: -20% auto auto -12%; background: rgba(255,255,255,.0); /*transform: rotate(75deg);*/z-index: 1; }
.charts-1 rect{ fill: rgba(255, 255, 255,.0);}
.charts-box{  right:30%;  margin-top:0; position: absolute; z-index: 9; } 
.charts-line{  width: 1px; height:120px; background:#f15921;  transform: rotate(45deg); right:-5%; top:25%; position: absolute; z-index: 9; }
.charts-title{ width: 100%; height: auto; text-align: right; margin-top: 160%; display: block;}
.charts-title h3{font-size: 60px; color: #c0c0c0;font-weight: 600;   }
.charts-title p{font-weight: 700; }
.charts-mask{ width: 50%; height: 400px; position: absolute; right: 0px; top:0; margin-top: 40%; z-index: 2;/* background-image: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(0,0,0,.1) 30%, rgba(0,0,0,.1) 50% ,rgba(255,255,255,0) 100%);*/ background:  url("../images/mold/mask.png")  no-repeat 40px top; background-size: auto 100%}
.charts-block{ width: calc(100% - 550px);  }
 }



@media (max-width:1440px) {
.charts-1 svg{transform: scale(.75)}
.charts-box{  right:15%;  margin-top:40px;   } 
.charts-block{ width: calc(100% - 250px); }    
}

      
 @media (max-width:1366px) {
 .charts-block{ width: calc(100% - 150px); }
 .charts-block:after{  width: 90%;}
 .charts-1{ margin-left: -25%;}
.charts-box{  right:30%; } 
 }

 @media (max-width:1280px) {
 .charts-block{margin:140px 0px 0px -2%; }
}
 


@media (max-width:1112px) {
 .charts-1{ margin-left: -35%;}
}

@media (max-width:1024px) {
.charts-wrap{margin:auto auto 15% 40%;   }
.charts-box{  right:15%; } 
.charts-block:after{  width:65%;}
}
@media (max-width:991px) {
.charts-wrap,.charts-block{  transform: scale(.8) }
.charts-block:after{ width:78%;}
}

@media (max-width:768px) {
.charts-block:after{ width:82%;}
 .charts-box{right:5%; } 
   
}

@media (max-width:640px) {
.prd-area{margin-top: 0px; }   
.charts-wrap{ order: 1;  width:100%; left:auto;margin: -20% auto auto auto; transform: scale(.65)  } 
.charts-block{order:2;transform: scale(1); width: auto; }   
.prd-wrap{ width: 100%;margin-top: 30px;  order: 3;  } 
.text-box { width:100%; margin:10px auto; }    
.charts-box{  transform: scale(1);right:30%; margin-top: 20px; } 
.charts-1{  margin-left: -80%; margin-top: -30%;}

.charts-title{  margin-top: 170%;    }
.charts-title h3{font-size: 36px;   }  
.charts-title p{font-size: 16px; }
.charts-line{  width: 1px; height:100px; right:-5%; top:-1%;   }

/* charts-block*/ 
.charts-block{margin:240px 0px 0px 0px; }   
.charts-block h2 { font-size:60px;line-height:60px; }
.charts-block h3{ font-size:14px; padding: 0px;}
.charts-block .percentage{ font-size:40px;line-height:40px; left: 100px; top:30px;  }  
.charts-block:after{ display: none;} 
}
@media (max-width:420px) {
.charts-1{  margin-left: -60%;  }

}

@media (max-width:380px) {
 .charts-1{  margin-left: -80%;  }
    
    
}



/*@media (max-width:576px) {
.charts-wrap{  margin: -30% auto auto 10%;   } 

}
*/
/* ==== Slider Style === */
.grid-section{  width: auto; display: flex; flex-wrap: wrap; margin: 100px 0px 0px 0px;padding: 0px; background: #f8f8f8; }

.problem-item  { width: 100%; margin:-30px 0px 0px 0px;  padding:0px;  transition: transform .6s; animation:fadeInUp 1s both 1.5s; }
.problem-item li{ width: 100%; padding:0px; margin:0px; transition: all 0.5s; list-style: none; position: relative; z-index: 9}
.problem-item li h3 { margin-bottom: 5px; font-size:20px;  font-size: min(max(3vw, 16px), 20px);     line-height: 1.466; font-weight: 400; color:#000;   }
.problem-item li p{ padding-left: 15px; color:#000; font-size: 18px; font-size: min(max(3vw, 14px), 18px); line-height: 1.466; }

.figure-wrap{ width: 100%; padding:0px; margin:0px;  display: flex; flex-wrap: wrap;justify-content: space-between;}
.figure-inner{width:calc(100%/2 - 20px); margin-right: 10px;}
.figure-inner:last-child{ margin-right: 0px;}
.figure-inner:last-child p{ text-align: right; padding-right: 20px;}

.problem-item li figure {  position: relative; width: 100%; margin: auto; padding-bottom: 20px; text-align: center;z-index: 0;  }
.problem-item li figure img{  width:100%; margin: auto; display:block;}
.problem-item li::before{ animation:fadeInUp .3s both .5s; content: attr(data-content); color:#f15921; font-size: 90px; font-weight: 600;  letter-spacing: 3px;font-family: 'MuseoModerno', cursive;  
position: absolute; left:46%; bottom:5%;  z-index:1; }
.problem-item .slick-prev, .problem-item .slick-next{ width: 36px;height: 36px;border-radius:99rem;  background: #fff;z-index: 9999; box-shadow: 3px 6px 5px  rgba(0,0,0,.3) }
.problem-item .slick-prev{left:-1%;}
.problem-item .slick-next{right:-1%;}
.problem-item .slick-next:before{ content: "→"; font-size: 16px; color:#f15921;  font-weight: 700; margin-top: 25%;  display: block; background: none;  }
.problem-item .slick-prev:before{ content: "←"; font-size: 16px;color:#f15921; font-weight: 700; margin-top: 25%; display: block; background: none; }
.problem-item  .slick-next:hover, .problem-item  .slick-prev:hover{ transform: scale(1);opacity: 1; background: #fff; }

 
.problem-title{ margin:-70px 0px 0px -9px;  color:#eeeeee; font-size: 130px; font-weight: 500;  letter-spacing: 3px;font-family: 'MuseoModerno', cursive;}
 
.problem-wrap{ width: 870px; margin: 0px auto; padding: 0px 0px 50px 0px;  position: relative; }
ul.problem{  width: auto; margin:-54px auto 0px auto; padding: 50px 0px 0px 100px; display: flex; flex-wrap: wrap; justify-content: center;background: #eeeeee; }
ul.problem li{ cursor: pointer;overflow: hidden; float: left; height: 177px; list-style: none; position: relative; width: 72px; transition: all 0.5s ease;  -webkit-transition: all 0.5s ease;}
ul.problem li::before{content: "";position: absolute; left:0px; top:0px;width: 1px;height: 77px;  background: #c0c0c0; } 
ul.problem li::after{content: attr(data-content);position: absolute; left:10px; top:0px; color:#c0c0c0; font-size:20px; font-weight:500;  letter-spacing: 3px;font-family: 'MuseoModerno', cursive; } 
ul.problem li a{ display: block; width: 72px; height: 177px; line-height: 177px; color: #c0c0c0; text-decoration: none;  position: absolute;left: 0;top: 0; text-indent: -999px; transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out;}
ul.problem li:hover a{color: #000;}
ul.problem li:hover::before{  background: #000; } 
ul.problem li.slick-current.slick-active {width: 370px;}
ul.problem li.slick-current.slick-active::after{  color:#eee;  } 
ul.problem li.slick-current.slick-active::before{  background: #000; } 
ul.problem li.slick-slide:not(.slick-current) { width: 72px; } 
ul.problem li .circle-list{  padding-top: 0px; width: 270px;  margin: 0px 5rem; color: #6d6d6d; font-size: 15px; letter-spacing: 0;  line-height: 18px;}
ul.problem li h3{margin: 0px 0px 10px 0px; color: #000; font-size: 1.25rem;    font-size: min(max(3vw, .875rem), 1.25rem); letter-spacing: 1px; line-height: 1.65rem;}
ul.problem li .circle-list .cms-dot{ width: 100%;  display: block; margin:0px;padding: 0px; position: relative;}
ul.problem li .circle-list .cms-dot li{ width: 100%!important; height: auto; display: block; padding: 2px 0px 2px 15px!important; margin:0px!important; font-size:1rem;  font-size: min(max(3vw, .875rem), 1rem);   line-height:1.5rem; font-weight:400; color:#6d6d6d; position: relative;  }
ul.problem li .circle-list .cms-dot li:before{ content: ''; width:3px; height:3px; background-color:#6d6d6d; border-radius: 99rem; position: absolute; top: 15px; left: 0px;  transition: all 0.5s ease 0s;}
ul.problem li .circle-list .cms-dot li:after{  display: none;}

 @media (max-width:1024px) {
  .problem-wrap{ width: 100%; padding:50px 0px 0px  0px; }   
}
 @media (max-width:640px) {
     
.problem-title{ margin:10px 0px 0px 40px;   font-size: 24px; }  
.problem-wrap{ margin:0px auto auto auto;  padding: 0px;position: relative; z-index: 0  }  
.problem-wrap:after{content: ""; width: 100%;height: 100%; position: absolute; left:0px; top:40px; background: #eeeeee; z-index: 0;}      
.problem-item  { margin: 0px ; padding: 40px 20px;   }
.problem-item li{ width: 100%; padding:0px 0px 50px 0px;  }
.problem-item li::before{  display: none; }     

.problem-item .slick-prev, .problem-item .slick-next{ top:80%; }
.problem-item .slick-prev{left:40%;}
.problem-item .slick-next{right:40%;}


ul.problem{  width: 100%; margin: 0px auto; padding: 0px; position: relative;z-index: 9; background: none; }   
ul.problem li{ width: 100%; height: auto; padding:50px 40px ;  }
ul.problem li.slick-current.slick-active {width: 100%;}
ul.problem li .circle-list{  padding-top: 0px; width: 100%;  margin: 0px 10px; color: #6d6d6d; font-size: 15px; letter-spacing: 0;  line-height: 18px;} 
ul.problem li::after{  left:auto; right: 20px; top: 0px; color:#f15921; font-size:40px;position: absolute;z-index: 9;   }     
ul.problem li.slick-current.slick-active::after{color:#f15921;  } 
ul.problem li.slick-current.slick-active::before{ display: none;} 
     
     
}



/*-------mold02.html----------*/
.solution-wrap{width: 100%; display: flex; flex-wrap: wrap; justify-content: flex-end;position: relative;}
.solution-block{ width: 340px; height: 400px; left:5%; top:15%; background:#f15921; border-radius:10px;   position: absolute;z-index: 1;}
.solution-nav{width: calc(100% - 342px);  position: relative;  }
.solution{width: 100%; max-width: 100%; margin: 0px auto; padding:0px;display: flex; flex-wrap: wrap; align-self: stretch;  position: relative; clear: both;  }
/* ==== Slider Style === */
.solution li{ width: 100%; height: 100%; margin: 0px auto; padding:1% 0px 30px 0px;  position: relative; z-index: 9;  transition: all .5s ease; }
.solution .slick-prev{ width: 50px; height: 50px; left:12%; background: #fff; z-index: 998; border-radius:99rem;   }
.solution .slick-next{ width: 50px; height: 50px; left:30%; background: #fff; z-index: 998; border-radius:99rem; }
.solution .slick-prev, .solution .slick-next{ top:auto; bottom:0px;  }
.solution .slick-next:hover, .solution .slick-prev:hover{ transform: scale(1);opacity: 1; background: #fff; }
.solution .slick-prev:before  { content: "←"; font-size: 16px;color:#f15921; font-weight: 700; margin-top: 25%; display: block; background: none;  }
.solution .slick-next:before { content: "→"; font-size: 16px; color:#f15921;  font-weight: 700; margin-top: 25%;  display: block; background: none;  }

.solution-content{padding: 40px; color: #fff;}
.solution-content h4,.solution-content p{ font-size: 20px; font-weight: 600;letter-spacing: 2px;  }
.solution-content .cms-dot{ width: 100%;  display: block; margin:30px 20px 20px 0px;padding: 0px; position: relative;}
.solution-content .cms-dot li{display: block; padding: 0px 0px 0px 15px!important; margin:0px 0px 5px 0px!important;  letter-spacing:3px;  font-weight:500;  line-height: 1.5rem; color:#fff; position: relative;  }
.solution-content .cms-dot li:before{ content: ''; width:3px; height:3px; background-color:#fff; border-radius: 99rem; position: absolute; top: 15px; left: 0px;  transition: all 0.5s ease 0s;}


.solution-pic{width: 100%; max-width: 100%; margin: 0px auto; padding:0px;display: flex; flex-wrap: wrap; align-self: stretch;  position: relative; clear: both;  }
.solution-pic figure{ position: relative;  }
.solution-pic figure::before{ content: attr(data-content);color: #f15921; font-size: 130px; font-weight: 500;  letter-spacing: 3px;font-family: 'MuseoModerno', cursive;  position: absolute; right:8px; bottom:14%;     }
.solution-pic figure::after{ content: "" ; width: 1px; height: 420px; background-color: #f15921;position: absolute; left:82%; bottom:-8%;  transform:rotate(50deg);  }

@media (max-width: 1024px) {
 .solution-wrap{  padding-bottom: 100px;}   
 .solution-block{  left:5%; top:5%;  }   
 .solution-nav{width: calc(100% - 250px);  position: relative;  }   
}

@media (max-width: 640px) {
.solution-wrap{ margin-top: -80px; flex-direction: column-reverse;}   
.solution-nav{width: 100%;  position: relative;  }  
.solution-block{ width: 100%; max-width: 80%; margin:-10% auto auto auto; left:auto;   position: relative;   }   
.solution-pic figure::before{ font-size: 40px;  left:10%; bottom:20%; }
.solution-pic figure::after{ display: none;  }

.solution .slick-prev{  left:30%; }
.solution .slick-next{  left:50%; }
.grid-section{   margin: 20px 0px 0px 0px; }

}


.advantage{width: 100%; margin: 0px auto; padding:0px;display: flex; flex-wrap: wrap; align-self: stretch;  position: relative; border-right:solid 1px #eee;border-left:solid 1px #eee;}
.advantage li{ width: calc(100%/3);  margin: 0px auto; padding:10px;  position: relative; z-index: 9;  transition: all .5s ease;list-style: none; }



.advantage li:after{content: ""; width: 1px;height: 100%;position: absolute; right: 0px; top:0px; background: #eee;  }
.advantage li:nth-child(3n):after{display: none;}
.advantage li:before{content: ""; width: calc(100% - 100px);height: 1px;position: absolute; left: 50px; bottom:0px; background: #eee;  }
.advantage li:nth-child(4):before,.advantage li:nth-child(5):before,.advantage li:nth-child(6):before{display: none;  }
.advantage li:hover{background: #f15921}
.advantage li:hover img {  filter: invert(1);  opacity: 1}
/*.slider-nav .nav-item:hover .nav-img:before { border: dashed 1px #fff; filter: grayscale(1) brightness(1) opacity(1);}
*/
.advantage li:hover .item-number,.advantage li:hover .item-name,.advantage li:hover .item-txt{ color: #fff;}
.advantage li:hover .item-name:after{background-color: #fff;}
.advantage-item{width: 100%;padding: 40px 50px; display: flex; flex-wrap: wrap;flex-direction: column;justify-content: center; }
.item-number{color: #b3b2b2; font-size: 16px; font-family: 'MuseoModerno', cursive; }
.item-name{ font-size: 20px;  position: relative;margin:30px 0px;  }
.item-name:after{content: ''; width:16px; height:1px; background-color:#f15921; position: absolute; top: 55px; left: 0px;  transition: all 0.5s ease 0s;}
.item-pic{  width: 50%; margin: auto; display: block;  }
.item-txt{color: #6d6d6d;font-size: 16px;  }

.advantage li ul.cms-dot { padding-top: 20px;}
 .advantage li ul.cms-dot li{margin: 0px auto 5px auto;  padding: 0px 0px 0px 10px;}
.advantage li ul.cms-dot li:before{content: ''; width: 3px; height: 3px;  background-color: #6d6d6d;  border-radius: 99rem;  position: absolute; top: 12px; left: 0px;  }
.advantage li ul.cms-dot li:after{display: none; }
.advantage li:hover ul.cms-dot li{ color:#fff}
.advantage li:hover ul.cms-dot li:before{ background-color: #fff; }


/*-------mold03.html----------*/
@media (max-width: 1440px) {
.no-padding{padding: 0px 0px 0px 15%!important;}
}

@media (max-width: 840px) {
.no-padding{padding: 0px!important;}
}
@media (max-width: 767.98px) {
.advantage{   border-right:none;border-left:none;}
.advantage li{ width:100%;  }   
.advantage li:after{display: none; }
.advantage-item{ padding: 40px ; }

}

.series { width: 100%; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap;}
.series-title { -webkit-box-flex: 1;  -ms-flex-positive: 1; flex-grow: 1; width: 100%; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; padding: 15px;  position: relative;  }
.series .series-nunber{ margin-top: -15%;}
.series-nunber{ position: relative; width:auto; display: flex; flex-direction: column;justify-content: center; }
.series-nunber h3{margin:0 auto; color: #f15921; font-size: 180px; font-weight: 500;  letter-spacing: 3px;font-family: 'MuseoModerno', cursive; position: relative;  }
.series-nunber h3::after{ content: "" ; width: 100%; height: 1px; background-color: #6d6d6d;position: absolute; left:0; bottom:20px;   }
.series-nunber p{margin:0 auto; color: #6d6d6d; font-size: 50px; font-weight: 400; letter-spacing: 3px;font-family: 'MuseoModerno', cursive;   }
@media (max-width: 1280px) {
.series-title  {transform: scale(.8); margin-left: -10%;}  
.series-nunber{transform: scale(.8);  }
}

@media (max-width: 840px) {
.series{ transform: scale(.9);}
.series-nunber{transform: scale(.6);  }  
 }
@media (max-width: 767.98px) {
.series{ transform: scale(1); padding: 0px 40px;}  
.series-title .title-block-2{width: 80%; margin: 0px 0px 30px 0px;} 
.series-title .title-block-2 h2 { font-size: 40px; }  
.series-title .title-block-2 h3 { font-size: 18px; }  
.series-nunber h3{  font-size: 40px;   }
.series-nunber h3::after{  bottom:0px;   }
.series-nunber p{  font-size: 18px;   }
 .series-nunber{transform: scale(1);  }  
}

@media (max-width: 400px) {
.series{  padding: 0px 20px;}  
  }
@media (max-width: 320px) {
.series-title {padding: 0px;} 
 .series-nunber{margin-left: -5px;  }  

}

/*Machine Study*/
.study-row { width:100%; max-width: 1420px;  margin: 0 auto; padding: 0px;}
.study-01-map { margin-top: 0px; display: flex; flex-wrap: wrap; justify-content: flex-end; position: relative; }
.study-01-map .map-image { width: 700px;height: auto; right: -80px; opacity: 1; position: relative;  }
@media (max-width: 1680px) {
.study-01-map { left: 50px; }
}

@media (max-width: 1440px) {
.study-01-map .map-image {transform: scale(.8); right: -50px;}
}
@media (max-width:1180px) {
.study-01-map  {transform: scale(.85); right: -50px;}
.study-01-map .pin .pin-popup img {opacity: 1}    
}


@media (max-width: 1024px) {
.study-01-map  {transform: scale(.7); right: -50px;}
}
@media (max-width:840px) {
.study-01-map   {transform: scale(.7);position: relative; left:auto; right: -100px; top:-160px; }
.study-01-map .map-image   {transform: scale(.7); left:auto; right: -100px; position: relative;}
}
 
@media (max-width:768px) {
.study-01-map{ right: -140px;}
}
@media (max-width:767.98px) {
.study-01-map  {transform: scale(1);position: relative; left:0px; right: auto; top:auto;}
.study-01-map .map-image   {transform: scale(1); left:0px; right: auto; position: relative;}
}




.pin { position: absolute; transition: all 0.5s ease 0s; }
.pin .pin-popup {position: relative; /*top: 0px; left: 0px;*/ width: auto;  z-index: 1 }
.pin .pin-popup img{ opacity: .5;  }
.pin .pin-popup .name{ font-size:20px;  font-size: min(max(10vw, 16px), 20px); font-weight: 400;  color: #000; letter-spacing: 2px;}
.pin .pin-popup .text { padding:0px; transition: opacity 0.3s; pointer-events: none;  }
.pin .pin-popup .text p{ font-size:1rem; font-weight: 400;line-height: 1.5rem; color: #6d6d6d; letter-spacing: 1px; word-break:normal; word-wrap: normal;  }
.pin:hover .pin-popup img { opacity: 1;}

/*dot-top*/
.pin .label-dot-top { width: 12px; height: 12px; border-radius: 50%; margin: auto; background-color:#f15921;transition: transform 0.3s; position: relative;  z-index: 1;}
.pin .label-dot-top:before { content: ""; position: absolute;  width:600px; height: 1px;  background-color:#c0c0c0;z-index: 0;  }
.pin .label-dot-top:after { content: ""; position: absolute;  width: 50px; height: 50px; top: -19px; left: -19px; border-radius: 50%;border: solid 1px #f15921; z-index: 1;}
.pin:hover .label-dot-top:after { content: ""; position: absolute; width: 50px; height: 50px; top: -19px; left: -19px; border-radius: 50%;background-color:#f15921; opacity: .5;}

/*mobile-version*/

.mobile-version{display: none;  }

@media (max-width: 767.98px) {
#study-01-map,#study-02-map,#identify{display: none;  }
.mobile-version hr{ border-top: rgba(0, 0, 0, 0.18) 1px solid; }

.mobile-version{display: block;  padding: 20px 40px; }  
.label-circle { width: 30px; height: 30px; font-size: 12px; font-weight: 700; color: #fff; display:  flex; flex-wrap: wrap; justify-content: center; align-items: center; border-radius: 50%; margin: auto; background-color:rgba(241,89,33,.5);transition: transform 0.3s; position: relative;  z-index: 1; font-family: 'MuseoModerno', cursive;  }
.study-01-map .dot-1   { left:45%; top:35%; position: absolute;}
.study-01-map .dot-2   { left:25%; top:45%; position: absolute;}
.study-01-map .dot-3   { left:65%; top:50%; position: absolute;}

.study-02-map .dot-1   { left:48%; top:35%; position: absolute;}

.identify .dot-1 { left:35%; top:25%; position: absolute;}
.identify .dot-2 { left:30%; top:42%; position: absolute;}

.study{ width: 100%; display: block; margin:15px auto; padding: 0px;}
.study-item{width: 100%; margin:15px auto; display: flex; flex-wrap: wrap;flex-direction: column;}
.study-item img{ display: flex; width: auto; margin: 10px 0px;}

.study-item img.w8{ width:80%}  
.study-item img.w9{width: 90%;}  

.study-item h3{ font-size: 16px; font-weight: 500;}
.study-item .numtxt{ font-size: 12px; font-weight: 500; color: #f15921;font-family: 'MuseoModerno', cursive;}
.study-item  .text { font-size:14px; font-weight: 400;  color: #6d6d6d; letter-spacing: 2px; }

.study-01-map .pin-0{ right:auto; top:auto; position: relative;  }
.pin.pin-0 .pin-popup, .pin.pin-1 .pin-popup, .pin.pin-2 .pin-popup,.pin.pin-0:before,.pin.pin-1:before,.pin.pin-2:before,.pin.pin-0 .label-dot-top:before,.pin.pin-1 .label-dot-top:before,.pin.pin-2 .label-dot-top:before,.study-02-map:before{ display: none;}
}





 
/*Study 3 dot-top*/
/*.pin-0*/
.study-01-map .pin-0{ right:14%; top:26%;   }
.pin.pin-0 .pin-popup {  top: -100px; left: -920px;  width: 100%;  }
.pin.pin-0 .label-dot-top:before { content: ""; position: absolute;  width:720px; height: 1px; top: -40px; left: -756px;  /*transform: rotate(90deg); */ }
.pin.pin-0:before { content: ""; position: absolute; z-index: 9; width:1px; height: 57px;right:57%; top:-34%; background: #c0c0c0;   transform: rotate(-45deg);  }

@media (max-width: 1680px) {
.study-01-map .pin-0{ right:16%;    }
.pin.pin-0 .pin-popup {   left: -820px;     }
.pin.pin-0 .label-dot-top:before {  top: -38px;  }
}

@media (max-width: 1440px) {
.study-01-map .pin-0{ right:18%; top:30%;   }
.pin.pin-0 .pin-popup {  top: -100px; left: -720px;    }
}

@media (max-width: 1366px) {
.pin.pin-0 .pin-popup {  top: -100px; left: -670px;}
}

@media (max-width: 1280px) {
.pin.pin-0 .pin-popup {  top: -100px; left: -610px;}
}
@media (max-width: 840px) {
.pin.pin-0 .label-dot-top:before {  width:408px; left: -444px;  top: -41px;  }
}
@media (max-width: 767.98px) {
.study-01-map .pin-0{ right:50%; top: 120%;}   
}


/*.pin-1*/
.study-01-map .pin-1{ left:44%; top:44%;}
.pin.pin-1 .pin-popup { top:-54px; left: -560px;width: 50%; height: auto;  }
.pin.pin-1 .label-dot-top:before {  width:800px; height: 1px; top:6px; left: -800px; }
@media (max-width: 1680px) {
.study-01-map .pin-1{ left:40%; }
.pin.pin-1 .pin-popup { left: -520px;width: 50%; height: auto;  }
}
  @media (max-width: 1440px) {
 .study-01-map .pin-1{ left:38%; }
 .pin.pin-1 .pin-popup { left: -480px;  }
 .pin.pin-1 .label-dot-top:before {  width:700px;   left: -700px; }
}
@media (max-width: 1366px) {
.pin.pin-1 .pin-popup { left: -400px;  }
.pin.pin-1 .label-dot-top:before {  width:700px;   left: -700px; }
}
 @media (max-width: 1280px) {
.study-01-map .pin-1{ left:30%;  }
.pin.pin-1 .pin-popup { left: -320px;  }
.pin.pin-1 .label-dot-top:before {  width:600px;   left: -600px; }
}

 @media (max-width: 840px) {
.study-01-map .pin-1{ left:15%;  }
.pin.pin-1 .pin-popup { left: -320px;  }
.pin.pin-1 .label-dot-top:before {  width:316px; left: -316px; }
}




/*.pin-2*/
.study-01-map .pin-2{ left:74%; top:50%;}
.pin.pin-2 .pin-popup { top: 60px; left: -940px;  width: 400px; height: 102px;}
.pin.pin-2 .pin-popup img{ width: 400px!important;  height: 102px!important;}
.pin.pin-2 .label-dot-top:before { width:726px; height: 1px; top: 92px; left: -800px; }
.pin.pin-2:before { content: ""; position: absolute; z-index:1; width:1px; height:120px;right:60%; top:-9px; background: #c0c0c0;   transform: rotate(45deg);  }
 @media (max-width: 1440px) {
.study-01-map .pin-2{ left:64%; top:50%;}
.pin.pin-2 .pin-popup {   left: -740px;  width: 400px; height: 102px;}
}

@media (max-width: 1366px) {
.pin.pin-2 .pin-popup {  left: -680px;  }
}

@media (max-width: 1280px) {
.pin.pin-2 .pin-popup {  left: -640px;  }
}

@media (max-width: 840px) {
.study-01-map .pin-2{ left:55%; top:50%;}
 .pin.pin-2 .label-dot-top:before { width:360px; height: 1px; top: 92px; left: -434px; }   
}


/*dot-bottom*/
.pin .label-dot-bottom { width: 12px; height: 12px; border-radius: 50%; margin: auto; background-color:#00bcff;transition: transform 0.3s; position: relative; }
.pin .label-dot-bottom:before{ content:""; position: absolute;width: 1px; height: 200px; bottom: -200px; left: 6px; background-color:#00bcff;  }
.pin:hover .label-dot-bottom:after { content:""; position: absolute;width: 50px; height: 50px; top: -19px; left: -19px; border-radius: 50%;background-color:#00bcff; opacity: .5;}


.pin .pin-popup-bottom {position: relative;bottom: -200px; left: 80px;  width: 100%;  /*box-shadow: 6px 6px 5px rgb(0, 0, 0,20%) */ }
.pin .pin-popup-bottom .name{ margin-left: 20px; font-size:1.25rem; font-weight: 600;  color: #000; letter-spacing: 2px; position: relative; z-index: 0;  pointer-events: none;}
.pin .pin-popup-bottom .text { margin-top: -50px; padding: 20px;  border-radius: 25px;opacity:0; transition: opacity 0.3s; position: relative; z-index: 1; pointer-events: none; background: #fff; box-shadow: rgb(46 46 46 / 20%) 0px 48px 100px 0px; }
.pin .pin-popup-bottom .text span { font-size:1.25rem; font-weight: 600;  color: #00bcff; letter-spacing: 2px; }

.pin:hover .pin-popup-bottom .name { opacity: 0;}
.pin:hover .pin-popup-bottom .text { opacity: 1;}

  
 
/*.study-02*/
.study-02-map { margin-top: 0px; display: flex; flex-wrap: wrap; justify-content: flex-start;pointer-events: all;  position: relative;}
.study-02-map:before { content: ""; position: absolute; z-index:9; width:3px; height:260px;right:47%; top:-16%; background:#f15921;   transform: rotate(45deg);  }

.study-02-map .map-image { width: 700px;height: auto;z-index: 0; position: relative;  }
/*.pin-1*/
.study-02-map .pin-1{ left:14%; top:38%;}
.study-02-map .pin.pin-1 .pin-popup { top:-70px; left: 700px;  width: 340px; height: auto;background-color: transparent;}
.study-02-map .pin.pin-1 .label-dot-top:before {  width:530px; height: 1px; top:6px; left: 15px; }
.study-02-map .problem-title{ display: flex;margin-top:-15%;  color:#f8f8f8; font-size: 130px; font-weight: 500;  letter-spacing:2px;font-family: 'MuseoModerno', cursive; z-index: -1 }
.study-02-map .problem-bg{ width:68%; height: 300px;margin: 0; background:#f8f8f8; position: absolute; right: 0px; top:20%; }

@media (max-width: 1440px) {
.study-02-map .map-image {transform: scale(.8); left: -120px;}
.study-02-map .pin-1{ left:6%; top:38%;}
.study-02-map .pin.pin-1 .pin-popup { left: 650px;  }
.study-02-map .pin.pin-1 .label-dot-top:before {  width:480px;   }
.study-02-map .problem-title{transform: scale(.9);margin-top:-16%; margin-left: -7%; }
.study-02-map .problem-bg{  right: 5%;  }
}
@media (max-width: 1280px) {
.study-02-map .pin-1{ left:8%;  }
.study-02-map .pin.pin-1 .pin-popup { left: 560px;  }
.study-02-map .pin.pin-1 .label-dot-top:before {  width:390px;   }
.study-02-map .problem-title{ margin-top:-19%; margin-left: -15%; }
}


@media (max-width:1180px) {
.study-02-map  {transform: scale(.85); margin-top: -200px;  }
.study-02-map .pin .pin-popup img {opacity: 1}    
}



@media (max-width: 1024px) {
.study-02-map  {transform: scale(.7);  }
}

@media (max-width: 840px) {
 .study-02-map .map-image { left:auto;}
 .study-02-map  {margin-top: -440px; margin-left: -120px; }
.study-02-map:before {   height:400px;right:35%; top:-25%;   }
}
@media (max-width: 768px) {
.study-02-map  {  margin-left: -120px; }
.study-02-map .map-image { transform: scale(.7);  }
    
.study-02-map:before { content: ""; position: absolute;  width:3px; height:400px;right:30%; top:-22%;   }
}
@media (max-width: 767.98px) {
.study-02-map  {transform: scale(1); position: relative;  margin-top:0px; margin-left: auto; left: auto;  right: auto;}
.study-02-map .map-image { transform: scale(1); left: auto; position: relative; }
 }

 


/*mold03.html .identify*/
.identify { margin-top: 0px;  pointer-events: all;  position: relative;}
.identify .map-image { width: 600px; height: auto;display: block; margin: auto; z-index: 0; position: relative;  }
@media (max-width: 1440px) {
.identify {transform: scale(.9); margin-left: 5%; }
}

@media (max-width: 1280px) {
.identify {transform: scale(.8); margin-left: 10%;  }
}

@media (max-width: 1180px) {
.identify {  margin-left: 0;margin-top: -100px;  }
    .identify .map-image{ transform: scale(.9);}

  }


@media (max-width: 1024px) {
.identify {transform: scale(.7); margin-left: 0;margin-top: -100px;  }
  }
@media (max-width: 840px) {
    .identify .map-image{ transform: scale(.85);}
   }


@media (max-width: 768px) {
.identify {transform: scale(.65);margin-top: -150px; margin-left: -12px; }
 
 }

@media (max-width: 767.98px) {
.identify {transform: scale(1);margin-top:0px; margin-bottom: 60px;  left: 0px;  right: auto; }
.identify .map-image {transform: scale(1); left: 0px;}
.identify-mobile .slick-dots{top:43%}
.identify-list{width: 100%; margin: auto;}   
}
 
.pin-border { width: 530px; height: 340px; border: solid 4px  #f15921;position: absolute;opacity: 0;  /*transition: all .3s ease;*/}
 @media (max-width: 1280px) {
.pin-border { width: 430px; height: 250px;}
}

.pin:hover .pin-border{ opacity: 1;}
.identify .name-text{ position: absolute;}
.identify .popup-item{display: block; width: 340px; margin-bottom: 20px; background-color: transparent;}


/*.pin-0*/
.identify .pin-0{ left:34%; top:26%;}
.identify .pin-0 .name-text{ margin-top: -45%; font-size:20px;  font-weight:400;  }
.identify .pin-0 .pin-border{ left:74%; top:-50%;}
.identify .pin:hover .pin-0 .pin-border{  animation:fadeInUp .3s both 1s;}
.identify .pin.pin-0 .pin-popup {  top: 60px; left: -500px;  width: auto;   }
.identify .pin.pin-0 .label-dot-top:before { content: ""; position: absolute;  width:420px; height: 1px; top:-50px; left: -660px; background: #f15921;   }
.identify .pin.pin-0:before { content: ""; position: absolute; display: block; z-index: 9; width:1px; height:250px; left: 45px; top:-146px; background: #f15921;   transform: rotate(-77deg);  }


/*.pin-1*/
.identify .pin-1{ left:44%; top:44%;}
.identify .pin-1 .name-text{ bottom:-140px; right:60px; min-width: 200px; font-size: 20px;  font-weight: 400;  }
.identify .pin-1 .pin-border{ left:auto; right: -630px;bottom:-460px; }
.identify .pin:hover .pin-1 .pin-border{transition: transform .6s;  /*transform: translateY(500px);*/ animation:fadeInUp 1s both 1.5s;   }
.identify .pin.pin-1 .pin-popup {  top: -350px;left:430px; width: auto;  position: absolute; }
.identify .pin.pin-1 .label-dot-top:before { content: ""; position: absolute;  width:240px; height: 1px; top:279px; left: 392px; background: #f15921;   }
.identify .pin.pin-1:before { content: ""; position: absolute; display: block; z-index: 9; width:1px; height:470px; left: 200px; top:-90px; background: #f15921;   transform: rotate(-55deg);  }



@media (max-width: 1280px) {
.identify .pin-0{ left:30%; }    
}

@media (max-width: 1180px) {
.identify .pin.pin-0 .label-dot-top:before{ width:360px;  left: -580px; }
.identify .pin-0 .name-text{ margin-top: -60%; }
.identify .pin.pin-0 .pin-popup {  top: 60px; left: -410px;   }
.identify .pin-1{ left:44%; top:48%;}
.identify .pin.pin-1 .pin-popup { left:360px;}
.identify .popup-item{display: block; width: 300px; margin-bottom: 20px; background-color: transparent;} 
}
@media (max-width: 1112px) {
.identify .pin.pin-1 .pin-popup {left:340px;}
.identify .pin.pin-0 .pin-popup { left: -400px;   }
}


@media (max-width: 1024px) {
.identify .pin-0{ left:28%; top:30%; }       
.identify .pin.pin-0 .pin-popup {  top: 60px; left: -400px;  width: auto;   }
.identify .pin-0 .pin-border{ left:74%; top:-40%;}
.identify .pin-1{ left:42%; top:48%;}
.identify .pin.pin-1 .pin-popup { left:350px;  }
}
@media (max-width: 840px) {
.identify .pin.pin-1 .pin-popup {left:340px;  }
}

@media (max-width: 768px) {
.identify .pin-0{ left:28%; top:32%; }       
.identify .pin-1{ left:41%; top:51%;}

}




.vis  { width: 100%; margin: 0px; position: relative; display: flex; flex-wrap: wrap; justify-content: space-between;  }
.vis li{ width: calc(100%/3); padding:20px 0px; margin:0px; list-style: none; position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; flex-direction: column; }
.vis li:after { content: ""; width: 80%; height: 50%; position: absolute;z-index: -1; left: 10%; top:0px; margin: auto;  background-image: linear-gradient(to top, #fff 0%, #f8f8f8 100%); }
.vis li figure {  position: relative; width: auto; margin: auto; padding-bottom: 10px; text-align: center;z-index: 9;  }
.vis li figure img{   margin: auto; display:block;}
.vis-inner{ width: 100%; position: relative;}
.vis-pic{ width: 100%; position: absolute;margin-top: 70px; }
.vis li:nth-child(2) {flex-direction: column-reverse; }
.vis li:nth-child(2) .circle-box{margin-top:-76px;}
.vis li:nth-child(2) .vis-pic{top: -76px;left:-25px; }
.vis li:nth-child(2):after { content: ""; width: 90%; height: 50%; position: absolute; z-index: -1; left: 5%; bottom:-40%; margin: auto;  background-image: linear-gradient(to bottom, #fff 0%, #f8f8f8 100%); }
.vis li:nth-child(3) .vis-pic{margin-top: 90px; left:-50px; }
 
/*.list txt*/
ul.vis-list{ width: auto;  margin: 10px auto 20px auto;   display: flex; position: relative;  }
ul.vis-list.half{width: 100%; display: flex; flex-wrap: wrap; }
ul.vis-list.half li{ width: 50%;  margin: 5px 0px; justify-content: flex-start; align-items:flex-start; }
.vis-list li{  width: auto; margin: 5px auto; padding: 0px 0px 0px 10px; color:#6d6d6d; font-size: 1rem; line-height: 1.5rem;  letter-spacing: 1px;  word-wrap: break-word;  text-overflow: ellipsis; }
.vis-list li:before{ content: ""; width: 5px; height: 5px;  position: absolute; left: 0px; top:8px;  right: auto; background:#6d6d6d;border-radius:99rem;  }


/*circle-box*/
.circle-box{ margin-top: 50px; width:160px; height: 160px;background: #f15921; border-radius:99rem; display: flex; flex-wrap: wrap;justify-content: center;align-items: center; flex-direction: column; z-index: 1;}
.circle-number{ margin-bottom: 20px; font-size: 70px; text-align: center;  -webkit-text-stroke: 1px #fff;   -webkit-text-fill-color: transparent;}
.circle-txt{ font-size: 20px;font-weight: 500; text-align: center; color: #fff;}


@media (max-width: 1680px) {
.vis li:nth-child(2) .vis-pic{top: -54px; left:-20px;}
.vis li:nth-child(3) .vis-pic{ left:-40px; }
}

@media (max-width: 1440px) {
.vis li:nth-child(2) .vis-pic{top: -44px; left:-20px;}
.vis li:nth-child(3) .vis-pic{ margin-top: 60px;left:-32px; }
}
@media (max-width: 1280px) {
.vis-pic{ margin-top: 120px; }
.vis li:nth-child(2) .vis-pic{   top: -28px; left:-16px;}
}
@media (max-width: 1024px) {
.vis { padding: 0px;  }
ul.vis-list.half li{ width: 100%; }    
   
 }
@media (max-width: 767.98px) {
.vis{position: relative;}  
.vis:after{content: ""; right:8%; top:18%; width: 2px; height:75%; position: absolute; background:#f15921;  }
.vis li{ width: 100%; padding: 20px 40px; flex-direction: column;position: relative; }
.vis li:nth-child(2) { flex-direction: column;  }
.vis li:after { width: 100%; height: 100%; left: 0; top:0px;background-image: linear-gradient(to bottom, #f8f8f8 0%, #fff 100%); }
.vis li:nth-child(2):after { content: ""; width: 100%; height: 100%; position: absolute; z-index: -1; left: 0; bottom:-40%; margin: auto;  background-image: linear-gradient(to bottom, #fff 0%, #f8f8f8 100%); }
.vis li .vis-pic{display: none}
.vis-inner{ order: 1;}
.circle-box{  width:50px; height: 50px; order: 3; position: absolute; right: 10px; bottom:20%}
.circle-txt{ font-size: 14px; line-height: 1.15rem}
.vis li .circle-number{ display: none}
.vis ul.vis-list{ width: 80%; margin: 0px; padding: 0px;  text-align: left;}
.vis ul.vis-list li{ width: 100%; margin: 5px auto; padding: 0px 0px 0px 10px; text-align: left; }
}

 @media (max-width: 320px) {
.vis:after{ top:20%; right:10%; height:72%;    }

}

 
/* mold03.html*/
.maintainance  { width: 100%; margin: 0px; padding: 20px 40px; position: relative; transition: transform .6s; animation:fadeInUp 1s both 1.5s; }
.maintainance li.main-grid{width: 100%; margin-bottom: 20px;  border-right: solid 1px #c0c0c0;position: relative; }
.maintainance li.main-grid:before { content: ""; width: 80%; height: 50%; position: absolute; left: 10%;   bottom: 0px; margin: auto;  pointer-events: none;  opacity: 1; background:#f8f8f8; -webkit-transition: all 0.5s; transition: all 0.5s;}
.maintainance li.main-grid:hover:before { background:#f15921;  }
.maintainance li.main-grid:hover{  transform: translateY(-19%);transition: all 0.5s;  }
.maintainance li.main-grid::after{content: attr(data-content); color:#fff; font-size: 130px; font-weight: 500;  letter-spacing: 3px;font-family: 'MuseoModerno', cursive;  
position: absolute; left:2%; top:8%;  z-index: 0;-webkit-text-stroke: 1px #000;  -webkit-text-fill-color: transparent; }
.maintainance li.main-grid:hover:after{ transform: translateY(500px);transition: all 0.5s;} 
@media (max-width: 1680px) {
 .maintainance li.main-grid:hover:after{ transform: translateY(462px); } 
 }

@media (max-width: 1280px) {
 .maintainance li.main-grid:hover:after{ transform: translateY(442px); } 
 }
@media (max-width: 840px) {
.maintainance  {  padding: 20px 0px;  }
}
.maintainance li.main-grid:hover i{opacity: 1}
.maintainance-item {width: 100%; padding:100px 40px 20px 40px; margin:0px 5px; display: flex; flex-wrap: wrap;  flex-direction: column;  -webkit-transition: all 0.5s; transition: all 0.5s; list-style: none; position: relative; }
.maintainance-item i{opacity: 0;}
.maintainance-item figure {  position: relative;   margin: auto; padding-bottom: 20px; text-align: center;z-index: 9; border-bottom: solid 1px #c0c0c0;}
.maintainance-item figure img{  width:100%; margin: auto; display:block;}
.maintainance-item h3 { margin-bottom: 5px; font-size:20px; line-height: 1.466;text-align: center; font-weight:400; color:#000; overflow: hidden;  }
.maintainance-item p{ color:#6d6d6d; font-size: 14px; line-height: 1.466; word-wrap: break-word;  text-overflow: ellipsis; height: 45px;}
.maintainance-inner{ width:70%; margin: auto; }
.maintainance li.main-grid:hover .cms-dot li{ color: #fff;}
.maintainance li.main-grid:hover .cms-dot li:before { background:#fff;  }
.maintainance li.slick-current.slick-active {/*transform: scale(1.1); */}
 
@media (max-width:767.98px) {
.maintainance-item { padding:100px 0px 20px 0px; margin:0px;   }
.maintainance-inner{ width:70%; margin: auto; }
.maintainance li.main-grid:before {  width: 100%; height: 50%; left:0; bottom: 0px; background:#f15921; }
.maintainance-item i{opacity: 1;}
.maintainance li.main-grid .cms-dot { padding-top: 20px;}
.maintainance li.main-grid .cms-dot li{ color: #fff;}
.maintainance li.main-grid .cms-dot li:before{background:#fff; }
.maintainance li.main-grid::after{ font-size: 40px; font-weight: 700; left:auto; right:10px; top:78%; color: #fff; -webkit-text-fill-color:#fff;  }
.maintainance li.main-grid:hover:after{ transform: translateY(0);transition: all 0.5s;} 
 .maintainance li.main-grid:hover{  transform: translateY(0);  }
   
}



/*.measure*/
.measure{width: 100%; margin: 0px; padding:40px 0px;display: flex; flex-wrap: wrap; align-self: stretch;  position: relative;  }
.measure::before{content: ""; width: 90%; height:82%; display: block; position: absolute; right:-10%; top:3%; background:#f8f8f8; z-index: -1;}
.measure-pic{ width: 50%; padding:10px 20px;  }
.measure-pic figure { transform: scale(.95); width:100%;  height:auto;  margin:50px 0px 0px 26px;padding:0px;position: relative;  }
.measure-pic figure img { margin: auto;  }
.measure-pic figure::before{content: ""; width: 122px; height:122px; display: block; position: absolute; left:-50px; top:-50px; background:#f15921; z-index: -1;}
.measure-pic.pic-bottom figure::before{  left:-50px;top:auto; bottom:-50px;  z-index: 1;}
.measure-box{ width: calc(50% - 100px); padding:40px 30px 0px 70px;  }
.measure-box ul{ width: 100%; margin: 0px auto; padding:0px;  list-style: none;   }
.measure-box li{ width: 100%;margin: 0px auto; padding:30px 10px;display: flex; flex-wrap: wrap;  border-bottom: solid 1px #c0c0c0;transition: all .5s ease;position: relative; }
.measure-box li .item-txt .cms-dot li{ width: 100%;margin: 0px auto; padding:5px 10px; border-bottom: none;   }

.measure-box li .item-txt .cms-dot li:before { width: 3px; height: 3px; top: 16px;  left: 0px;  }
.measure-box li:last-child{border-bottom:none;}
.measure-box li img {opacity:.5}
.measure-box li:hover img {opacity: 1}
.measure-item{ width: 100%; padding: 0px; margin: 0px; position: relative;  display: flex; flex-wrap: wrap;  }

.measure-item .item-number{color: #f15921; font-size: 16px;font-weight: 500; font-family: 'MuseoModerno', cursive;position: absolute; right: 0px;top:0px; }
.measure-item .item-pic{  width: 100%; margin: auto; display: block;  }
.measure-item .item-txt h3 { font-size: 20px; font-weight: 400;  line-height: 1.5rem; margin-bottom: 10px; color: #000; letter-spacing: 2px;}
.measure-item .item-txt p { font-size: 1rem; line-height: 1.5rem; font-weight: 400; color: #6d6d6d; letter-spacing: 2px;}
 @media (max-width: 1440px) {
.measure-box{ width: calc(50% ); padding:40px 0px 0px 70px;  }
.measure-box li{ padding:20px;  }
.measure-item{ width: 90%;  }
.measure-item .item-number{ right: -60px; }
.measure-pic.pic-bottom figure::before{ transform: scale(.9)}
    
}
 @media (max-width: 1366px) {
.measure-pic{ width: 50%; padding: 0px;  }
.measure-pic.pic-bottom figure::before{ transform: scale(.8)}
.measure::before{content: ""; width: 90%; height:88%;  }
}
 @media (max-width: 840px) {
.measure-pic.pic-bottom figure::before{ transform: scale(.6)}
}
@media (max-width: 767.98px) {
.measure{ padding:40px 0px;  }
.measure::before{ width: 100%; height:100%; left:0px; right: auto;}
.measure-item{ flex-direction: column; padding:0px 40px; }
.measure-box li{ width: 100%;  border: none;}
.measure-box li:hover{ background: #f15921; }
.measure-box li:hover .measure-item .item-number,.measure-box li:hover .item-txt,.measure-box li:hover .item-txt ul li{color:#fff }
.measure-box li:hover .cms-dot li:before{ background-color:#fff;  }    
.measure-pic{ width:100%;padding:0px 40px;}
.measure-pic figure { transform: scale(1); width:100%;  height:auto;  margin:50px 0px 0px 0px;position: relative;  }
.measure-pic figure::before{ width: 40px; height:40px; position: absolute; left:-20px; top:-20px;  z-index: -1;}
.measure-pic.pic-bottom figure::before{  left:-20px;top:auto; bottom:-20px; transform: scale(1) }    
.measure-item{width: 100%; }
.measure-box{ width: 100%; padding:40px 0px 0px 0px;  }
.measure-style-1 .measure-item .item-number{ position: relative; right: auto; order: 2;}
.measure-item .item-number{  width: auto; position: absolute; right: 40px; top:0px;order: 2;}
.measure-item .item-pic{order: 1;}  
.measure-item .item-txt{order:2;}   
.measure-item .item-txt ul li{padding: 0px 0px 0px 10px;}
}



/*mold06.html*/

.overall.measure::before{ top:25%; width: 96%; height:75%;  }
.overall .measure-pic{  width: 45%; padding:10px 0px 10px 25px;  }
.overall .measure-pic figure img{ width: 100%; display: block; margin:0px; }
.overall .measure-box{ width: calc(55% - 50px); padding:80px 0px 0px 50px;  }
.overall .measure-box ul{ margin: 0px auto; padding:100px 0px 0px 30px;  }
.overall .measure-box li{  padding:40px 10px; }

.overall .measure-box li:hover{ background: #f15921; }
.overall .measure-box li:hover .measure-item .item-number,.overall .measure-box li:hover .item-txt,.overall .measure-box li:hover .item-txt ul li,.overall .measure-box li:hover .item-txt h3,.overall .measure-box li:hover .item-txt p {color:#fff; }

.overall .measure-box li:hover .cms-dot li:before{ background-color:#fff;  }    
.overall .measure-item .item-txt p { font-size: 1rem; line-height: 1.5rem; color: #6d6d6d; letter-spacing: 2px;}

.measure-item .item-icon{  width:80px;margin-top: -10px; }
.measure-box li .measure-item .item-icon img{opacity: 1;}
.measure-item .item-wrap{  width: calc(100% - 80px - 10px);padding-left:10px; }

@media (max-width: 1680px) {
.overall.measure::before{   height:73%;  }
.overall .measure-box{ width:calc(55% - 30px); padding:80px 0px 0px 30px;  }    
.overall .measure-box ul{ margin-left: 50px; padding:50px 0px 0px 0px; }
.overall .measure-box li{  padding:40px 10px; }
.overall .measure-item .item-txt p {  letter-spacing: 0;}
}
 @media (max-width: 1440px) {
.overall .measure-box li{  padding:20px 10px; }
.overall .measure-item{width: 100%;}
.overall .measure-item .item-txt p { font-size: 14px;  }
}
@media (max-width: 840px) {
 .overall.measure::before{  top: 20%;}
   
.overall .measure-box{ width: calc(55% - 30px); padding:80px 0px 0px 0px;  }    
 .overall .measure-pic figure { transform: scale(1); width:100%;  height:auto;  margin:50px 0px 0px 0px;padding:0px;  }
.overall .measure-box ul{ margin:10px 0px; padding: 0px; }
 .overall .measure-box ul li{ margin:20px 0px;  }
    
}
@media (max-width: 767.98px) {
.overall.measure{ padding:0px;  }
.overall.measure::before{ width: 100%;  height:73%;  left:0px; right: auto; top: 25%;}
 .overall .measure-box ul li{ margin:20px 0px; padding:40px 0px;  }
.overall .measure-item{width: 100%; flex-direction: row;}
.overall .measure-pic{  width: 100%; padding:10px 40px;  }
.overall .measure-box{ width: 100%; padding:80px 0px 0px 0px;  }
.overall .measure-item .item-wrap{width: 100%; padding: 0px;  }
.overall .measure-item .item-icon{  width:60px;  position: absolute;right: 40px; top:-20px; }
    
    
}

.predictive  { width: 100%; margin: 0px;  padding: 0px; position: relative; display: flex; flex-wrap: wrap; justify-content: space-between;  }
.predictive li{ width: calc(100%/4 - 18px); padding:0px 0px; margin:0px 18px 0px 0px; list-style: none; position: relative;   display: flex; flex-wrap: wrap; flex-direction: row; align-content: space-between
 ;align-items: flex-end; border-top: solid 1px #000;}
.chart-item{ font-size: 20px; font-weight: 400; padding: 10px 0px 40px 0px; letter-spacing: 1px; }

.chart-box{  width: 100%; display: flex;  flex-direction: column;  }
.chart-pic{  display: flex;  align-items: flex-end;  }
.chart-pic .icon-pix{  width: 45px;height: 45px;  display: flex;  margin: 0; }
.chart-icon{ width: 100%;height: 45px; display: flex; justify-content: flex-end; }
.chart-end{ width: 100%;display: flex; flex-wrap: wrap; margin: 10px 0px;  }
.chart-number{ font-size: 40px; color: #000; font-weight: 500;}
.chart-number-de{ margin-top: -10px; margin-left: 10px; font-size: 14px; color: #a3a3a3;font-weight:400; letter-spacing: 1px;}
.box-orange{ background:#f15921}
.box-gray{ background:#6d6d6d}

.box-25{ height: 3.5rem;}
.box-35{  height: 5rem;}
.box-45{   height: 7rem;}
.box-75{  height: 11rem;}

@media (max-width: 767.98px) {
.predictive li{ width: calc(100%  - 18px); padding:0px ; margin: 0px 0px 15px 0px; }
}






/* mold04.html*/
.mold{width: 100%; margin: 0px auto; padding:0px;display: flex; flex-wrap: wrap; align-self: stretch;  position: relative; border-right:solid 1px #eee;border-left:solid 1px #eee;}
.mold li{ width: 100%;  margin: 0px auto; padding:10px;  position: relative; z-index: 9;  transition: all .5s ease;list-style: none; }
.mold li:after{content: ""; width: 1px;height: 100%;position: absolute; right: 0px; top:0px; background: #eee;  }
.mold li:nth-child(2n):after{display: none;}
.mold li:before{content: ""; width:100%;height: 1px;position: absolute; left:0px; bottom:0px; background: #eee;  }
.mold li:hover .item-number{ color:#f15921 }
.mold-item{width: 100%;padding: 40px 50px; display: flex; flex-wrap: wrap;flex-direction: column;justify-content: space-between; }
.mold-item .item-number{ font-size: 130px;line-height: 130px; color: #b3b2b2; font-weight: 500; font-family: 'MuseoModerno', cursive;display: block; margin-bottom: 20px; }
.mold-item .item-pic{  width: 100%; margin: auto; display: block;  }
.mold-item .item-pic img{box-shadow: 5px 5px 15px rgba(0,0,0,.1);}
.mold-item .item-txt{color:#7f7f7f;font-size: 16px;line-height: 1.5rem;  margin-bottom: 20px; }
.mold .slick-prev,.mold .slick-next{ bottom:0px;top:auto; }


 @media (max-width: 767.98px) {
.mold-item .item-number{ font-size: 40px;line-height:40px; color: #f15921;  margin-bottom: 20px; }
.mold-item{padding: 40px 0px;  }
.mold-item .item-txt{order: 3; }
.mold-item .item-pic{margin: auto auto 30px auto;} 
.mold{border: none;}
.mold li:before{  bottom:50px;  }
.mold li:after{ display: none;  }
.mold .slick-prev { left:30% }
.mold .slick-next{ right:30%; }
.mold .slick-prev:before,.mold .slick-next:before{  width: 36px; height: 36px;}
}


/* mold05.html*/
.mold-section{  width: auto; display: flex; flex-wrap: wrap; margin: 100px 0px 0px 0px;padding:0px 100px;  background-image: linear-gradient(to bottom, #fff 0%, #f8f8f8 100%); }

.promos { width:100%; margin: 0 auto; margin-top: 50px; display: flex; flex-wrap: wrap;}
.promo {  width: 50%;padding:50px 0px; display: flex; flex-wrap: wrap;  align-items: flex-start; align-content: flex-start; background: #ebebeb;  color: #f9f9f9;}
.deal { margin: auto; font-size:30px; color: #000; text-align: center; font-weight: 400;letter-spacing: 1px; }
 
.promo .price { flex: 0 0 auto; margin: 100px 0px 10px 10%; padding: 10px 50px; font-size: 1rem;color: #6d6d6d;  border: solid 1px #f15921;}
.features {width: 100%; margin: 20px 0 10px 10%; padding: 0; list-style-type: none; text-align: center; color: #999;}
.features li {display: flex;justify-content: center; width: 100%; margin:30px 0px; padding:15px 10px;  background: #fff; border-radius:30px 0px 0px 30px; box-shadow: 5px 5px 5px -5px rgba(0,0,0,.1)  }
.scale { box-shadow: -8px  2px 8px  -5px rgba(20, 20, 20, 0.5); background: #f15921;}

.scale .features{margin: 20px 10% 10px 0px;}
.scale .features li{ color:#f15921; border-radius:0px 30px 30px 0px;}
.scale .deal{color: #fff;}

 .promos .slick-prev,.promos .slick-next{ bottom:-30px;top:auto; }
 .promos .slick-prev { left:30% }
 .promos .slick-next{ right:30%; }
 @media (max-width: 840px) {
.mold-section{ padding:0px;}
}
 @media (max-width: 768px) {
     .promos {  margin-bottom: 80px; }
 .mold-section{ margin: 0px; padding:0px;}
   .promos .slick-prev:before,.promos .slick-next:before{  width: 36px; height: 36px;}    
 }
 



.tabs-wrapper{margin:100px 0px; position: relative;}
.resp-tabs-list li{border-radius:60px 60px 0px 0px; border: solid 1px #6d6d6d;  color: #6d6d6d;}
.resp-tabs-list li a {  font-size: 1.875rem; font-weight: 500;  color: #6d6d6d!important;}
#cms-main .resp-tab-active  { color: #000!important;   border-bottom: solid 1px #fff;  }
#cms-main .resp-tab-active a { color: #000!important;    }
.resp-tabs-list {  width:100%; padding: 10px; display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; text-align: center; z-index:1;  background-color:transparent; border-bottom: solid 1px #fff;}
.edit {display: block; margin: auto; margin: 100px auto;}

/*mold07.html*/
/* ==== Slider Style === */
.vieo-item {  width: 1000px; height: auto !important; margin: auto; position: relative; }
.item-video { width: 100%; height: 600px;  display: block; background-color: #fff; position: relative; } 
.vieo-item .owl-carousel .owl-video-wrapper{   margin-bottom: 20px; background-color: #fff;  }
.vieo-item img { object-fit: cover; position:absolute; top: 0; z-index: 0; } 
.vieo-item .video-title{ font-size: 20px; font-weight: 400; display: block; z-index: 9;left:0px; bottom: 0px;  position: absolute;}
.vieo-item .owl-dots{margin-top: 50px;}
.vieo-item .owl-theme .owl-dots, .vieo-item  .owl-theme .owl-nav { text-align: right;}
.vieo-item .owl-theme .owl-dots .owl-dot.active span::before, .vieo-item .owl-theme .owl-dots .owl-dot:hover span::before { border: solid 1px #f15d26;}


@media (max-width: 840px) {
.vieo-item {  width: 100%; height: auto !important; margin: auto; padding-top: 40px; position: relative;background-image: linear-gradient(to bottom, #f8f8f8 0%, #fff 100%); }
.item-video { width: 100%; height: 480px;  } 
}
@media (max-width: 767.98px) {
.item-video { width: 100%;  height: 260px; margin-top: 40px; } 
.vieo-item .video-title{ width: 100%;left:0px; bottom: auto; top:40px; font-size: 14px; text-align: center; }
.vieo-item .owl-theme .owl-dots, .vieo-item  .owl-theme .owl-nav { text-align: center;}
}

/*---------------------------------
best-wrap
----------------------------------------*/
.cms-best-wrap{width: 100%; margin:0 auto; padding:40px 0px 40px 15%; background: #f8f8f8; }
.best-item  { width: 100%; margin: 80px 0px 0px  -40px;  position: absolute;  display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap;  }
.best-item li{ width:100%; margin: 0px 30px 0px 0px; padding:20px;  list-style: none; background: #fff; position: relative;transition: all .35s ease; -webkit-box-shadow: 2vw 3vw 3vw -3vw rgb(0,0,0,20%);  box-shadow: 3vw 3vw 3vw -3vw rgb(0,0,0,20%);   }
.best-item li figure {  width: 100%; height: auto;padding: 80px 20px;  background-color: #fff; transition: all 0.5s ease 0s; position: relative;  }
.best-item li .product-inner{width: 100%; padding:10px;transition: transform 0.35s;  }

.best-item li .item-title{ margin-bottom: 10px;padding-bottom: 10px; border-bottom: solid 1px #dfdfdf; }
.best-item li .item-title h3 { margin: 5px 0px; font-size:1.125rem; line-height: 1.466; font-weight:400; overflow: hidden; white-space: normal;display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: break-word; text-overflow: ellipsis;}
.best-item li .item-title p{ color: #6d6d6d; font-size: 14px; line-height: 1.466; word-wrap: break-word;  text-overflow: ellipsis; }
.best-item li .item-sub-title{color: #6d6d6d; font-size: 14px;}


.btn-area { width: 100%; position: absolute; z-index: 5; bottom:0; left: 0; transition: all 0.4s ease-out 0s; opacity:0; }
.btn01 { display:flex; flex-wrap: wrap;justify-content: center;align-items: center; align-content: center; width: 100%; line-height: 70px; border: 1px solid #f15921;  padding: 0 30px; position: relative; color: #fff !important; background:#f15921; overflow: hidden;}
.btn01:before { content: ""; position: absolute; top: 0; left: -100%; width: 100%;  height: 100%; background: linear-gradient( 120deg, transparent, #fff, transparent); transition: all 650ms;}
.btn01:hover:before { left: 100%}

.btn01 i{width: 16px; height:16px; margin-left: 10px; }
.best-item li:hover .btn-area{opacity: 1; }
.best-item .slick-slider{overflow: visible;  }
.best-item .slick-prev,.best-item .slick-next{ top:-120px;  -webkit-filter:grayscale(100%);}
.best-item .slick-prev{ left: auto; right: 60px;}
 

.reveal {  visibility: hidden; position: relative; width:100%; height: 100%; overflow: hidden;}

/* Reveal block */
.reveal-holder { width: 100%;position: relative;}
.reveal-holder .reveal-block { position: absolute; top: 0; width: 100%; height: 100%; background: white;}
.reveal-holder .reveal-block::before { position: absolute; content: ""; top: 0; left: 0; right: 0;  bottom: 0; background: #f15921; transition-property: transform; transition-duration: 0.5s;}


.reveal-block.gradient::before {
  background: linear-gradient(to left, #000, #ccc);
}

.reveal-block.gradient-two::before {
  background: linear-gradient(to left, #1b9edf, #af74c3);
}

.reveal-block.extra {
  background: #1b9edf;
}
.reveal-block.extra::before {
  background: #af74c3;
}

.reveal-block.top.aos-animate::before,
.reveal-block.bottom.aos-animate::before {
  transform: scaleY(1);
}

.reveal-block.left.aos-animate::before,
.reveal-block.right.aos-animate::before {
  transform: scaleX(1);
}

.reveal-block.top::before {
  transform: scaleY(0);
  transform-origin: 0% 100%;
}

.reveal-block.left::before {
  transform: scaleX(0);
  transform-origin: 100% 0%;
}

.reveal-block.right::before {
  transform: scaleX(0);
  transform-origin: 0% 100%;
}

.reveal-block.bottom::before {
  transform: scaleY(0);
  transform-origin: 100% 0%;
}

/* AOS animate */
[data-aos=reveal-top],
[data-aos=reveal-left],
[data-aos=reveal-right],
[data-aos=reveal-bottom] {
  transition-property: transform;
  transition-delay: 0.5s;
}

[data-aos=reveal-top] {
  transform: scaleY(1);
}
[data-aos=reveal-top].aos-animate {
  transform: scaleY(0);
  transform-origin: 100% 0%;
}

[data-aos=reveal-left] {
  transform: scaleX(1);
}
[data-aos=reveal-left].aos-animate {
  transform: scaleX(0);
  transform-origin: 0% 100%;
}

[data-aos=reveal-right] {
  transform: scaleX(1);
}
[data-aos=reveal-right].aos-animate {
  transform: scaleX(0);
  transform-origin: 100% 0%;
}

[data-aos=reveal-bottom] {
  transform: scaleY(1);
}
[data-aos=reveal-bottom].aos-animate {
  transform: scaleY(0);
  transform-origin: 0% 100%;
}

[data-aos=reveal-item] {
  visibility: hidden;
  transition-property: visibility;
  transition-duration: 0s;
}
[data-aos=reveal-item].aos-animate {
  visibility: visible;
}

 

/* fixed-table*/
 
.responsive-table {width: 100%; margin: auto;}
.unfixed-table{ width: 100%; margin: auto;  border-collapse: collapse;}

 

.unfixed-table td,.unfixed-table th { padding: 25px 0px; box-sizing: border-box;   text-align: center;}
.unfixed-table td{font-size: 16px;color:#6d6d6d; font-weight: 500; letter-spacing: 1px;}
.unfixed-table th{font-size: 20px; font-weight: 400; letter-spacing: 1px; }
.unfixed-table td:nth-child(1){width:20%; }
.unfixed-table td:nth-child(2),.unfixed-table td:nth-child(3){width:40%; } 
.unfixed-table td:nth-child(3),.bg-th{ color: #fff;  background: #f15921;}
.unfixed-table thead th {position: -webkit-sticky;  position: sticky; top: 0; z-index: 2; font-size: 20px; }
.unfixed-table thead th:first-child { left: 0; z-index: 3;}

.unfixed-table tr{border-bottom:1px solid #ebebeb;}
.unfixed-table tr:last-of-type{ border-bottom: none!important;}
.bg-no{background-color: transparent!important;}
.unfixed-table td.bg-no .table-grid .img-pic{padding: 0px 20px 20px 20px;}
.table-grid{  width: 100%; padding: 20px; }
.table-grid .img-pic{padding:20px 40px 20px 0px; display: block; margin:0px; }
.table-grid ul{  margin: 0px; padding: 0px;}
.table-grid ul li{ font-size: 1rem;  font-weight: 400;  color: #f15921; text-align: left; letter-spacing: 1px;}

 
 /*.unfixed-table2 */
.unfixed-table-2  { width: 100%; margin: auto;  border-collapse: collapse;}
.unfixed-table-2 td,.unfixed-table-2 th { padding: 25px 30px; box-sizing: border-box; text-align: left; letter-spacing: 1px;}
.unfixed-table-2 td{font-size: 16px;color:#6d6d6d; }
.unfixed-table-2 th{font-size: 20px;font-weight: 400;}
.unfixed-table-2 td{ width: auto; }
.unfixed-table-2 th:nth-child(1){width:15%;padding: 25px 5px;  }

.unfixed-table-2 td:nth-child(5),.bg-th{ color: #fff;  background: #f15921;}
.unfixed-table-2 thead th {/*position: -webkit-sticky;  position: sticky; top: 0;*/ z-index: 2; font-size: 20px; }
.unfixed-table-2 thead th:first-child { left: 0; z-index: 3;}

.unfixed-table-2 tr{border-bottom:1px solid #ebebeb;}
.unfixed-table-2 tr:last-of-type{ border-bottom: none!important;}



.unfixed-table-3  { width: 100%; margin: auto;  border-collapse: collapse;}
.unfixed-table-3 td,.unfixed-table-3 th { padding: 25px 30px; box-sizing: border-box; text-align: left;}
.unfixed-table-3 td{font-size: 16px;color:#6d6d6d; }
.unfixed-table-3 th{font-size: 20px; font-weight: 400; letter-spacing: 0.5}
.unfixed-table-3 td{ width: auto; }
.unfixed-table-3 th:nth-child(1){width:15%;padding: 25px 5px; }
.unfixed-table-3 td:nth-child(5),.bg-th{ color: #fff;  background: #f15921;}
.unfixed-table-3 thead th {/*position: -webkit-sticky;  position: sticky; top: 0;*/ z-index: 2; font-size: 20px; }
.unfixed-table-3 thead th:first-child { left: 0; z-index: 3;}
.unfixed-table-3 tr{border-bottom:1px solid #ebebeb;}
.unfixed-table-3 tr:last-of-type{ border-bottom: none!important;}

 

.group{ width: 80%;    display: flex; flex-wrap:wrap; justify-content: center; align-items: center; }
.group h3{width: 100%; text-align: center; margin: auto;  font-size: 30px; letter-spacing: 1px; }
.group-list{  display: flex;   align-items: center;margin: 10px;font-size: 16px; letter-spacing: 1px; color: #c0c0c0;}
.group-list i{margin-right: 5px; }


 @media (max-width: 1520px) {
 .unfixed-table,.unfixed-table-2,.unfixed-table-3 {transform: scale(.9)}
}
 @media (max-width: 768px) {
 .unfixed-table,.unfixed-table-2,.unfixed-table-3 {transform: scale(1)}
}
 
@media (max-width: 767.98px) {
.responsive-table { height: auto; overflow: auto;}
.unfixed-table table { border-spacing: 0;}
.unfixed-table thead { font-size: 12px; line-height: 16px; letter-spacing: 0.05em; text-transform: uppercase;}
.unfixed-table tbody {font-size: 14px;}
.unfixed-table th, .unfixed-table td { padding: 15px;  white-space: nowrap; border-bottom: 1px solid #ebebeb;}
 /* .unfixed-table td:nth-child(2){display: flex; flex-wrap: wrap; justify-content: center;  } 
.unfixed-table tr th:nth-child(2){display: flex; flex-wrap: wrap; justify-content: center;  } 
*/ 
.unfixed-table td:nth-child(2){ min-width: 250px; } 
    
    
.unfixed-table td:nth-child(3){width:auto; } 
/*STICKY ROW Normal css box-shadow works for the header as it is a single html element */
.unfixed-table tr.sticky { position: sticky; top: 0; z-index: 1;  box-shadow: 0 0 6px rgba(0,0,0,0.25);}
/*STICKY COLUMNAvoid undesirable overlapping shadows by creating a faux shadow on the ::after psudo-element instead of using the css box-shadow property.*/
.unfixed-table th.sticky,.unfixed-table td.sticky { font-size: 16px;  padding: 15px 2px; position: sticky;  left: 0;  background: #f8f8f8}
.unfixed-table th.sticky::after,.unfixed-table td.sticky::after { content: ""; position: absolute; right: -6px;  top: 0;   bottom: -1px; width: 5px; border-left: 1px solid #ebebeb; background: linear-gradient(90deg, rgba(0,0,0,0.08) 0%, rgba(0,0,0,0) 100%);}

.unfixed-table th.sticky::before,.unfixed-table td.sticky::before { content: ""; position: absolute; left: -6px; top: 0; bottom: -1px; width: 5px; border-right: 1px solid #ebebeb; background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.08) 100%);}

.unfixed-table tr:last-child td {border-bottom: none;    }
.table-grid{  width: 100%; padding: 0px; }
.table-grid .img-pic{padding:20px 0px; display: block; margin:0px; }   
.table-grid ul li{   word-break: break-all; white-space: normal;}
.bg-table{ background-color: #f8f8f8;}
    
    
/*.unfixed-table-2   */
.unfixed-table-2 table { border-spacing: 0;}
.unfixed-table-2 thead { font-size: 12px; line-height: 16px; letter-spacing: 0.05em; text-transform: uppercase;}
.unfixed-table-2 tbody {font-size: 14px;}
.unfixed-table-2 th:nth-child(1){width:30%;  padding: 20px 25px; text-align: center; }

.unfixed-table-2 th  { padding: 15px 30px;  white-space: nowrap; border-bottom: 1px solid #ebebeb;}
.unfixed-table-2 td  { padding: 20px; box-sizing: border-box; border-bottom: 1px solid #ebebeb;}
.unfixed-table-2 tr:last-child td {border-bottom: none;    }

/*STICKY ROW Normal css box-shadow works for the header as it is a single html element */
.unfixed-table-2 tr.sticky { position: sticky; top: 0; z-index: 1;  box-shadow: 0 0 6px rgba(0,0,0,0.25);}
/*STICKY COLUMNAvoid undesirable overlapping shadows by creating a faux shadow on the ::after psudo-element instead of using the css box-shadow property.*/
.unfixed-table-2 th.sticky,.unfixed-table-2 td.sticky {  position: sticky;  left: 0;  font-size: 16px;  padding-left: 2px;  padding-right: 2px;  background: #f8f8f8}
.unfixed-table-2 th.sticky::after,.unfixed-table-2 td.sticky::after { content: ""; position: absolute; right: -6px;  top: 0;   bottom: -1px; width: 5px; border-left: 1px solid #ebebeb; background: linear-gradient(90deg, rgba(0,0,0,0.08) 0%, rgba(0,0,0,0) 100%);}

.unfixed-table-2 th.sticky::before,.unfixed-table-2 td.sticky::before { content: ""; position: absolute; left: -6px; top: 0; bottom: -1px; width: 5px; border-right: 1px solid #ebebeb; background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.08) 100%);}
.unfixed-tabl-2 tr:last-child td {border-bottom: none; min-width: 400px;   }

    
 .group{ width: auto;    }
    .group h3{width: auto;}   
    
}


 
 

 

