/*!
 * common css in 2018
 * xm and cj modify */

/*------common------*/






/*---------modal-city--------*/

 
.modal-city .modal-content {color:#fff;background-color:#0D3785;}
.modal-city .modal-body { color:#fff;}
.modal-city .modal-content .modal-header {text-align:center; border-bottom:0;color:#fff;}
.modal-city .modal-content .close {color:#fff; opacity:0.9; } 
.modal-city .modal-content { box-shadow:none; background:none; }
.modal-city .btn { display:block; font-size:16px; background-color: #349deb;  border: 0px solid #fff;color:#fff;padding-top:10px;padding-bottom:10px; }
.modal-city .btn:hover,.modal-city .btn:focus {background-color: #349deb; }
.modal-city p {width:210px;margin:0 auto;margin-bottom:10px;}

@media (min-width: 360px) {
.modal-city {margin-top:50px}	
}

@media (min-width: 375px) {
.modal-city {margin-top:70px}	
}
@media (min-width: 414px) {
.modal-city {margin-top:90px}	
}


/*--------city menu--------*/
 .header .nav>li.open >a{border-bottom:2px solid #fff;}
.navbar-nav > li > .city-menu { top: 100%;padding:0; width: 700px;border:0;border-radius:20px 0 20px 0; overflow:hidden; left: -350px;background:#349deb; 
-webkit-box-shadow: 0 0px 12px rgba(0,0,0,.175);
    box-shadow: 0 0px 12px rgba(0,0,0,.175);}
.city-menu li { float:left; width:16.66%;padding:0;margin:0;  }
.city-menu li a { text-align:center;padding:20px 0; border-right:0px solid #2C86C8; color:#fff;}
.city-menu li a span.img {}
.city-menu li a strong { display:block; font-size:22px; font-weight:normal;}
.city-menu li a:hover,.city-menu li a:focus { background-color:#2C86C8;color:#fff;}
.city-menu > .active > a { background-color:#2C86C8!important;}
@media (min-width: 992px) {
.navbar-nav > li > .city-menu { width: 800px;left: -400px;}	
}



/*-------city------*/

.mod-city { overflow:hidden;}
.mod-city:before {content:""; position:absolute;background-color:#d39ffd; width:18px;height:45px; bottom:20px;left:58px;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);}
.mod-city:after { content:""; position:absolute;background-color:#7884da; width:12px;height:70px; bottom:-20px;left:50px;
-webkit-transform:rotate(45deg);
transform:rotate(45deg)}

@media (max-width: 992px){
	.mod-city:before {content:""; position:absolute;background-color:#d39ffd; width:0px;height:0px; bottom:0px;left:08px;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);}
.mod-city:after { content:""; position:absolute;background-color:#7884da; width:0px;height:0px; bottom:0px;left:0px;
-webkit-transform:rotate(45deg);
transform:rotate(45deg)}
	
}

.city-info-menu { padding-top:10px;padding-bottom:20px; overflow:auto;}
.city-info-menu li {width:50%; float:left; text-align:center;}
.city-info-menu li a { display:block;margin:3px;  border: 1px solid #7984da24;line-height:1.42;padding:5px 0; color:#fff; font-size:15px;}
.city-info-menu li a span { display:block; text-align:center; opacity: 0.5; font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;}
.city-info-menu li.active {    }
.city-info-menu li.active a {border: 1px solid #9f8fe8; background-image:url(../images/tab_bg.jpg); background-position:left top; background-repeat:repeat-y;
background-size:100%;}
.city-tab-content { }
.city-content {position: relative; }
.city-content .city-img { position: relative;     z-index: 1;width: 100%; height:150px;overflow: hidden;bottom: -55px;  margin-top: -55px;
background-position:right bottom; background-repeat: no-repeat; background-size:150px;}
.city-content .city-img strong { position: absolute; bottom:55px; right:0; width: 100%;  color: #fff; font-size: 28px;text-align:left; font-weight:100; padding-left:10px;}
.city-content .city-a { background-image: url(../images/city03.png);}
.city-content .city-b {  background-image: url(../images/xq.png);}
.city-content .city-c {  background-image: url(../images/city02.png);}
.city-content .city-d { background-image: url(../images/city04.png);}
.city-content .city-e { background-image: url(../images/city07.png);}
.city-content .city-f {background-image: url(../images/city05.png);}
.city-content .city-g { background-image: url(../images/city06.png);}

.city-content .kuai {  margin-top:20px;width:30px;height:30px; background:#9f8fe8; display:none; }
.city-content .city-info {padding-bottom:10px;padding-left:5px;padding-right:5px; }
.city-content .city-desc {font-size:14px; line-height:1.8;padding-top:45px; position:relative;color: #e0e0e0; display:none; }
.city-content .city-desc:before { position:absolute;left:0;top:0;width:30px;height:30px; background:#9f8fe8; content:""; }
.city-content .city-info h3 { font-size:22px; color:#fff; display:block; line-height:1.2; padding:4px 5px;margin-top:0;margin-bottom:0;
 border-bottom:2px solid #a190e9; border-image:linear-gradient(to left,#7884da,#d49ffc) 2;
 border-left:0!important;border-right:0!important;border-top:0!important;}
.city-content .city-info p {font-size:14px;line-height:1.8;padding-top:25px;}
.city-content .city-info p a.border-btn{margin-right:0px;}
@media (min-width: 992px){.city-content .city-info p a.border-btn{margin-right:15px;}}
.city-content .text-center {padding-top:30px;padding-bottom:50px;}

.city-content .city-info p a.border-btn:hover {
    border: 1px solid #9f8fe8; background-image:url(../images/tab_bg.jpg); background-position:left top; background-repeat:repeat-y;
background-size:100%;
}



@media(min-width:768px) {
.city-info-menu li { width:16.66%; }
.city-info-menu li a {padding:10px 0;font-size:17px;}
.city-info-menu li a span {font-size:20px;}
.city-content .city-img {height:320px;background-position: center; background-size:320px;bottom:0;margin-bottom:0;margin-top:20px;}
.city-content .city-img strong {font-size: 42px;text-align:center;padding-left:0; }
.city-content .city-info {padding-left:0;padding-right:0;}
.city-content .city-info h3 { font-size:32px;padding-top:30px;}
.city-content .city-info p {font-size:16px;  }

.mod-city:before {width:40px;height:125px; bottom:-40px;left:145px; }
.mod-city:after { width:12px;height:70px; bottom:-20px;left:115px; }
}

@media(min-width:992px) {

.city-info-menu li a {margin:10px;padding:15px 0;}
.city-info-menu li a span {font-size:24px;}
.city-tab-content {padding-top:0;}
.city-content {padding-left:15px;padding-right:15px;}
.city-content .city-info h3 {text-align:right; }
}
.city-content .city-info h3 {padding-top:20px}
@media(min-width:1200px) {
.city-content .city-info h3 {padding-top:30px}
.city-info-menu li { float:none; width:100%;}
.city-info-menu li a { padding:10px 0; position:relative;padding-right:10px;}
.city-info-menu li a:hover { padding:10px 0; position:relative;padding-right:10px;border: 1px solid #9f8fe8; background-image:url(../images/tab_bg.jpg); background-position:left top; background-repeat:repeat-y;
background-size:100%;}
.city-info-menu li a span {font-size:20px; line-height:1; display:inline-block;padding-right:10px; opacity:1; }
.city-content .city-img {margin-bottom:0; margin-top:30px;}
.city-content .city-desc { display:block}
.city-content .city-img strong {bottom:10px;}

}
@media(min-width:1400px) {

.city-content .city-img {height:370px;background-size:200px;margin-top:0; }
.city-content .city-img strong {font-size: 46px;}
}


a.border-btn {
    border: 2
px
 solid #fff;
    vertical-align: middle;
    line-height: 32px;
    width: auto;
    border-image: linear-gradient(to left,#176eff,#00f3ff) 2;
    padding-left: 20
px
;
    padding-right: 20
px
;
    color: #fff;
    display: inline-block;
    box-sizing: border-box;
    position: relative;
}