.header{position: fixed; z-index: 1000; width: 100%;}
.navHome,.navBar,.navDir{width: 100%;}
.navHome .wrap,.navBar .wrap,.footer .wrap{ padding: 0 90px;}


.navHome{background:#fff; height: 90px;-webkit-transition:all ease-out 0.7s; transition:all ease-out 0.7s;}
.navHome .wrap{padding-top: 30px;}
.navCommon{background:#fff; height: 90px;-webkit-transition:all ease-out 0.7s; transition:all ease-out 0.7s;}
.navCommon .wrap{padding-top: 30px;}



/* 棣栭〉瀵艰埅 鏍峰紡*/
.page-index .navHome {background: url(../images/mask-top-bg.png) repeat-x; height: 143px; position: fixed; z-index: 1}
.page-index .navHome .wrap{padding-top: 50px;}
.page-index .navCommon{background:#fff; background-image: none; height: 90px;}
.page-index .navCommon .wrap{padding-top: 30px;}

.page-index .navHome a.logo{ float: left; width: 370px; height: 52px; background: url(/themes/hanking_cn/default/images/logo_w.svg) no-repeat;background-size: auto 42px;}
.page-index .navHome a.menu{float: right; width: 26px; height: 20px; padding-top: 18px;}
.page-index .navHome a.menu span{display: block;background-color: #fff; height: 3px;}
.page-index .navHome a.menu span.mid{margin: 3px 0;}
.page-index .navHome .mainMenu{float: right;}
.page-index .navHome .mainMenu li{float: left;padding-right: 40px;}
.page-index .navHome .mainMenu li a{display: block; height: 52px; line-height: 52px; color: #fff;}

.page-index .navCommon a.logo{ float: left; width: 268px; height: 38px; background: url(/themes/hanking_cn/default/images/logo_b.svg) no-repeat;background-size: auto 38px;}
.page-index .navCommon a.menu{float: right; width: 26px; height: 20px; padding-top: 13px;}
.page-index .navCommon a.menu span{display: block;background-color: #000; height: 3px;}
.page-index .navCommon a.menu span.mid{margin: 3px 0;}
.page-index .navCommon .mainMenu{float: right;}
.page-index .navCommon .mainMenu li{float: left;padding-right: 40px;}
.page-index .navCommon .mainMenu li a{display: block; height: 38px; line-height: 38px; color: #000;}
.page-index .navHome .btn-lang{float: right; font-size: 18px; height: 18px; line-height: 18px;padding-top: 16px; margin-right: 40px; color: #fff;}
.page-index .navCommon .btn-lang{float: right; font-size: 18px; height: 18px; line-height: 18px;padding-top: 11px; margin-right: 40px;color: #000;}




/* 鏍囧噯瀵艰埅 鏍峰紡*/
.navHome a.logo{ float: left; width: 268px; height: 38px; background: url(/themes/hanking_cn/default/images/logo_b.svg) no-repeat;background-size: auto 38px;}
.navHome a.menu{float: right; width: 26px; height: 20px; padding-top: 12px;}
.navHome a.menu span{display: block;background-color: #000; height: 3px;}
.navHome a.menu span.mid{margin: 3px 0;}
.navHome .mainMenu{float: right;}
.navHome .mainMenu li{float: left;padding-right: 40px;}
.navHome .mainMenu li a{display: block; height: 38px; line-height: 38px; color: #000;}
.navHome .mainMenu li a:hover{color: #666;}
.navCommon a.logo{ float: left; width: 268px; height: 38px; background: url(/themes/hanking_cn/default/images/logo_b.svg) no-repeat;background-size: auto 38px;}
.navCommon a.menu{float: right; width: 26px; height: 20px; padding-top: 12px;}
.navCommon a.menu span{display: block;background-color: #000; height: 3px;}
.navCommon a.menu span.mid{margin: 3px 0;}
.navCommon .mainMenu{float: right;}
.navCommon .mainMenu li{float: left;padding-right: 40px;}
.navCommon .mainMenu li a{display: block; height: 38px; line-height: 52px; color: #000;}




.navHome .btn-lang{float: right; font-size: 18px; height: 18px; line-height: 18px;padding-top: 11px; margin-right: 40px; color: #000;}
.navCommon .btn-lang{float: right; font-size: 18px; height: 18px; line-height: 18px;padding-top: 11px; margin-right: 40px;color: #000;}


.navBar{background: #fff; height: 38px;padding: 20px 0; position: fixed; z-index: 2; display: none;}
.navBar a.logo{ float: left; width: 268px; height: 38px; background: url(/themes/hanking_cn/default/images/logo_b.svg) no-repeat;background-size: auto 38px;}
.navBar .btn-close{float: right;  padding-top: 6px;}
.navBar .btn-close i{float:left; height: 18px; width: 18px; 
	background: url(../images/ico-close.png) no-repeat; margin-top: 2px;}
.navBar .btn-close span{float:left;height: 18px; line-height: 18px;  font-size: 16px; margin:0 10px;}

.navDir {display: none; position: fixed; top:74px; z-index: 10000; }
.navDir li{width: 100%; background:#eee;  background:rgba(240,240,240,0.9); filter:alpha(opacity=80); margin-top: 1px;
 -webkit-transition:all ease-out 0.3s; transition:all ease-out 0.3s;overflow: hidden;}
.navDir li:hover{background:rgba(255,255,255,0.9); filter:alpha(opacity=90);}
.navDir li a,.navDir li ul{display: block; position: relative;color: #000000;}
.navDir li ul li{background: none;
 -webkit-transition:all ease-out 0.3s; transition:all ease-out 0.3s; }
.navDir li ul li:hover{background: none;}
.navDir li ul li a{font-size: 14px; line-height: 26x; display: inline;}
.navDir li ul li a:hover{color: #cc0000;}
.navDir a.title{float: left; padding-left: 20%; width: 20%; font-size: 20px;}
.navDir ul.submenu{float: left; width: 60%; padding: 10px 0; display: none;}


/* home css */

.bannerHome{position: relative; z-index: 1;}
.bannerHome .bxslider li{position: absolute; top:0; left: 0px; }
.bannerHome .bxslider li a{display: block; width: 100%; height: 100%; overflow: hidden; position: relative; }
.bannerHome .wrap{position:relative; z-index: 1000; margin-top: -130px; margin-left: 90px;margin-right: 90px; height: 130px; }
.bannerHome .wrap .pager{width: 66px; height: 22px;
 margin-bottom: 20px;
}
.bannerHome .pager a{display: block;
	float: left; width: 22px; 
	height: 22px; 
	background: url(../images/ico-prev.png) no-repeat;
}
.bannerHome .pager a.btn-next{background: url(../images/ico-next.png) no-repeat right; }
.bannerHome .pager a.btn-stop{ background: url(../images/ico-stop.png) no-repeat; }
.bannerHome .pager a.btn-start{ background: url(../images/ico-start.png) no-repeat; }

.bannerHome .captions li div{ min-height: 30px; width: 480px; color: #fff; font-size: 20px;line-height: 1.5;letter-spacing:8px;}
.bannerHome .btn-down{display: block;position: absolute; left: 50%; width: 30px; margin-left: -15px;}
.bannerHome .btn-down i{ display: block; height: 4px; background: #fff; margin:0 auto 3px auto;
     -webkit-animation-name:'downIco';/*鍔ㄧ敾灞炴€у悕锛屼篃灏辨槸鎴戜滑鍓嶉潰keyframes瀹氫箟鐨勫姩鐢诲悕*/
     -webkit-animation-duration: 0.5s;/*鍔ㄧ敾鎸佺画鏃堕棿*/
     -webkit-animation-timing-function: ease-in-out; /*鍔ㄧ敾棰戠巼锛屽拰transition-timing-function鏄竴鏍风殑*/
     -webkit-animation-delay: 0.5s;/*鍔ㄧ敾寤惰繜鏃堕棿*/
     -webkit-animation-iteration-count: infinite;/*瀹氫箟寰幆璧勬枡锛宨nfinite涓烘棤闄愭*/
     -webkit-animation-direction: alternate;/*瀹氫箟鍔ㄧ敾鏂瑰紡*/
     animation-name:'downIco';/*鍔ㄧ敾灞炴€у悕锛屼篃灏辨槸鎴戜滑鍓嶉潰keyframes瀹氫箟鐨勫姩鐢诲悕*/
     animation-duration: 0.5s;/*鍔ㄧ敾鎸佺画鏃堕棿*/
     animation-timing-function: ease-in-out; /*鍔ㄧ敾棰戠巼锛屽拰transition-timing-function鏄竴鏍风殑*/
     animation-delay: 0.5s;/*鍔ㄧ敾寤惰繜鏃堕棿*/
     animation-iteration-count: infinite;/*瀹氫箟寰幆璧勬枡锛宨nfinite涓烘棤闄愭*/
     animation-direction: alternate;/*瀹氫箟鍔ㄧ敾鏂瑰紡*/
}

/* 鍚戜笅绠ご鍔ㄧ敾 */
.bannerHome .btn-down i:nth-child(2){width: 60%; -webkit-animation-delay: 0.9s;animation-delay: 0.9s; } 
.bannerHome .btn-down i:nth-child(3){width: 20%; -webkit-animation-delay: 1.2s;animation-delay: 1.2s; } 
@-webkit-keyframes 'downIco' {0% {opacity: 0.5;}100% {opacity: 1;} }



/* 棣栭〉鏂伴椈 婊氬姩鏍峰紡 */
.page-index .sliderBox{display: block; overflow: hidden; width: 100%;}
.page-index #eventListBox{position: relative;}
.page-index #eventListBox .controls a{display: block; width: 27px; height: 27px; position: absolute; top:50%;
opacity: 0.6; filter:alpha(opacity=60);
 -webkit-transition:all ease-out 0.3s; transition:all ease-out 0.3s;
}
.page-index #eventListBox .controls a.btn-prev{left: 30px; background: url(../images/ico-home-left.png) no-repeat;}
.page-index #eventListBox .controls a.btn-next{right: 30px;background: url(../images/ico-home-right.png) no-repeat;}
.page-index #eventListBox .controls a.btn-prev:hover{left: 25px;opacity: 1; filter:alpha(opacity=100);}
.page-index #eventListBox .controls a.btn-next:hover{right: 25px;opacity: 1; filter:alpha(opacity=100);}




/* 4 grid */
.wrap_1{padding: 60px; padding-top: 0px;padding-top: 152px;}
.list_1{display: block;}
.list_1 li{width: 25%; float: left;}
.list_1 li a img{width: 100%; height: auto;}
.list_1 li a{display: block;padding: 30px;-webkit-transition:all ease-out 0.3s; transition:all ease-out 0.3s;}
.list_1 li p{font-size: 14px; color: #999; line-height: 26px;}
.list_1 li a span.title{display:block; margin:40px 0; font-size: 18px; line-height: 26px; }
.list_1 li a span.title:hover{text-decoration: underline;}
.list_1 li datetime{ font-size: 14px; display: block;}
.list_1 li .desp{font-size: 14px; line-height: 20px; color: #888;}
.list_1 li a:hover{margin-top: -15px; }
.list_1 li a:hover img{border-top: 3px solid #cc0000;}
.list_1 li h3{display:block; margin:30px 0 0 0; font-size: 16px; line-height: 26px;}
.list_1 li h3:hover{text-decoration: underline;}

/* list 3*/
.list_1 li.even a{display: block;padding: 30px;-webkit-transition:all ease-out 0.3s; transition:all ease-out 0.3s;}
.list_1 li.even a .title{display:block; margin:40px 0; font-size: 16px; line-height: 26px; }
.list_1 li.even datetime{ font-size: 14px; display: block;}
.list_1 li.even .desp{font-size: 14px; line-height: 20px; color: #888;}
.list_1 li.even a:hover{margin-top: -15px; }
.list_1 li.even a:hover img{border-top: 3px solid #cc0000;}
.list_1 li.even h3{display:block; margin:30px 0 0 0; font-size: 16px; line-height: 26px;}
.list_1 li.even span{font-size: 14px; color: #999;}
.list_1 li.even picture{display: block;-webkit-transition:all ease-out 0.3s; transition:all ease-out 0.3s;}

/* 2 grid */
.wrap_2{padding: 0px;padding-top: 152px;}
.list_2{display: block;}
.list_2 li{width: 100%; float: left; background-color: #fafafa; margin-bottom: 40px;}
.list_2 li a{float: left;width: 50%; position:relative; overflow: hidden;}
.list_2 li a.pic img{width: 100%; height: auto;-webkit-transition:all ease-out 0.5s; transition:all ease-out 0.3s;}
.list_2 li a.pic:hover img{
	 -webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);
    transform:scale(1.1,1.1);
}
.list_2 li a.text{}
.list_2 li a.text .box{padding: 40px; position:absolute; bottom: 0px;}
.list_2 li a.text span{display: inline-block;}
.list_2 li a.text .title{display:block;font-size:28px; }
.list_2 li a.text .smallTitle{font-size: 14px; color: #666;clear: both; float: none;}
.list_2 li a.text .info{ padding-top: 70px; font-size: 14px; line-height: 22px;}
.list_2 li a.text .info label{color: #666;}
.list_2 li a.text .btn-more{width: 24px; height: 24px; background: url(../images/ico-add.png) no-repeat; 
    position: absolute; bottom: 40px; right: 40px;
    transition:All 0.4s ease-in-out;
    -webkit-transition:All 0.4s ease-in-out;
    -moz-transition:All 0.4s ease-in-out;
    -o-transition:All 0.4s ease-in-out;

}
.list_2 li a.text .btn-more:hover{
    transform:rotate(180deg);
    -webkit-transform:rotate(180deg);
    -moz-transform:rotate(180deg);
    -o-transform:rotate(180deg);
    -ms-transform:rotate(180deg);
    opacity: 0.6; filter:alpha(opacity=60);
}


/* common */
.first_row{padding-top: 90px;}
.toolsBar{position: fixed; top: 70px; width:100%;z-index: 800;
    background-color: #fff;
    background:rgba(255,255,255,0.9); filter:alpha(opacity=0); opacity:0;
    -webkit-transition:all ease-out 0.3s; transition:all ease-out 0.3s;
}
.toolsBar.show{top: 90px;filter:alpha(opacity=90); opacity:100; }

.toolsBar .wrap{padding: 20px 90px 20px 90px;}
.toolsBar .categorys{float: left;}
.toolsBar .categorys a{float: left; margin-right: 20px; color: #000;}
.toolsBar .categorys a:hover,.toolsBar .categorys a.current{color: #cc0000;}
.toolsBar .views{float: right;}
.toolsBar .views a{float: right; width: 24px; height: 18px; margin-left: 10px;}
.toolsBar .views a.list{background: url(../images/ico-list.jpg) no-repeat;}
.toolsBar .views a.list:hover,.toolsBar .views a.list.current{background: url(../images/ico-list2.jpg) no-repeat;}
.toolsBar .views a.grid{background: url(../images/ico-grid.jpg) no-repeat;}
.toolsBar .views a.grid:hover,.toolsBar .views a.grid.current{background: url(../images/ico-grid2.jpg) no-repeat;}




.detailsRow1{font-size: 14px; max-width: 1080px; margin: 0 auto; padding: 0 60px;}
.rightGrid{float: right; width: 50%;}
.leftGrid{float: left; width: 50%;}
.lineFull{width: 100%; height: 1px; line-height: 1px; background: #eee; margin: 0 30px;
clear:both;float: none;
}
.leftGrid {line-height: 26px;}

.fullBanner{position: relative; overflow: hidden; background: #fff;}
.sliderBig .bx-viewport ul li div{width: 100%; position: relative;}
.sliderBig .bx-viewport ul li img{ position: absolute;}

.fullBanner .pager{position: absolute;left: 90px;
 bottom: 120px;z-index: 1003; width: 114px;height: 22px;}
.fullBanner .pager a{float: left;width: 14px;
 height: 22px; color: #fff; font-size: 16px;}
.fullBanner .pager a.num-cur{width: 14px;}
.fullBanner .pager a.num-max{width: 22px;}
.fullBanner .pager a.btn-prev{background: url(../images/ico-prev2.png) no-repeat;
 opacity: 0.8; filter:alpha(opacity=80); margin-right: 10px;}
.fullBanner .pager a.btn-next{background: url(../images/ico-next2.png) no-repeat;
    opacity: 0.8; filter:alpha(opacity=80);  margin-left: 10px;}
.fullBanner .pager a.btn-prev:hover{opacity: 1;filter:alpha(opacity=100); }
.fullBanner .pager a.btn-next:hover{opacity: 1;filter:alpha(opacity=100); }
.fullBanner .pager a.btn-line{width: 1px; background: #fff;opacity: 0.5; filter:alpha(opacity=50); margin: 0 10px;  }


.fullBanner .captions{position: absolute; bottom: 0px;  z-index: 701; 
    color: #fff;
    width: 100%; height: 206px; background: url(../images/bg-txtmask.png) repeat-x;
}
.fullBanner .captions .box{padding-left: 90px; padding-top: 100px;}
.fullBanner .captions li span{font-size: 26px; display: block; line-height: 28px;}
.fullBanner .captions li span.en{font-size: 14px;}



a.btn-back{display: block; height: 20px; line-height:20px;text-indent: 30px; background: url(../images/ico-left-zt.jpg) no-repeat;}
a.btn-back:hover{text-decoration: underline;}
.artNav{height: 20px; line-height: 20px; float: right;}
.artNav a{ float: left; height: 20px; line-height: 20px;opacity: 0.8; filter:alpha(opacity=80);}
.artNav a.prev{width: 20px; background: url(../images/ico-left-zt.jpg) no-repeat;}
.artNav a.next{width: 20px; background: url(../images/ico-right-zt.jpg) no-repeat; margin-right: 10px;}
.artNav a.line{width: 20px; background: url(../images/ico-line.jpg) no-repeat;}
.artNav a:hover{opacity: 1;filter:alpha(opacity=100); text-decoration: underline; }


a.link:hover{color: #cc0000;}
a.link-mail{ text-decoration: underline;}
/*footer */
.fl{float: left;}.fr{float: right;}
.footer{padding-top: 30px;}
.footer a{font-size: 14px; height: 30px;}
.footer .fl{ margin-right: 20px;}.footer .fr{ margin-left: 20px;}
.footer .location{text-indent: 24px; background: url(../images/ico-local.png) no-repeat; color: #333;}
.footer .btn-sina{width: 18px; height: 14px; background: url(../images/share-sina.png) no-repeat; background-size: 18px 14px; opacity: 0.7;}
.footer .btn-wx{width: 18px; height: 14px; background: url(../images/share-wx.png) no-repeat; background-size: 18px 14px;opacity: 0.7;}
.footer .btn-sina:hover,.footer .btn-wx:hover{opacity: 1;}


/*projects*/


@media screen and (min-width: 768px) {
.transition { opacity: 0; transform: translate3d(0,60px,0); transition: all .7s ease-out; }
.transition.css3 { opacity: 1; transform: translate3d(0,0,0); }
}

.bx-wrapper .bx-loading {
    min-height: 50px;
    background: url(../images/bx_loader.gif) center center no-repeat;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}

@media only screen and (max-width: 1024px) {
    .navHome .wrap,.navBar .wrap,.footer .wrap{ padding: 0 20px;}
    .page-index .navHome .wrap{padding-top: 20px;}
    .page-index .navHome a.menu{padding-top: 14px;}
    .page-index .navHome .btn-lang{padding-top: 13px; margin-right: 10px;}
    .page-index .navCommon{height: 70px;}
    .wrap_1{padding:20px; }
    .detailsRow1{padding: 0 40px;}
    .page-index .navHome a.logo{  width: 185px; height: 26px; background-size: 185px 26px;}  

    .navHome{height: 50px;}
    .navHome .mainMenu{display: none;}
    .navHome a.logo{  width: 185px; height: 26px; background-size: 185px 26px; margin-top: 12px;}

    .navHome .btn-lang{margin-right: 10px;padding-top: 16px;}
    .navHome a.menu{padding-top: 18px;}

    .navBar{padding: 10px 0; height: 28px;}
    .navBar a.logo{  width: 185px; height: 26px;background-size: 185px 26px;}
    .navBar .btn-close{padding-top: 3px;}
    .navDir{top:48px;}
    .navDir a.title{padding-left: 5%; width: 40%; font-size: 16px;}
    .navDir ul.submenu{width: 50%; padding: 10px 0; display: none;}
    .toolsBar{top:38px;}
    .toolsBar.show{top:48px;}
    .toolsBar .wrap {
      padding: 20px 20px 20px 20px;
    }

    .first_row{padding-top: 50px;}
}
@media only screen and (max-width: 768px){
    .page-index .navHome .mainMenu{display: none;}
    
    .footer a{display: none;}
    .footer a.copyright{display: block;margin-left:0; text-align: center; width: 100%;}
    .footer .location{display: block; width: 80px; float: none; margin: auto;}
    
    

    .list_1 li{width: 100%;}
    .list_2 li a.text .box{padding: 20px;}
    .list_2 li a.text .btn-more{display: none;}
    .list_2 li a.text .title{font-size: 22px;}

    .wrap_2{padding-top: 120px;}
    
    .leftGrid,.rightGrid{width: 100%;}
    .rightGrid img{max-width: 100%;}
    
    .fullBanner .pager{display: none;}
    .fullBanner .captions{height: 50px;}
    .fullBanner .captions .box{padding-left:0;padding-top:0; text-align: center; }
    .fullBanner .captions li span{font-size: 18px;}

    .btn-scroll{display: none;}
    .artNav{ margin-top: -21px;}
    
    .bannerHome .wrap .pager{display: none;}
    .bannerHome .wrap{ margin: 20px auto;margin-top: -120px; text-align: center;}
    .bannerHome .captions li div{margin: 0 auto;font-size: 16px;width: 320px;letter-spacing: .2em;}
    .bannerHome .btn-down{top:70px;}
    .page-index #eventListBox .controls{display: none;}


}
@media only screen and (max-width: 480px){
        .toolsBar{ display: none;}
        .list_2 li a.text .info{display: none;}

        .wrap_2{padding-top: 50px;}

}
.txt-video video{display: block;width: 100%;max-width: 100%}
.txt-video iframe {display: block;width: 100%;min-height: 360px;}