.hidden { display: none; }

p { color: #6d6d6d; }

.pro_nav * { animation: all .2s; }
.pro_nav .pros_select span:hover { color: #77b917; }
.pro_nav .pros_select span:hover:after { background-position-x: -190px; }
.pro_nav .pros_select ul { width: 100%; position: absolute; background: #FFFFFF; box-shadow: 0px 1px 3px 0px #f9f9f9; border: 1px solid #ccc; }
.pro_nav .pros_select ul li { line-height: 40px; border-top: 1px solid #f0f0f0; text-indent: 5px; height: 40px; transition: all .2s; }
.pro_nav .pros_select ul li a { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: color .2s; text-transform: capitalize; }
.pro_nav .pros_select ul li:hover { background: #77b917; text-indent: 10px; }
.pro_nav .pros_select ul li:hover a { color: #FFFFFF; }

.pro_nav.pfix { position: fixed; top: 0; background: rgba(0, 0, 0, 0.9); border-bottom: none; }
.pro_nav.pfix .pros_select span, .pfix ul.opcn li, .pfix ul.opcn a { color: white; }
.pro_nav.pfix .pros_select { margin-top: 0; }
.pro_nav.pfix .pros_select span:after { background-position-x: -220px; }
.pro_nav.pfix ul.opcn { margin-top: 23px; width: 310px; }
.pro_nav.pfix a.chat { margin-top: 15px; animation: shake 2.5s infinite; font-size: 16px; }

@keyframes shake { from,
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  10%,
  30%,
  50%,
  70%,
  90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-5px, 0, 0); }
  20%,
  40%,
  60%,
  80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(5px, 0, 0); } }

/*---------pro overview-------------*/


.pro_overview .liner { width: 100%; height: 1px; background: #f2f2f2; margin: 80px 0; }

.pro_media { width: 100%; overflow:hidden}
.pro_media .video_box { width: 400px; float:left; }
.pro_media .video_box div{width:100%;position:relative;padding-top:56.2%}
.pro_media .video_box iframe{width:100%; height:100%;position:absolute;left:0;top:0}
.pro_media .small_txt { width: 700px; height: 100%; float: right; }
.pro_media table { border-collapse: collapse; width: 100%; text-align: center; margin-top: 25px; display:block; overflow-x:scroll}
.pro_media table td { border: 2px solid #77b917; height: 40px; font-size: 1rem; color: #202020; }

img.mix { margin: 0 auto; }

/*---overview _parts-------*/
.parts { width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; }
.parts dl { width: 280px; height: 390px; position: relative; }
.parts dl * { transition: all .2s; }
.parts dl dt { width: 280px; height: 280px; border-radius: 50%; overflow: hidden; box-shadow: 0 2px 4px 3px #c1c1c1; }
.parts dl dt img { width: 100%; }
.parts dl:after { display: block; content: ""; width: 80px; height: 80px; border-radius: 50%; position: absolute; left: 50%; margin-left: -40px; top: 240px; background: url("../img/icons.png") -73px -480px; background-color: #77b917; transition: all .2s; }
.parts dl dd { font-size: 1.12rem; color: #808080; line-height: 24px; text-align: center; margin-top: 50px; }
.parts dl:hover dt img { transform: scale(1.05); }
.parts dl:hover dd { color: #77b917; }
.parts dl:hover:after { transform: scale(0.8); }

/*--------overview----------*/
.pro_img dl { height: 284px; cursor: pointer; }
.pro_img dl dt { height: 210px; position: relative; }
.pro_img dl dt:after { display: block; content: ""; position: absolute; width: 60px; height: 60px; background: url("../img/solution/icon_glass.png") 100% 100%; right: 0; bottom: 0 !important; top: unset; }
.pro_img dl dd { font-size: 1.12rem; color: #202020; height: 74px; line-height: 74px; padding-top: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pro_img dl:hover dd { color: #77b917; }

/*--------para_details table-----------*/
.table_hd { width: 100%; height: 50px; line-height: 50px; text-align: center; margin: 80px auto 40px; }
.table_hd span { display: inline-block; padding: 0 20px; background: #f5f5f5; font-size: 1.12rem; color: #333333; margin-right: 10px; border-radius: 4px; transition: all .2s; }
.table_hd span.on, .table_hd span:hover { color: #FFFFFF; background: #77b917; }

.tables table { font-size: 1rem; color: #000; width: 100%; border-collapse: collapse; margin-bottom: 80px; }
.tables table tr:nth-child(odd) { background: #f2f2f2; }
.tables table tr { line-height: 1.5rem; transition: all .2s; }
.tables table tr * { transition: all .2s; }
.tables table tr:hover { background: #77b917; }
.tables table tr:hover td { color: white; }
.tables table td { text-align: center; border: 1px solid white; padding:.5rem 0}
.tables table tr:first-child { background: #77b917; color: white; }
.tables table tr:last-child td { border-bottom: 1px #f2f2f2 solid; }

/*---case-----*/
.casebox { margin: 80px 0 40px; }

.casebox dl { margin-bottom: 40px; }

/*-------------------CAPACITY PAGE---------------------------*/

.application_banner.fish a:hover{border-radius: 20px; transition: border-radius .3s;}

.flow_img { width: 100%; display: flex; justify-content: space-between; margin: 40px 0 80px; }
.flow_img li { width: 580px; overflow: hidden; box-shadow: 2px 3px 3px 1px #c0c0c0; cursor: pointer; position: relative; }
.flow_img li img { width: 100%; height:auto; transition: all .2s; }
.flow_img li.center { margin: 0 auto; width: 880px; }
.flow_img li:after { display: block; content: ""; position: absolute; width: 60px; height: 60px; background: url("../img/solution/icon_glass.png") 100% 100%; right: 0; bottom: 0; }

.single_machine { width: 100%; margin: 80px auto; }
.single_machine > div { width: 100%; display: flex; justify-content: space-between; }
.single_machine > div dl { height: 100%; }
.single_machine > div dl * { transition: all .2s; }
.single_machine > div dl dd p span { transition: all .2s; }
.single_machine > div dl dd p span em { display: block; font-style: normal; }
.single_machine > div dt { overflow: hidden; }
.single_machine > div dt, .single_machine > div dd, .single_machine > div dt img { width: 100%; }
.single_machine > div dd { background: #f2f2f2; display: table; padding: 20px; box-sizing: border-box; }
.single_machine > div dd p { display: table-cell; vertical-align: middle; font-size: 1.12rem; color: #202020; }
.single_machine > div dd p span { display: block; font-size: 1rem; }
.single_machine > div dd p span, .single_machine > div dd p span em { color: #202020; }
.single_machine > div dl:hover dt img { transform: scale(1.05); }
.single_machine > div dl:hover dd { background: #77b917; }
.single_machine > div dl:hover dd p, .single_machine > div dl:hover dd p span, .single_machine > div dl:hover dd p span em { color: white; }
.single_machine .quarter { height: 580px; }
.single_machine .quarter dl { width: 280px; }
.single_machine .quarter dt { height: 360px; }
.single_machine .quarter dd { height: 200px; margin-bottom: 20px; }
.single_machine .quarter dl:nth-child(2n-1) dt { margin-bottom: 20px; }
.single_machine .third { height: 760px; margin: 20px 0; }
.single_machine .third dl { width: 380px; position: relative; }
.single_machine .third dt, .single_machine .third dd { height: 380px; }
.single_machine .third dl:after { display: block; content: ""; width: 32px; height: 32px; background: url("../img/solution/icon_arrow.png"); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.single_machine .third dl:nth-child(2):after { transform: scaleY(-1) translate(-50%, 50%); }
.single_machine .half { height: 280px; }
.single_machine .half dl { width: 580px; }
.single_machine .half dt, .single_machine .half dd { float: left; width: 280px; height: 280px; }
.single_machine .half dl:first-child dt { margin-right: 20px; }
.single_machine .half dl:last-child dd { margin-right: 20px; }

/*---------------------Application page----------------------------------*/
.full_grey { width: 100%; background: #f2f2f2; padding: 60px 0; margin-bottom: 60px; }
.full_grey img { width: 100%; margin-top: 60px; }

.recipe { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; margin: 80px auto; }
.recipe dl { width: 280px; height: 510px; background: #f2f2f2; overflow: hidden; transition: all .2s; }
.recipe dl dt { width: 100%; height: 100px; background: url("../img/solution/bg_recipe.png") center no-repeat; display: table; }
.recipe dl dt p { display: table-cell; vertical-align: middle; line-height: 32px; font-size: 1.75rem; text-align: center; color: white; text-transform: capitalize; }
.recipe dl dd { width: 90%; height: 40px; line-height: 40px; background: url("../img/solution/icon_li.png") no-repeat 20px center; font-size: 1.12rem; color: #202020; text-indent: 50px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.recipe dl:hover { box-shadow: 0 0 5px 0px #77b917; }

.used { margin-bottom: 80px; }
.used p { margin-bottom: 50px; }

.overall { width: 100%; background: url("../img/products/bg_overall.jpg") no-repeat right top; }
.overall dt { width: 50%; float: left; }
.overall dd { color: #77b917; font-size: 1.25rem; line-height: 32px; width: 40%; float: right; padding-top: 40px; }

.partsdetail li { width: 242px; height: 470px; float: left; margin-right: 70px; }
.partsdetail li div{width: 242px; height: 470px;}
.partsdetail li:nth-child(4n) { margin-right: 0; }
.partsdetail li:nth-child(5) { margin-left: 160px; }
.partsdetail li:nth-child(n+5) { margin-top: -72px; }
.partsdetail p { padding: 270px 20px 0; width: 100%; text-align: left; color: #202020; box-sizing: border-box; transition: all .2s;}
.partsdetail li:hover p { color: #77b917; }

@media (max-width:1179px) {
  img{width: 100%; height: auto;}
  .pro_overview div#partsDetail{width: 100%; overflow-x:scroll}
  .pro_overview div#partsDetail ul{width: 1180px;;}
  .parts dl{width: 24%; height: auto;}
  .parts dl dt{width: 100%; height: auto;}
  .pro_img dl,.pro_img dl dt{height: auto;}
  .mask2 img{width: 96%;}
  .flow_img li{width: 49%;}
  .single_machine .quarter dl{width: 24%;}
  .single_machine .quarter dl:nth-child(2n-1) dt,.single_machine .quarter dd{margin-bottom: 0;}
  .single_machine .quarter dt{height: auto;}
  .single_machine .half dl{width: 49%;}
  .single_machine .half dl a{display: flex; flex-wrap: wrap; justify-content: space-between;}
  .single_machine .half dt, .single_machine .half dd{float: unset;width: 50%; height: auto;}
  .single_machine .half dl:first-child dt,.single_machine .half dl:last-child dd{margin-right: 0;}
  .single_machine > div dd{display: flex;align-items: center;}
  .single_machine .third dl{width: 32.5%;}
  .single_machine > div dd p{width: 100%;}
}
@media (max-width:1024px) {
  .pro_media{height: auto;display: flex; flex-wrap: wrap; justify-content: space-between;}
  .pro_media .video_box{width:34%; height: auto;float: unset;}
  .pro_media .small_txt{width: 64%;height: auto; float: unset;}
  .parts dl:after{top: 55%;}
  .single_machine .third dt{height: auto;}
  .single_machine .third dd{height: 31vw;}
  .single_machine .third dl:after{top: 31vw;}
  .recipe dl{width: 24%; height: auto;}
}
@media (max-width:768px) {
  
  .tables table{display: block; overflow-x: scroll;}
  .pro_media .video_box,.pro_media .small_txt,.pro_img dl{width: 49%;}
  .industrybox .industry dl{width:32.5%}
  .single_machine .quarter,.single_machine .third{height: auto;}
  .single_machine .quarter dd{height: 280px;}
  .single_machine .half{flex-wrap: wrap;justify-content: space-around;height: auto;}
  .single_machine .half dl{width: 80%; margin-bottom: 1rem;}
  .application_banner.feedsolution_banner,.application_banner.woodsolution_banner{background: none;}

  .ban_title{width: 90%; position: absolute;top: 5vw;left: 5%; margin: 0;background: rgba(0, 0, 0, .8); border-radius: 27px;}
  .recipe dl{width: 49%;margin-bottom: 1rem;}
    .service .main li,.video p{width: 100%;}
}
@media (max-width:425px) {
  
  .pro_media .video_box, .pro_media .small_txt,.overall dt,.overall dd{width: 100%;}
  .pro_media .video_box{margin-bottom: 1rem;}
  .overall{background:none}
  .parts dl{width: 49%; margin-bottom: 1rem;}
  .industrybox .industry dl{width:49%}
  .single_machine > div{flex-wrap: wrap;}
  .single_machine .quarter dl{width: 49%;margin-bottom: 1rem;}
  .single_machine .third dl{width: 80%;margin-bottom: 1rem;}
  .single_machine .third{justify-content: space-around;}
  .single_machine .third dl:nth-child(2)::after{top: 77vw;}
  .single_machine .half dl{width: 100%;}
}
@media (max-width:375px) {
  .parts dl:after{display: none;}
  .parts dl dd{margin-top: 1.5rem;}
}