/*
*  @date 2017-04-19
*  @author pretender
*  @description  layout css document
*  @update pretender
*  @updatedate 2017-05-31
*
*/


@media (min-width: 1200px) {
	.now-bar{
	width: 100%;
	height: 40px;
	background: #f7f7f7;
	border-bottom:1px solid #ddd;
	z-index: 199;
	color:#333;
}
.now-bar  a.CurrChnlCls{
	line-height: 40px;
    font-size: 14px;
    padding: 0 10px;
	color:#333;
}
}

@media (max-width: 1199px) and (min-width: 1025px) {
    .now-bar{
	width: 100%;
	height: 40px;
	background: #f7f7f7;
	border-bottom:1px solid #ddd;
	z-index: 199;
	color:#333;
}
.now-bar  a.CurrChnlCls{
	line-height: 40px;
    font-size: 14px;
    padding: 0 10px;
	color:#333;
}
    .nav-bar {
        margin-left: 25px;
    }
    .nav a {
        padding: 0 12px;
    }
    .container {
        width: 1000px;
    }
    .mode-border {
        display: none;
    }
    .mode-cont {
        margin: 5px auto 0;
    }
    .h-container a {
        width: 330px;
    }
    .h-container a .h-item {
        margin: 10px;
    }
    .p-container a {
        width: 250px;
    }
    .p-container a .p-item {
        margin: 5px;
    }
    .p-page {
        display: none;
    }
    .curr-nav{
    	width: 100%;
    }
    .awards{
    	width: 1030px;
    }
    .awards-desc{
    	height: 50px;
    }
    .footer{
    	height: auto;
    }
    .footer .friendly-link{
    	float: none;
    }
    .footer span{
    	line-height: 48px;
    }
    .governance{
    	width: 1025px;
    }
    .go-pic img{
    	max-width: 100%;
    }
    .history-flag{
    	margin-left: 0;
    }
    .history-list-item {
    	background: url(./../image/history07.png) 15px 0px repeat-y;
	}
	.history-tab-title{
		float: none;
		width: 170px;
		background: url(./../image/history02.png) 15px center no-repeat;
	}
	.history-year-tab li{
		width: inherit;
		padding:15px;
	}
	.history-box-right{
		width: 100%;
		background: url(./../image/history03.png) 15px 18px no-repeat;
	}
	.history-box-title{
		margin-left: 30px;
	}
	.history-box-cont{
		margin-left: 30px;
	}
	.ourlogo-list{
		width: 100%;
	}
	.reports ul{
		width: 1025px;
	}
	.team{
		width: 1025px;
	}
	.team li{
		width: 50%;
	}
	.videos ul{
		width: 1025px;
	}
	.videos li dd{
		width: 125px;
	}
	.searchword{
		width:180px;
	}
}



@media (max-width: 1366px) and (min-width: 1024px){
    .mode2{height:640px!important;}
    .mode3{height:640px!important;}
    .mode4{height:640px!important;}
    .mode-title{padding-top:150px;}
    .slide-pic{width:1366px;margin-left:-683px;}
}


@media (min-width: 1367px){
    .mode2{height:720px!important;}
    .mode3{height:700px!important;}
    .mode4{height:700px!important;}
    .mode-title{padding-top:50px;}
}

@media (min-width: 1367px) and (min-height: 500px){
    .mode-title{padding-top:150px;}
}

@media (max-height: 500px){
    .mode1{height:640px!important;}
    .mode2{height:530px!important;}
    .mode3{height:600px!important;}
    .mode4{height:580px!important;}
    .mode-title{padding-top:50px;}

}
@media (min-height: 500px) and (max-height: 800px){
    mode1{height:810px!important;}
}
@media (min-width: 1600px) and (min-height: 800px){
    .mode1{height:940px!important;}
    .mode2{height:740px!important;}
    .mode3{height:740px!important;}
    .mode4{height:650px!important;}
    .banner .swiper-page-container{bottom:50px;}
}
@media (min-width: 1600px) and (max-height: 500px) {
    .mode-title{padding-top:50px;}
}
@media (min-width: 1600px) and (min-height: 500px) {
    .mode-title{padding-top:150px;}
    .slide-pic img{height:auto;}
    .mode4 .mode-title{padding-top:50px;}
}
@media (max-width: 1680px) and (min-width: 1367px){
    .slide-pic{width:1680px;margin-left:-840px;}
}


