@charset "utf-8";
body{ margin:0px; padding:0px;}
a{ text-decoration:none;}
ul{ list-style:none; margin:0px; padding:0px;}
p{ margin:0px;}
.width{ width:1200px; margin:0 auto;}
.both{ clear:both;}
a{ color:#000; transition:0.5s;}
#box{ width:100%; position:relative; overflow:hidden; height:500px;}
#box img{ transition:0.3s; position:absolute; top:0px; left:0px; height:100%; width:100%; object-fit:cover;}
.arrow{width:100%;}
.arrow a{ position:absolute; top:45%; background-color:rgba(255,255,255,0.8);border-radius:50%; color:#333; font-size:24px; padding:10px 15px; opacity:0;}
#box:hover .arrow a{ opacity:1;}


#top{ background:#f1efef; font-size:12px; padding:10px 0;}
#top p{ color:#8d8d8d; float:left;}
#top a{ color:#8d8d8d; float:right; border-right:1px solid #8d8d8d; height:12px; line-height:12px; padding:0 10px;}
#top .border_none{ border:none;}
#top a:hover{ color:#f0831e;}

#logo{ padding:20px 0;}
#logo .logo{ float:left; font-size:44px; color:#333; font-weight:600; }
#logo .logo_right{ float:left; border-left:1px solid #e1e1e1; margin-left:40px; padding-left:40px;}
#logo .logo_right .p1{ font-size:24px; color:#363535; font-weight:600;}
#logo .logo_right .p1 b{ color:#f0831e;}
#logo .logo_right .p2{ font-size:14px; color:#414141; margin-top:10px;}
#logo .tel{ float:right; background:url(../img/tel.png) no-repeat left; padding:5px 0 5px 60px;}
#logo .tel .p1{ font-size:14px;}
#logo .tel .p2{ font-size:24px;}
#logo .tel .p2 a{ color:#f0831e; font-weight:600;}

#nav{ background:#0d62be;}
#nav a{ float:left; height:54px; line-height:54px; width:calc(100% / 8); text-align:center; color:#fff;}
#nav a:hover{ background:#0d529e;}

#about{ padding:60px 0;}
#about .title{ text-align:center; font-weight:600; font-size:28px; color:#222; margin-bottom:50px;}
#about .title b{ color:#171f5e; font-weight:500;}
#about .about_text{ line-height:160%; text-align:center; font-size:14px; color:#333;}
#about .about_youshi{ margin:30px 0 60px; display:flex; justify-content:center;}
#about .about_youshi .about_icon{ padding-left:70px; margin:0 50px;}
#about .about_youshi .jingyan{ background:url(../img/about_icon1.png) left no-repeat;}
#about .about_youshi .cheliang{ background:url(../img/about_icon2.png) left no-repeat;}
#about .about_youshi .zhunshi{ background:url(../img/about_icon3.png) left no-repeat;}
#about .about_youshi .about_icon .p1{ font-weight:600; color:#333; font-size:28px; display:inline-block;}
#about .about_youshi .about_icon .p1 span{ font-size:14px; font-weight:500; color:#333; float:right;}
#about .about_youshi .about_icon .p2{ font-size:14px; color:#333;}
#about .about_href{ text-align:center;}
#about .about_href a{ margin:0 3px; display:inline-block; width:165px; height:45px; line-height:45px; border-radius:3px; color:#fff; font-size:14px;}
#about .about_href .tell_a{ background:#0d62be;}
#about .about_href .about_a{ background:#ff613e;}
#about .about_href .tell_a:hover{ background:#454d7e;}
#about .about_href .about_a:hover{ background:#ff8030;}

#product{ padding:40px 0;}
#product .left{ float:left; width:240px;}
#product .left h1{ background:url(../img/product_h1.jpg); text-align:center; margin:0; font-size:30px; height:80px; line-height:80px; color:#fff;}
#product .left .title{ background:#f3f3f3; padding:15px;}
#product .left .title p{ background:url(../img/product_type.png) 96% center no-repeat #fff; margin-bottom:10px; height:40px; font-size:14px; line-height:40px; padding:0 10px;}
#product .left .title p a{ color:#333;}
#product .left .tel{ background:#0d62be; padding:15px;}
#product .left .tel .p1{text-align:center; color:#fff; height:30px; line-height:30px; background:url(../img/product_tel.png) 25px center no-repeat #f0831e;}
#product .left .tel .p2{ text-align:center; color:#fff; font-weight:600; font-size:24px; line-height:200%;}
#product .right{ float:right; width:calc(100% - 240px);}
#product .right .product{ float:left; width:calc(100% / 3 - 40px); margin:0 20px 20px; background:#f3f3f3; transition:0.3s;}
#product .right .product img{ width:100%; height:180px;object-fit: cover;}
#product .right .product p{ height:60px; line-height:60px; text-align:center; font-size:14px;}
#product .right .product p a{ color:#666;}
#product .left .title p:hover{ background-color:#0d62be;}
#product .left .title p:hover a{ color:#fff;}
#product .right .product:hover{ background:#f0831e;}
#product .right .product:hover p a{ color:#fff; font-size:18px;}

#example{ background:url(../img/example_bg.jpg) no-repeat; background-size:100% 100%; padding:40px 0;}
#example .title{ font-size:44px; color:#fff; text-align:center;}
#example .descript{ font-size:20px; color:#fff; text-align:center; margin-bottom:40px;}
#example .product{ float:left; width:calc(100% / 4 - 40px); padding:10px; background:#fff; margin:10px; transition:0.3s;}
#example .product img{ width:100%; height:200px;}
#example .product p{ height:35px; line-height:35px; text-align:center;}
#example .product:hover{ background:#f0831e;}
#example .product:hover p a{ color:#fff;}

#youshi{ padding:80px 0;}
#youshi .title{ color:#454d7e; font-weight:600; font-size:40px; text-align:center; background:url(../img/title_bg.png) bottom no-repeat; padding-bottom:40px; margin-bottom:40px;}
#youshi .youshi_order_left{ float:left; width:50%;}
#youshi .youshi_order_right{ float:right; width:50%;}
#youshi .product{ width:100%;}
#youshi .product .product_left{ float:left; width:50%; border-left:1px solid #d2dee7; border-top:1px solid #d2dee7; border-bottom:1px solid #d2dee7; box-sizing:border-box; height:220px;}
#youshi .product .p1{ font-size:20px; padding:30px 0 0 30px;}
#youshi .product .p2{ line-height:200%; font-size:14px; color:#999; padding:0 30px; margin:15px 0 30px;}
#youshi .product .p3{ padding:0 30px;}
#youshi .product .p3 img{ width:30px; height:5px;}
#youshi .product .product_right{ float:right; width:50%; border-right:1px solid #d2dee7; border-top:1px solid #d2dee7; border-bottom:1px solid #d2dee7; box-sizing:border-box; height:220px;}
#youshi .product .product_img{ width:100%; height:100%;}

#tell{ background:url(../img/map.jpg) center 30px no-repeat; background-size:100%; padding-bottom:60px;}
#tell .message{ background:#fff; padding:55px 50px; width:350px; box-shadow:0 3px 15px 0 #eee;}
#tell .message .p1{ font-size:24px; color:#999;}
#tell .message .p2{ font-weight:600; font-size:18px; color:#333; margin:5px 0 20px;}
#tell .message .contact_p{ margin-bottom:20px;}
#tell .message .contact_p p{ color:#333; font-size:12px; display:inline-block; width:calc(50% - 25px); line-height:280%; padding-left:20px;}
#tell .message .contact_p .tell{ background:url(../img/message_tell.png) left no-repeat;}
#tell .message .contact_p .adress{ background:url(../img/message_adress.png) left no-repeat;}
#tell .message .index_form_text{ border:2px solid #ededed; padding:3px; box-sizing:border-box; width:100%; height:35px; line-height:35px; margin-bottom:10px;}
#tell .message .index_textarea{ border:2px solid #ededed; padding:3px; box-sizing:border-box; width:100%; height:100px; resize:none; margin-bottom:10px;}
#tell .message .index_form_submit{ background:#0d62be; border:none; padding:0; margin:0; width:140px; height:40px; margin-left:calc(100% - 140px); color:#fff; border-radius:5px; transition:0.3s;}
#tell .message .index_form_submit:hover{ background:#ff613e;}


#news{ padding:40px 0;}
#news .left{ float:left; width:49%;}
#news .left .title{ color:#0d62be; font-size:24px; font-weight:600; margin-bottom:20px;}
#news .left .title a{ float:right; color:#0d62be; border:2px solid #0d62be; height:26px; width:26px; line-height:26px; font-size:24px; text-align:center;}
#news .left .mid{ display:flex;flex-wrap: wrap;justify-content: space-evenly;}
#news .left .mid p{ margin-top:20px; font-size:14px; color:#666; line-height:200%; display:inline-block; width:calc(100% / 3);}
#news .left .mid p a:hover{ color:#36C;}
#news .left .bottom{ padding:25px 0;}
#news .left .bottom p{ width:150px; height:30px; background:#0d62be; text-align:center;}
#news .left .bottom p a{ line-height:30px; font-size:12px; color:#fff;}
#news .right{ float:right; width:49%;}
#news .right .title{ color:#0d62be; font-size:24px; font-weight:600; margin-bottom:20px;}
#news .right .title a{ float:right; color:#0d62be; border:2px solid #0d62be; height:26px; width:26px; line-height:26px; font-size:24px; text-align:center;}
#news .right .product{ width:100%; background:#f0f0f0; border-bottom:1px solid #d2d2d2;}
#news .right .product .new_more a{  float:left; background:#0d62be; width:45px; height:45px; text-align:center; line-height:45px; font-size:24px; color:#fff;}
#news .right .product .new_title{ float:right; width:calc(100% - 45px); background:#f7f7f7; height:45px; line-height:45px;}
#news .right .product .new_title a{ font-size:14px; margin-left:10px;}
#news .right .product .new_descript{ padding:10px 55px 0; font-size:14px; color:#5a5a5a; line-height:200%; overflow: hidden;text-overflow: ellipsis;display: -webkit-box; -webkit-line-clamp:3;-webkit-box-orient: vertical; margin-bottom:10px;}
#news .left .title a:hover{ transform:rotateZ(180deg); color:#fff; background:#0d62be;}
#news .right .title a:hover{ transform:rotateZ(180deg); color:#fff; background:#0d62be;}
#news .right .product .new_more a:hover{ background:#f0831e;}
#news .right .product .new_title a:hover{ text-decoration:underline;}

#list{height:300px; padding:30px 0; width:1200px;}
#list img{ width:300px; height:250px; padding:10px 15px;}



#links{ padding:0 0 20px;}
#links p{ font-size:14px; color:#333;}
#links p a{ color:#333;}
#links p a:hover{ color:#01a1ea;}

#foot_daohang{ background:#0d62be; text-align:center; padding:10px 0;}
#foot_daohang a{ color:#fff; font-size:14px; display:inline-block; width:140px; height:20px; line-height:20px; position:relative;}
#foot_daohang a:before{ content:''; position:absolute; left:0; top:0; width:1px; height:100%; background:#fff;}
#foot_daohang .fir:before{ content:normal;}

#foot{ background:#2c2c2c; padding:40px 0;}
#foot .left{ float:left;}
#foot .left p{ font-size:14px; line-height:200%; color:#fff;}
#foot .left p a{ color:#fff;}
#foot .right{ float:right;}
#foot .right img{ width:110px; height:110px;}
#foot_nav{ display:none;}

.menu_close{ display:none;}















@media screen and (max-width: 980px) {
*{-webkit-text-size-adjust:none;}
#box{ height:300px;}
.width{ width:98%;}

#nav a{ width:calc(100% / 7);}
#about .about_youshi .about_icon{ margin:0 15px; }
#logo .logo_right{ display:none;}
#logo .logo{ font-size:40px; line-height:60px;}
#nav .width{ width:100%;}

#product .left{ display:none;}
#product .right{ width:100%;}
#product .right .product{ width:calc(100% / 2 - 40px);}
#example .product{ width:calc(100% / 2 - 40px);}
#news{ padding:40px 0 10px;}
#news .left , #news .right{ width:100%; margin-bottom:20px;}
#foot{ margin-bottom:40px;}
#foot_nav{ display:block; position:fixed; bottom:0; left:0; width:100%; background:#0d529e;}
#foot_nav a{ height:40px; line-height:40px; color:#fff; float:left; width:calc(100% / 3); text-align:center; font-size:14px;}
#youshi .youshi_order_left{ width:100%;}
#youshi .youshi_order_right{ width:100%;}
#tell .message{ margin:0 auto;}
#tell{ background-size:cover;}
#foot_daohang a{ width:70px;}
#top a{ display:none;}
#list{height:300px; padding:30px 0; width:100%;}
}