/*Generated by wjdhcms 3.0 */

@charset "utf-8";
* { padding: 0; margin: 0; font-family: 'Microsoft YaHei', arial, helvetica, clean, sans-serif; }
html { /* overflow: hidden; */
    -webkit-overflow-scrolling: touch; overflow-scrolling: touch; }
body { color: #333; margin: 0; line-height: 1.5;/* overflow: hidden; */
}
:focus { outline: 1; }
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; }
a { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
ins { background-color: #ff9; color: #000; text-decoration: none; }
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #cccccc; margin: 1em 0; padding: 0; }
input, select { vertical-align: middle; }
li, ul { list-style-type: none; }
img { border: none; }
a { color: #333; text-decoration: none;  -webkit-transition: all .3s ease-out;
 transition: all .3s ease-out;
}
a:link, a:hover, a:active, a:visited { text-decoration: none; color: #333; }
input, textarea { outline: 0; border: 0; -webkit-appearance: none; }
textarea { resize: none; }
h1, h2, h3, h4, h5, h6, dl, dd, dt, i, em { font-weight: normal; font-style: normal; }
.container { padding-left: 5px; padding-right: 5px; }
 [class*="col-"] {
 padding-left: 5px;
 padding-right: 5px;
}
.header img { width: 100%; }
.bar { width: 100%; padding: 10px 15px; height: 50px; background-color: #080808; }
.bar .goback { float: left; width: 30px; height: 30px; }
.bar .goback:before, .bar .goback:after { content: ''; display: block; background: #999999; width: 16px; height: 1px; position: absolute; top: 25px; transform: translate3d(0px, 0px, 0px); -webkit-transform: translate3d(0px, 0px, 0px); }
.bar .goback:before { transform: translateZ(0px) rotate(-45deg); -webkit-transform: translateZ(0px) rotate(-45deg); transform-origin: left bottom; -webkit-transform-origin: left bottom; }
.bar .goback:after { transform: translateZ(0px) rotate(45deg); -webkit-transform: translateZ(0px) rotate(45deg); transform-origin: left bottom; -webkit-transform-origin: left bottom; }
.lcbody { float: right; width: 30px; height: 30px; position: relative; transform: translateZ(0px) rotate(0deg); transition: transform 0.4s cubic-bezier(0.4, 0.01, .165, 0.99); }
.lcitem { position: absolute; left: 0; top: 0; transform: translateZ(0px) rotate(0deg); transition: transform 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99) 0s; -webkit-transform: translateZ(0px) rotate(0deg); -webkit-transition: -webkit-transform 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99) 0s; width: 30px; height: 30px; }
.lcitem .rect { width: 30px; height: 1px; background: #999999; position: absolute; left: 0; top: 14px; transition: transform 0.2s ease 0.2s; -webkit-transition: -webkit-transform 0.2s ease 0.2s; }
.lcitem .rect.top { transform: translate3d(0px, -6px, 0px); -webkit-transform: translate3d(0px, -6px, 0px); }
.lcitem .rect.bottom { transform: translate3d(0px, 6px, 0px); -webkit-transform: translate3d(0px, 6px, 0px); }
body.open .lcbody { transform: translateZ(0px) rotate(90deg); -webkit-transform: translateZ(0px) rotate(90deg); }
body.open .lcitem { transform: translateZ(0px) rotate(45deg); transition: transform 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99) 0.2s; -webkit-transform: translateZ(0px) rotate(45deg); -webkit-transition: -webkit-transform 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99) 0.2s; }
body.open .lcitem .rect { transition: transform 0.2s ease 0s; transform: translate3d(0px, 0px, 0px); -webkit-transition: -webkit-transform 0.2s ease 0s; -webkit-transform: translate3d(0px, 0px, 0px); }
.lcitem .rect.top { transform: translate3d(0px, -6px, 0px); -webkit-transform: translate3d(0px, -6px, 0px); }
body.open .lcitem.bottom { transform: translateZ(0px) rotate(-45deg); -webkit-transform: translateZ(0px) rotate(-45deg); }
body.open #page { transform: translate3d(-250px, 0, 0); -webkit-transform: translate3d(-250px, 0, 0); }
#page.goon { transform: translate3d(-100%, 0, 0); -webkit-transform: translate3d(-100%, 0, 0); }
#page.comeback { transform: translate3d(100%, 0, 0); -webkit-transform: translate3d(100%, 0, 0); }
#page { background: #fdfdfd; width: 100%; /* height: 100%; */
    transition: transform 0.4s cubic-bezier(0.4, 0.01, 0.165, 0.99); -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.4, 0.01, 0.165, 0.99); /* position: absolute; */
    /* left: 0; */
    /* top: 0; */
    z-index: 2; }