@media (min-width: 1800px) {
}
@media (max-width: 1024px) {
    .now-bar{
        width: 100%;
        height: 40px;
        background: #f7f7f7;
        border-bottom:1px solid #ddd;
        z-index: 199;
        color:#333;
    }
    .now-bar  a.CurrChnlCls{
        line-height: 40px;
        font-size: 14px;
        padding: 0 10px;
        color:#333;
    }
    .top-bar {
        display: none;
    }
    .footer .container {
        padding-bottom: 20px;
    }
    .container {
        box-sizing: border-box;
        padding: 0 15px;
        width: 100%;
    }
    .curr-nav .curr-title{
        padding: 0 15px;
    }
    .menu-bar {
        height: 50px;
    }
    .nav-bar {
        display: none;
    }
    .small-nav {
        display: block;
        width: 30px;
        height: 40px;
        top: 10px;
        right: 15px;
    }
    .small-nav span {
        width: 100%;
        height: 3px;
        margin: 6px 0;
        background: #222;
    }
    .logo {
        height: 40px;
        line-height: 50px;
    }
    .logo img {
        max-height: 100%;
    }
    .search-bar {
        display: none;
    }
    .h-title{
        height:auto;
    }
    .in-container {
        width: 100%;
        overflow: hidden;
    }
    .in-container.container {
        padding: 0;
    }
    .in-container li {
        padding: 0 5px;
    }
    .in-container li a {
        margin-right: 0px;
        box-sizing: border-box;
    }
    .in-container .swiper-slide:hover .unit-desc {
        display: block;
    }
    .in-container .swiper-slide:hover .unit-mask {
        height: 100%;
        display: none;
    }
    .ourlogo-item{
        width:100%;
    }
    .report-item img{
        max-width:175px;
        max-height:233px;
    }
    .footer {
        height: auto;
    }
    .footer span {
        line-height: 24px;
    }
    .footer .friendly-link {
        float: left;
        display: block;
    }
    .now-bar span.firstmenu{
        display: none;
    }
    .curr-nav{
        width: 100%;
    }
    .main-conts{
        margin-top: 100px;
        min-height: calc(100vh - 233px);
    }
    .about-us li .pull-left{
        width: 100%;
        float: none;
    }
    .about-us li .pull-right{
        width: 100%;
        float: none;
    }
    .about-us li .pull-right p.oneline{
        line-height: 24px;
    }
    .about-us li .pull-right p{
        margin-top: 0;
    }
    .awards{
        width: 100%;
    }
    .awards-list{
        width: 100%;
    }
    .awards-list-cont{
        margin-right: 0;
    }
    .governance{
        width: 100%;
    }
    .go-pic img{
        max-width: 100%;
    }
    .history-year-tab li{
        padding:0;
    }
    .history-flag{
        margin-left: 0;
    }
    .history-list-item {
        background: url(./../image/history07.png) 15px 0px repeat-y;
    }
    .history-tab-title{
        float: none;
        width: 170px;
        background: url(./../image/history02.png) 15px center no-repeat;
    }
    .history-year-tab li{
        width: 100%;
        padding:15px;
    }
    .history-year-tab li.curr{
        background: #2475d0;
    }
    .history-box-right{
        width: 100%;
        background: url(./../image/history03.png) 15px 18px no-repeat;
    }
    .history-box-title{
        margin-left: 30px;
    }
    .history-box-cont{
        margin-left: 30px;
    }
    .history-flag{
        width: 100%;
    }
    .history-box-title{
        height: auto;
    }
    .introduce img{
        max-width: 100%;
    }
    .about-us img{
        max-width: 100%;
    }
    .news li .news-cont{
        float: none;
        width: 100%;
    }
    .news li .news-date{
        float: none;
        margin-top: 20px;
    }
    .ourlogo-list{
        width: 100%;
        margin-top: 0px;
    }
    .profile-list .profile-desc{
        width: 100%;
    }
    .profile-list .profile-left{
        width: 100%;
        float: none;
    }
    .profile-list .profile-right{
        width: 100%;
        float: none;
        padding-left: 0;
    }
    .team{
        width: 100%;
    }
    .videos ul{
        width: 100%;
    }
    .p-page{
        display:block;
    }
    .team-tablist-right{
        width:auto;
        padding-right: 30px;
    }
    .slide-pic{margin-left:-502px;width:1024px;}
}

