﻿

.contact-us-page {

    padding:15px 0 70px;

}

.contact-us-page .container {}

.contact-infomation {

    padding:4% 5% 4.5%;

    background:#fff;

}

.contact-infomation .each-item {

    float:left;

    width:21.5%;

    margin-right:3.5%;

}



.contact-infomation .each-item dt {

    padding-bottom:25px;

    margin-bottom:15px;

    font-size:16px;

    font-weight:bold;

    color:#333;

    border-bottom:1px solid rgba(0,0,0,.15);

}

.contact-infomation .each-item .word {

    font-size:16px;

    color:#666;

    transition:all .5s ease-in-out;

}

.contact-infomation .each-item a.word:hover {color:rgba(255,255,255,.7);}

.contact-infomation .each-item .contact-item .word {

    display:block;

    padding:5px 0;

}

.contact-infomation .each-item .address-item dd {

    margin:0 0 20px 0;

    padding-left:35px;

}

.contact-infomation .each-item .address-item .address {

    line-height:22px;

    background:url(../image/contact-icon3.png) no-repeat left center;

}

.contact-infomation .each-item .address-item .phone-number {

    line-height:24px;

    font-size:16px;

    background:url(../image/contact-icon4.png) no-repeat left center;

}





.contact-infomation .each-item.qq-item {

    /*width:29%;

    margin-left:6.5%;*/

    width:25%;

    margin-right:0;

}



.contact-infomation .each-item .dt-title {

    padding-bottom:25px;

    margin-bottom:15px;

    font-size:16px;

    font-weight:bold;

    color:#333;

    border-bottom:1px solid rgba(0,0,0,.15);

    text-transform:uppercase;

}

.contact-infomation .each-item .dt-titles {

    padding-bottom:25px;

    font-size:16px;

    font-weight:bold;

    color:#333;

    text-transform:uppercase;

}

.contact-infomation .each-item .dd-content > span {

    font:16px/1  'Gotham-Book','Microsoft Yahei';

    color:#666;

    font-weight:bold;

    line-height:22px;

    padding-left:35px;

    background:url(../image/contact-icon5.png) left center no-repeat;

}

.each-item .contact-qq {

    display:inline-block;

    width:140px;

    height:48px;

    margin-right:10px;

    margin-bottom:10px;

    font:14px/1  'gotham-medium';

    color:#333;

    line-height:48px;

    text-align:center;

    border:2px solid #333;

    border-radius:52px;

    -moz-border-radius:52px;

    -webkit-border-radius:52px;

    transition:all .4s ease-in-out;

    box-sizing: border-box;

}

.each-item .contact-qq:last-child{margin-right:0;}

.contact-infomation .each-item .contact-qq:hover {color:#fff;background:#333;}

.contact-infomation .each-item .contact-qq .icon {

    display:inline-block;

    width:23px;

    height:23px;

    margin-right:5px;

    vertical-align:-5px;

    background:url(../image/contact-icon1-2.png) no-repeat center center;

    transition:all .4s ease-in-out;

}

.contact-infomation .each-item .contact-qq:hover .icon {background:url(/public/image/fix-icon2.png) no-repeat center center;}

@media(max-width:1338px){

    .contact-infomation {padding:3% 3% 3.5%;}

    /*.contact-infomation .each-item.qq-item {width:35.5%;margin-left:0;}*/

    .contact-infomation .each-item .dd-content > span {  font: 14px/1 'Gotham-Book','Microsoft Yahei';  line-height: 24px;  }

    .contact-infomation .each-item .contact-qq {width:135px;height:40px;line-height:36px;}

}

.contact-map {background:#fff;}

.contact-traffic {

    background:#fff;

}

.contact-traffic .title {

    padding-bottom:4%;

    font-size:28px;

    font-weight:bold;

    color:#333;

    text-align:center;

    padding-top:5%;

}

/*.contact-traffic-ways {margin-left:-5%;}*/

.contact-traffic .each-item {

    float:left;

    width:50%;

    min-height:352px;

    padding:8% 10% 0px 7%;

    box-sizing:border-box;

}

    .contact-traffic .each-item:last-child {

        background:#fff;

    }

.contact-traffic .each-item .dt-title {

    margin-bottom:20px;

    border-bottom:1px solid #e5e5e5;

}

.contact-traffic .each-item .dt-title .icon {

    display:block;

    width:48px;

    height:45px;

}

.contact-traffic .item-bus .dt-title .icon {background:url(/public/image/contact-icon2-1.png) no-repeat center center;}

.contact-traffic .item-train .dt-title .icon {background:url(/public/image/contact-icon2-2.png) no-repeat center center;}

.contact-traffic .item-car .dt-title .icon {background:url(/public/image/contact-icon2-3.png) no-repeat center center;}

@media(max-width:1365px){

    .contact-traffic .each-item .dt-title .icon {width:55px;height:51px;}

    .contact-traffic .item-bus .dt-title .icon {background:url(/public/image/contact-icon2-1a.png) no-repeat center center;background-size:100% 100%;}

    .contact-traffic .item-train .dt-title .icon {background:url(/public/image/contact-icon2-2a.png) no-repeat center center;background-size:100% 100%;}

    .contact-traffic .item-car .dt-title .icon {background:url(/public/image/contact-icon2-3a.png) no-repeat center center;background-size:100% 100%;}

}

.contact-traffic .each-item .dt-title .text {

    display:block;

    padding:30px 0;

    font-size:20px;

    color:#333;

    line-height:1;

}

/* .contact-traffic .each-item .dd-content {padding-right:60px;} */

.contact-traffic .each-item .dd-content span {

    display:block;

    font:14px/1.85 'gotham-medium','Microsoft Yahei';

    color:#666;

}

.pay-page {  padding:60px 0 100px;  }

.pay-page-inner .title {

    margin-bottom:23px;

    font-size:28px;

    font-weight:bold;

    color:#333;

    text-align:center;

}







@media (max-width:991px){

    

    .inner-main-container.contact-us {

        background:#f2f2f2;

    }

    .contact-infomation {

        padding: 3% 0 3.5%;

        position: relative;

        z-index: 3;

    }

    .contact-infomation .each-item {width:94%;padding:5% 3%;border-bottom:10px solid #f2f2f2;}

    .contact-infomation .each-item.qq-item {width:84%;border-bottom:0; box-sizing: border-box; padding: 5% 8%;}

    .contact-infomation .each-item .contact-qq{width:100%; margin-right:0; height:50px; line-height:50px;}

    .contact-traffic .each-item,

    .pay-list .each-item{width:100%;}

    .contact-traffic .title {

        padding-top:10%;

    }

    .contact-traffic .each-item {padding:8% 12%; min-height:initial;}

    .contact-traffic .each-item:last-child{background:none;}

    .pay-list .each-item {margin-bottom:5%;}

    .pay-list .item-inner {padding:10%;}

    .data-background {height:100%;}



}



