@import url("https://fonts.googleapis.com/css?family=Roboto:400,500,700");
html {
  overflow-x: hidden;
}

body {
  background: #fff;
  font-size: 14px;
  font-weight: 400;
  font-family: 'Microsoft YaHei', Helvetica, Tahoma;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-font-smoothing: subpixel-antialiased;
  color: #666;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  overflow-x: hidden;
}

h1, h2, h3, h4 {
  font-size: 38px;
  font-weight: 700;
  font-family: 'Microsoft YaHei', Helvetica, Tahoma;
}

a {
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

a:hover {
  text-decoration: none;
}

a a:focus {
  outline: none;
}

p {
  font-weight: 400;
  font-family: 'Microsoft YaHei', Helvetica, Tahoma;
  margin: 0px;
  font-size: 14px;
}

ul, ol {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}

ul li, ol li {
  list-style: none;
}
button, input, select, textarea {
  padding: 0;
  background: none;
  border: 0;
  font-size: inherit;
}
.clear {
  clear: both;
  width: 0;
  height: 0;
  overflow: hidden;
}
.fl{ float:left;}
.fr{ float:right;}
.mb20{margin-bottom: 20px !important;}
.mtb20{ margin-top:20px; margin-bottom:20px;}
.mtb10{ margin-top:10px; margin-bottom:10px;}
.text_indent{ text-indent:2em;}

/*------ 首页轮播 ------*/
.banner_main{ width:100%; margin-top:57px; position: relative;}
.banner_main .prev,.next{ display:block; width:32px; height:52px; position:absolute; z-index:222; top:248px; overflow:hidden; cursor:pointer; opacity:0.6; -moz-opacity:0.6;filter:alpha(opacity=60);}
.banner_main .prev{ left:125px;}
.banner_main .next{ right:125px;}
.banner_main .prev:hover,.banner_main .next:hover{ opacity:1; -moz-opacity:1; filter:alpha(opacity=100);}
.banner_main .item{ display:block; width:100%; height:6px; position:absolute; z-index:124; bottom:28px; left:0; text-align:center;}
.banner_main .item a{ display:inline-block; width:10px; height:10px; margin-right:11px; background:#ccc; opacity:0.6; -moz-opacity:0.6; filter:alpha(opacity=60); overflow:hidden; border-radius:50%;}
.banner_main .item a.cur{ background:#fff; width:20px; height:10px; border-radius:30px;}
.banner_main .banner_box,.banner_main .slide{ display:block; width:100%; height:100%; overflow:hidden;}
.banner_main .slide{ display:none; position:relative; z-index:8;}
.banner_main .slide a{ width:100%; cursor:pointer; background-color:#ddd; box-sizing:border-box; text-align:center;}
.banner_main .slide img{ width:100%; height:auto;}
.index_ad_con{ width:100%;}
.index_ad_con img{ width:100%;}


/*------ 功能区域 ------*/
.tit_type{ width:100%; height:84px; margin:26px 0;}
.tit_type .big_font{ font-size:28px; line-height:48px; color:#333; text-align:center; font-weight:bold; margin:0;}
.tit_type img{ width:6%; margin:0 47%;}
.tit_type p{ font-size:18px; color:#666; text-align:center; margin:10px 0;}
.function-main{ width:1280px; margin:0 auto; overflow:hidden;}
.citycard,.jinchengtong,.service_network{ width:100%; height:300px; margin-bottom:30px;}
.service_network{ height:256px; margin-bottom:0px;}

/*---  常见问题    ---*/
.more{ display:inline-block; padding:6px 12px; background:none; color:#0098ff; border:1px solid #0098ff; border-radius: 30px;}
.faq{ float:right; width:100%; background-color:#0098ff; padding:30px 15px;}
.faq h5{ font-size:20px; color:#fff; font-weight:normal; margin:0 0 20px;}
.faq h5 span{ font-size:16px; padding-left:10px;}
.faq .que{ font-size:14px; color:#fff;  padding-top:10px; padding-bottom:10px;}
.faq .que span{ display:inline-block; font-size:12px; background-color:#fff; color:#0098ff; padding:2px 6px; border-radius:50px; margin-right:8px;}
.faq .ans{ font-size:14px; color:#333;}
.faq .ans span{ display:inline-block; font-size:12px; background-color:#ffad70; color:#fff; padding:2px 6px; border-radius:50px; margin-right:8px;}
.faq a{ display:block; font-size:14px; color:#666; background-color:#fff; text-align:center; padding:8px; margin-top:28px;}
.faq a:hover{ background:#ffad70; color:#fff;}

.ans_style{ line-height:23px; display:-webkit-box; overflow:hidden; white-space:normal !important; text-overflow:ellipsis; word-wrap:break-word; -webkit-line-clamp:3; -webkit-box-orient:vertical;}

.news_question,.card_selling{ width:90%; margin:10px auto;}

.content-box {
  text-align: center;
  position: relative;
}
.content-box .panel-img-box {
        width: auto;
        overflow: hidden;
        display: inline-block;
        vertical-align: top;
		
}
.content-box .panel-img-box a {
    color: #fff;
    text-decoration: none;
    display: block;
    overflow: hidden;
    position: relative;
    height: 100%;
}
.content-box .panel-img-box img {
        width: 100%;
        height: 100%;		
}
.content-box .panel-img-box .text-box {
        padding: 25px 30px;
		 position:absolute;
		 width:783px;
		 text-align:left;
}
.content-box .category{ font-size:30px; color:#fff; font-weight:bold; line-height:32px; margin-bottom:16px;text-shadow: 3px 3px 3px #3c3c3c;}
.content-box .read-more span{ font-size:18px; color:#fff; line-height:22px;}


/** 城市卡 **/
.banner_other{ width:100%; height:196px; margin:0 auto; overflow:hidden; margin-top:16px; background:url(../img/citycard_bg.png) center no-repeat;}
.banner_pay{ background:url(../img/citypay_bg.png) center no-repeat;}
.banner_news{ background:url(../img/news_bg.png) center no-repeat;}
.banner_search{ background:url(../img/search_bg.png) center no-repeat;}
.banner_other .tit_text{ font-size:28px; color:#000; text-align:center; margin-top:78px; margin-bottom:10px; line-height:28px;}
.banner_other .text_explain{ font-size:16px; color:#000; line-height:16px; text-align:center;}
.banner_news .tit_text,.banner_news .text_explain{ color:#fff;}


.introduce-main{ width:100%; padding:20px 18px;}
.introduce_img img{ width:100%;}
.introduce_info{ width:100%; padding:20px 15px; background-color:#edf8ff; border-radius:6px;}
.introduce_info .text p{ line-height:30px; padding-top:10px;}
.introduce_info .text .circular_tag{ display:inline-block; width:10px; height:10px; border-radius:20px; background-color:#2ba9ff; margin-right:10px;}
.introduce_info .text h4{ font-size:18px;}
.introduce_info .links{ margin-top:26px; text-align:center;}
.introduce_info .links p a{ line-height:22px; padding:10px 16px; display:block; margin-bottom:16px; border-radius:30px; background-color:#007bff; color:#fff;}


.more_a { display:inline-block; width:200px; height:46px; line-height:46px; font-size:18px; color:#fff; background-color:#0098ff; border:8px solid #8ad0ff; border-radius:90px; box-sizing:initial;}
.more_a:hover{ color:#fff;}
.img_text{ width:100%; padding:15px; background-color:#edf8ff;}
.img_text h3{ font-size:22px; color:#333; margin-bottom:20px; text-align:left;}
.img_text p{ font-size:14px; line-height:26px; text-align: left;}
.banner_main_card{ background-color:#edf8ff; padding-bottom:20px;}
.btn_card{ text-align:center; margin-top:30px;}
.banner_main .item_card{ position:static; left:inherit; bottom:inherit;}
.banner_main .item_card a{ background:#8ad0ff;}
.banner_main .item_card a.cur{ background:#0098ff;}
.selling_con .text-box .text{ font-size:1.2em; color:#666; padding-bottom:23px;}
.recharge_con  img{ width:100%;}


.cooperate{ width:100%; margin-bottom:32px;}
.cooperate h3{ width:100%; height:72px; line-height:72px; font-size:24px; font-weight:normal; text-align:center; margin:0;}
.cooperate .tab{ width:100%; overflow:hidden;}
.tab-con{ width:100%; height:228px;}
.tab-con a{ font-size:14px; color:#fff;}
#TabTab03Con1{ background:url(../img/type-banner1.jpg) top no-repeat; background-size:100%; margin-top: -10px;}
#TabTab03Con2{ background:url(../img/type-banner2.jpg) top no-repeat; background-size:100%; margin-top: -10px;}
#TabTab03Con3{ background:url(../img/type-banner3.jpg) top no-repeat; background-size:100%; margin-top: -10px;}
#TabTab03Con4{ background:url(../img/type-banner4.jpg) top no-repeat; background-size:100%; margin-top: -10px;}
#TabTab03Con5{ background:url(../img/type-banner5.jpg) top no-repeat; background-size:100%; margin-top: -10px;}
#TabTab03Con6{ background:url(../img/type-banner6.jpg) top no-repeat; background-size:100%; margin-top: -10px;}
#TabTab03Con7{ background:url(../img/type-banner7.jpg) top no-repeat; background-size:100%; margin-top: -10px;}
#TabTab03Con8{ background:url(../img/type-banner8.jpg) top no-repeat; background-size:100%; margin-top: -10px;}

.type1,.type2,.type3,.type4,.type5,.type6,.type7,.type8{ float:left; width:100%; background-color:#edf8ff; margin:0 auto; padding:10px; margin-bottom: 10px;}
.type1 a,.type2 a,.type3 a,.type4 a,.type5 a,.type6 a,.type7 a,.type8 a{ width:46%; color:#fff; line-height:32px; padding:0 10px; margin:6px; border-radius: 20px; background-color:#0098ff;}
.tab1,.tab2,.tab3,.tab4,.tab5,.tab6,.tab7,.tab8{ display:inline-block; margin:0px 26px; font-size:16px; line-height:27px; float:left; text-align:center; cursor:pointer; color:#fff;}


.section-padding {
  padding: 20px 0;
}

.padding-none {
  padding: 0px;
}

.btn {
  font-size: 14px;
  padding: 6px 30px;
  cursor: pointer;
  font-weight: 400;
  color: #fff;
  border-radius: 30px;
  display: inline-block;
}

.btn:focus,
.btn:active {
  box-shadow: none;
  outline: none;
  color: #fff;
}

.btn-border {
  color: #fff;
  background-color: transparent;
  border: 1px solid #fff;
}

.btn-border:hover {
  border: 1px solid #fff;
  color: #fff;
  background-color: rgba(255, 255, 255, 0.2);
}

button:focus {
  outline: none !important;
}

#cta {
  background: url(../img/bg-2.jpg) left;
  overflow: hidden;
  position: relative;
}

#cta:before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
}

#cta .cta-info {
  padding: 60px;
}

#cta .cta-info h3 {
  color: #fff;
  font-size: 30px;
  margin-bottom: 30px;
  line-height: 40px;
}

.bg-color {
  background: #f7f7f7;
}

.navbar-brand {
  position: relative;
  padding: 0px;
}

.indigo {
  background: #0098ff;
}

.navbar-expand-lg .navbar-nav .nav-link i {
  font-size: 14px;
  margin-left: 5px;
  vertical-align: middle;
}

.navbar-expand-lg .navbar-nav .nav-link {
  color: #fff;
  font-weight: 700;
  padding: 8px 17px;
  margin-top: 15px;
  margin-bottom: 15px;
  line-height: 40px;
  text-transform: uppercase;
  cursor: pointer;
  background: transparent;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.navbar-expand-lg .navbar-nav li a:hover,
.navbar-expand-lg .navbar-nav li .active > a,
.navbar-expand-lg .navbar-nav li a:focus {
  color: #ffad70;
  outline: none;
}

.navbar {
  padding: 0;
}

.navbar li.active a.nav-link {
  color: #ffad70;
}

.dropdown-toggle::after {
  display: none;
}

.dropdown-menu {
  margin: 0;
  padding: 0;
  display: none;
  position: absolute;
  z-index: 99;
  min-width: 210px;
  background-color: #fff;
  white-space: nowrap;
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  animation: fadeIn 0.4s;
  -webkit-animation: fadeIn 0.4s;
  -moz-animation: fadeIn 0.4s;
  -o-animation: fadeIn 0.4s;
  -ms-animation: fadeIn 0.4s;
}

.dropdown-menu:before {
  content: "";
  display: inline-block;
  position: absolute;
  bottom: 100%;
  left: 20%;
  margin-left: -5px;
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
  border-bottom: 10px solid #fff;
}

.dropdown:hover .dropdown-menu {
  display: block;
  position: absolute;
  text-align: left;
  top: 100%;
  border: none;
  animation: fadeIn 0.4s;
  -webkit-animation: fadeIn 0.4s;
  -moz-animation: fadeIn 0.4s;
  -o-animation: fadeIn 0.4s;
  -ms-animation: fadeIn 0.4s;
}

.dropdown .dropdown-menu .dropdown-item {
  width: 100%;
  padding: 12px 20px;
  font-size: 14px;
  color: #333;
  border-bottom: 1px solid #f1f1f1;
  text-decoration: none;
  display: inline-block;
  float: left;
  clear: both;
  position: relative;
  outline: 0;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}

.dropdown .dropdown-menu .dropdown-item:last-child {
  border-bottom: none;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.dropdown .dropdown-menu .dropdown-item:first-child {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.dropdown .dropdown-item:focus,
.dropdown .dropdown-item:hover,
.dropdown .dropdown-item.active {
  color: #ED5437;
  background: #f7f7f7;
}

.dropdown-item.active, .dropdown-item:active {
  background: transparent;
}

.fadeInUpMenu {
  -webkit-animation-name: fadeInUpMenu;
  animation-name: fadeInUpMenu;
}

.slicknav_btn {
  border-color: #ffad70;
}

.slicknav_menu .slicknav_icon-bar {
  background: #ffad70;
}

/* only small tablets */
@media (min-width: 768px) and (max-width: 991px) {
  #nav-main li a.nav-link {
    padding-top: 18px;
  }
}

.navbar-toggler {
  display: none;
}

.mobile-menu {
  display: none;
}

.slicknav_menu {
  display: none;
}

@media screen and (max-width: 991px) {
  .navbar-header {
    width: 100%;
  }
  .navbar-brand {
    position: absolute;
    padding: 15px 15px;
    top: 0;
  }
  .navbar-brand img {
    width: 75%;
  }
  .slicknav_menu {
    display: block;
  }
  .slicknav_nav a:hover,
  .slicknav_nav a:focus,
  .slicknav_nav .active {
    color: #ED5437;
    outline: none;
    background: #f8f9fa;
  }
}

@media screen and (max-width: 768px) {
  .navbar-header {
    width: 100%;
  }
  .navbar-brand {
    position: absolute;
    padding: 7px 15px;
    top: 0;
  }
  .navbar-brand img {
    width: 75%;
  }
  #mobile-menu {
    display: none;
  }
  .slicknav_menu {
    display: block;
  }
  .slicknav_nav .active a {
    background: #E91E63;
    color: #fff;
  }
  .slicknav_nav a:hover,
  .slicknav_nav a:focus,
  .slicknav_nav .active {
    color: #0098ff;
    outline: none;
    background: #f8f9fa;
  }
}

.team-item {
  padding: 16px;
  background: #f7f7f7;
  border: 1px solid rgba(0, 0, 0, 0.06);
}

.team-item .img-thumb {
  overflow: hidden;
  position: relative;
  margin-bottom: 15px;
}

.team-item .img-thumb img {
  
  display: inline-block;
  width: inherit;
}

.team-item .content {
  overflow: hidden;
}

.team-item .content h2 {
  font-size: 18px;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 30px;
  margin: 0;
}

.team-item .content h2 a {
  color: #484848;
  display: inline-block;
  text-align: left;
}

.team-item .content .description {
  width: 100%;
  text-align:left;
  padding-top:16px;
}

.text-danger {
  font-size: 14px;
  margin-top: 10px;
}

.list-unstyled li {
  color: #d9534f;
}


/* Footer Area Start */
.footer-area { background: #f1f1f1; margin-top:20px;}
.footer-area ul li { margin-bottom: 10px;}
.footer-area ul li a { color: #333; font-size: 14px; font-weight: 400;}
.footer-area ul li a:hover {color: #333;}
.footer-area .links .row{ margin:0 auto; text-align:center;}
.footer-area .links li{ float:left; padding:0px 12px;}
.footer-area .links_con { width:90%; margin:0 auto; margin-top:10px;}
.footer-area .links_con a{ display:inline-block; margin-right:20px; font-size:14px; color:#333; line-height:28px;}
.footer-area .blogrol{ font-size:24px; color:#333; margin-top:0px; margin-bottom: 10px; padding-bottom:6px; border-bottom:1px solid #d3d3d3;}
.footer-area .blogrol span{ font-size:18px; color:#666; padding-left:10px;}
.footer-area .self_logo{ width:90%; margin:30px auto;}

#copyright { background: #f1f1f1;}
#copyright p { line-height: 26px; color: #666; text-align: center;margin: 0;}
#copyright p a { color: #666;}
#copyright p a:hover { color: #666;}

.mt0{ margin-top:0px;}
.mt20{ margin-top:20px;}
.mt80{ margin-top:80px;}