@media (min-width: 768px) and (max-width: 1024px) {
    /*mode1*/
    .mode1 {
        padding-top: 50px;
        height: 500px !important;
    }
    .slide-pic img {
        max-width: 100%;
        *width: 100%;
        width: 100%\0\9;
    }
    .swiper-desc {
        margin-top: 50px;
        background:none;
    }
    .banner .swiper-page-container {
        bottom: 10px;
    }
    .banner3 video{/*margin-left:-502px;*/}
    /*mode2*/
    .mode2 {
        padding: 50px 0;
        height: 550px !important;
    }
    .mode-title {
        padding-top: 0px;
    }
    .mode4 .mode-title{padding-top:50px;}
    .h-container {
        display: none;
    }
    .mo-h-container {
        display: block;
        margin-top: 20px;
        width: 100%;
        height: 380px;
        overflow: hidden;
    }
    .mo-h-container a {
        width: 100%;
    }
    .mo-h-container a {
        display: block;
        float: left;
        box-sizing: border-box;
        width: 100%;
    }
    .mo-h-container .h-item {
        margin: 0 15px;
        background: #fff;
        padding: 10px;
        border: 1px solid #cccccc;
    }
    .mo-h-container .h-title {
        font-size: 15px;
    }
    .h-page {
        width: 100%;
        height: 40px;
        position: absolute;
        bottom: 20px;
        line-height: 40px;
        text-align: center;
        z-index:10;
    }
    .h-page .swiper-pagination-switch {
        display: inline-block;
        width: 15px;
        height: 15px;
        border-radius: 15px;
        border: 1px solid #9d9d9d;
        margin: 0 15px;
        cursor:pointer;
    }
    .h-page .swiper-visible-switch.swiper-active-switch {
        background: #9d9d9d;
    }
    .h-pic {
        text-align: center;
    }
    /*mode3*/
    .mode3 {
        padding: 50px 0;
        height: 640px !important;
    }
    .mode4{height:540px!important;}
    .p-container {
        display: none;
    }
    .mo-p-container {
        display: block;
        width: 100%;
        height: 390px;
        overflow: hidden;
    }
    .mo-p-container a {
        width: 50%;
    }
    .mo-p-container a .p-item {
        background: #fff;
        height: 350px;
        padding: 10px;
        border: 1px solid #ccc;
    }
    .mo-p-container a .p-desc {
        padding: 0;
    }
    .mo-p-container a .p-title {
        font-size: 18px;
    }
    .mo-p-container a .p-cont {
        margin-top: 0px;
        font-size: 12px;
    }
    .p-page {
        position: absolute;
        width: 100%;
        height: 40px;
        line-height: 40px;
        color: #fff;
        display: block;
        bottom: 40px;
    }
    .p-page-left {
        width: 50%;
        text-align: center;
        float: left;
        background: #cccccc;
        font-size: 28px;
        box-sizing: border-box;
        border: 1px solid #ccc;
        cursor: pointer;
    }
    .p-page-right {
        width: 50%;
        text-align: center;
        float: right;
        font-size: 28px;
        border: 1px solid #ccc;
        color: #ccc;
        box-sizing: border-box;
        cursor: pointer;
    }
    .p-pic {
        text-align: center;
    }
    .unit-mask {
        display: none;
    }
    .in-container .swiper-slide:hover .unit-desc {
        display: block;
    }
    .in-container .swiper-slide:hover .unit-mask {
        height: 100%;
        display: none;
    }
    .footer {
        height: 90px;
        padding: 10px 0;
    }
    .footer span {
        line-height: 40px;
    }
    .footer .friendly-link {
        float: left;
        display: block;
    }
    .governance .go-bg{
        width: 33.333%;
    }
    .go-pic img{
        max-width: 100%;
    }
    a.ourlogo-item{
        width: 40%;
        margin:40px;
    }
    .reports ul{
        width:100%;
    }
    .reports li{
        width: 50%;
    }
    .team li{
        width: 100%;
    }

    .about-us-pc{display:none;}
    .about-us-mob-pic{text-align:center;padding:20px 0px;}
    .about-us-mob-pic img{max-width: 100%;max-width:80%;}
    .about-us-mob-wrap{margin-bottom:10px;}
    .about-us-mob-desc p{text-align: justify;}
    .about-us-mob-title{font-size:16px;font-weight:bold;margin-bottom:10px;}
    .about-us-mob-bot-title{font-size:20px;font-weight:bold;margin-bottom:10px;}
    .about-us-mob-bot-wrap p{color:#666;margin-bottom:10px;text-align: justify;}
    .about-us-mob{display:block;line-height:1.5;}
    .about-us-mob ul,.about-us-mob li{list-style:none;}
    .about-us-mob li{box-shadow: inset 0px -1px 0px 0px  #dddddd;margin-bottom:20px;padding-bottom:20px;}
    .about-us-mob-title{text-align:left;}
    .about-bullt{    text-indent: 15px;
        background: url(./../image/about-dotted.png) no-repeat left 6px;
        background-size: 12px;}
}


@media (max-width: 767px) and (min-width: 414px) {
    .main-conts {
  
        min-height: calc(100vh - 213px);
     }
    /*mode1*/
    .mode1 {
        padding-top: 50px;
        height: 350px !important;
    }
    .mode4{height:400px!important;}
    .slide-pic {
        width:768px;
        margin-left:-384px;
    }
    .mode1 .container{position:absolute;left:20px;top:20px;}
    .banner3 video{/*margin-left:-384px;*/}
    .slide-pic img {
        *width: 100%;
        width: 100%\0\9;
        width:100%;
        position: initial;
    }
    .swiper-desc {
        position: initial;
        margin-top: 0px;
        padding: 0;
        width: 100%;
        height: auto;
        background:none;
    }
    .swiper-h3 {
        line-height: 30px;
        font-size: 20px;
        width:auto;
    }
    .swiper-h4 {
        line-height: 30px;
        font-size: 16px;
        margin-top: 10px;
    }
    .white {
        color: #666;
    }
    .border-white {
        border: 1px solid #222;
    }
    .swiper-h4.white {
        color: #666;
    }
    .swiper-more {
        width: 100px;
        height: 30px;
        line-height: 30px;
        margin-top: 10px;
    }
    .banner .swiper-page-container {
        bottom: 10px;
    }
    /*mode2*/
    .mode2 {
        padding: 30px 0;
        height: 520px !important;
    }
    .mode-title {
        padding-top: 0;
    }
    .h-container {
        display: none;
    }
    .h-item img {
        max-height: 398px;
    }
    .mo-h-container {
        display: block;
        margin-top: 20px;
        width: 100%;
        height: 380px;
        overflow: hidden;
    }
    .mo-h-container a {
        width: 100%;
    }
    .mo-h-container a {
        display: block;
        float: left;
        box-sizing: border-box;
        width: 100%;
    }
    .mo-h-container .h-item {
        margin: 0 15px;
        background: #fff;
        padding: 10px;
        border: 1px solid #cccccc;
    }
    .mo-h-container .h-title {
        font-size: 15px;
    }
    .h-page {
        width: 100%;
        height: 40px;
        position: absolute;
        bottom: 0;
        line-height: 40px;
        text-align: center;
        z-index:100;
    }
    .h-page .swiper-pagination-switch {
        display: inline-block;
        width: 15px;
        height: 15px;
        border-radius: 15px;
        border: 1px solid #9d9d9d;
        margin: 0 15px;
    }
    .h-page .swiper-visible-switch.swiper-active-switch {
        background: #9d9d9d;
    }
    .h-pic {
        text-align: center;
    }
    /*mode3*/
    .mode3 {
        padding: 30px 0;
        height: 640px !important;
    }
    .p-container {
        display: none;
    }
    .mo-p-container {
        display: block;
        width: 100%;
        height: 390px;
        overflow: hidden;
    }
    .mo-p-container a {
        width: 50%;
    }
    .mo-p-container a .p-item {
        background: #fff;
        height: 350px;
        padding: 10px;
        border: 1px solid #ccc;
    }
    .mo-p-container a .p-desc {
        padding: 0;
    }
    .mo-p-container a .p-title {
        font-size: 15px;
    }
    .mo-p-container a .p-cont {
        margin-top: 0px;
        font-size: 12px;
    }
    .p-page {
        position: absolute;
        width: 100%;
        height: 40px;
        line-height: 40px;
        color: #fff;
        display: block;
        bottom: 10px;
    }
    .p-page-left {
        width: 50%;
        text-align: center;
        float: left;
        background: #cccccc;
        font-size: 28px;
        box-sizing: border-box;
        border: 1px solid #ccc;
        cursor: pointer;
    }
    .p-page-right {
        width: 50%;
        text-align: center;
        float: right;
        font-size: 28px;
        border: 1px solid #ccc;
        color: #ccc;
        box-sizing: border-box;
        cursor: pointer;
    }
    .p-pic {
        text-align: center;
    }
    .in-container.container {
        padding: 0;
    }
    .in-container li {
        padding: 0 5px;
    }
    .in-container li a {
        margin-right: 0px;
        box-sizing: border-box;
    }
    .unit-mask {
        display: none;
    }
    .unit-desc {
        height: 30px;
        line-height: 30px;
        font-size: 16px;
    }
    .in-container .swiper-slide:hover .unit-desc {
        display: block;
    }
    .in-container .swiper-slide:hover .unit-mask {
        height: 100%;
        display: none;
    }
    .footer {
        height: auto;
    }
    .footer span {
        line-height: 24px;
    }
    .footer .friendly-link {
        float: left;
        display: block;
    }
    .contact-left{
        float: none;
        width: 100%;
        text-align: center;
    }
    .contact-right{
        float: none;
        width: 100%;
        text-align: left;
        margin-left: 0;
        margin-top: 30px;
    }
    .governance .go-bg{
        width: 50%;
    }
    .go-pic img{
        max-width: 100%;
    }
    a.ourlogo-item{
        width: 100%;
        margin-right: 0;
    }
    .reports ul{
        width:100%;
    }
    .reports li{
        width: 100%;
    }
    .reports li .report-item{
        margin-right: 0;
    }
    .reports li dd.report-title{
        width: 60%;
    }
    .team li{
        width: 100%;
    }
    .team li .li-bg{
        margin-right: 0;
    }
    .videos li{
        width: 50%;
    }
    .now-bar a{
        display:none;
    }
    .now-bar a:nth-child(1){
        display:inline;
    }
    .now-bar a:last-child{
        display:inline;
    }

    .about-us-pc{display:none;}
    .about-us-mob-pic{text-align:center;padding:20px 0px;}
    .about-us-mob-pic img{max-width: 100%;max-width:80%;}
    .about-us-mob-wrap{margin-bottom:10px;}
    .about-us-mob-desc p{text-align: justify;}
    .about-us-mob-title{font-size:16px;font-weight:bold;margin-bottom:10px;}
    .about-us-mob-bot-title{font-size:20px;font-weight:bold;margin-bottom:10px;}
    .about-us-mob-bot-wrap p{color:#666;margin-bottom:10px;text-align: justify;}
    .about-us-mob{display:block;line-height:1.5;}
    .about-us-mob ul,.about-us-mob li{list-style:none;}
    .about-us-mob li{box-shadow: inset 0px -1px 0px 0px  #dddddd;margin-bottom:20px;padding-bottom:20px;}
    .about-us-mob-title{text-align:left;}
    .about-bullt{    text-indent: 15px;
        background: url(./../image/about-dotted.png) no-repeat left 6px;
        background-size: 12px;}
}

@media (max-width: 500px){
    .curr-nav{
        line-height:inherit;
        padding-bottom: 20px;
        height: inherit;
    }

}
@media (max-width: 414px) and (min-width: 321px) {
    .now-bar span{
        padding:0 5px;
    }
    .mode1 .swiper-slide .container{position: absolute;left:0px;top:20px;white-space: normal;}
    .swiper-h3,.swiper-h4 {width:100%;}
    /*mode1*/
    .mode1 {
        padding-top: 50px;
        height: 350px !important;
    }
    .slide-pic {
        margin-left:-382px;
        width:768px;
    }
    .slide-pic img {
        position: initial;
        *width: 100%;
        width: 100%\0\9;
    }
    .banner3 video{/*margin-left:-384px;*/}
    .swiper-desc {
        position: initial;
        margin-top: 0px;
        padding: 0;
        width: 100%;
        height: auto;
        background:none;
    }
    .swiper-h3 {
        line-height: 30px;
        font-size: 20px;
        width:100%;
    }
    .swiper-h4 {
        line-height: 30px;
        font-size: 16px;
        margin-top: 10px;
    }
    .white {
        color: #666;
    }
    .border-white {
        border: 1px solid #222;
    }
    .swiper-h4.white {
        color: #666;
    }
    .swiper-more {
        width: 100px;
        height: 30px;
        line-height: 30px;
        margin-top: 10px;
    }
    .banner .swiper-page-container {
        bottom: 10px;
    }
    /*mode2*/
    .mode2 {
        position: relative;
        padding: 0;
        height: 560px !important;
    }
    .mode-title {
        padding-top: 25px;
    }
    .mode-desc {
        line-height: 30px;
    }
    .h-container {
        display: none;
    }
    .mo-h-container {
        display: block;
        margin-top: 20px;
        width: 100%;
        height: 375px;
        overflow: hidden;
    }
    .mo-h-container a {
        width: 100%;
    }
    .mo-h-container a {
        display: block;
        float: left;
        box-sizing: border-box;
        width: 100%;
    }
    .mo-h-container .h-item {
        margin: 0 15px;
        background: #fff;
        padding: 10px;
        border: 1px solid #cccccc;
    }
    .mo-h-container .h-title {
        font-size: 15px;
    }
    .h-page {
        width: 100%;
        height: 40px;
        position: absolute;
        bottom: 0;
        line-height: 40px;
        text-align: center;
    }
    .h-page .swiper-pagination-switch {
        display: inline-block;
        width: 15px;
        height: 15px;
        border-radius: 15px;
        border: 1px solid #9d9d9d;
        margin: 0 15px;
    }
    .h-page .swiper-visible-switch.swiper-active-switch {
        background: #9d9d9d;
    }
    /*mode3*/
    .mode3 {
        padding: 0;
        height: 580px !important;
    }
    .p-container {
        display: none;
    }
    .mo-p-container {
        display: block;
        width: 100%;
        height: 325px;
        overflow: hidden;
    }
    .mo-p-container a {
        width: 50%;
    }
    .mo-p-container a .p-item {
        background: #fff;
        min-height: 300px;
        padding: 10px;
        border: 1px solid #ccc;
    }
    .mo-p-container a .p-desc {
        padding: 0;
    }
    .mo-p-container a .p-title {
        font-size: 15px;
    }
    .mo-p-container a .p-cont {
        margin-top: 0px;
        font-size: 12px;
    }
    .p-page {
        position: absolute;
        width: 100%;
        height: 40px;
        line-height: 40px;
        color: #fff;
        display: block;
        bottom: 10px;
    }
    .p-page-left {
        width: 50%;
        text-align: center;
        float: left;
        background: #cccccc;
        font-size: 28px;
        box-sizing: border-box;
        border: 1px solid #ccc;
        cursor: pointer;
    }
    .p-page-right {
        width: 50%;
        text-align: center;
        float: right;
        font-size: 28px;
        border: 1px solid #ccc;
        color: #ccc;
        box-sizing: border-box;
        cursor: pointer;
    }
    /*mode4*/
    .mode4 {
        padding: 0;
        height: 400px !important;
    }
    .in-container.container {
        width: 100%;
        overflow: hidden;
        padding: 0;
    }
    .in-container li {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }
    .in-container li a {
        margin-right: 0px;
        box-sizing: border-box;
    }
    .unit-desc {
        height: 30px;
        line-height: 30px;
        font-size: 12px;
    }
    .in-container li a .unit-mask {
        width: 100%;
    }
    .footer {
        height: auto;
    }
    .footer span {
        text-align: left;
        line-height: 30px;
    }
    .footer .friendly-link {
        float: left;
    }
    .footer .friendly-link a {
        padding: 0 15px 0 0;
    }
    .footer .friendly-link a + a {
        padding-left: 15px;
    }
    #menu {
        display: none;
    }
    .contact-left{
        float: none;
        width: 100%;
        text-align: center;
    }
    .contact-right{
        float: none;
        width: 100%;
        text-align: left;
        margin-left: 0;
        margin-top: 30px;
    }
    .governance .go-bg{
        width: 100%;

    }
    .governance .go-bg a{
        margin-right: 0;
    }
    .history-box-cont{
        margin-top: -30px;
        padding-top: 30px;
    }
    a.ourlogo-item{
        width: 100%;
        margin-right: 0;
    }
    .reports ul{
        width:100%;
    }
    .reports li{
        width: 100%;
    }
    .reports li .report-item{
        margin-right: 0;
    }
    .team li{
        width: 100%;
        height: auto;
    }
    .team li .li-bg{
        margin-right: 0;
    }
    .team li .li-bg dt{
        float:none;
    }
    .team li .li-bg dd{
        float:none;
        width: 100%;
    }
    .videos li{
        width: 100%;
    }
    .videos li dd{
        width: 100%;
    }
    .videos li .video-item{
        margin-right: 0;
    }
    .now-bar a{
        display:none;
    }
    .now-bar a:nth-child(1){
        display:inline;
    }
    .now-bar a:last-child{
        display:inline;
    }

    .about-us-pc{display:none;}
    .about-us-mob-pic{text-align:center;padding:20px 0px;}
    .about-us-mob-pic img{max-width: 100%;max-width:80%;}
    .about-us-mob-wrap{margin-bottom:20px;}
    .about-us-mob-desc p{text-align: justify;    margin-bottom: 10px;}
    .about-us-mob-title{font-size:16px;font-weight:bold;margin-bottom:10px;}
    .about-us-mob-bot-title{font-size:20px;font-weight:bold;margin-bottom:10px;}
    .about-us-mob-bot-wrap p{color:#666;margin-bottom:10px;text-align: justify;}
    .about-us-mob{display:block;line-height:1.5;}
    .about-us-mob ul,.about-us-mob li{list-style:none;}
    .about-us-mob li{box-shadow: inset 0px -1px 0px 0px  #dddddd;margin-bottom:20px;padding-bottom:20px;}
    .about-us-mob-title{text-align:left;}
    .about-bullt{    text-indent: 15px;
        background: url(./../image/about-dotted.png) no-repeat left 6px;
        background-size: 12px;}
}


@media (max-width: 320px) {
    .now-bar span{
        padding:0 5px;
    }
    .mode1 .swiper-slide .container{position: absolute;left:0px;top:20px;white-space: normal;}
    .swiper-h3,.swiper-h4 {width:100%;}
    /*mode1*/
    .mode1 {
        padding-top: 50px;
        height: 350px !important;
    }
    .slide-pic {
        margin-left:-382px;
        width:768px;
    }
    .slide-pic img {
        position: initial;
        *width: 100%;
        width: 100%\0\9;
    }
    .banner3 video{/*margin-left:-384px;*/}
    .swiper-desc {
        position: initial;
        margin-top: 0px;
        padding: 0;
        width: 100%;
        height: auto;
        background:none;
    }
    .swiper-h3 {
        line-height: 30px;
        font-size: 20px;
        width:100%;
    }
    .swiper-h4 {
        line-height: 30px;
        font-size: 16px;
        margin-top: 10px;
    }
    .white {
        color: #666;
    }
    .border-white {
        border: 1px solid #222;
    }
    .swiper-h4.white {
        color: #666;
    }
    .swiper-more {
        width: 100px;
        height: 30px;
        line-height: 30px;
        margin-top: 10px;
    }
    .banner .swiper-page-container {
        bottom: 10px;
    }
    /*mode2*/
    .mode2 {
        position: relative;
        padding: 0;
        height: 560px !important;
    }
    .mode-title {
        padding-top: 25px;
    }
    .mode-desc {
        line-height: 30px;
    }
    .h-container {
        display: none;
    }
    .mo-h-container {
        display: block;
        margin-top: 20px;
        width: 100%;
        height: 375px;
        overflow: hidden;
    }
    .mo-h-container a {
        width: 100%;
    }
    .mo-h-container a {
        display: block;
        float: left;
        box-sizing: border-box;
        width: 100%;
    }
    .mo-h-container .h-item {
        margin: 0 15px;
        background: #fff;
        padding: 10px;
        border: 1px solid #cccccc;
    }
    .mo-h-container .h-title {
        font-size: 15px;
    }
    .h-page {
        width: 100%;
        height: 40px;
        position: absolute;
        bottom: 0;
        line-height: 40px;
        text-align: center;
    }
    .h-page .swiper-pagination-switch {
        display: inline-block;
        width: 15px;
        height: 15px;
        border-radius: 15px;
        border: 1px solid #9d9d9d;
        margin: 0 15px;
    }
    .h-page .swiper-visible-switch.swiper-active-switch {
        background: #9d9d9d;
    }
    /*mode3*/
    .mode3 {
        padding: 0;
        height: 580px !important;
    }
    .p-container {
        display: none;
    }
    .mo-p-container {
        display: block;
        width: 100%;
        height: 325px;
        overflow: hidden;
    }
    .mo-p-container a {
        width: 50%;
    }
    .mo-p-container a .p-item {
        background: #fff;
        min-height: 300px;
        padding: 10px;
        border: 1px solid #ccc;
    }
    .mo-p-container a .p-desc {
        padding: 0;
    }
    .mo-p-container a .p-title {
        font-size: 15px;
    }
    .mo-p-container a .p-cont {
        margin-top: 0px;
        font-size: 12px;
    }
    .p-page {
        position: absolute;
        width: 100%;
        height: 40px;
        line-height: 40px;
        color: #fff;
        display: block;
        bottom: 10px;
    }
    .p-page-left {
        width: 50%;
        text-align: center;
        float: left;
        background: #cccccc;
        font-size: 28px;
        box-sizing: border-box;
        border: 1px solid #ccc;
        cursor: pointer;
    }
    .p-page-right {
        width: 50%;
        text-align: center;
        float: right;
        font-size: 28px;
        border: 1px solid #ccc;
        color: #ccc;
        box-sizing: border-box;
        cursor: pointer;
    }
    /*mode4*/
    .mode4 {
        padding: 0;
        height: 400px !important;
    }
    .in-container.container {
        width: 100%;
        overflow: hidden;
        padding: 0;
    }
    .in-container li {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }
    .in-container li a {
        margin-right: 0px;
        box-sizing: border-box;
    }
    .unit-desc {
        height: 30px;
        line-height: 30px;
        font-size: 12px;
    }
    .in-container li a .unit-mask {
        width: 100%;
    }
    .footer {
        height: auto;
    }
    .footer span {
        text-align: left;
        line-height: 30px;
    }
    .footer .friendly-link {
        float: left;
    }
    .footer .friendly-link a {
        padding: 0 15px 0 0;
    }
    .footer .friendly-link a + a {
        padding-left: 15px;
    }
    #menu {
        display: none;
    }
    .contact-left{
        float: none;
        width: 100%;
        text-align: center;
    }
    .contact-right{
        float: none;
        width: 100%;
        text-align: left;
        margin-left: 0;
        margin-top: 30px;
    }
    .governance .go-bg{
        width: 100%;

    }
    .governance .go-bg a{
        margin-right: 0;
    }
    .history-box-cont{
        margin-top: -30px;
        padding-top: 30px;
    }
    a.ourlogo-item{
        width: 100%;
        margin-right: 0;
    }
    .reports ul{
        width:100%;
    }
    .reports li{
        width: 100%;
    }
    .reports li .report-item{
        margin-right: 0;
    }
    .team li{
        width: 100%;
        height: auto;
    }
    .team li .li-bg{
        margin-right: 0;
    }
    .team li .li-bg dt{
        float:none;
    }
    .team li .li-bg dd{
        float:none;
        width: 100%;
    }
    .videos li{
        width: 100%;
    }
    .videos li dd{
        width: 100%;
    }
    .videos li .video-item{
        margin-right: 0;
    }
    .now-bar a{
        display:none;
    }
    .now-bar a:nth-child(1){
        display:inline;
    }
    .now-bar a:last-child{
        display:inline;
    }

    .about-us-pc{display:none;}
    .about-us-mob-pic{text-align:center;padding:20px 0px;}
    .about-us-mob-pic img{max-width: 100%;max-width:80%;}
    .about-us-mob-wrap{margin-bottom:10px;}
    .about-us-mob-desc p{text-align: justify;}
    .about-us-mob-title{font-size:16px;font-weight:bold;margin-bottom:10px;}
    .about-us-mob-bot-title{font-size:20px;font-weight:bold;margin-bottom:10px;}
    .about-us-mob-bot-wrap p{color:#666;margin-bottom:10px;text-align: justify;}
    .about-us-mob{display:block;line-height:1.5;}
    .about-us-mob ul,.about-us-mob li{list-style:none;}
    .about-us-mob li{box-shadow: inset 0px -1px 0px 0px  #dddddd;margin-bottom:20px;padding-bottom:20px;}
    .about-us-mob-title{text-align:left;}
    .about-bullt{    text-indent: 15px;
        background: url(./../image/about-dotted.png) no-repeat left 6px;
        background-size: 12px;}

}