@charset "utf-8";
/* CSS Document */

/*main*/
.main{ background:url(../images/other/main_bg.png) no-repeat; color:#fff; /*width:919px; height:500px;*/ margin: 15px 0 0 16px ; padding: 8px 25px 8px 18px; line-height:19px; position:relative; width: 962px; height: 508px; /*height: auto; background-image: none; background-color: rgba(0,0,0,0.65); border-radius: 10px;*/ }
.main .qrcode{position:absolute; /*bottom:65px; left:360px;*/ right: 0;  bottom: 0;}

/*about*/
.main .about_title{ font-size:15px; color:#d6f23d; font-weight:bold; display:block; padding:10px 0;}
.main .about_img{ float:right; margin:5px 0 0 10px;}
/*.about-customer{ margin:10px 0 0 0; text-align:center; display: flex; justify-content: space-between; }
.about-customer li{ display: inline-block; vertical-align: top; width: 20%; }*/
.about_city-mobile{ display: none; }
.about_city{ margin: 5px auto; text-align: center;}
.about_city img{ width: 50%; }


/*service*/
.main .service_title{ font-size:15px; color:#d6f23d; font-weight:bold; display:block; padding:10px 0;}
.main .service_tips{ font-family:"Times New Roman", Times, serif; font-size:16px; color:#1bf2ff; display:block; padding:5px 0; font-weight:bold; font-style:italic;}
.main .service_list{ font-size:13px; line-height:18px;}
.main .service_list li{ background:url(../images/other/icon01.jpg) no-repeat 5px 10px; padding:5px 0 5px 20px;}
.main .service_img{ margin:33px 0 0 20px;}

/*process*/
.main .process_title{ font-size:15px; color:#d6f23d; font-weight:bold; display:block; padding:7px 0 6px 0;}
.main .process_img{ float:left;}
.main .process_right{
	border-left:dashed 1px #7c7c7c;
	float:right;
	width:180px;
	height:430px;
	padding-top:10px;
	background:url(../images/other/gear.png) no-repeat bottom right;
	position:relative;
}
.main .process_right li{ padding-left:20px; height:28px; padding-top:4px; }
.main .process_right li a{ color:#fff; text-decoration:none;}
.main .process_right li a:hover{font-weight:bold; text-decoration:underline;}
.main .process_right li.act{ background:url(../images/other/right_nav.png) no-repeat;font-weight:bold;}
.main .equipment_list{ font-size:13px; line-height:18px; width:710px; height:456px; position:relative;}
.main .equipment_list .left_list li{background:url(../images/other/icon01.jpg) no-repeat 5px 7px; padding:2px 0 2px 20px;}
.main .equipment_list .roll{ background:url(../images/other/roll_back.png) no-repeat; width:344px; height:212px; position:absolute; right:13px; bottom:44px; padding:8px 0 0 0;}
.main .equipment_list .catia{position:absolute; right:18px; bottom:280px;}


/*contact*/
.main .contact_title{ font-size:15px; color:#d6f23d; font-weight:bold; display:block; padding:10px 0;}
.main .contact_list{ font-size:13px; line-height:16px; padding-bottom:10px; width:450px;}
.main .contact_list li{ background:url(../images/other/icon01.jpg) no-repeat 5px 8px; padding:4px 0 4px 20px;}
.main .contact_tips{font-size:15px; color:#6ac2ff; display:block;  font-weight:bold; padding-left:5px; padding-bottom:10px; width:450px;}
.main .contact_addr{ font-size:13px; padding-left:5px; width:450px; line-height:20px;}
.main .contact_addr a{ color:#999; text-decoration:none;}
.main .contact_addr a:hover{ color:#fff; text-decoration:underline;}
.main .contact_right{ float:right; width:453px;}
.main .contact_right .map{ background:url(../images/other/map_bg.jpg) no-repeat; /*height:196px; width:446px; */margin-top:7px; padding:6px 0 0 7px; height: 210px; width: 460px; }
.main .contact_right .map a{ color:#0069ea; line-height:25px; text-decoration:none;}
.main .contact_right .map a:hover{ text-decoration:underline;}
.main .contact_right .con_text{ font-family:"Times New Roman", Times, serif;  font-size:15px; color:#ffc000; line-height:16px;  margin:5px auto; width:430px; }
.contact_form input{ background:none; border:solid 1px #5f5f5f; color:#fff; float:left; margin:4px 0; margin:5px 0\9; padding:0 3px; }
.contact_form textarea{ background:none; border:solid 1px #5f5f5f; color:#fff;  /*float:left; width:336px;*/ margin:4px 0 3px 0; *margin:3px 0 2px 0; padding:0 3px;  vertical-align: top; float: none;  display: inline-block; width: calc(76% - 15px); }
.contact_form .form_title{ /*width:91px; float:left;*/  height:14px; margin:3px 0 3px 10px; float: none;  display: inline-block; vertical-align: top; width: 24%;  }
.contact_form input.form_space1{ /*width:336px;*/ display: inline-block;   float: none;   vertical-align: top; width: calc(76% - 15px); }
.contact_form input.form_space2{ /*width:108px;*/ float: none;  display: inline-block;  vertical-align: top; width: calc(26% - 17px); }
.contact_form input.contact_submit{ border:0; width:87px; height:27px; margin-left:230px; }
.contact_block{ float: left;  position: relative;}

/*products*/
.main .product_title{ font-size:15px; color:#d6f23d; font-weight:bold; display:block; padding:10px 0;}
.main .product_list{ /*margin-left:15px;*/ margin-left:0; }
.main .product_list li{ /*margin:3px 19px 21px 0; float:left;*/ display: inline-block;  margin-right: 20px; margin-bottom: 20px; }
.main .product_list li:nth-child(5n){  margin-right:0; }
.main .product_list li.no_r{ margin-right:0;}



@media only screen and (max-width: 990px) {

.main{ width: 100%; height: auto;  background-size: cover; background-image: none; background-color: rgba(0,0,0,0.65); border-radius: 10px; margin: 0 auto; box-sizing: border-box; padding: 10px 15px; }
.main .about_img{ float: none; margin: auto; width: 75%;}
.about_text{ float: none; }

.main .product_list{  margin: auto; text-align: center; }
.main .product_list li{ display: inline-block;  float: none;  margin-right: 10px;}
.main .product_list li img{ width: 100%; }

.main .service_img{ margin: 20px auto; display: flex;  justify-content: space-around;  width: 98%;}
.main .service_img img{ width: calc(100% / 5 - 10px); height: auto; }

.main .process_right{float: none; width: calc(100% - 750px);  width: 100%; height: auto;  margin-bottom: 20px; background: none;  display: flex; align-items: center; }
.main .process_img{ float: none;  display: inline-block; width: 100%; vertical-align: top;}
.main .process_right li{ display: inline-block; /*width: 150px;*/ text-align: center; width: calc(100% / 3); padding: 5px; height: auto; }
.main .process_right li.act{ /*background-size: cover;  background-position: center; background: url(../images/other/right_nav-mobile.png) no-repeat;*/ background-color: #434343; background-image: none;}

.left_list{ margin-bottom: 30px; }
.main .equipment_list .left_list li{ display: inline-block; margin-right: 20px;}
.main .equipment_list{ width: 100%; }
.main .equipment_list .catia{ position: static;  width: calc(100% - 350px);   display: inline-block; vertical-align: middle;}
.main .equipment_list .roll{ position: static; display: inline-block; vertical-align: middle; height: auto; }
.main .equipment_list{ height: auto; }

.contact{ display: flex; flex-wrap: wrap;}
.main .contact_list li{ width: 100%; }
.main .contact_right{ width: 100%;  float: none; order: 2;}
.main .contact_list{ width: 100%;   display: flex;  flex-wrap: wrap;}
.main .contact_tips{ width: 100%; }
.main .contact_addr{ width: 100%; }
.main .contact_right .con_text{ margin: 10px auto;  width: 100%; }
.contact_form input.contact_submit{ margin: 20px auto; text-align: center; float: none;}
.contact_block{ order: 1; float: none; }
/*.main .qrcode{ right: 20%;  bottom: 10px;}*/
.main .qrcode{ position: static;  margin: 10px 0;}
.main .qrcode img{ width: auto; }
.contact_submit_block{ text-align: center; }
}


@media only screen and (max-width: 900px) {

.main .product_list li:nth-child(5n){ margin-right:10px;}
.main .product_list li:nth-child(4n){ margin-right:0; }
}


@media only screen and (max-width: 768px) {

.main .about_img{ width: 100%; }
.main .product_list li:nth-child(4n){ margin-right:10px; }
.main .product_list li:nth-child(3n){ margin-right:0; }

.main .equipment_list .catia{ text-align: center; width: 100%; margin-bottom: 15px; }
.main .equipment_list .roll{ width: 100%;  text-align: center;  margin: auto; background-position: top center; }

.about_city img{width: 75%;}
}

@media only screen and (max-width: 640px) {
.main .service_img{ flex-wrap: wrap;  justify-content: center; }
.main .service_img img{ width: calc(100% / 3 - 10px); }
.main .process_right li{ padding-left: 0; }
.main .contact_right .map{ width: 100%;  background: none;}
.main .contact_right .map iframe{ width: 100%; }
.contact_form .form_title{ width: 26%; margin-left: 0; }
.contact_form input.form_space1, .contact_form input.form_space2, .contact_form textarea{ width: calc(74% - 15px); }

.about_city img{width: 100%;}

}

@media only screen and (max-width: 600px) {
.main .product_list li{ margin-bottom: 10px;}
.main .product_list li, .main .product_list li:nth-child(3n){ margin-right:10px; }
.main .product_list li:nth-child(2n){ margin-right:0; }


}

@media only screen and (max-width: 480px) {

.main .product_list li{ width: calc(50% - 10px); }
/*.contact_form input.form_space2{ width: calc(80% - 15px); }*/
.about_city-mobile img{ width: 70%; }
.contact_form .form_title{ width: 100%; }
.contact_form input.form_space1, .contact_form input.form_space2, .contact_form textarea{ width: calc(100% - 15px); margin-left: 15px; }
}

@media only screen and (max-width: 440px) {

.main .qrcode{ position: static;  margin: 10px 0;}
.main .qrcode img{ width: auto; }

.main .equipment_list .roll{ background: none;}
}

@media only screen and (max-width: 360px) {

.main .service_img{ justify-content: space-between; margin-left: 10px; }
.main .service_img img{ height: auto;  width: calc(50% - 15px); }

.about_city-mobile img{ width: 80%; }
/*.contact_form .form_title{ width: 30%; }
.contact_form input.form_space1, .contact_form input.form_space2, .contact_form textarea{ width: calc(70% - 15px); }*/
}
