@charset "utf-8";
.city_title { width:100%; height:50px; background:#42b8f1; color:#fff; position:relative; z-index:30;}
.city_title h5 { height:100%; padding:0 15px; background:#333; font-weight:bold; line-height:48px; font-size:18px; position:absolute; top:0; left:0;}
.city_title .more { height:22px; line-height:22px; color:#fff; position:absolute; top:50%; right:15px; margin-top:-11px;}
.city_title .more:hover { border-bottom:#fff 1px solid;}

.city_part01 { width:1200px; padding:50px 0; position:relative;}
.city_part01:before { width:1920px; height:100%; content:""; background:#42b8f1 url(../images/city/bg_city01.jpg) no-repeat center bottom; position:absolute; top:0; left:50%; margin-left:-960px; z-index:10;}
.city_part01 .city_title { height:auto; padding-top:40px; margin-bottom:10px; background:none;}
.city_part01 .city_title h2 { width:100%; line-height:30px; text-align:center; font-size:30px; position:absolute; top:-2px; left:0;}
.city_part01 .city_title p { text-align:center; font-size:14px; text-transform:uppercase;}
.city_part01 .list { width:105%; position:relative; z-index:30;}
.city_part01 .list li { width:150px; height:40px; margin:20px 25px 0 0; line-height:38px; font-size:16px;}
.city_part01 .list li a { width:100%; height:100%; background:#333; border-radius:20px; text-align:center; color:#fff; display:block;}
.city_part01 .list li a:hover { background:#f7ab00;}
.city_part01 .list li a.active { background:#f7ab00;}

.city_part02 { width:100%; position:relative;}
.city_part02_left { width:820px; margin-top:-30px;}
.city_part02_left .list { width:100%; margin-top:30px;}
.city_part02_left .list .imglist { width:100%; background:#eceeef;}
.city_part02_left .list .imglist li { width:100%; height:170px; position:relative;}
.city_part02_left .list .imglist li p { width:calc(100% - 275px); overflow:hidden; position:absolute; left:260px; z-index:20;}
.city_part02_left .list .imglist li .img { width:230px; height:140px; border:#eee 1px solid; top:15px; left:15px;}
.city_part02_left .list .imglist li .img img { transition:all 0.5s;}
.city_part02_left .list .imglist li .name { height:18px; line-height:18px; font-size:18px; color:#3e3a39; top:18px;}
.city_part02_left .list .imglist li .date { line-height:12px; font-size:12px; color:#898989; top:50px;}
.city_part02_left .list .imglist li .date span { float:left; height:12px; margin-left:21px; position:relative;}
.city_part02_left .list .imglist li .date span:before { width:1px; height:100%; content:""; background:#898989; position:absolute; top:1px; left:-11px;}
.city_part02_left .list .imglist li .date span:first-child { margin:0;}
.city_part02_left .list .imglist li .date span:first-child:before { display:none;}
.city_part02_left .list .imglist li .info { height:48px; line-height:24px; top:75px;}
.city_part02_left .list .imglist li .tags { height:12px; line-height:12px; font-size:12px; bottom:18px;}
.city_part02_left .list .imglist li .tags i,.city_part02_left .list .imglist li .tags a { float:left; margin-left:10px; color:#42b8f1;}
.city_part02_left .list .imglist li .tags i { margin:0 -5px 0 0;}
.city_part02_left .list .imglist li .tags a:hover { color:#c7000b;}
.city_part02_left .list .imglist li:hover .img img { transform:scale(1.06);}
.city_part02_left .list .imglist li:hover .name a { color:#42b8f1;}
.city_part02_left .list .txtlist { width:100%; border-top:#b5b5b5 1px dotted;}
.city_part02_left .list .txtlist li { width:100%; height:46px; border-bottom:#b5b5b5 1px dotted; text-indent:28px; line-height:46px; font-size:16px;}
.city_part02_left .list .txtlist li span { float:right; margin:0 15px 0 5px; font-size:12px; color:#898989;}
.city_part02_left .list .txtlist li a { width:100%; height:100%; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; position:relative;}
.city_part02_left .list .txtlist li a:before { width:5px; height:5px; content:""; background:#595757; position:absolute; top:50%; left:15px; margin-top:-2px; transform:rotate(45deg);}
.city_part02_left .list .txtlist li:hover a:before { background:#42b8f1;}
.city_part02_left .list .txtlist li:hover span { color:#42b8f1;}

.city_part02_right { width:350px; margin-top:-30px;}
.city_part02_right .list { width:100%; margin-top:30px; background:#eceeef;}
.city_part02_right .list .imglist { width:100%; background:#eceeef;}
.city_part02_right .list .imglist li { width:100%; position:relative;}
.city_part02_right .list .imglist li p { float:left; width:calc(100% - 30px); margin-left:15px; overflow:hidden; position:relative;}
.city_part02_right .list .imglist li .img { height:195px; margin-top:15px;}
.city_part02_right .list .imglist li .img img { width:100%; min-height:100%; transition:all 1s;}
.city_part02_right .list .imglist li .name { height:18px; line-height:18px; font-size:18px; color:#3e3a39; text-overflow:ellipsis; white-space:nowrap; margin-top:16px;}
.city_part02_right .list .imglist li .date { line-height:12px; font-size:12px; color:#898989; margin-top:15px;}
.city_part02_right .list .imglist li .date span { float:left; height:12px; margin-left:21px; position:relative;}
.city_part02_right .list .imglist li .date span:before { width:1px; height:100%; content:""; background:#898989; position:absolute; top:1px; left:-11px;}
.city_part02_right .list .imglist li .date span:first-child { margin:0;}
.city_part02_right .list .imglist li .date span:first-child:before { display:none;}
.city_part02_right .list .imglist li .info { height:48px; line-height:24px; margin:10px 15px; white-space:normal; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;}
.city_part02_right .list .imglist li .tags { height:12px; line-height:12px; font-size:12px; margin-bottom:15px;}
.city_part02_right .list .imglist li .tags i,.city_part02_right .list .imglist li .tags a { float:left; margin-left:10px; color:#42b8f1;}
.city_part02_right .list .imglist li .tags i { margin:0 -5px 0 0;}
.city_part02_right .list .imglist li .tags a:hover { color:#c7000b;}
.city_part02_right .list .imglist li:hover .img img { transform:scale(1.065);}
.city_part02_right .list .imglist li:hover .name a { color:#42b8f1;}
.city_part02_right .list .txtlist { width:100%; border-top:#b5b5b5 1px dotted;}
.city_part02_right .list .txtlist li { width:calc(100% - 15px); height:46px; padding-right:15px; border-bottom:#b5b5b5 1px dotted; text-indent:28px; line-height:46px; font-size:16px;}
.city_part02_right .list .txtlist li a { width:100%; height:100%; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; position:relative;}
.city_part02_right .list .txtlist li a:before { width:5px; height:5px; content:""; background:#595757; position:absolute; top:50%; left:15px; margin-top:-2px; transform:rotate(45deg);}
.city_part02_right .list .txtlist li:hover a:before { background:#42b8f1;}

.city_part03 { width:100%; margin-top:30px; position:relative;}
.city_part03 .list { width:105%;}
.city_part03 .list li { width:390px; height:295px; margin:15px 15px 0 0; position:relative;}
.city_part03 .list li a { width:100%; height:100%; display:block;}
.city_part03 .list li p { width:100%; overflow:hidden; position:absolute; left:0;}
.city_part03 .list li .img { width:100%; height:245px; top:0; left:0;}
.city_part03 .list li .img img { transition:all 0.8s;}
.city_part03 .list li .name { width:calc(100% - 75px); height:50px; padding-right:75px; background:#eceeef; line-height:50px; text-indent:15px; font-size:16px; bottom:0;}
.city_part03 .list li .name:before,.city_part03 .list li .name:after { width:28px; height:20px; content:""; background:url(../images/base.png) no-repeat 100px 0; position:absolute; top:0; right:0; bottom:0; left:0; margin:auto;}
.city_part03 .list li .name:before { background-position:-260px 0; margin-right:30px;}
.city_part03 .list li .name:after { background-position:-288px 0; margin-right:2px;}
.city_part03 .list li:hover .img img { transform:scale(1.08);}
.city_part03 .list li:hover .name { background:#42b8f1; color:#fff;}
.city_part03 .list li:hover .name:before { background-position:-260px -20px;}
.city_part03 .list li:hover .name:after { background-position:-288px -20px;}