#leftnav { display: none; width: 250px; height: 100%; background: #202020; position: fixed; right: 0; overflow-y: auto; overflow-x: hidden; transform: translate3d(50px, 0, 0); -webkit-transform: translate3d(50px, 0, 0); transition: transform 0.4s cubic-bezier(0.4, 0.01, 0.165, 0.99); -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.4, 0.01, 0.165, 0.99); }
body.open #leftnav { transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); }
#leftnav ul li { display: block; line-height: 46px; border-bottom: .8px solid #2e2e2e; color: #818181; font-size: 15px; text-indent: 24px; width: 250px; cursor: pointer; }
#leftnav ul li>ul li { text-indent: 35px; background-color: #161616; border-bottom: 1px solid #111; }
#leftnav ul li a { color: #fff; }
#main { /* height: calc(100% - 50px); */
    /* height: -webkit-calc(100% - 50px); */
    /* overflow-x: hidden; */
    padding-bottom: 5em; overflow-y: auto; }
.wjdh-title { padding: 10px 0 20px; }
.wjdh-title span { text-transform: uppercase; color: #888; position: relative; }
.wjdh-title span:before, .wjdh-title span:after { content: ''; display: block; width: 30px; height: 1px; background-color: #888; position: absolute; top: 50%; ; }
.wjdh-title span:before { left: -50px; }
.wjdh-title span:after { right: -50px; }
.product-list ul { }
.product-list li { margin-bottom: 10px; }
.product-cat li a { display: block; width: 100%; height: 35px; line-height: 35px; margin-bottom: 10px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background-color: #ececec; }
.product-list li .item { display: block; border: 1px solid #CCCCCC; background-color: #FFFFFF; }
.product-list li .item img { width: 100%; height: auto; }
.product-list li .item span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 5px 10px; }
.product-list li .item .more { text-align: center; border: 1px solid #cecece; width: 60%; margin: 10px auto; }
.pages { margin: 20px 0; text-align: center; font-size: 12px; }
.pages a, .pages span { padding: 2px 8px; border: 1px solid #999; margin: 0 5px 5px; color: #999; display: inline-block; }
.pages .current { background-color: #e70012; border: 1px solid #e70012; color: #fff; }
.pages .current:hover { color: #fff; }
.pic-list li { margin-bottom: 10px; }
.pic-list li img { width: 100px; height: 80px; float: left; }
.pic-list li .info { border: 1px solid #cecece; margin-left: 110px; height: 80px; padding: 0 10px; }
.pic-list li .info h5 { margin: 5px 0; line-height: 25px; height: 25px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pic-list li .info p { height: 40px; line-height: 20px; overflow: hidden; margin: 0; color: #b6b6b6; }
.product-info { border: 5px solid #ececec; margin: 20px 0; }
.product-info h4 { border-bottom: 1px solid #ececec; padding: 20px 0; margin: 0; }
.product-info .img { padding: 20px; background-color: #f4f4f4; }
.product-info .img img { margin: 0 auto; width: 100%; }
.product-info span, .product-info p { color: #999; line-height: 25px; padding: 0 20px; }
.product-info a { border: 1px solid #ccc; display: block; text-align: center; padding: 10px 10px 10px 20px; display: flex; align-items: center; justify-content: center; font-size: 16px; margin: 20px; }
.product-info a svg { width: 25px; height: 25px; fill: #e70012; margin: 0 10px 0 0; }
.product-photo { padding: 10px 20px; border-top: 6px solid #ececec; border-bottom: 1px solid #ececec; background-color: #f4f4f4; margin-bottom: 13px; }
.product-photo ul { overflow-x: scroll; overflow-y: hidden; display: flex; margin: 0; }
.product-photo li { width: 100px; margin-right: 10px; }
.product-photo img { width: 100px; height: 70px; border: 3px solid #d4d4d4; }
.product-message { background-color: #fff; }
.product-message ul li { display: flex; align-items: center; padding: 5px 10px; background-color: #fff; margin-bottom: 10px; }
.product-message ul li button { display: block; width: 100%; }
.product-message .btn-tj { background-color: #e70012; color: #fff; }
.product-message ul li svg { display: block; width: 30px; height: 20px; fill: #666; margin-right: 10px; }
.page-content { border: 5px solid #ececec; margin: 20px 0; padding: 10px; background-color: #fff; font-size: 16px; line-height: 2; }
.page-content .page-title { margin-bottom: 20px; }
.page-content * { text-indent: 0!important; }
.page-content img { max-width: 100%; width: auto!important; height: auto; }
.page-content iframe { max-width: 100%; }
.case-list li .item { display: block; background-color: #fff; padding: 5px; margin-bottom: 10px; }
.case-list li span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 30px; }
.case-list li p { font-size: 12px; color: #666; height: 40px; line-height: 20px; overflow: hidden; }
.case-list li .more { background-color: #e70012; color: #fff; }
.case-list .img img { width: 100%; height: 10rem; }
.text-list ul li { padding-left: 30px; height: 35px; line-height: 35px; position: relative; }
.text-list ul li span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.text-list ul li b { float: right; font-weight: normal; color: #999; }
.text-list ul li i { display: block; width: 20px; height: 1px; background-color: #ccc; position: absolute; top: 50%; left: 0; }
.text-list ul li i:before, .text-list ul li i:after { content: ''; display: block; background: #ccc; width: 10px; height: 1px; position: absolute; top: 50%; right: 0; transform: translate3d(0px, 0px, 0px); -webkit-transform: translate3d(0px, 0px, 0px); }
.text-list ul li i:before { transform: translateZ(0px) rotate(45deg); -webkit-transform: translateZ(0px) rotate(45deg); transform-origin: right bottom; -webkit-transform-origin: right bottom; }
.text-list ul li i:after { transform: translateZ(0px) rotate(-45deg); -webkit-transform: translateZ(0px) rotate(-45deg); transform-origin: right bottom; -webkit-transform-origin: right bottom; }
.news-tab { display: flex; justify-content: center; align-items: center; margin-bottom: 20px; }
.news-tab a { display: block; padding: 10px 20px; background-color: #fff; margin: 0 10px; }
.news-tab .on { background-color: #e70012; color: #fff; }
.news-top { margin-bottom: 20px; height: 140px; }
.news-top .img { float: left; }
.news-top .img img { width: 180px; height: 140px; border: 5px solid #ccc; }
.news-top .info { margin-left: 200px; }
.news-top .info h4 { height: 50px; line-height: 25px; margin-bottom: 0px; overflow: hidden; }
.news-top .info p { height: 50px; line-height: 25px; overflow: hidden; }
.news-top .info span { background-color: #e70012; color: #fff; padding: 5px 10px; display: inline-flex; align-items: center; }
.news-top .info span i { display: inline-block; width: 20px; height: 1px; background-color: #fff; position: relative; margin-left: 10px; }
.news-top .info span i:before, .news-top .info span i:after { content: ''; display: block; background: #fff; width: 10px; height: 1px; position: absolute; top: 50%; right: 0; transform: translate3d(0px, 0px, 0px); -webkit-transform: translate3d(0px, 0px, 0px); }
.news-top .info span i:before { transform: translateZ(0px) rotate(45deg); -webkit-transform: translateZ(0px) rotate(45deg); transform-origin: right bottom; -webkit-transform-origin: right bottom; }
.news-top .info span i:after { transform: translateZ(0px) rotate(-45deg); -webkit-transform: translateZ(0px) rotate(-45deg); transform-origin: right bottom; -webkit-transform-origin: right bottom; }
.news-list ul li { height: 100px; margin-bottom: 10px; overflow: hidden; border: 1px solid #ccc; }
.news-list ul li dl { float: left; width: 100px; height: 100px; border-right: #ccc; display: flex; flex-direction: column; justify-content: center; align-items: center; border-right: 1px solid #ccc; color: #666; }
.news-list ul li dl dt { font-size: 24px; }
.news-list ul li .info {  padding: 10px; }
.news-list ul li .info span { font-size: 16px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 10px; }
.news-list ul li .info p { height: 40px; line-height: 20px; overflow: hidden; }
.wjdh-map { position: relative; }
.wjdh-map #wmap { width: 100%; height: 40vh; }
.wjdh-map #r-result { position: absolute; right: 0; top: 0; width: 450px; max-height: 500px; overflow-y: scroll; overflow-x: hidden; z-index: 99; transition: 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99); -webkit-transition: 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99); }
.wjdh-map .luxianjieguo #r-result { }
.wjdh-map .anchorBL { display: none; }
.wjdh-map .BMap_pop>div>div { border-radius: 8px; border: 0!important; }
.wjdh-map .BMap_pop .BMap_center { border: 0!important; border-right: 1px solid #fff!important; }
.wjdh-map .BMap_top { border: 0!important; }
.wjdh-map .BMap_bottom { border: 0!important; }
.wjdh-map .map-marker dt { float: left; }
.wjdh-map .map-marker dd { height: 80px; overflow: hidden; margin-left: 110px; }
.wjdh-map .map-marker dd span { font-size: 18px; }
.wjdh-map .map-marker h4 { height: 30px; font-size: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0; }
.wjdh-map .map-marker p { height: 40px; line-height: 20px; overflow: hidden; }
.driving-way { font-family: 'Microsoft JhengHei'; }
.driving-way .hd li { float: left; font-size: 16px; width: 50%; height: 50px; line-height: 50px; background-color: #eee; cursor: pointer; text-align: center; }
.driving-way .hd li.on { color: #fff; }
.driving-way .map-tab { padding: 20px 0; }
.driving-way .map-tab .trip-mode a { position: relative; float: left; font-size: 16px; padding-left: 50px; width: 100px; height: 50px; line-height: 50px; }
.driving-way .map-tab .trip-mode a.active { _background: url(../img/checkbox.png) no-repeat 10px center;  *background: url(../img/checkbox.png) no-repeat 10px center;
}
.driving-way .map-tab .trip-mode a i { width: 14px; height: 14px; display: block; border: 3px solid #666; position: absolute; left: 10px; top: 50%; margin-top: -10px; transition: 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99); -webkit-transition: 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99); }
.driving-way .map-tab .trip-mode a:hover i, .driving-way .map-tab .trip-mode a.active i { transform: translateZ(0px) rotate(45deg); -webkit-transform: translateZ(0px) rotate(45deg); }
.driving-way .map-tab .trip-mode a:hover i:before, .driving-way .map-tab .trip-mode a.active i:before { opacity: 1; }
.driving-way .map-tab .trip-mode a i:before { content: ''; display: block; width: 6px; height: 6px; background-color: #666; position: absolute; left: 50%; top: 50%; margin-left: -3px; margin-top: -3px; opacity: 0; transition: 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99); -webkit-transition: 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99); }
.driving-way .map-tab ul { position: relative; width: 100%; height: 112px; _background: url(../img/ico5.png) no-repeat left center;  *background: url(../img/ico5.png) no-repeat left center;
}
.driving-way .map-tab ul:before { position: absolute; left: 0; top: 50%; margin-top: -9px; content: ''; display: block; width: 16px; height: 17px; background: url(../img/ico5.png) no-repeat center center; transition: 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99); -webkit-transition: 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99); }
.driving-way .map-go ul:before { transform: rotateX(180deg); }
.driving-way .map-tab ul li { height: 35px; line-height: 35px; width: 70%; font-size: 16px; padding: 10px 0; margin-left: 80px; position: absolute; left: 0; transition: 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99); -webkit-transition: 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99); }
.driving-way .map-tab ul .d1 { top: 0; }
.driving-way .map-tab ul .d2 { top: 56px; }
.driving-way .map-go ul .d1 { top: 56px; }
.driving-way .map-go ul .d2 { top: 0; }
.driving-way .map-tab ul .d1:before { position: absolute; left: -20px; top: 30px; content: ''; display: block; border-radius: 50%; width: 3px; height: 3px; border: 2px solid #ed744e; }
.driving-way .map-tab ul .d2:before { position: absolute; left: -20px; top: 25px; content: ''; display: block; border-radius: 50%; width: 3px; height: 3px; border: 2px solid #12a7eb; }
.driving-way .map-tab ul i { display: block; width: 75%; height: 1px; background-color: #ccc; position: absolute; left: 50px; top: 56px; }
.driving-way .map-tab ul li input { font-size: 16px; width: 100%; height: 35px; line-height: 35px; }
.driving-way .map-tab #result { background-color: #313131; color: #fff; width: 50px; height: 50px; line-height: 50px; position: absolute; right: 0; top: 50%; margin-top: -25px; display: block; text-align: center; font-size: 18px; text-transform: uppercase; cursor: pointer; transition: 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99); -webkit-transition: 0.25s cubic-bezier(0.4, 0.01, 0.165, 0.99); }
.driving-way .contact-content { }
.driving-way .contact-content li { font-size: 16px; color: #888; padding-left: 40px; padding-top: 10px; padding-bottom: 10px; line-height: 32px; background-position: 0 center; background-repeat: no-repeat; }
.driving-way .contact-content .ct-address { background-image: url(../img/ct-address.png); margin-right: 40px; }
.driving-way .contact-content .ct-phone { background-image: url(../img/ct-phone.png); margin-right: 40px; }
.driving-way .contact-content .ct-mobile { background-image: url(../img/ct-mobile.png); }
.driving-way .contact-content .ct-email { background-image: url(../img/ct-email.png); }
.driving-way .luxian { width: 50%; float: left; }
.driving-way .luxian ul li:first-child { background: #eee url(../img/ico6.png) no-repeat 100px center; }
.driving-way .luxian ul li { width: 100%; height: 60px; line-height: 60px; color: #999; text-align: center; font-size: 21px; margin: 20px 0; background: #eee url(../img/ico7.png) no-repeat 100px center; cursor: pointer; }