/*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: 1em;

    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;

 

    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 {

    margin-left: 120px;

    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;

}