@charset "utf-8";

@font-face {
  font-family: "webfont";
  src: url('webfont/webfont.eot'); /* IE9 */
  src: url('webfont/webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('webfont/webfont.woff') format('woff'), /* chrome、firefox */
  url('webfont/webfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url('webfont/webfont.svg#webfont') format('svg'); /* iOS 4.1- */
}

.web-font {
  font-family: "webfont" !important;
  /* font-size: 16px; */
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

*{transition: all .4s ease-in-out;}
#header { clear: both;background: rgba(0,0,0,0.84);position: fixed; top: 0; left: 0;right: 0;height: 80px;z-index: 99;line-height: 80px;backdrop-filter: blur(5px);-webkit-backdrop-filter: blur(5px);}
#header.partybuild { background: rgba(217,0,0,0.84);-webkit-backdrop-filter: blur(5px);backdrop-filter: blur(5px);}
#header .w_1200{height: 80px;}
#header .logo { margin-top: 10px; }
#header .logo img { float: left; margin-right: 10px; height: 60px; width: auto;}
#header .logo dl{margin-top: 20px;}
#header .logo dl dt { white-space: nowrap; font-size: 24px; color: #00003F; font-weight: bold;}
#header .logo dl dd { white-space: nowrap; font-size: 16px; color: #888;}
#header .tel  { padding:0 15px; margin: 0 15px; margin-top: 16px;padding-left: 20px; background: url(/public/themes/pc/static/images/ico_tel.png) no-repeat left center;line-height: 22px;}
#header .tel dl dd { font-size: 12px; color: #FFF;}
#header .tel dl dt { font-size: 22px; color: #FFF;}
#header .nav{ height: 120px;width:720px;}
#header .nav ul{ text-align: left; font-size: 0;margin: 0 auto; white-space: nowrap;}
#header .nav ul li{display: inline-block;font-size: 14px; position: relative;}
#header .nav ul li::after{display: block;position: absolute;width: 0;left: 0; bottom: 0;height: 2px; background: #81B936;transition: all .4s;content: ""}
#header.partybuild .nav ul li::after{ background: #FFF;}
#header .nav ul li:hover::after{width: 100%;}
#header .nav ul li > a{display: block;padding: 0 24px; color: #FFF;}
#header .nav ul li > a:hover,
#header .nav ul li:hover > a
{ color: #FFF; transform: translateY(6px)}
#header .nav ul li .menu{ position: fixed; top:80px; left: 0;right: 0;top: 80px; background: rgba(242,242,242,0.97); color: #333; z-index: 99999; width: auto !important;overflow: hidden; display: none; transition: none; box-shadow: 0 2px 5px rgba(0,0,0,0.1);min-width: 100%;text-align: center;font-size: 0;border-bottom:solid 1px #ddd}
#header .nav ul li .menu dl{display: inline-block; text-align: left;vertical-align: top;padding: 20px 5px;margin:0 15px}
#header .nav ul li .menu dl dt{ font-weight: bold;font-size: 16px;font-weight:bold;border-bottom: 1px solid rgba(105,105,105,0.2); display: block;}
#header .nav ul li .menu dl dd{font-size: 14px;float:left}
#header .nav ul li .menu .linecol dd{clear:both}
#header .nav ul li .menu .subcol dd:nth-child(4n+6){clear:both}
#header .nav ul li .menu .subcol2 dd:nth-child(2n+2){clear:both}
#header .nav ul li .menu a{color: #333; white-space: nowrap; display: block;line-height: 40px; text-align: left;min-width: 130px;padding-right: 10px;}
#header .nav ul li .menu a:hover{color:#205ec6;}

#banner{ height: 600px;background: #222}
#banner *{transition: none!important;}
#banner .slideBox{ width:100%; height:600px; /* overflow:hidden; */ position:relative; }
#banner .slideBox .hd{ height:18px; overflow:hidden; position:absolute; right:0px;left: 0px; bottom:30px; z-index:1; }
#banner .slideBox .hd ul{ overflow:hidden; zoom:1;text-align: center;display: block;}
#banner .slideBox .hd ul li{ display: inline-block; width:8px; height:8px; line-height:5px; text-align:center; background:#CCC; cursor:pointer;border-radius:200px;margin: 0 4px;opacity: 0.8;overflow: hidden;text-indent: -10000px;transition: all !important; }
#banner .slideBox .hd ul li.on{ background: #FFF; width: 24px;height: 8px;opacity: 1;transition: all !important; }
#banner .slideBox .bd{ position:relative; height:100%; z-index:0;   }
#banner .slideBox .bd li{ zoom:1; vertical-align:middle; }
#banner .slideBox .bd li a{ width:100%; height:600px; display:block;background-position:center center!important; background-repeat: no-repeat!important;background-size: cover!important; }
#banner .slideBox .bd img{ width:100%; height:600px; display:block;  }
#banner .slideBox .bd .banner_txt{width:100%;color:#ffffff;padding-top:270px;text-align:center;float:left;}
#banner .slideBox .bd .banner_txt span{color:#ffffff;font-size:50px;font-weight:bold}
#banner .slideBox .bd .banner_txt2{width:100%;color:#ffffff;padding-top:20px;text-align:center;float:left;}
#banner .slideBox .bd .banner_txt2 span{color:#ffffff;font-size:26px;}

#banner .slideBox .prev,
#banner .slideBox .next{ position:absolute; left:3%; top:50%; margin-top:-25px; display:block; width:32px; height:40px; background:url(/public/themes/pc/static/images/slider-arrow.png) -110px 5px no-repeat; filter:alpha(opacity=50);opacity:0.5;   }
#banner .slideBox .next{ left:auto; right:3%; background-position:8px 5px; }
#banner .slideBox .prev:hover,
#banner .slideBox .next:hover{ filter:alpha(opacity=100);opacity:1;  }
#banner .slideBox .prevStop{ display:none;  }
#banner .slideBox .nextStop{ display:none;  }


#footer {background: #222 url(/public/themes/pc/static/images/footer_bg.jpg) center bottom repeat-x fixed;color: #FFF;overflow: hidden;font-size: 14px;padding: 40px 0 40px 0; clear: both;}
#footer.partybuild {background: #666 url(/public/themes/pc/static/images/partybuild_footer_bg.jpg) center bottom repeat-x fixed;}
#footer::after{display: block; height: 0; clear: both; content: ""}
#footer .info{overflow: hidden;}
#footer .info dd{margin-top: 15px;}
#footer .info .logo img{height: 50px; width: auto;}
#footer .info .com_name{font-size: 26px;}
#footer .info .com_txt{font-size: 30px;}
#footer .info .bdsharebuttonbox{ margin-top: 80px;}
#footer .info .copyright{color: #888;font-size: 12px;}
#footer .info .copyright a{color: #888;}
#footer.partybuild .info .copyright{color: #FFF;font-size: 12px;}
#footer.partybuild .info .copyright a{color: #FFF;}
#footer .info .copyright a:hover{color: #81B936;}

#footer .address{font-size: 14px; color: #FFF; width: 435px;}
#footer .address ul li{line-height: 26px;}
#footer.partybuild .address ul li img{filter: brightness(1000)}
#footer .address dl{margin-top: 40px; border-left: 1px solid rgba(255,255,255,0.2);padding-left: 30px;font-size: 12px; color: #999; line-height: 18px;}
#footer .address dl dd{font-size: 12px; margin-top: 15px;color: #999;}
#footer.partybuild .address dl{margin-top: 40px; border-left: 1px solid #FFF;padding-left: 30px;}
#footer.partybuild .address dl dd{font-size: 12px; margin-top: 15px;color: #FFF;}

.gray{background-color:#f2f2f2}


#main_index{clear: both; padding: 20px 0 0 0;}
#main_index::after{display: block; height: 0; clear: both; content: ""}
#main_index .main_box{clear: both;}
#main_index .main_box.product{clear: both;font-size: 0; white-space: nowrap;padding: 30px 0 50px 0;background-color:#f2f2f2}
#main_index .main_box.product .pro_box{width: 300px; height: 360px;display: inline-block;position: relative;}
#main_index .main_box.product .pro_box .pro_A{ width: 286px;height: 350px;position: absolute; top: 0; right: 7px;z-index: 9; background-position: right bottom; background-repeat: no-repeat;background-size:160px;background-color:#fff;}

/*#main_index .main_box.product .pro_box:hover .pro_A{transform: translateX(-130px);}*/

#main_index .main_box.product .pro_box .pro_A::after{display: block;position: absolute;height: 5px; width: 0; bottom: 0; right: 0;background: #81B936;transition: all .4s;content: "";}
#main_index .main_box.product .pro_box:hover .pro_A::after{width: 100%;}
#main_index .main_box.product .pro_box .pro_A dl{font-size: 14px;  text-align: right; white-space: normal;/* padding-left: 120px; */margin-top: 30px;}
#main_index .main_box.product .pro_box .pro_A dl dt{font-size: 22px;margin-bottom: 10px;margin-left: 30px;margin-right: 30px;font-weight:bold;text-align:left}
#main_index .main_box.product .pro_box .pro_A dl dt:after{content: '';display: block;margin-top: 10px;width: 40px;border-top: 2px solid #eee;}
#main_index .main_box.product .pro_box .pro_A dl dd{line-height: 24px;border-right:0px solid #81B936;text-align:left;margin-left: 30px;margin-right: 30px;}
#main_index .main_box.product .pro_box .pro_A dl ul{line-height: 22px;border-right:0px solid #81B936;text-align:left;margin-left: 30px;margin-right: 30px;font-size:12px;margin-top:10px;color:#666}
#main_index .main_box.product .pro_box .pro_A dl ul li{float:left;margin:10px 10px 10px 0}
/*#main_index .main_box.product .pro_box:hover .pro_A dl dd{border-right:20px solid #81B936;}*/



#main_index .main_box.product .pro_box .pro_B{ width: 130px;height: 400px; position: absolute; top: 0; right: 0; overflow: auto; overflow-x: hidden;}
#main_index .main_box.product .pro_box .pro_B ul{ font-size: 13px; text-align: right;padding:30px 5px 30px 10px;white-space: normal;color:#fff;text-align:center;line-height: 18px;}
#main_index .main_box.product .pro_box .pro_B ul li{ line-height: 18px; margin-top: 13px; white-space: normal;color:#fff;text-align:left;font-size:13px;}
#main_index .main_box.product .pro_box .pro_B ul li a{ color: #FFF;}

#main_index .main_box.product .pro_box .pro_B span{display:block;margin:13px;color:#fff;font-size:14px;white-space:normal;}


#main_index .main_box.news{clear: both; white-space: nowrap;padding: 60px 0 100px 0; background: url(/public/themes/pc/static/images/news_bg.jpg) no-repeat center center fixed / cover;}
#main_index .main_box.news::after{display: block; height: 0; clear: both; content: ""}

#main_index .main_box.news .newsimg{ width: 490px; height: 350px; overflow: hidden;position: relative;}
#main_index .main_box.news .newsimg img{ width: 100%; height: 350px;}
#main_index .main_box.news .newsimg a:hover img{ transform: scale(1.1)}
#main_index .main_box.news .newsimg span{display: block;position: absolute;bottom: 0; left: 0; right: 0;background: rgba(0,0,0,0.6);z-index: 9;padding: 10px 15px;color: #FFF;white-space:normal;}

#main_index .main_box.news .newsclass{ width: 700px; height: 350px; overflow: hidden;}
#main_index .main_box.news .newsclass::after{display: block; height: 0; clear: both; content: ""}
#main_index .main_box.news .newsclass ul li{ width: 100%; height:80px;float: left; background: #f2f2f2;margin: 0 10px 10px 0;position: relative;overflow: hidden;}
#main_index .main_box.news .newsclass ul li:nth-child(n2){margin-right: 0;}
#main_index .main_box.news .newsclass ul li img{ width: 290px; height: 220px;}
#main_index .main_box.news .newsclass ul li a{color:#333}
#main_index .main_box.news .newsclass ul li a:hover img{ transform: scale(1.1);}
#main_index .main_box.news .newsclass ul li span{ display: block; position: absolute; font-size: 16px; font-weight:bold;top: 9px; left: 20px;color: #333;z-index: 9;}
#main_index .main_box.news .newsclass ul li dd{ display: block; position: absolute; font-size: 12px; top: 35px; left: 20px;color: #666;z-index: 9;white-space:normal;width:95%;line-height:170%;text-indent:25px}

#main_index .main_box.case{clear: both; padding: 60px 0 100px 0; }
#main_index .main_box.case::after{display: block; height: 0; clear: both; content: ""}

#main_index .main_box.case .top3{text-align: center; white-space: nowrap;font-size: 0;}
#main_index .main_box.case .top3 dl{ display: inline-block; width: 300px; white-space: normal;margin: 0 50px;vertical-align: top;}
#main_index .main_box.case .top3 dl dt{display: block; width: 300px; height: 300px; background: #f6f6f6;border-radius: 400px;font-size: 34px; color: #888; text-align: center;overflow: hidden;}
#main_index .main_box.case .top3 dl dt a{ color: #888; display: block; width: 300px; height: 300px;overflow: hidden;}
#main_index .main_box.case .top3 dl:hover dt{ box-shadow: 0 3px 6px rgba(0,0,0,0.1)}
#main_index .main_box.case .top3 dl:hover dt a{ color: #81B936}
#main_index .main_box.case .top3 dl dt img{ display: block;width: 66px; height: 66px;margin: 0 auto;margin-top: 100px;}

#main_index .main_box.case .top3 dl dd{font-size: 14px;padding-top: 15px;color: #888;}
#main_index .main_box.case .top3 dl dd.name{font-size: 24px;padding-top: 20px;color: #444;}
#main_index .main_box.case .top3 dl:hover dd.name{color: #0F9DCD;}
#main_index .main_box.case .other {padding-top: 10px; text-align: center; font-size: 0;}
#main_index .main_box.case .other dl {width:370px;padding: 0 15px;font-size: 14px;float:left}
#main_index .main_box.case .other dl:last-child {border: none;}
#main_index .main_box.case .other dl dt{ display: block; width: 360px; height: 240px;line-height: 240px; text-align: center;font-size: 0;margin: 0 auto;}
#main_index .main_box.case .other dl dt img{width: 360px;height: 240px; vertical-align:middle; }
#main_index .main_box.case .other dl:hover dt img{transform: scale(1.1)}
#main_index .main_box.case .other dl dd{margin-bottom: 10px;padding:20px 20px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
#main_index .main_box.case .other dl dd a{color: #333;font-size:16px;}
#main_index .main_box.case .other dl:hover dd a{color: #0F9DCD;}

#main_index .main_box.about{clear: both; padding: 0px 0 40px 0; background: #fff}

#main_index .main_box.about .com_name{ text-align: center; white-space: nowrap; line-height: 60px;font-size: 0;padding-bottom: 20px;padding-top: 10px;}
#main_index .main_box.about .com_name img{ height: 60px; width: auto; vertical-align: top;}
#main_index .main_box.about .com_name h1{ font-size: 30px;margin-left: 0px; display: inline-block;line-height: 60px;}
#main_index .main_box.about .com_content{ font-size: 14px; color: #888; line-height: 24px; text-align: left;}
#main_index .main_box.about .com_more{ text-align: center;padding: 50px 0;}
#main_index .main_box.about .com_more a{ font-size: 18px; color: #0F9DCD;}
#main_index .main_box.about .com_history{ text-align: center;}
#main_index .main_box.about .com_history img{max-width: 100%;height: auto;}


#main{clear: both; width: 100%;}
.ps-contbox{height: 100vh;clear: both;position: relative;}
.ps-contbox::after{display: block; height: 0; clear: both; content: ""}
.ps-contbox *{transition: none;}

.about-a{background: #222 url(/public/themes/pc/static/images/about-a-bg.jpg) no-repeat center center fixed;background-position:120% 120%; color: #FFF;font-size: 16px; transition: none;}
.about-a .m1{display: inline-block;position: absolute;top: 180px; left: 50%; width: 200px; margin-left: -100px;font-size: 40px; text-align: center;padding-bottom: 10px;}
.about-a .m1::after{display: block; width: 40px; height: 2px;background: #81B936; position: absolute; bottom: 0; left: 50%; margin-left: -20px; content: ""; } 
.about-a .m2{display: inline-block;position: absolute;top: 280px; left: 50%; width: 900px; margin-left: -450px;line-height: 30px; text-align: left;}




.about-b{background: #f9f9f9 url(/public/themes/pc/static/images/about-b-bg.jpg) no-repeat center center fixed;background-position:120% 120%; color: #000;overflow: hidden; transition: none;}
.about-b::after{display: block; height: 0; clear: both; content: ""}
.about-b .about_title{width:100%;text-align:center;margin: 0 auto;font-size:36px;margin-top:6%}
.about-b ul{ width: 1200px; margin: 0 auto; text-align: center;margin-top:6%;}
.about-b ul li{width: 250px; vertical-align: top;display: inline-block;margin: 0 20px;}
.about-b ul li .img{width: 250px; height: 250px;background: #FFF;border-radius: 1000px;position: relative;transition: all .4s}
.about-b ul li .img i{display: block; width:64px; height: 64px;position: absolute; top: 45%; left: 50%; margin: -32px 0 0 -32px; background-position: center top; background-repeat: no-repeat; background-size: 100% 200%;transition: all .2s}
.about-b ul li .img span{top: 160px;font-weight: bold;font-size: 20px;display: block;position: absolute;text-align: center;width: 100%;}
.about-b ul li:nth-child(1) .img i{background-image: url(/public/themes/pc/static/images/about-b-ico-1.png);}
.about-b ul li:nth-child(2) .img i{background-image: url(/public/themes/pc/static/images/about-b-ico-2.png);}
.about-b ul li:nth-child(3) .img i{background-image: url(/public/themes/pc/static/images/about-b-ico-3.png);}
.about-b ul li:nth-child(4) .img i{background-image: url(/public/themes/pc/static/images/about-b-ico-4.png);}
.about-b ul li:hover .img i{background-position: center bottom;}
.about-b ul li:hover .img{ transform: translateY(-20px);box-shadow: 0 10px 20px rgba(0,0,0,0.2)}
.about-b ul li .name{width: 250px;font-size: 14px;line-height: 24px;margin-top: 30px;transition: all .4s}
.about-b ul li:hover .name{transform: translateY(15px);}


.titleX{display: block;position: relative;  width: 100%; font-size: 30px; text-align: center;padding-bottom: 10px; margin: 0 auto;margin-bottom: 10px;font-weight:normal;}
.titleY{display: block;position: relative;  width: 40%; font-size: 15px; text-align: center;padding-bottom: 10px; margin: 0 auto;margin-bottom: 10px;font-weight:normal;}
.titleXs{display: block;position: relative;  width: 100%; font-size: 15px; text-align: center;padding-bottom: 10px; margin: 0 auto;margin-bottom: 30px;color:#666}
.titleX.white,.titleY.white{color: #FFF;}
.titleX::after{display: block; width: 10%; height: 2px;background: #81B936; position: absolute; bottom: 0; left: 45%; margin-left: 0px; content: ""; } 

.titleX2{display: block;position: relative;  width: 1200px; font-size: 40px;padding-bottom: 10px; margin: 0 auto;margin-bottom: 60px;}
.titleX2.white{color: #FFF;}
.titleX2::after{display: block; width: 40px; height: 2px;background: #81B936; position: absolute; bottom: 0; left: 0; content: ""; } 
.titleX2 span{font-size: 20px; color: #0F9DCD;}
.titleX2 span a{color: #0F9DCD;}
.titleX2 span::before{font-size: 40px; color: #0F9DCD;content: "."}


.classX{ width: 1200px; margin: 0 auto 0px auto; text-align: center;}
.classX ul li{ display: inline-block;margin: 0 10px;}
.classX ul li a{ padding: 10px 20px; font-size: 16px; color: #666; display: block;}
.classX ul li a:hover,.classX ul li a.act{  color: #81B936;}


.history{clear: both;}
.history.history-bg{ background: url(/public/themes/pc/static/images/history_bg.jpg) no-repeat center center fixed;background-position:cover;padding: 250px 0 120px 0;}
.history .ico{ text-align: center;padding-top: 40px;padding-bottom: 5px;}
.history .history-list{ background: url(/public/themes/pc/static/images/history_line.jpg) repeat-y center top;}
.history .history-list::after,.history .history-list::before{display: block; height: 0; clear: both; content: ".";width: 100%;}
.history-list .team{width: 20px; height: 20px; margin: 180px auto 0 auto;position: relative; background: #0F9DCD; border-radius: 200px;}
.history-list .team:hover{background: #81B936;}
.history-list .team:first-child{margin-top: 350px;}
.history-list .team.importent{background:#0F9DCD url(/public/themes/pc/static/images/history_importent.png) no-repeat center center;}
.history-list .team.importent:hover{background:#81B936 url(/public/themes/pc/static/images/history_importent.png) no-repeat center center;}
.history-list .team .cont{position: absolute; width: 510px; right: 50px; bottom: -20px;text-align: right;}
.history-list .team:nth-child(even) .cont{position: absolute; width: 510px; left: 50px; bottom: -20px; right: auto; text-align: left;}
.history-list .team .cont dl dt{ font-size: 58px; color:#0F9DCD;}
.history-list .team .cont dl dd{ font-size: 16px; color:#444;padding: 10px 0;line-height: 20px;}

.history-list .team .cont:hover{transform: translateX(-30px)}
.history-list .team:nth-child(even) .cont:hover{transform: translateX(30px)}
.history-list .team .cont:hover dl dt{ font-size: 58px; color:#81B936;}
.history-list .team .cont:hover dl dd{ color:#81B936;padding: 10px 0;}


.coreteam{clear: both;}
.coreteam.coreteam-bg{ background: url(/public/themes/pc/static/images/coreteam_bg.jpg) no-repeat center center fixed;background-position:cover;padding: 250px 0 120px 0;}

.corelist{ width: 1200px;margin: 0 auto; overflow: hidden; position: relative;}
.corelist .thumbsbox{text-align: center;}
.corelist .thumbsbox img{width: 148px; height: 148px;border-radius: 200px;border: 5px solid #CCC;background: #FFF;}
.corelist .thumbsbox img:hover{border: 5px solid #81B936;}
.corelist .thumbsbox.swiper-slide-active img:hover{border: 5px solid #81B936;}

.corelist .infobox{overflow: hidden;}
.corelist .infobox .img{float: left; width: 400px;height: 400px; padding-left: 100px;padding-right: 50px;line-height: 400px;}
.corelist .infobox .img img{max-width: 400px;max-height: 400px; vertical-align: bottom;}
.corelist .infobox .info{float: left; color: #FFF;}
.corelist .infobox .info .namelist{clear: both;white-space: nowrap;margin-top: 100px;}
.corelist .infobox .info .namelist .name{display: inline-block;font-size: 30px; color:#0F9DCD; font-weight: bold;margin-right: 5px;}
.corelist .infobox .info .namelist dl{display: inline-block;}
.corelist .infobox .info .namelist dl dd{font-size: 10px;opacity: 0.5;}
.corelist .infobox .info .namelist dl dt{font-size: 14px;}
.corelist .infobox .info .content{width: 500px;font-size: 16px; line-height: 24px;margin-top: 30px;}

.honor{clear: both;}
.honor.honor-bg{ background: url(/public/themes/pc/static/images/honor_bg.jpg) no-repeat center center fixed;background-position:cover;padding: 250px 0 120px 0;}
.honorlist{ width: 1200px;margin: 0 auto;}
.honorlist::after{display: block; height: 0; clear: both; content: ".";width: 100%;}
.honorlist dl{ width:220px;float: left;margin: 0 25px 25px 0;}
.honorlist dl:hover{transform: translateY(-20px)}
.honorlist dl:nth-child(5n){ margin-right: 0;}
.honorlist dl dt{ width: 220px;height: 220px; line-height: 220px; text-align: center; font-size: 0;}
.honorlist dl dt img{ max-width: 220px;max-height: 220px;vertical-align: middle;border: 1px solid #FFF;}
.honorlist dl:hover dt img{ box-shadow: 0 10px 20px rgba(0,0,0,0.2)}
.honorlist dl dd{ white-space: nowrap;overflow: hidden; text-overflow: ellipsis; font-size: 14px;padding-top: 15px;text-align: center; }

.contact-a{background: #222 url(/public/themes/pc/static/images/contact-a-bg.jpg) no-repeat center center fixed;background-position:120% 120%; color: #FFF;font-size: 16px; transition: none;}
.contact-a .m1{display: inline-block;position: absolute;top: 260px; left: 50%; width: 200px; margin-left: -100px;font-size: 40px; text-align: center;padding-bottom: 10px;}
.contact-a .m1::after{display: block; width: 40px; height: 2px;background: #81B936; position: absolute; bottom: 0; left: 50%; margin-left: -20px; content: ""; } 
.contact-a .m2{display: inline-block;position: absolute;top: 360px; left: 50%; width: 900px; margin-left: -450px;line-height: 30px; text-align: left;}

.contactlist{ width: 1200px; margin: 0 auto;padding: 120px 0;}
.contactlist::after{display: block; height: 0; clear: both; content: ".";width: 100%;}
.contactlist dl{float: left; width: 360px;margin-right: 60px; margin-bottom: 60px;}
.contactlist dl:nth-child(3n){margin-right: 0;}
.contactlist dl:hover dt img{box-shadow: 0 10px 20px rgba(0,0,0,0.3);}
.contactlist dl dd{padding: 10px 20px;font-size: 14px; color: #888; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.contactlist dl dd.name{padding: 20px 20px;font-size:24px; color: #000;}
.contactlist dl dd.tel{padding: 5px 20px;}
.contactlist dl dd.address{padding: 5px 20px;}

.brand{clear: both;}
.brand.brand-bg{ padding: 250px 0 120px 0;}
.brand.brand-bg .brand-content{width: 1200px; margin: 0 auto;font-size: 14px; line-height: 24px; color: #666; }
.brand.brand-bg .brand-content img{ max-width: 100%; height: auto;}

.case{clear: both;}
.case.case-bg{ padding: 120px 0 60px 0;}
.case.case-bg .caselist{ width: 1200px; margin: 0 auto;padding: 40px 0 0 0;}
.case.case-bg .caselist::after{display: block; height: 0; clear: both; content: "";width: 100%;}
.case.case-bg .caselist dl{float: left; width: 360px;margin-right: 60px; margin-bottom: 60px; border-bottom: 1px solid #EEE;padding-bottom: 30px;}
.case.case-bg .caselist dl:hover{ border-bottom: 1px solid #81B936;}
.case.case-bg .caselist dl:nth-child(3n){margin-right: 0;}
.case.case-bg .caselist dl:hover dt img{box-shadow: 0 10px 20px rgba(0,0,0,0.3); transform: scale(1.05)}
.case.case-bg .caselist dl dd{padding: 10px 20px;font-size: 14px; color: #888; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.case.case-bg .caselist dl dd.date{padding: 20px 20px 5px 20px;font-size: 16px;}
.case.case-bg .caselist dl dd.name{padding: 10px 10px;font-size:18px; color: #000;text-align: center}
.case.case-bg .caselist dl dd.content{padding: 5px 10px; font-size: 14px; white-space: normal;height:35px}

.case.case-bg .news-title{ width: 1100px; margin: 0 auto; font-size: 36px;padding: 0 0 30px 0; text-align: center;font-weight:bold}
.case.case-bg .news-date{ width: 1200px; margin: 0 auto; font-size: 12px; line-height: 24px; color: #888; padding: 0 0 50px 0; text-align: center;}
.case.case-bg .news-content{ width: 1200px; margin: 0 auto; font-size: 16px; line-height: 32px;padding: 0 0 60px 0;color:#444444}
.case.case-bg .news-content p{ margin:15px 0}

.case.case-bg .news-content img{ max-width: 100%; height: auto;}


.news{clear: both;}
.news.news-bg{ padding: 120px 0 60px 0;}
.news.news-bg .newslist{ width: 1200px; margin: 0 auto;padding: 40px 0 0 0;}
.news.news-bg .newslist::after{display: block; height: 0; clear: both; content: "";width: 100%;}
.news.news-bg .newslist dl{float: left; width: 100%;margin-right: 0px; margin-bottom: 30px; border-bottom: 1px solid #EEE;padding-bottom: 30px;}
.news.news-bg .newslist dl dt{float:left}
.news.news-bg .newslist dl:nth-child(3n){margin-right: 0;}
.news.news-bg .newslist dl dd{padding: 10px 20px;font-size: 14px; color: #666; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.news.news-bg .newslist dl dd.date{padding: 10px 20px;font-size: 13px;color:#999;font-weight: normal}
.news.news-bg .newslist dl dd.name{padding: 5px 20px;font-size:18px; color: #333;font-weight:bold}
.news.news-bg .newslist dl dd.content{padding: 5px 20px; font-size: 14px; white-space: normal;height: 76px;line-height: 180%;}
.news.news-bg .newslist dl dd.content a{color:#ff0000;font-size:12px}

.news.news-bg .news-title{ width: 1100px; margin: 0 auto; font-size: 36px;padding: 0 0 30px 0; text-align: center;font-weight:bold}
.news.news-bg .news-date{ width: 1200px; margin: 0 auto; font-size: 12px; line-height: 24px; color: #888; padding: 0 0 50px 0; text-align: center;}
.news.news-bg .news-content{ width: 1150px; margin: 0 auto; font-size: 16px; line-height: 185%;padding: 0 0 60px 0;color:#333}
.news.news-bg .news-content p{ margin:20px 0}

.news.news-bg .news-content img{ max-width: 100%; height: auto;}

.pagemain{padding: 20px 0 60px 0 !important;}

.list_other{ background: #EEE;width: 1200px; margin: 0 auto;}
.list_other ul{padding:15px 30px;}
.list_other ul li{line-height: 24px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;font-size: 14px;color: #444;}


.join{clear: both;}
.join.join-bg{ padding: 0 0 120px 0;}
.join.join-bg .img-title{height:180px; width: 100%; padding-top: 180px;background: url(/public/themes/pc/static/images/join_title_bg.jpg) no-repeat center bottom / cover;margin-bottom: 50px; }
.join.mail-bg{ padding: 0 0 0px 0;}
.join.mail-bg .img-title{height:180px; width: 100%; padding-top: 180px;background: url(/public/themes/pc/static/images/join_title_bg.jpg) no-repeat center bottom / cover;margin-bottom: 50px; }

.join.join-bg .joinlist{ width: 1200px; margin: 0 auto;padding: 0;}
.join.join-bg .joinlist::after{display: block; height: 0; clear: both; content: ".";width: 100%;}
.join.join-bg .joinlist ul li{float: left; width: 360px; height: 270px; margin-right: 60px; margin-bottom: 60px; background: #000; position: relative;overflow: hidden;}
.join.join-bg .joinlist ul li:hover{box-shadow: 0 10px 20px rgba(0,0,0,0.3);}
.join.join-bg .joinlist ul li:nth-child(3n){margin-right: 0;}
.join.join-bg .joinlist ul li img{width: 360px;height: 270px;opacity: 0.75;}
.join.join-bg .joinlist ul li a:hover img{opacity: 1; transform: scale(1.1)}
.join.join-bg .joinlist ul li .name{ position: absolute; left: 30px; top: 30px; font-size: 14px; color: #FFF;text-shadow: 0 2px 2px rgba(0,0,0,0.3);}
.join.join-bg .joinlist ul li .name dl dt{ font-size: 24px;}
.join.join-bg .joinlist ul li span{ display: block; width: 40px; height: 40px; background: #81B936;line-height: 40px; text-align: center; color: #FFF; font-size: 26px;box-shadow: 0 5px 10px rgba(0,0,0,0.3);position: absolute; right: 30px; bottom: 30px;border-radius: 200px;}
.join.join-bg .joinlist ul li span::before{ content: "＋"}
.join.join-bg .joinlist ul li a:hover span{transform: scale(1.2);}


.join.join-bg .join-title{ width: 800px; margin: 0 auto; font-size: 30px;padding: 0 0 80px 0; text-align: center;}
.join.join-bg .join-date{ width: 1200px; margin: 0 auto; font-size: 12px; line-height: 24px; color: #888; padding: 0 0 80px 0; text-align: center;}
.join.join-bg .join-content{ width: 1200px; margin: 0 auto; font-size: 14px; line-height: 24px;padding: 0 0 60px 0;}
.join.join-bg .join-content img{ max-width: 100%; height: auto; }
.join.join-bg .join-btn{ width: 1200px; margin: 0 auto; padding:0 0 50px 0; text-align: center;}
.join.join-bg .join-btn #joinaddbtn{ display: inline-block; padding: 10px 40px; font-size: 24px; color: #FFF; background: #0F9DCD;}
.join.join-bg .join-btn #joinaddbtn:hover{  background: #81B936;box-shadow: 0 5px 10px rgba(0,0,0,0.2);}
.join.join-bg .join-tel{text-align: center;font-size: 14px;color: #0F9DCD;margin-bottom: 15px; vertical-align: baseline}
.join.join-bg .join-tel a{color: #0F9DCD;font-size: 20px;margin-left: 10px;display: inline-block}
.join.join-bg .join-mail{text-align: center;font-size: 14px;color: #0F9DCD;margin-bottom: 50px;vertical-align: baseline}
.join.join-bg .join-mail a{color: #0F9DCD;font-size: 20px;margin-left: 10px;display: inline-block}







.join.join-bg .titleX2{margin-top: 250px;}

#addform{ width: 960px; padding: 20px;background: #FFF; display: none;}
#addform h4{font-size: 24px; color: #000;margin-bottom: 15px;}
#addform .m1,
#addform .m2,
#addform .m3{width: 960px;}
#addform .m1::after,
#addform .m2::after,
#addform .m3::after{display: block; height: 0; clear: both; content: ".";width: 100%;overflow: hidden; text-indent: -10000px;}
#addform .m0 ul{display: block;}
#addform .m0 ul::after{display: block; height: 0; clear: both; content: ".";width: 100%;overflow: hidden; text-indent: -10000px;}
#addform .m0 ul li{margin-bottom: 20px;font-size: 14px; color: #888;}
#addform .m0 ul li input{ width: 306px; height: 40px; text-indent: 15px;border: 1px solid #DDD; font-size: 14px; color: #222;}

#addform .m1 ul li{ width: 306px; margin: 0 20px 20px 0; float: left;}
#addform .m1 ul li:nth-child(3n){ margin-right: 0;}
#addform .m1 ul li input{ width: 306px; height: 40px; text-indent: 15px;border: 1px solid #DDD; font-size: 14px; color: #222;}
#addform .m1 ul li input::-webkit-input-placeholder{font-size: 14px; color: #888;}
#addform .m1 ul li input:focus{ border:1px solid #0F9DCD;box-shadow:0 0 0 1px #0F9DCD}
#addform .m1 ul li input:focus::-webkit-input-placeholder{font-size: 14px; color: #FFF;}
#addform .m1 ul li select{ width: 306px; height: 42px; text-indent: 15px;border: 1px solid #DDD; font-size: 14px; color: #222;}

#addform .m2 ul li{ clear: both;margin: 0; padding: 0; margin-top: -1px;}
#addform .m2 ul li textarea{  width: calc(100% - 32px); height: 70px; border: 1px solid #DDD; font-size: 14px; color: #222;padding: 15px;}
#addform .m2 ul li textarea:focus{ border:1px solid #0F9DCD;box-shadow:0 0 0 1px #0F9DCD;position: relative;z-index: 9;}
#addform .m2 ul li textarea:focus::-webkit-input-placeholder{font-size: 14px; color: #FFF;}
#addform .m2 ul li:last-child{margin-bottom: 20px;}

#addform .m3 ul li{ width: 306px; margin: 0 20px 20px 0; float: left;}
#addform .m3 ul li:nth-child(3n){ margin-right: 0;}
#addform .m3 ul li input{ width: 306px; height: 40px; text-indent: 15px;border: 1px solid #DDD; font-size: 14px; color: #222;}
#addform .m3 ul li input::-webkit-input-placeholder{font-size: 14px; color: #888;}
#addform .m3 ul li input:focus{ border:1px solid #0F9DCD;box-shadow:0 0 0 1px #0F9DCD}
#addform .m3 ul li input:focus::-webkit-input-placeholder{font-size: 14px; color: #FFF;}
#addform .m3 ul li input.w_150{width: 150px;}
#addform .m3 ul li img{width: auto; height: 40px;margin-left: 2px;}

#addform .btn{width: 960px; text-align: center;}
#addform .btn input{ padding: 10px 20px; font-size: 16px; color: #FFF; background: #0F9DCD;border: none;}
#addform .btn input:hover{background: #81B936;}


.partybuild{clear: both;}
.partybuild.partybuild-bg{ padding: 0 0 120px 0;}

.partybuild.partybuild-bg .img-title{height:330px; width: 100%; padding-top: 320px;background: url(/public/themes/pc/static/images/partybuild_bg.jpg) no-repeat center bottom / cover;margin-bottom: 50px; }
.partybuild.partybuild-bg .img-title .titleX{display: none; }

.partybuild.partybuild-bg .partybuild-cont{ font-size: 16px; color: #FF0000; line-height: 30px; width: 1200px; margin: 0 auto;}

.partybuild.partybuild-bg .partybuildlist{ width: 1200px; margin: 0 auto;padding: 80px 0 0 0;}
.partybuild.partybuild-bg .partybuildlist::after{display: block; height: 0; clear: both; content: ".";width: 100%;}
.partybuild.partybuild-bg .partybuildlist dl{float: left; width: 360px;margin-right: 60px; margin-bottom: 60px; border-bottom: 1px solid #EEE;padding-bottom: 30px;}
.partybuild.partybuild-bg .partybuildlist dl:hover{ border-bottom: 1px solid #FF0000;}
.partybuild.partybuild-bg .partybuildlist dl:nth-child(3n){margin-right: 0;}
.partybuild.partybuild-bg .partybuildlist dl:hover dt img{box-shadow: 0 10px 20px rgba(0,0,0,0.3); transform: scale(1.1)}
.partybuild.partybuild-bg .partybuildlist dl dd{padding: 10px 20px;font-size: 14px; color: #888; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.partybuild.partybuild-bg .partybuildlist dl dd.date{padding: 20px 20px 5px 20px;font-size: 16px;}
.partybuild.partybuild-bg .partybuildlist dl dd.name{padding: 5px 20px;font-size:18px; color: #000;}
.partybuild.partybuild-bg .partybuildlist dl dd.name a:hover{color: #FF0000;}
.partybuild.partybuild-bg .partybuildlist dl dd.content{padding: 5px 20px; font-size: 14px; white-space: normal;height: 60px;}

.partybuild.partybuild-bg .partybuild-title{ width: 800px; margin: 0 auto; font-size: 30px;padding: 0 0 80px 0; text-align: center;}
.partybuild.partybuild-bg .partybuild-date{ width: 1200px; margin: 0 auto; font-size: 12px; line-height: 24px; color: #888; padding: 0 0 80px 0; text-align: center;}
.partybuild.partybuild-bg .partybuild-content{ width: 1200px; margin: 0 auto; font-size: 14px; line-height: 24px;padding: 0 0 60px 0;}
.partybuild.partybuild-bg .partybuild-content img{ max-width:100%; height: auto;}




.servernav{position: fixed;left: 20px; top: 50%; transform: translateY(-50%);width: 10px;white-space: nowrap;z-index: 9;}
.servernav ul li{margin: 4px auto;}
.servernav ul li::before{ display: inline-block; width: 10px; height: 10px; background: #FFF; border-radius: 200px;box-shadow: 0 0 5px 5px rgba(0,0,0,0.1);content: "."; overflow: hidden; text-indent: -999999px;opacity: 0.5;cursor: pointer;transition: all .4s ease-in-out;}
.servernav ul li:hover::before{ opacity: 1;width: 20px;}
.servernav ul li.act::before{ opacity: 1;width: 20px;}
.servernav ul li span{ display: inline-block;padding: 5px 10px; background: rgba(255,255,255,0.8); border-radius: 200px; font-size: 12px; color: #888; margin-left: 10px;opacity: 0; transform: translateX(-10px);cursor: pointer;}
.servernav ul li:hover span{opacity: 1; transform: translateX(0)}
.servernav ul li.act span{opacity: 1; transform: translateX(0)}







.serverlist{clear: both;background-color:#444;}
.serverlist *{transition: none;} 

.serverlist .serbox{ width: 100%; height: 100vh;background-color:#444;background-attachment: fixed; background-position: center center; background-repeat: no-repeat; /* background-size: 120% 120%; */ position: relative;background-size: cover;}
.serverlist .serbox:nth-child(even){ background-color: #222;}

.serverlist .serbox .info{width: 690px;position: absolute;top: 50%;transform: translateY(-50%) !important;left:calc((100% - 1200px) / 2 + 100px);}
.serverlist .serbox:nth-child(even) .info{right:calc((100% - 1200px) / 2 + 100px);left: auto;}
.serverlist .serbox .info dl dt{font-size: 40px;color: #FFF;text-shadow: 0 2px 4px rgba(0,0,0,0.4); display: inline-block;}
.serverlist .serbox .info dl dt::after{ width: 40px; height: 3px; background: #81B936; content: ".";overflow: hidden; text-indent: -999999px;display: block;margin-top: 10px;}
.serverlist .serbox .info dl dd{font-size: 16px;color: #FFF;text-shadow: 0 2px 4px rgba(0,0,0,0.4);line-height: 28px;padding-top: 30px;}

.serverlist .serbox .ico{width: 200px;position: absolute;top: 50%;transform: translateY(-50%) !important;right:calc((100% - 1200px) / 2 + 100px);}
.serverlist .serbox:nth-child(even) .ico{left:calc((100% - 1200px) / 2 + 100px);right: auto;}
.serverlist .serbox .ico img{width: 200px;height: auto;}

.serverimg-title{height:180px; width: 100%; padding-top: 180px;background: url(/public/themes/pc/static/images/server_title_bg.jpg) no-repeat center bottom / cover;}


#messagesbox{padding: 20px;display: none;}
#messagesbox ul li{padding-bottom: 10px;}
#messagesbox ul li input{ width: 320px; height: 40px; text-indent: 15px;border: 1px solid #DDD; font-size: 14px; color: #222;}
#messagesbox ul li input::-webkit-input-placeholder{font-size: 14px; color: #888;}
#messagesbox ul li input:focus{ border:1px solid #0F9DCD;box-shadow:0 0 0 1px #0F9DCD}
#messagesbox ul li input:focus::-webkit-input-placeholder{font-size: 14px; color: #FFF;}
#messagesbox ul li input.w_150{width: 150px;}
#messagesbox ul li img{width: auto; height: 40px;margin-left: 2px;}
#messagesbox ul li textarea{  width: calc(100% - 32px); height: 70px; border: 1px solid #DDD; font-size: 14px; color: #222;padding: 15px;}
#messagesbox ul li textarea:focus{ border:1px solid #0F9DCD;box-shadow:0 0 0 1px #0F9DCD;position: relative;z-index: 9;}
#messagesbox ul li textarea:focus::-webkit-input-placeholder{font-size: 14px; color: #FFF;}
#messagesbox ol li input{ width: 320px; height: 40px; font-size: 16px; color: #FFF;background: #0F9DCD;border: none;}
#messagesbox ol li input:hover{ background: #81B936;}



.lr-desc {
    text-align: left;
    width: 980px;
    margin: 0 auto;
	font-size:15px;
	line-height: 175%;
}

.index-first-data {
    margin-top: 50px;
}
.index-first-logo {
    margin-top: 60px;
    height: 120px;
    overflow: hidden;
    position: relative;
}
.index-knowMore {
    text-align: center;
    margin-top: 40px;
}
.index-first-data-number {
    font-size: 46px;
    font-family: fontStyleOne;
}
.index-first-data-unit {
    font-size: 16px;
}
.index-first-data-up {
    color: #4285f4;
	float:left;
}
.index-first-data ul {
    overflow: hidden;
}
.index-first-data li {
    float: left;
    text-align: left;
    margin: 0 20px;
    width: 258px;
}.index-first-data-down, .index-first-data-title {
    font-size: 14px;
    color: #666;
	float:left;
	margin-left:15px;
}

.diy-div{width:100%;   margin: 0 auto;}

.diy-content{    width: 1200px;
    margin: 0 auto;
    font-size: 16px;
    line-height:180%;
	color:#333;
	}