body{ background-color: transparent;   }
.banner-nav{margin-bottom: 15px;}
.banner-nav ul li{display: inline;font-weight: bold; font-size: 18px; padding:0 30px 10px 10px;}
.banner-nav ul li a{ color:#174e8d; }
.banner-nav2 a{display: inline-block; color: #fe602e;font-size: 16px; 
                padding: 0 5px 10px; float: right; font-weight: bold; background: white;}

#lm1{background: white; font-size: 16px;}
#lm1 div{padding: 20px 0 15px 10px; border-bottom: 1px dashed #aceaff; }
#lm1 div h3{padding-left: 10px; margin-bottom: 10px;}
#lm1 div p{padding: 0 10px; line-height: 30px;}
#lm1 .list6{padding: 18px 0 22px 10px;}


.div_scroll {
    width: 97%;

    overflow: auto;
    height: 444px;
}
.scroll_container {
    overflow: hidden;
    position: relative;

}

.scroll_absolute {
    position: absolute;
}

.scroll_vertical_bar {
    position: absolute;
    top: 0;
    right: 10px;
    width: 10px;
    height: 100%;
    background: transparent;
    margin: 0;
    padding: 0;
    border-radius:10px;
}

.scroll_track {
    position: relative;

    border-radius:10px;
    background: url(img/scroll_bk.png) no-repeat top center  ;
    background-color: #f1f1f1;
}

.scroll_drag {
    position: relative;
    top: 0;
    left: 0;
    cursor: pointer;
    background-color: #c0ccdd;
    border-radius:10px;

}

.scroll_arrow {
    text-indent: -20000px;
    display: block;
    cursor: pointer;
    background-color: #369DB4;
    border-radius:10px;
}

.scroll_vertical_bar .scroll_arrow {
    height: 16px;
}
.banner .list7 li p{ text-indent:2em; font-size: 16px; color: #472b0d; line-height: 40px; font-family: "Microsoft yahei";}



.ul li{ float: left; width: 140px; height: 247px; background:#fff; margin-right: 12px; text-align: center}
.ul li:hover{ box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.20)}
.ul li img{ padding-top: 32px;  }
.ul li h3{   height: 52px;  text-align: center;font-size: 14px; margin: 0; line-height: 52px;}
.ul li p{ font-size: 12px; color: #4a4a4a; text-align: left;width: 113px; margin:  0 auto;}



/* Large desktop */
@media (min-width: 1200px) {
    .container {width: 1200px;  }
    .wrap{margin-top: -450px;}
    .row{margin-left: 0;}

    #banner-img .span4 img{ border: 5px solid white; }
    #banner-img .span4{margin-left: 10px; width: 390px; }

    .banner-yufang{ height: 600px; background: url('img/slide02_bg.jpg') no-repeat left center; 
             margin-top: 280px; width: 100%;margin-left: 0; position: relative;
            }
    .banner-yufang>div{ width: 47%; }
    .banner-yufang .part1{ padding-left:30px ; float: left; margin-right: 40px;margin-top: 70px; 
                            }
    
    .banner-yufang .part1 h3 { padding-left: 60px; background: url('img/icon01.png') no-repeat left center; margin-bottom: 10px;}
    .banner-yufang .part1 h3 a{ font-weight: bold;}
    .banner-yufang .part1 p{font-size: 16px; margin-bottom: 20px; line-height: 30px;}
    .banner-yufang .part2{ float: right; height: auto; margin-top: 70px;  float: right;
                            /*border-left: 1px dashed #dcdcdc;*/}
    .banner-yufang .part2 li{margin-bottom: 30px;}
    .banner-yufang .part2 li a{font-size: 16px; display: inline-block; padding-left: 25px;width: 44%;}
    .banner-yufang .part2 li a:first-child {  line-height: 30px; vertical-align: middle; background: url('img/icon02.jpg')no-repeat 0 8px;}
    .banner-yufang .part2 li a:last-child{padding-left: 10px;}
    .line{border-right: 1px dashed #dcdcdc; height: 455px; display: inline-block; float: left; position: relative; left: 6px;}
    .banner-yufang .part2 li a:first-child:hover{ background: url('img/icon03.jpg') no-repeat left 8px; }

    .slide01 .container{  background: url(img/bg05.png) no-repeat; margin-top: -120px;}
    .slide01 h3{ display: inline-block; padding-left: 10px; float: left; width: 86%; margin-top: 5px;}
    .slide01 h3 a{ font-weight: bold;}
    .slide01  i { background: url('img/icon04.jpg') no-repeat left center; display: inline-block; width: 39px; height: 50px; float: left;}
    .slide01 .list6 { clear: both; }
    .slide01 .list6 .on a{ font-weight: bold; color: #187fdb; }
    .slide01 .list6 .marginTop{ margin-top: 20px; }
    .slide01 .leftPart .list8 { margin-top: 20px;  margin-left: 0; }
    .slide01 .row{ margin-top: 60px; background: white;  }
    .slide01 .span4:last-child{ background: url('img/bg02.jpg') no-repeat left center;
        margin-top: 0; color: white; height: 625px;
         }
    .slide01 .span4:last-child a{ color: white; font-size: 22px;}
    .slide01 .span4:last-child > div{ padding-top: 38px; padding-left: 20px; padding-right: 14px; padding-bottom: 20px;}
    .slide01 .span4:last-child div p{ padding-top: 20px; font-size: 15px; line-height: 30px;}
    .slide01 .span4:last-child > div div:first-child p{ border-bottom: 1px dashed; padding-bottom: 30px; }
    .slide01 .span4:last-child hr{ margin: 20px auto; width: 90%; border-bottom: 1px dashed white; border-top: none; }
    .slide01 .span4:last-child > div div:last-child{ padding-top: 30px; }
    
    .slide02{ margin-top: 20px; }
    .slide02 .container{ background: url('img/bg04.jpg') no-repeat; }
    .slide02 .container .span4:first-child{ overflow: hidden; width: 354px; position: relative;}
    .slide02 .row > div{ padding-top: 60px; }
    .slide02 .list8 {  width: 354px;margin-left: 0 ; overflow: hidden; position: relative;}
    .slide02 .list8 li{ float: left; }
    .slide02 .span4 span{ position: absolute;  display: inline-block; width: 35px; height: 72px; top:40%; cursor:pointer;}
    .slide02 .left{ background: url(img/left-right.png) no-repeat 0 -72px; left: 0;}
    .slide02 .right{ background: url(img/left-right.png) no-repeat 0 0; right: 0; }
    .slide02 .span8 h3 a{ font-weight: bold; padding-left: 50px; 
        }
    .slide02 .span8 h3{ background:url('img/icon05.jpg') no-repeat left center;   }
    .slide02 .span8 > div a{ display: block; width: 100%;line-height: 30px; font-size: 16px;}
    .slide02 .span8 > div{ display: inline-block; margin-right: 25px;width: 46%; float: left; height: 380px; position: relative;
    }
    .slide02 .span8 > div a:nth-child(2){ margin-top: 20px; }
    .slide02 .span8 .more a{line-height: 23px; color: white;}
    .slide02 .span8 .more {width: 62px; height: 23px; display: inline-block; 
        text-align: center;background: #9196a0;border-radius: 5px; position: absolute; right: 0; bottom: 0; }
    
    
   
    .slide03{ width: 100%; overflow: hidden;margin-top: 30px;}
    .slide03 .container{ width: 100%; }    
    .slide03 .container .span12{float: left;margin-left: 15px;padding-top: 60px;background: url(img/bg06.png) no-repeat left top;}
    .slide03 .aleft, .slide03 .aright{position: relative;margin-top: 70px; ;width: 12%; height: 845px; background: #ff9409; opacity: .85;}
    .slide03 .aleft{ float: left; z-index: 111}
    .slide03 .aright { float: right; }
    .slide03 .aleft-icon, .slide03 .aright-icon{ width: 54px; height: 143px; display: inline-block;
         position: absolute;  top: 50%; cursor:pointer; ;
        transform:translate(0, -50%);
        -ms-transform:translate(0, -50%);     
        -moz-transform:translate(0, -50%);    
        -webkit-transform:translate(0, -50%); 
        -o-transform:translate(0, -50%);}
    .slide03 .aleft-icon { background: url(img/aright.png) no-repeat -54px 0; right: 12%; }
    .slide03 .aright-icon { background: url(img/aright.png) no-repeat 0 0; left: 12%;}
    .slide03 .list25 li{ display: inline-block; }
    .slide03 .list25 li:nth-child(1){ width: 420px; }
    .slide03 .list25 li:nth-child(2){ width: 745px; }
    .slide03 .list25{ height: 848px; /*width: 3000px;*/ }
    .slide03 .container .box{ width: 3558px; position: relative; }
    .slide03 .container .box > li{ width: 1170px; float: left;margin-right: 16px; }





    .slide04{ background: url(img/bg07.png)no-repeat center bottom; }
    .slide04{margin-top: 30px; padding-bottom: 30px;}
    .slide04 .container .span12{padding-top: 60px;margin-left: 15px; background: url(img/bg10.png) no-repeat left 0; /*position: relative;*/}

    .slide04  .span12 ul{ overflow: hidden; }
    .slide04  .span12 li{ width: 50%; float: left; position: relative;}
    
    .slide04  .span12 li:nth-child(n):before{
        content: "";
        width: 22px; height: 22px; display: inline-block; background: #f5f5f5; 
        position: absolute; left: 48.21%; top: 45%;


        transform:rotate(45deg);
        -ms-transform:rotate(45deg);     
        -moz-transform:rotate(45deg);    
        -webkit-transform:rotate(45deg); 
        -o-transform:rotate(45deg);
        
    }

    .slide04 .container .span12 li span { display: table;width: 232px; height: 164px;float: left; 
            line-height: 30px; font-size: 18px; padding: 0 30px; background: #f5f5f5;}
    .slide04 .container .span12 li span a{display: table-cell; vertical-align: middle;}
    .slide04 .container .span12 li img{float: left;}
    .slide04 .container .icon{ float: right;margin-top: 30px; margin-right: 15px;}
    .slide04 .container .icon li{ display: inline-block; width: 13px; height: 13px; border-radius: 50%; background: white; 
       margin-left: 10px; cursor:pointer; ;}
    .slide04 .container .icon .active{ background: #fabf13; width: 40px; border-radius: 10px; }
    .slide04 .hide{ display: none; }
    .slide04 .row2 { margin-top: 30px; }
    .slide04 .row2 .span4:first-child{ background: url('img/bg08.png') no-repeat; }
    .slide04 .row2 .span4:first-child img{ padding-top: 60px; }
    .slide04 .row2 .list6{ padding-top: 50px; }
    .slide04 .row2 .list6 li{ color: white; }
    .slide04 .row2 .list6 li a{ color: white; font-size: 17px;}
    .slide04 .row2 .span4:last-child { background: url(img/bg09.png) no-repeat; }
    .slide04 .weather-icon{ padding-top: 50px; }
    .slide04 .weather-icon li{ 
        width: 62px; height: 62px; display: inline-block; cursor:pointer ; margin-right: 36px; }
    .slide04 .weather-icon li:first-child{ background: url(img/weather.png) no-repeat 0 0; }
    .slide04 .weather-icon li:nth-child(2){ background: url(img/weather.png) no-repeat 0 -62px; }
    .slide04 .weather-icon li:nth-child(3){ background: url(img/weather.png) no-repeat 0 -124px; }
    .slide04 .weather-icon li:last-child{ background: url(img/weather.png) no-repeat 0 -186px; margin-right: 0;}

    .slide04 .weather-icon li:first-child:hover{ background: url(img/weather.png) no-repeat -62px 0; }
    .slide04 .weather-icon li:nth-child(2):hover{ background: url(img/weather.png) no-repeat -62px -62px; }
    .slide04 .weather-icon li:nth-child(3):hover{ background: url(img/weather.png) no-repeat -62px -124px; }
    .slide04 .weather-icon li:last-child:hover{ background: url(img/weather.png) no-repeat -62px -186px; }
    
    .slide04 .weather-img { padding-top: 10px; }
    .slide04 .weather-img li{ padding-top: 5px; }
    .slide04 .weather-img img{ border: 3px solid white; }
    .slide04 .weather-icon a{ display: inline-block; width: 62px; height: 62px; }


    
    .footer{ margin-top: 0; border-top: none; background: #113bce; color: white; font-size: 16px; line-height: 45px;}
    .footer a{ color: white; }



    .banner{ width: 100%; min-width: 1200px; height:2200px;background: url('img/banner01.png') no-repeat center top; min-height:2200px;   }
    .banner .container{width: 1200px; padding-top: 400px; padding-left: 0; padding-right: 0;}
    .banner .container .span8{ width: 763px; margin-left: 0; padding-left: 15px; padding-right: 15px;}
    .banner .container .span4{ width: 367px; margin-left: 20px;}
    .banner .list7{ width: 328px; margin: 0 auto;}

    
    #pic{ position: relative; margin-top:-340px; z-index: -1;  width: 100%; height: 340px; background-attachment: fixed; background-position: center 0;  background-repeat: no-repeat; background-image: url('img/bg03.jpg'); }
    .list8{ width: auto;}
    
    
    

    
}
/* desktop */
@media (min-width: 979px) and (max-width: 1199px) {
    .container,#localNav,#channelNav,.footer{ width:1200px;}
    .lm4 ul li {line-height: 20px; }
    .span12 {width: 1170px; }
    .span11 {width: 1070px; }
    .span10 {width: 970px;  }
    .span9 { width: 870px; }
    .span8 { width: 770px; }
    .span7 { width: 670px; }
    .span6 { width: 570px; }
    .span5 { width: 470px; }
    .span4 {width: 370px;  }
    .span3 {width: 270px;  }
    .span2 {width: 170px;  }
    .span1 {width: 70px;  }
    li {line-height: 34px; }

    .list18 li, .list18 li{ height: 160px; width: 285px; }
    .list18 li + li{margin-left: 10px;}

    .banner{ width: 100%;min-width: 1200px; height:930px;background: url(img/banner.jpg) no-repeat center top; min-height:930px; }
    .banner .container{width: 1200px; padding-top: 400px; padding-left: 0; padding-right: 0;}
    .banner .container .span8{ width: 755px; margin-left: 0; padding-left: 15px; padding-right: 15px;}
    .banner .container .span8 .list4 .carousel{ border: 10px solid #fff;}
    .banner .container .span4{ width: 415px; }
    .banner .list7{ width: 328px; margin: 0 auto;}

    
    .pic{position: relative; width: 100%; height: 600px; background-attachment: fixed; background-position: center 0;  background-repeat: no-repeat;  }

    
    .list8{ float: left; width: auto;}
    
    .slide02 .container .span4:first-child{ overflow: hidden; width: 354px; position: relative;}
    .slide02 .row > div{ padding-top: 60px; }
    .slide02 .list8 {  width: 354px;margin-left: 0 ; overflow: hidden; position: relative;}
    .slide02 .list8 li{ float: left; }
    .slide02 .span4 span{ position: absolute;  display: inline-block; width: 35px; height: 72px; top:40%; cursor:pointer;}
    .slide02 .left{ background: url(img/left-right.png) no-repeat 0 -72px; left: 0;}
    .slide02 .right{ background: url(img/left-right.png) no-repeat 0 0; right: 0; }
}
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
    .container,#localNav,#channelNav,.footer{ width:1200px;}
    .lm4 ul li {  line-height: 20px;    }
    .span12 {width: 1170px;    }
    .span11 { width: 1070px;    }
    .span10 {width: 970px;    }
    .span9 {width: 870px;    }
    .span8 { width: 770px;    }
    .span7 { width: 670px;    }
    .span6 { width: 570px;    }
    .span5 {width: 470px;    }
    .span4 {width: 370px;    }
    .span3 { width: 270px;    }
    .span2 {width: 170px;    }
    .span1 {width: 70px;    }
    li { line-height: 34px;    }
    #row1 .span8{ position: relative;}
    .list18 li, .list18 li{ height: 160px; width: 285px; }
    .list18 li + li, .list18 li+li{margin-left: 10px;}

    .banner{ width: 100%;min-width: 1200px; height:930px;background: url(img/banner.jpg) no-repeat center top; min-height:930px;   }
    .banner .container{width: 1200px; padding-top: 400px; padding-left: 0; padding-right: 0;}
    .banner .container .span8{ width: 755px; margin-left: 0; padding-left: 15px; padding-right: 15px;}
    .banner .container .span8 .list4 .carousel{ border: 10px solid #fff;}
    .banner .container .span4{ width: 415px; }
    .banner .list7{ width: 328px; margin: 0 auto;}

    
    .pic{position: relative; width: 100%; height: 600px; background-attachment: fixed; background-position: center 0;  background-repeat: no-repeat;  }
    
    .footer{ margin-top: 37px;}
    
    .slide02 .container .span4:first-child{ overflow: hidden; width: 354px; position: relative;}
    .slide02 .row > div{ padding-top: 60px; }
    .slide02 .list8 {  width: 354px;margin-left: 0 ; overflow: hidden; position: relative;}
    .slide02 .list8 li{ float: left; }
    .slide02 .span4 span{ position: absolute;  display: inline-block; width: 35px; height: 72px; top:40%; cursor:pointer;}
    .slide02 .left{ background: url(img/left-right.png) no-repeat 0 -72px; left: 0;}
    .slide02 .right{ background: url(img/left-right.png) no-repeat 0 0; right: 0; }

}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
    .banner {
        min-width: 100%;
        height: auto;
        background: none;
    }

    .row {
        margin-left: 2%;
        margin-right: 2%;
    }

    .span4 {
        width: 100%;
    }
    .right{  width: 74%; }
    .right p{margin-top: 0; }
    
    .div_scroll {
        width: 97%;}
    .slide04  .span12 ul{ overflow: hidden; }
    .slide04  .span12 li{ width: 50%; float: left; }
    .slide04 .container .span12 li span { display: table; height: 164px;float: left; 
            line-height: 30px; font-size: 18px; padding: 0 30px; background: #f5f5f5;}
    .slide04 .container .span12 li span a{display: table-cell; vertical-align: middle;}
    .slide04 .container .span12 li img{float: left;}
    .slide04 .container .icon{ float: right;margin-top: 30px; }
    .slide04 .container .icon li{ display: inline-block; width: 13px; height: 13px; border-radius: 50%; background: gray; 
       margin-left: 10px; cursor:pointer; ;}
    .slide04 .container .icon .active{ background: #fabf13; width: 40px; border-radius: 10px; }
    .slide02 .container .span4:first-child{ overflow: hidden; width: 354px; position: relative;}
    .slide02 .row > div{ padding-top: 60px; }
    .slide02 .list8 {  width: 354px;margin-left: 0 ; overflow: hidden; position: relative;}
    .slide02 .list8 li{ float: left; }
    .slide02 .span4 span{ position: absolute;  display: inline-block; width: 35px; height: 72px; top:40%; cursor:pointer;}
    .slide02 .left{ background: url(img/left-right.png) no-repeat 0 -72px; left: 0;}
    .slide02 .right{ background: url(img/left-right.png) no-repeat 0 0; right: 0; }
    
}

/* Landscape phones and down */
@media (max-width: 480px) {
    .banner{ min-width: 100%; height:auto; background: none;}
    .row{ margin-left: 2%; margin-right: 2%;}
    .span4{ width: 100%;}

    .slide04 .weather-img li{ padding-top: 5px; }
    .slide04 .weather-img img{ border: 3px solid white; }
    .slide02 .span8 > div{ padding-top: 20px; }
    a,p {font-size: 16px; line-height: 25px;}
    .banner-nav2 a{ float: left; }
}

/*<a href="{$r[url]}" class="pic" target="_blank"><img src="{thumb($r[thumb])}" alt=""  ></a>
<a href="{$r[url]}" class="title jiaodai" target="_blank">{$r[title]}</a>*/