﻿@charset "utf-8";
/* CSS Document */
/*header*/
header{ width:1100px; margin:0 auto; height:130px; overflow:hidden}
header #bl_logo{ float:left; margin-top:38px;}
header .bl_search{ position:relative; float:right; margin-top:45px; background:#f3f3f3; border-radius:45px; height:46px; padding:0 92px 0 15px;}
header .bl_search .bl_sou{ border:0; height:40px; margin-top:3px;outline:none; font-size:16px; color:#999; width:265px; background:#f3f3f3}
header .bl_search .bl_anniu{ background:url(../images/bl_sousuo.png) no-repeat; border:0; display:block; position:absolute; top:0; right:0; width:92px; height:46px;outline:none; cursor:pointer}
/*nav*/
nav{ position:relative;width:1100px; margin:0 auto}
nav ul{ overflow:hidden; position:absolute; left:0; top:2px;}
nav ul li{ float:left; line-height:50px; margin-right:50px;}
nav ul li a{ font-size:16px; color:#fff; padding-bottom:7px; border-bottom:2px;}
nav ul li a:hover,nav ul li .bl_hover{ color:#fe6e24; border-bottom:2px solid #fe6e24}
/*banner*/
#banner{ width:100%;}
#banner img{ display:block; width:100%}
/*content*/
#content{ width:1100px; margin:0 auto; overflow:hidden}
#content .class_nav{ overflow:hidden; background:#f8f8f8; margin:35px 0}
#content .class_nav dl{ overflow:hidden; padding:15px 0 15px 25px;}
#content .class_nav dl dt,#content .class_nav dl dd{ float:left}
#content .class_nav dl a{ color:#555; font-size:14px;}
#content .class_nav dl dt{ font-weight:bold; font-size:14px;}
#content .class_nav dl dd{ padding:0 10px;}
#content .class_nav dl dd .hover,#content .class_nav dl dd a:hover{ border:1px solid #e7570e; color:#e7570e; border-radius:6px; padding:5px 8px;}
#content .class_nav dl dd a{ padding:5px 8px;border:1px solid #f8f8f8;}
#content .product{ width:1200px; overflow:hidden}
#content .bl_cp{ width:252px; float:left; margin:0 30px 40px 0}
#content .bl_cp .bl_pic{ width:252px; height:165px; overflow:hidden}
#content .bl_cp .bl_pic img{ display:block; width:100%; height:165px;transition: all 0.6s;}
#content .bl_cp .bl_pic img:hover{transform: scale(1.2);}
#content .bl_cp dl{ padding-top:10px;}
#content .bl_cp dl dt{ /*padding-left:25px; background:url(../images/bl_zhai.jpg) no-repeat left;*/font-weight: bold;font-size: 20px; height:40px; line-height:40px; overflow:hidden}
#content .bl_cp dl dt a{ color:#333; font-size:14px;}
#content .bl_cp dl dt a:hover{ color:#d80d0d; border-bottom:1px solid #d80d0d}
#content .bl_cp dl dd{ font-size:13px; line-height:25px; color:#555}
#content .bl_cp dl dd b{ color:#ed8b0d; font-weight:normal; padding-right:3px;}
#content .bl_cp .yomi{ font-size:13px; color:#555; padding-top:10px;}
#content .bl_cp .yomi b{ color:#d80d0d; padding:0 2px;}
#content .bl_cp .yomi .split{ color:#555; font-weight:normal}
/*footer*/
footer{ height:80px; line-height:80px; color:#fff; background:#62534c; text-align:center; font-size:14px;overflow: hidden;}
/*内页样式*/
#content .position{ background:url(../images/bl_weizhi.jpg) no-repeat 0 21px; font-size:14px; color:#666; padding:18px 0 25px 18px; width:1100px; margin:0 auto}
#content .position p{ background:url(../images/bl_jt.jpg) no-repeat left; padding-left:12px; margin-left:10px; display:inline-block}
#content .position a{ color:#666}
#content .position a:hover{ color:#d80d0d}
#content .product_details dl{ width:1100px; overflow:hidden }
#content .product_details dl dt{ float:left; width:550px; height:380px;}
#content .product_details dl dt img{ display:block; width:100%; height:100%}
#content .product_details dl dd{ width:515px; float:right; height:380px; position:relative}
#content .product_details dl dd .bl_title{ font-size:16px; color:#555; background:url(../images/bl_zhai.jpg) no-repeat left; padding-left:30px;}
#content .product_details dl dd ul{ padding:20px 0} 
#content .product_details dl dd ul li{ line-height:35px; font-size:14px; color:#555}
#content .product_details dl dd ul li b{ color:#ed8b0d; display:inline-block; padding-right:5px;}
#content .product_details dl dd ul li .yomi b{ color:#d80d0d;}
#content .product_details dl dd ul li .yomi .split{ color:#666}
#content .product_details dl .cd-popup-trigger{ position:absolute; left:0; bottom:0; width:100%; background:#f3641b; text-align:center; height:45px; line-height:45px; color:#fff; font-size:18px; border-radius:4px; cursor:pointer}
#content .detailed{ padding:30px 0 0 0; width:1100px; }
#content .detailed h2{ border-left:3px solid #f3641b; font-size:16px; padding-left:10px; margin-bottom:32px;}
#content .detailed p,#content .detailed img{ display:block; max-width:100%; margin:0 auto 35px auto}

/*留言*/
.cd-popup {position: fixed;left: 0;
  top: 0; height: 100%; width: 100%;background-color: rgba(94, 110, 141, 0.9); opacity: 0; visibility: hidden; -webkit-transition: opacity 0.3s 0s, visibility 0s 0.3s; -moz-transition: opacity 0.3s 0s, visibility 0s 0.3s; transition: opacity 0.3s 0s, visibility 0s 0.3s;}
.cd-popup.is-visible { opacity: 1; visibility: visible; -webkit-transition: opacity 0.3s 0s, visibility 0s 0s; -moz-transition: opacity 0.3s 0s, visibility 0s 0s;transition: opacity 0.3s 0s, visibility 0s 0s; position:absolute; top:12px; right:12px; position:absolute}
.cd-popup-container {  position:fixed;  width:520px;  max-width:60%;  margin: 4em auto;  background: #f5f5f5;  border-radius: .45em .45em .4em .4em;
 box-shadow: 0 0 20px rgba(0, 0, 0, 0.2); margin:0 auto; left:0; right:0; -webkit-transform: translateY(-40px);
  -moz-transform: translateY(-40px);  -ms-transform: translateY(-40px);  -o-transform: translateY(-40px);  transform: translateY(-40px);  /* Force Hardware Acceleration in WebKit */  -webkit-backface-visibility: hidden; -webkit-transition-property: -webkit-transform;  -moz-transition-property: -moz-transform;  transition-property: transform;  -webkit-transition-duration: 0.3s;  -moz-transition-duration: 0.3s;  transition-duration: 0.3s; top:20%}
.cd-popup .img-replace{ position:absolute; top:10px; right:10px; background:#F60; color:#fff; font-size:12px; border-radius:100%; width:35px; height:35px; line-height:35px; text-align:center}
.is-visible .message{ padding:35px}
.is-visible .message h2{ font-size:18px;}
.is-visible .message h2 p{ display:block; font-weight:normal; color:#999; padding-top:12px; font-size:14px;}
.is-visible .message dl{ overflow:hidden}
.is-visible .message dl dt,.is-visible .message dl dd{ float:left; font-size:16px; color:#555; margin-top:30px;}
.is-visible .message dl dt{ width:120px; text-align:right; line-height:35px;}
.is-visible .message dl dd .bl_xm{ border:0; height:35px; padding:0 10px; outline:none; border-radius:3px; line-height:35px; width:250px;}
.is-visible .message dl dd .bl_yzm{ width:130px; margin-right:10px;}
.is-visible .message dl dd a{ display:inline-block; line-height:35px; height:35px; padding:0 12px; border-radius:3px; color:#fff; background:#f3641b; font-size:12px;}
.is-visible .message dl dd .bl_bz{ font-family:"微软雅黑"; height:150px; line-height:25px;}
.is-visible .message .bl_tijiao{ padding:25px 0 0px 0}
.is-visible .message .bl_tijiao input{ display:block; width:300px; margin:0 auto; background:#f3641b; color:#fff; font-size:14px; border:0; outline:none; height:45px; cursor:pointer; border-radius:3px;}

@media screen and (max-device-width:700px) {
header{ width:100%; height:auto; margin-bottom:15px;}
header #bl_logo{ float:none; text-align:center; margin-top:20px;}
header #bl_logo img{ width:80%}
header .bl_search{ float:none; height:38px; margin:22px 15px auto 15px;}
header .bl_search .bl_sou{ height:35px; line-height:35px; font-size:14px;}
header .bl_search .bl_anniu{ height:38px; background-size:80px 100%; right:0; width:79px;}
nav{ width:100%}
nav ul{ text-align:center; width:100%}
nav ul li{ float:none; display:inline-block; margin:0 16px;}
nav ul li a{ font-weight:bold; font-size:14px;}
#banner img{ height:180px;}
#content{ width:100%; padding-bottom:35px;}
#content .class_nav dl{ padding-bottom:5px; padding-top:15px;}
#content .class_nav dl dt{ margin-top:15px;}
#content .class_nav dl dd{ height:25px; line-height:25px; padding:0; margin:12px 5px 0 5px;}
#content .class_nav{ margin:10px 0}
#content .product{ width:100%}
#content .bl_cp{ float:none; width:95%; margin:0 auto 30px auto}
#content .bl_cp .bl_pic{ width:100%; height:250px;}
#content .bl_cp .bl_pic img{ height:100%}
footer{ font-size:12px; line-height:50px; height:50px; position:fixed; bottom:0; left:0}
#content .position{ width:98%; margin-left:2%; padding-bottom:15px;}
#content .product_details dl{ width:98%; margin:0 auto}
#content .product_details dl dt{ float:none; width:100%; height:250px;}
#content .product_details dl dd{ float:none; width:100%; padding-top:20px; height:290px; padding-bottom: 20px;}
#content .detailed{ width:98%; margin:0 auto}
#content .detailed h2{ border-bottom:1px dotted #ccc}
.cd-popup-container{ width:96%; max-width:none; top:10%;}
.is-visible .message dl dt{ width:85px; font-size:14px;}
.is-visible .message dl dd .bl_xm{ width:190px;}
.is-visible .message dl dd .bl_yzm{ width:75px;}
.is-visible .message dl dt, .is-visible .message dl dd{ margin-top:19px;}
.is-visible .message{ padding:45px 15px 12px 15px;}
#content .product_details dl .cd-popup-trigger{ width:95%; margin:0 auto; right:0}
#content .class_nav{height:200px;overflow:auto;}

}