label{font-weight:normal}
textarea { font-family: Arial; }
textarea:focus::-webkit-input-placeholder {color: transparent;}
textarea:focus::-moz-input-placeholder {color: transparent;}
textarea:focus:-moz-input-placeholder {color: transparent;}

h1,h2,h3,h4,h5,h6{text-transform:capitalize}

img { border: none; display: block; }

input { outline: none; -webkit-appearance:none}
input[type="checkbox"]{-webkit-appearance:checkbox;}

td{text-size-adjust: 100%;-webkit-text-size-adjust: 100%;}

.clear { clear: both; overflow:hidden}

#LRdiv0 { display: none !important; }

.hidden { display: none; }

.mart_80 { margin-top: 80px; }

p { font-size: 1rem; color: #6f6f6f; line-height: 1.5rem; }

p.tit_sum { width: 1000px; text-align: center; margin: 30px auto 0; }

p.center { text-align: center; margin: 35px auto 40px; }

.flex{display:flex; flex-wrap:wrap; justify-content:space-between}

.ltit, .ltit_c, .overview h2,.opc h2 { font-size: 1.5rem; line-height: 30px; color: #333333; position: relative; margin-bottom: 20px; font-weight: normal; width: 100%; text-transform: capitalize; }
.ltit:after, .ltit_c:after, .overview h2:after,.opc h2:after { content: " "; display: block; width: 100px; height: 1px; position: absolute; background: #77b917; bottom: -12px; }
.ltit a.more, .ltit_c a.more, .overview h2 a.more { float: right; font-size: 1.12rem; color: #77b917; text-transform: uppercase; }
.ltit span, .ltit_c span, .overview h2 span { font-size: .87rem; padding-left: 20px; }

.ltit_c, .overview h2,.opc h2 { text-align: center; }
.ltit_c:after, .overview h2:after,.opc h2:after { left: 50%; margin-left: -50px; }

a.consult{display:block;width:10rem; margin:1rem auto 2rem; text-align:center; padding:1rem; box-sizing:border-box; background:#77b917; color:#fff;}
a.consult:hover{border-radius:10px; transition:all .2s}

h2.ltit { text-transform: capitalize; }

.pagenumber { width: 100%; height: 40px; text-align: center; margin-top: 40px; display:flex;flex-wrap:wrap; justify-content:center; }
.pagenumber a, .pagenumber b { padding: 5px 10px; border: 1px solid #e6e6e6; border-radius: 4px; font-size: 1rem; color: #666666; margin: 0 .5rem 1rem;  transition: all .2s; }
.pagenumber a:hover, .pagenumber b { border-color: #77b917; color: #77b917; }


.products_nav { width: 100%; line-height: 60px; border-bottom: 1px solid #f0f0f0; margin: 5px 0 20px; }
.products_nav .container { text-align: justify; overflow: hidden; display: flex; flex-wrap:wrap; justify-content: space-around; }
.products_nav a { font-size: 1.12rem;  display: inline-block; transition: all .2s; color: #202020; padding:0 5px}
.products_nav a:after { content: " "; display: block; width: 0; height: 1px; background: #77b917; margin: 0 auto; transition: all .2s; }
.products_nav a.on, .products_nav a:hover { color: #548210; }
.products_nav a.on:after, .products_nav a:hover:after { width: 100%; }
.products_nav a.none { opacity: 0; }

.cons { height: 38px; margin-top: 60px; text-align:center}
.cons a { display: inline-block; width: 308px; height: 38px; line-height: 38px; border: 1px solid #77b917; border-radius: 4px; color: #77b917; margin-right: 10px; margin-bottom:1rem}
.cons a:before { display: block; width: 22px; height: 30px; content: " "; background: url("../img/icons.png") -392px -112px; float: left; margin: 0 10px 0 30px; }
.cons a.mail { margin-left: 0; }
.cons a.mail:before { background-position-x: -427px; }

#ad { background: url("../img/ad.jpg"); }

/*-------------nav----------------*/
.nav li dl { background: #f5f5f5; width: 250px; position: absolute; top: 80px; display: none; }
.nav li dl dd { line-height: 40px; text-indent: 10px; border-bottom: 1px solid #f0f0f0; position:relative; }
.nav li dl a { display: block; }
.nav li dl a:hover { color: #FFFFFF; background: #77b917; }
.nav li:last-child dl { width: 160px; }
.nav li:hover > a,.nav li dl dd:hover>a { background: #77b917; color:#fff}
.nav li:hover dl { display: block; }
.nav .nav_last{position:absolute;left:250px; top:0; background:#f5f5f5; width:360px; display:none;max-height:30rem;overflow-y:scroll}
.nav li dl dd:hover .nav_last{display:block;}

.websites ul { width: 250px; position: absolute; top: 80px; background: #FFFFFF; left: -185px; border: 1px solid #f0f0f0; border-top: none; display: none; }
.websites ul li { line-height: 30px; text-indent: 20px; transition: all .2s; }
.websites ul li a { display: block; transition: all .2s; }
.websites ul li:hover { background: #77b917; }
.websites ul li:hover a { color: #FFFFFF; }
.websites:hover ul { display: block;}

.nav_search .searchbox { position: absolute; top: 80px; left: -250px; width: 300px; height: 41px; background: #FFFFFF; border: 1px solid #f0f0f0; border-radius: 4px; line-height: 40px; display: none; }
.nav_search .searchbox input { width: 250px; height: 40px; border: none; line-height: 40px; text-indent: 10px; float: left; }
.nav_search .searchbox button { width: 50px; height: 40px; float: left; border: none; outline: none; cursor: pointer; border-radius: 0 4px 4px 0; background: url("../img/icons.png") #77b917 -326px 0px; }

/*------cebian-----------*/
.cebian li * { transition: all .2s; }

/*----------small banner------------*/
.sb_service { background: url("../img/sb_service.jpg"); }

.marb0 { margin-bottom: 0; }

/*-----------pro box--------------*/
.probox, .casebox { width: 100%; display:flex;flex-wrap:wrap; justify-content:space-between;}
.probox:after, .casebox:after { content: " "; display: block; clear: both; }
.probox .ltit, .casebox .ltit { margin-bottom: 50px; }
.probox dl, .casebox dl { width: 24%; padding: 20px; border: 1px solid #f0f0f0; border-radius: 4px; margin: 0 0 20px 0; box-sizing: border-box; float: left; }
.probox dl *, .casebox dl * { transition: all .2s; }
.probox dl dt, .casebox dl dt { width: 100%; position: relative; }
.probox dl dt img, .casebox dl dt img { width: 100%; height:100%;}
.probox dl dd, .casebox dl dd { border-top: 1px solid #f0f0f0; text-align: center;  color: #666666; margin-top: 20px; padding-top: 20px; font-size: 1rem; line-height: 26px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.probox dl dd span, .casebox dl dd span { display: block; font-weight: normal; color: #333333; line-height: 30px;height:60px; font-size: 1.12rem; transition: all .2s; overflow: hidden; white-space: normal; }
.probox dl:nth-of-type(4n), .casebox dl:nth-of-type(4n) { margin-right: 0; }
.probox dl:hover, .casebox dl:hover { border-color: #77b917; }
.probox dl:hover dd, .casebox dl:hover dd { border-top-color: #77b917; }
.probox dl:hover dd span{ color: #77b917; overflow: hidden;}

.casebox dl { width: 280px; border: none; border-bottom: 1px solid #f5f5f5; border-radius: 0; padding: 0; }
.casebox dl dt { overflow: hidden; width: 100%; }
.casebox dl dt img { width: 100%;height: auto; transition: all .2s; }
.casebox dl dt:after { content: ""; width: 1px; height: 100%; display: block; background: white; right: 0; position: absolute; top: 0; }
.casebox dl dd { border: none; margin-top: 0; height: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.casebox dl:after { content: " "; display: block; width: 0; height: 1px; background: #77b917; margin: 0 auto; transition: all .2s; }
.casebox dl:hover dt img { transform: scale(1.05); }
.casebox dl:hover { border-color: #f0f0f0; }
.casebox dl:hover:after { width: 100%; }

.probox_index .ltit { margin-bottom: 50px; }
.probox_index dl * { transition: all .2s; }
.probox_index dl:hover { border-color: #77b917; }
.probox_index dl:hover dt img { transform: scale(1.15); }
.probox_index dl:hover dd { border-top-color: #77b917; color: #77b917; }

/*--------service strip-------------*/
.service_strip { width: 100%; height: auto; border: 1px solid #f0f0f0; border-left: none; border-right: none; margin: 70px 0; }
.service_strip span { display: block; float: left; height: 88px; line-height: 88px; font-size: 1rem; color: #333333;  margin-right: 45px; }
.service_strip span:before { display: inline-block; width: 40px; height: 30px; content: " "; background: url("../img/icons.png") -525px -103px; vertical-align: middle; margin-right: 10px; }
.service_strip span:after { display: inline-block; width: 1px; height: 30px; content: " "; background: #f0f0f0; float: right; margin-top: 29px; }
.service_strip span.cor { width: auto; float: right; margin-right: 0; }
.service_strip span.cor:after { display: none; }
.service_strip span.qtb { width: 290px; }
.service_strip span.qtb:before { background-position-y: -142px; }
.service_strip span.ciw { width: 295px; }
.service_strip span.ciw:before { background-position-y: -183px; }
.service_strip span.pat { margin-right: 50px; width: 270px; }
.service_strip span.pat:before { background-position-y: -226px; }
.service_strip span:hover { color: #77b917; }
.service_strip span:hover:before { background-position-x: -576px; }

/*---------form-----------*/
.form_quotation {width:100%; overflow:hidden; }
.form_quotation input, .form_quotation textarea { outline: none; }
.form_quotation .left, .form_quotation .right { width: 49%; height: 280px; margin-top: 20px; }
.form_quotation .left { float: left; width: 49%; }
.form_quotation .right { float: right; }
.form_quotation input { font-size: 1rem; }
.form_quotation .lab { width: 578px; height: 38px; border: 1px solid #cccccc; margin-bottom: 20px; font-size: 1rem; color: #757575; line-height: 38px; box-sizing:border-box}
.form_quotation .lab span { display: block; float: left; width: 90px; text-align: right; }
.form_quotation .lab input { width: calc(100% - 90px); height: 90%; text-indent: 10px; border: none; color: #333; }
.form_quotation .lab i { color: #77b917; font-style: normal; }
.form_quotation .lab select { outline: none; border: none; font-size: 1rem; width: 300px; margin-left: 10px; height: 97%; }
.form_quotation textarea { width: 100%; height: 270px; border: 1px solid #CCCCCC; line-height: 36px; font-size: 1rem; text-indent: 20px; color: #333333; box-sizing:border-box;padding:10px}
.form_quotation .fuel_cho, .form_quotation .appli_cho { width: 100%; color: #666666; line-height: 36px; }
.form_quotation .fuel_cho span, .form_quotation .appli_cho span { display: block; float: left; font-size: 1.12rem; margin-right: 50px; }
.form_quotation .fuel_cho li, .form_quotation .appli_cho li { float: left; line-height: 36px; margin-right: 28px; cursor: pointer; }
.form_quotation .fuel_cho li:before, .form_quotation .appli_cho li:before { display: inline-block; width: 10px; height: 10px; margin-right: 10px; background: url("../img/icons.png") -565px -281px; content: " "; }
.form_quotation .fuel_cho li.on, .form_quotation .fuel_cho li:hover, .form_quotation .appli_cho li.on, .form_quotation .appli_cho li:hover { color: #77b917; }
.form_quotation .fuel_cho li.on:before, .form_quotation .fuel_cho li:hover:before, .form_quotation .appli_cho li.on:before, .form_quotation .appli_cho li:hover:before { background-position-x: -545px; }
.form_quotation .fuel_cho:hover span, .form_quotation .appli_cho:hover span { color: #77b917; }
.form_quotation .appli_cho span { height: 85px; }
.form_quotation .sub { width: 220px; height: 44px; line-height: 44px; color: #FFFFFF; background: #77b917; font-size: 1.12rem; border-radius: 4px; margin: 30px auto; border: none; cursor: pointer; display: block; }

.successed,.sending { pointer-events: none; background: #999 !important; font-weight: bold; }

.chat_form { float: right; font-size: 1.12rem; color: #77b917; height: 22px; line-height: 22px; }
.chat_form a { color: #77b917; }
.chat_form a:before, .chat_form a:after { display: inline-block; background: url("../img/icons.png"); content: " "; vertical-align: middle; }
.chat_form a:before { width: 24px; height: 28px; background-position: -510px -275px; margin-right: 5px; }

@keyframes formsking { 0% { color: #333; }
  25% { color: #77b917; }
  50% { color: #333; }
  75% { color: #77b917; }
  100% { color: #333; } }
.form_quotation .formsking { animation: formsking 3s linear; }

/*-----------footer---------------*/
.footer { width: 100%; background: #303030; border-top: #77b917 2px solid; overflow: hidden; color: #cccccc; font-size: 1rem; position: relative; padding-top: 35px; margin-top: 80px;padding-bottom:30px}
.footer a { color: #cccccc; /* transition: all .2s;*/ }
.footer a:hover { color: #77b917; }
.footer * { z-index: 99999; }
.footer canvas { opacity: .2; position: absolute; top: 0; left: 0; z-index: 9998; pointer-events: none; }
.footer .help { width: 300px; margin: 0 0 40px 0; color: #ffffff; font-size: 1rem;  height: 40px; line-height: 40px; float: left; }
.footer .help span { display: inline-block; margin-left: 20px; cursor: pointer; }
.footer .help span:before { display: block; float: left; width: 10px; height: 10px; border-radius: 50%; background: #FFFFFF; content: " "; margin: 14px 8px 0 0; }
.footer .help span.on:before { background: #77b917; }
.footer .f_nav { width: 800px; height: 290px; float: left; }
.footer .f_nav ul { float: left; margin-right: 40px; }
.footer .f_nav ul li:not(.img) { line-height: 34px;  }
.footer .f_nav ul li:first-child { font-size: 1.25rem;; margin-bottom: 10px; font-weight: normal; }
.footer .f_nav ul li.img img { width: 200px; margin-bottom: 3px; }
.footer .cons_sns { width: 380px; float: right; height: 290px; color: #cccccc; }
.footer .cons_sns .tit { font-size: 1.25rem;; margin-bottom: 10px; line-height: 34px; }
.footer .cons_sns p { color: #ccc; font-size: 1rem; line-height: 30px; border-bottom: 1px solid #666666; padding-bottom: 8px; margin-bottom: 15px; }
.footer .cons_sns ul.cons_foot { width: 100%; }
.footer .cons_sns ul.cons_foot li { width: 50%; float: left; height: 20px; line-height: 20px; margin-bottom: 10px;  }
.footer .cons_sns ul.cons_foot li:before { width: 20px; height: 20px; float: left; display: block; content: " "; background: url("../img/icons.png") -50px -211px; margin-right: 5px; }
.footer .cons_sns ul.cons_foot li.tel:before { background-position-x: -76px; }
.footer .cons_sns ul.cons_foot li.phone:before { background-position-x: -98px; }
.footer .cons_sns ul.cons_foot li.fax:before { background-position-x: -120px; }
.footer .cons_sns ul.cons_foot li:nth-child(2n) { width: 45%; float: right; }
.footer .cons_sns .sns { width: 100%; margin-top: 15px; display: flex; justify-content: space-around; }
.footer .cons_sns .sns a { width: 25px; height: 25px; display: block; float: left; background: url("../img/icons.png") -4px -254px; color:transparent}
.footer .cons_sns .sns a.tw { background-position-x: -30px; }
.footer .cons_sns .sns a.yt { background-position-x: -61px; }
.footer .cons_sns .sns a.pin { background-position-x: -93px; }
.footer .cons_sns .sns a.in { background-position-x: -126px; }
.footer .cons_sns .sns a.sky { background-position-x: -157px; }
.footer .cons_sns .sns a.wk { background-position-x: -189px; }
.footer .cons_sns .sns a.tt { background-position-x: -226px; }
.footer .cons_sns .sns a:hover { background-position-y: -281px; }
.footer .langs { text-align: center; border-top: 1px solid #4d4d4d; }
.footer .langs .mia { text-align: center; margin: 32px 0 10px; }
.footer .langs .mia a { display: inline-block; width: 40px; height: 30px; color:transparent; background: url("../img/icons.png") -80px -110px; margin-right: 20px; }
.footer .langs .mia a.eso { width: 52px; background-position-x: -130px; }
.footer .langs .mia a.eac { width: 34px; background-position-x: -186px; }
.footer .langs .mia a:hover { background-position-y: -140px; }

form#phone { width: 570px; height: 40px; background: #222222; border-radius: 4px; float: right; overflow: hidden; }
form#phone input.phone { width: 480px; float: left; height: 40px; line-height: 40px; font-size: .87rem; color: #FFFFFF; outline: none; border: none; background: #222222; text-indent: 25px; }
form#phone input.sub { width: 80px; height: 40px; line-height: 40px; text-align: center; color: #FFFFFF; background: #77b917; float: right; border: none; outline: none; font-size: 1rem;  cursor: pointer; }


/*---------------news list----------------------*/
.related_info, .news_list_ind { width: 100%; margin: 70px auto; }
.related_info ul, .news_list_ind ul { width: 100%; margin-top: 50px; display: flex; flex-wrap: wrap;justify-content: space-between;}
.related_info ul li, .news_list_ind ul li { width: 49%; height: 54px; line-height: 54px; font-size: 1.12rem; border-bottom: 1px solid #f0f0f0; }
.related_info ul li a, .news_list_ind ul li a { color: #666666;  display: block; transition: all .2s; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.related_info ul li a:before, .news_list_ind ul li a:before { display: block; width: 10px; height: 54px; content: " "; float: left; background: url("../img/icons.png") -227px -100px; margin-right: 10px; transition: all .2s; }
.related_info ul li a:after, .news_list_ind ul li a:after { display: block; height: 1px; content: " "; background: #77b917; transition: all .2s; width: 0; }
.related_info ul li a span, .related_info ul li a i, .news_list_ind ul li a span, .news_list_ind ul li a i { display: block; height: 54px; line-height: 54px; }
.related_info ul li a span, .news_list_ind ul li a span { width: 70%; float: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.related_info ul li a i, .news_list_ind ul li a i { width: 20%; float: right; font-style: normal; }
.related_info ul li:hover a, .news_list_ind ul li:hover a { color: #77b917; }
.related_info ul li:hover a:before, .news_list_ind ul li:hover a:before { background-position-x: -239px; }
.related_info ul li:hover a:after, .news_list_ind ul li:hover a:after { width: 100%; }
.related_info ul:after, .news_list_ind ul:after { content: " "; display: block; clear: both; }

.news_list_ind ul li a:before { background: none; }

dl.more { width: 100%; height: 90px; margin-top: 30px; }
dl.more dt { width: 50px; height: 50px; text-align: center; line-height: 58px; margin: 0 auto 10px; color: #77b917; border: 1px solid #77b917; font-size: 3.43rem; border-radius: 50%;  }
dl.more dd { font-size: 1rem; text-align: center; color: #548210; }

/*---------------news content-------------------*/
.news_art { width: 100%; }
.news_art h1 {font-size: 2rem; color: #68a214; }
.news_art span.newstime { font-size: 1rem; color: #666666; text-align: center; display: block;  }
.news_art p { margin-bottom: 25px; }
.news_art p a,.news_art ul li a{color:#757575}
.news_art img { display: block; margin: 0 auto 1rem; width: 600px; height: 400px; }
.news_art h2 {width: calc(100% - 30px);font-size: 1.3rem;background: #e4f1d4;line-height: 1.8rem;padding:.9rem 0 .9rem 40px;margin-bottom: 15px;text-transform: capitalize;color: #333;border:1px solid #77ba28; box-sizing:border-box; position:relative; margin-left:30px;font-weight:normal;font-family:"Impact"}
.news_art h2:before{display:block; content:"ஐ";width:60px; height:60px;background:#77ba28; border-radius:50%; border-top-right-radius:0; position:absolute; left:-30px; top:-1px;text-align:center; font-size:2rem; color:#fff;line-height:45px; font-weight:normal}
.news_art h2:after{display:block; content:"RICHI";width:70px;height:24px;line-height:24px; text-align:center; color:#fff;position:absolute; top:-12px;right:12px;background:#77ba28;font-family:"Arial";font-size:1rem}
.news_art h3{font-size:1.3rem; color:#333;margin-bottom:1rem; font-size:1.13rem; color:#77ba28}
.news_art h3 a{color:#77ba28}
.news_art h3:before{display:inline-block; content:"";width:20px; height:20px; background:url(/static/img/article_time.png) no-repeat 0 -38px; margin-right:10px}
.news_art h4{font-size:1rem; color:#333; line-height: 2.5rem;}
.news_art h5{font-size:1rem; line-height:2rem;font-weight:normal;color:#77ba28}
.news_art iframe{width:100%; margin-bottom:1rem}
.news_art table{width:100%; box-sizing:border-box; border-collapse:collapse; margin-bottom:1.5rem;display:block;overflow-x:scroll}
.news_art table td,.news_art table th{border:1px solid #ddd; padding:.5rem; text-align:center; line-height:1.5rem; color:#333; font-size:1rem}
.news_art table tr:nth-child(2n+1){background:#f1f8e7}
.news_art table th,.news_art table th a{color:#fff; background:#77b917}
.news_art table td a{color:#333}
.news_art ul,.news_art ol{background:#f2f2f2; padding:2rem 1rem 1rem 3rem;margin-bottom:1.5rem;border-radius:5px}
.news_art ul li,.news_art ol li{list-style:disc; line-height:1.5rem;color:#333; margin-bottom:1rem}
.news_art ul li::marker,.news_art ol li::marker{color:#77ba28}
.news_art ol li{list-style:decimal-leading-zero}


.hotqian { width: 100%; height: 30px; line-height: 30px; margin-top: 30px; }
.hotqian dt, .hotqian span { float: left; font-size: 1.12rem; color: #77b917; margin-right: 30px; }
.hotqian dt:before, .hotqian span:before { display: block; content: " "; width: 27px; height: 30px; background: url("../img/icons.png") -460px -149px; float: left; margin-right: 8px; }
.hotqian dd { float: left; font-size: 1rem;  }
.hotqian a { margin-right: 25px; color: #666666; }
.hotqian a:hover { color: #77b917; }

.pn { width: 100%; line-height: 60px; text-align: center; font-size: 1rem; color: #999999; margin: 80px 0; display:flex; flex-wrap:wrap;justify-content:space-between}
.pn .pan, .pn .back_list { background: #f5f5f5; }
.pn .pan a, .pn .back_list a { color: #6f6f6f; }
.pn .pan { width: 40%; height: 60px; overflow: hidden; }
.pn .pan a:hover { color: #77b917; }
.pn .back_list { background: #f5f5f5; width: 19%; }
.pn .back_list a { display: block; }
.pn .back_list:hover { background: #77b917; }
.pn .back_list:hover a { color: #FFFFFF; }

/*-------other public--------*/
.vicon { width: 100px; height: 30px; position: absolute; left: 25px; bottom: 25px; background: url("../img/icons.png") #FFFFFF 0 -172px; border-radius: 4px; cursor: pointer; }
.vicon span { display: block; float: right; width: 70px; height: 30px; text-align: center; line-height: 32px; color: #77b917; font-size: .87rem; }

.arrow {width:100%; max-width: 148px; height: 34px; line-height: 34px; border-radius: 4px; border: 1px solid #77b917; display: block; text-align: center; font-size: 1rem;  color: #548210; }
.arrow:after { width: 22px; height: 34px; display: inline-block; content: " "; background: url("../img/icons.png") -590px -14px; vertical-align: middle; margin-left: 10px; }

.case_special .hd, .equipment .hd { width: 100%; height: 60px; line-height: 60px; text-align: center; border-bottom: 1px solid #f0f0f0; }
.case_special .hd span, .equipment .hd span { font-size: 1.87rem;  padding: 0 10px; display: inline-block; position: relative; margin: 0 30px; transition: all .2s; }
.case_special .hd span:after, .equipment .hd span:after { display: block; width: 0; height: 1px; background: #77b917; content: " "; left: -5%; position: absolute; transition: all .2s; }
.case_special .hd span.on, .case_special .hd span:hover, .equipment .hd span.on, .equipment .hd span:hover { color:#68a214 }
.case_special .hd span.on:after, .case_special .hd span:hover:after, .equipment .hd span.on:after, .equipment .hd span:hover:after { width: 110%; }

.equipment .hd span:after { left: 0; margin: 0 auto; position: relative; }

.equipment .hd span:hover:after, .equipment .hd span.on:after { width: 100%; }

/**-----**/
.mask2 { position: fixed; background-color: rgba(51, 51, 51, 0.8); width: 100%; height: 100%; z-index: 8; top: 0px; left: 0px; display: none; z-index: 19960426; }

.mask2 video, .mask2 iframe { width: 960px; height: 540px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }

.mask2 img { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }

.mask2 .imgclo { cursor: pointer; position: fixed; top: 15%; right: 25%; z-index: 999; font-size: 3.43rem; color: red; }

.notfound { margin-top: 150px; text-align: center; font-size: 1.12rem; line-height: 26px; }
.notfound em { font-style: normal; display: block; font-size: 1.87rem; margin: 40px 0 30px; }
.notfound span { color: #77b917; }
.notfound img { display: block; margin: 0 auto; }
.notfound .probox { margin-top: 80px; }

/*---------industry-----------*/
.industrybox { margin-bottom: 40px; }
.industrybox .industry { width: 100%; margin: 20px 0 40px; display:flex;flex-wrap:wrap;justify-content:space-between}
.industrybox .industry dl { width: 24%; margin-bottom:20px; overflow: hidden; position: relative; }
.industrybox .industry dl * { transition: all .2s; }
.industrybox .industry dl dt { width: 100%; height: 100%; }
.industrybox .industry dl dt img { width: 100%; }
.industrybox .industry dl dd { width: 100%; height: 30px; line-height: 30px; text-align: center; font-size: 1rem; color: #333333;  position: absolute; bottom: 0; background: rgba(255, 255, 255, 0.8); text-transform: capitalize; }
.industrybox .industry dl:hover img { transform: scale(1.05); }
.industrybox .industry dl:hover dd { height: 100px; line-height: 100px; color: #77b917; }
.industrybox .industry a.more { display: block; height: 100px; line-height: 100px; text-align: center; font-size: 1.12rem;  color: #333333; float: left; background: #f5f5f5; width: 280px; transition: all .2s; }
.industrybox .industry a.more:hover { color: #FFFFFF; background: #77b917; }

.whatsapp_m{display:none}

/*popupForm*/
.popupForm{display:none;position: fixed; z-index: 999999999; padding-top: 200px; left: 0;top: 0;width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.8);}
.popupForm .formContent{position: relative;background-color: #fefefe;margin: auto;padding: 0;border: 1px solid #888;width: 500px;box-shadow: 0 0 10px 1px rgba(119,177,34,0.5);animation: animatetop 0.4s}
@keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}
.popupForm .formContent span.formClose {color: #77b122;font-size: 50px;font-weight: bold;position:absolute;right:-50px;top:-100px;cursor:pointer}
.popupForm .formContent dl{padding:60px 20px 20px}
.popupForm .formContent dl dt{position:absolute; width:90%; left:5%; top:-30px; height:60px; line-height:60px; text-align:center; color:#fff; font-size:1.3rem; background:#77b122}
.popupForm .formContent form input,.popupForm .formContent form .select,.popupForm .formContent form textarea{width:100%; line-height:3rem; margin-top:10px; padding-left:1rem; box-sizing:border-box; border:1px solid #ddd; background:#f7f7f7; outline:none; font-size:1rem;color:#666}
.popupForm .formContent form .select select{width:70%;float: right;font-size: 1rem;height: 3rem;line-height: 3rem;border: none;outline: none;color: #666;background:#f7f7f7;}
.popupForm .formContent form .select select option{line-height:1.5rem}
.popupForm .formContent form input.sub{background:#77b122; color:#fff; font-size:1.2rem;cursor:pointer}
form .output{padding:10px 0;line-height:1.5}

@media screen and (max-width:1179px){
    .probox dl,.casebox dl{width:24%; margin:0 0 1rem 0}
    .form_quotation .left,.form_quotation .left, .form_quotation .right{width:49%}
    .form_quotation .lab{width:100%}
    .footer .f_nav ul:last-child{margin-right:0}
    .footer .f_nav{width:66%}
    .footer .cons_sns{width:32%}
    .footer .cons_sns ul.cons_foot li{height:40px}
    .service_strip{display: flex; flex-wrap: wrap; justify-content: space-between;}
    .service_strip span,.service_strip span.pat,.service_strip span.qtb,.service_strip span.ciw,.service_strip span.cor{float: unset;margin-right: 0;width: 24%;}
    .pn .pan{width:49%}
    .pn .back_list{width:100%; margin-top:1rem}
  }
  @media screen and (max-width:1093px){
    .mhide { background: url("/m/static/img/menu_hide.png") no-repeat; background-size: 100%; }

    nav { width: 70%;height:100%; background: #333333f2; padding: 1.5rem .3rem; float:left; box-sizing:border-box;overflow-y:scroll}
    nav dl{width:100%;}
    nav dl dt{margin-left:10%; position:relative}
    nav dl dt:after{display:block; content:"+"; position:absolute;right:10%; top:0;font-size:1.5rem}
    nav dl:first-child dt:after{display:none}
    nav dl dt.active:after{content:"-"}
    nav dl dt,nav dl dt a{color:#fff; line-height:7vh}
    nav dl dd{display:none; background:#fff}
    nav dl dd a{color:#333; line-height:5vh;display:block; margin-left:12%}
    .navbar .navclose{width:30%; float:right; height:220vh}
    .navcons { width: 100%; border-top: 1px solid #4d4d4d; padding: 3vh 0 0 2%; box-sizing:border-box}
    .navcons a { color: #FFFFFF; display: block; line-height: 3vh; margin-bottom: 1vh;font-size:1rem;}
    .navcons a:before { display: inline-block; width: 2rem; height: 2rem; content: " "; margin-right: 1rem; background: url("/m/static/img/mail_nav.png") no-repeat; background-size: 100%; vertical-align: middle; }
    .navcons .nav_tel:before { background: url("/m/static/img/tel_nav.png") no-repeat; background-size: 100%; }
    .bgbl_t{ width: 80%; background: #77b917; color: #FFFFFF; line-height: 3vh; font-size: 1.1rem; text-align: center; display: block; margin-left: 10%;padding: .5rem 1rem; box-sizing: border-box;box-shadow: 3px 3px 3px #000}
    
  }
@media screen and (max-width:1024px){
    .service_strip span,.service_strip span.pat,.service_strip span.qtb,.service_strip span.ciw,.service_strip span.cor{width:50%;margin-right:0}
    .service_strip span:after{display:none}
    .footer .f_nav ul{margin-right:10px}
    .mask2 video, .mask2 iframe{width:98%}
}
@media screen and (max-width:768px){
    img{width:100%; height:auto}
.casebox dl:nth-child(7),.casebox dl:nth-child(8){display:none}
.footer{height:auto}
.form_quotation .lab select{width:80%; margin-left:0}
.footer .cons_sns{width:100%;float:unset}
.footer .f_nav{display:none}
.probox dl,.casebox dl,.industrybox .industry dl{width:49%}
    .popupForm{padding-top:5vh;}
    .popupForm .formContent{width: 90%;height:90vh;overflow-y:scroll}
    .popupForm .formContent span.formClose{position:fixed;right:10px;top:0}
    .popupForm .formContent dl{padding:3vh 1rem 0}
    .popupForm .formContent dl dt{width:100%;height:7vh;line-height:7vh;position:unset}
    .popupForm .formContent form input, .popupForm .formContent form .select{line-height:5.5vh;margin-top:1.5vh;}
    .popupForm .formContent form .select select{height:5vh;line-height:5vh}
    
    .whatsapp_m{position:fixed;right:0;top: 40%;}
    .whatsapp_m a{display:block; padding:10px; border-top-left-radius:10px;border-bottom-left-radius:10px; background-color:#77b917}
    .whatsapp_m img{width:30px}
}
@media screen and (max-width:600px){
    .form_quotation .left, .form_quotation .left, .form_quotation .right{width:100%}
    .service_strip span{width:100% !important;height:3rem;line-height:3rem}
}
@media screen and (max-width:425px){
    .flex{justify-content:space-around}
    .casebox dl:nth-child(7),.casebox dl:nth-child(8){display:block}
    .service_strip{height:auto; overflow:hidden}
.chat_form{float:unset}
.copyright{line-height:1.5rem}
.copyright .cpt{width:75%;padding-top:.5rem}
    .copyright .f_logo{width:22%;background-size:contain}
    .related_info ul li, .news_list_ind ul li{width: 100%;}
    #LRMINIBar{bottom:9px !important; right:169px !important}

}