@font-face { 
    font-family: 'chalet'; 
    src: url('../fonts/chaletcomprime-cologneeighty.eot'); 
    src: url('../fonts/chaletcomprime-cologneeighty.eot') format('embedded-opentype'), 
    /* url('../fonts/chaletcomprime-cologneeighty.woff2') format('woff2'),  */
    url('../fonts/chaletcomprime-cologneeighty.woff') format('woff'), 
    url('../fonts/chaletcomprime-cologneeighty.ttf') format('truetype'), 
    url('../fonts/chaletcomprime-cologneeighty.svg') format('svg'); 
    font-weight: normal; 
    font-style: normal; 
}

/* reset */
@charset "utf-8";
* { margin: 0; padding: 0; outline: 0; -webkit-text-size-adjust: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; font-style: 100px; height: 100%; }
body { font: .18rem/1.5 'Helvetica Neue', Helvetica, 'Hiragino Sans GB', STHeiti, sans-serif; color: #000; background: #fff; height: 100%; opacity: 0; }
.pg { opacity: 1; }
img { border: 0; vertical-align: top; max-width: 100%; }
table { border-collapse: collapse; border-spacing: 0; }
ol, ul { list-style: none; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
input, textarea, select, button { font: inherit; outline: none; -webkit-appearance: none; border-radius: 0; }
b, i, cite { font-style: normal; font-weight: normal; }
a { text-decoration: none; color: #000; }

/* common */
.clearfix:after { content: ''; display: block; clear: both }
.flex { -webkit-box-flex: 1; -moz-box-flex: 1; -ms-flex: 1; -webkit-flex: 1; flex: 1; }
.flexbox, .box { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; }
.flex-col, .box { -webkit-box-orient: vertical; -moz-box-orient: vertical; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column; }
.flex-ver-center { -webkit-align-items: flex-center; -moz-align-items: flex-center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
.main-en .flex-ver-center { box-align:center; }
.flex-wrap {    /*warn: old syntax box-lines is invalid*/-webkit-box-lines: multiple; -webkit-box-direction: normal; -moz-box-lines: multiple; -moz-box-direction: normal; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.pic[data-src] { -webkit-background-size: cover; background-size: cover; background-position: center top; }
.main { }
.box { position: relative; overflow: hidden; }
.home-cover { background: url(../images/p1.jpg) center top no-repeat; background-size: cover; opacity: 0; }
.home-swiper { }
.home-swiper .swiper-slide { background-size: cover; background-position: center top; opacity: 0; }
.main .home-swiper.swiper-container-horizontal>.swiper-pagination { text-align: center; left: 0; bottom: .4rem; }
.main .home-swiper.swiper-container-horizontal>.swiper-pagination span { background: rgba(255, 255, 255, .5); }
.main .home-swiper.swiper-container-horizontal>.swiper-pagination span.swiper-pagination-bullet-active { }
.home-title {display:none;position: absolute;color: #fff;font-family: 'chalet';left: .15rem;top: 50%;font-size: .85rem;line-height: .65rem;text-transform: uppercase;margin: -1rem 0 0;opacity: 0; /*animation: home-title 2s linear infinite alternate-reverse;-webkit-animation: home-title 2s linear infinite alternate-reverse;-moz-animation: home-title 2s linear infinite alternate-reverse;*/ z-index: 1;}

@keyframes home-title {
    from { text-shadow: 0 0 20px rgba(255,255,255,1); }
    to { text-shadow: 0 0 5px rgba(128,128,128,.5); ; }
}
@-webkit-keyframes home-title {
    from { text-shadow: 0 0 20px rgba(255,255,255,1); }
    to { text-shadow: 0 0 5px rgba(128,128,128,.5); ; }
}
@-moz-keyframes home-title {
    from { text-shadow: 0 0 20px rgba(255,255,255,1); }
    to { text-shadow: 0 0 5px rgba(128,128,128,.5); ; }
}
.home-arrow { position: absolute; left: 50%; bottom: .2rem; background: url(../images/arrow.png) center no-repeat; background-size: .125rem; width: .125rem; height: .095rem; margin: -.0475rem 0 0 -.0625rem; z-index: 11; -webkit-animation: home-arrow 2s infinite; -moz-animation: home-arrow 2s infinite; animation: home-arrow 2s infinite; }
@-webkit-keyframes home-arrow {
    from { bottom: .2rem; }
    to { bottom: .1rem; }
}
@-moz-keyframes home-arrow {
    from { bottom: .2rem; }
    to { bottom: .1rem; }
}
@keyframes home-arrow {
    from { bottom: .2rem; }
    to { bottom: .1rem; }
}
.intro { text-align: center; }
.intro h3 { font-size: .2rem; padding: 0 0 .09rem; }
.intro .line { background: #424242; height: 1px; overflow: hidden; border-bottom: #F2F2F2 1px solid; width: .18rem; margin: 0 auto; }
.intro .quot { font-family: 'chalet'; font-size: .6rem; line-height: .28rem; overflow: hidden; padding: .09rem 0 0; }
.intro .quot span { display: inline-block; vertical-align: top; position: relative; top: .12rem; }
.intro .text { font-size: .11rem; line-height: .225rem; }
.intro .btn { padding: 22px 0 0; }
.intro .btn a { display: inline-block; vertical-align: top; font-size: 10px; color: #fff; background: #000; line-height: 27px; padding: 2px 19px 0; border-radius: 1px; }
.intro .ceo { font-size: .11rem; line-height: .225rem; padding: .28rem 0 0; }
.intro .ceo strong { }
.intro .sign { padding: .12rem 0 0; height: .66rem; }
.intro .sign img { width: 1rem; }
.intro-box { width: 100%; }
.intro-box > * { transform: translateY(-.3rem); opacity: 0; }
.count { max-height: 2.2rem; }
.count li { width: 50%; border: #E4E4E4 1px solid; border-width: 1px 0 0 0; box-sizing: border-box; transform: translateY(200%); opacity: 0; padding: .2rem 0; }
.count li:nth-child(2n+2) { border-width: 1px 0 0 1px; }
.count li > div { width: 100%; text-align: center; }
.count li b { display: block; font-family: 'chalet'; font-size: .6rem; line-height: .5rem; letter-spacing: -4px; height: .5rem; overflow: hidden; position: relative; }
.count li em { display: none; }
.count li i { display: block; font-size: .09rem; }
.count li .sup { font-size: .36rem; position: relative; bottom: .16rem; display: inline-block; vertical-align: top; }
.count li .sub { position: relative; bottom: .05rem; display: inline-block; vertical-align: top; }
.info-list { }
.info-list .item { background: #000; color: #fff; }
.info-list .pic { height: 45%;    /* position: absolute; */ }
.info-list-con { color: #fff; position: absolute; z-index: 1; left: 0; top: 55%; height: 45%; opacity: 0; width: 100%; }
.info-list-con .con { padding: 0 .3rem; height: 50%; display: none; }

.info-list-con .pic {
    height: 40%;
}
.info-list-con .con:first-child { display: block; }
.info-list-con .con h3 { font-family: 'chalet'; font-size: .4rem; text-transform: uppercase; line-height: .4rem; height: .4rem; padding: .24rem 0 0; }
.info-list-con .con h4 { font-size: .14rem; }
.info-list-con .con .des { padding: .1rem 0 0; }
.info-list-con .con .des p { font-size: .1rem; line-height: .17rem; }
.info-list-con .con .more { padding: .24rem 0 0; font-size: .09rem; }
.info-list-con .con .more a { color: #fff; text-decoration: underline; text-transform: uppercase; }
.info-list-con .con .more a span{opacity: 0;text-decoration: none;  -webkit-transform: scale(3); transform: scale(2); display: block; float: left;}
.info-page, .box .swiper-container-horizontal>.swiper-pagination { position: absolute; left: .27rem; bottom: .27rem; height: .08rem; text-align: left; opacity: 0; }
.box .swiper-container-horizontal>.swiper-pagination span { display: inline-block; vertical-align: top; width: .08rem; height: .08rem; margin: 0.03rem; border-radius: 50%; background: #666666; opacity: 1; }
.box .swiper-container-horizontal>.swiper-pagination span.swiper-pagination-bullet-active { background: #fff; }
.join { position: absolute; right: 0; bottom: 0; background: url(../images/join.png); width: .5rem; height: .535rem; background-size: .5rem; }
.news-tag { opacity: 0; }
.news-tag ul {font-size: .11rem;line-height: 2;padding: .15rem 0;}
.main-en .news-tag ul {font-size: .0.08rem;line-height: 2;padding: .15rem 2px;}
.news-tag li {float: left;width: 20%;text-align: center;position: relative;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.news-tag li.now { position: relative; }
.news-tag li.now:after { position: absolute; width: 4em; height: 1px; background: #000; left: 50%; bottom: 0; content: ''; margin: 0 0 0 -2em; }
.news-tag li select{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}
.news-list {height: 100%; background: #000;}
.news-list .item {position: relative;color: #fff;max-height: 33.33%;overflow: hidden;/* height: 33.33%; */}
.news-list .item .pic { position: absolute; width: 100%; height: 100%; }
.news-list .item .des { position: absolute; font-size: .11rem; line-height: .175rem; text-align: center; width: 100%; padding: .05rem 0; background: rgba(0, 0, 0, .7); bottom: 0; transition: all 1s; }
.news-list .item .des2 { position: relative; font-size: .16rem; line-height: .175rem; text-align: center; width: 100%; }
.news-list .item a { position: absolute; width: 100%; height: 100%; left: 0; top: 0; }
.news-btn {    /* position: absolute; */
right: 0; bottom: 0; opacity: 0; }
.news-btn span { display: inline-block; vertical-align: top; width: .33rem; height: .33rem; background-position: center; background-repeat: no-repeat; background-size: .135rem; position: absolute; z-index: 4; top: 56%; }
.news-btn span.prev { background-image: url(../images/arrow-left2.png);    /* border-right: 1px solid #3F517B; */ }
.news-btn span.next { background-image: url(../images/arrow-right2.png); right: 0; }
.brand-box { position: relative; transform: translateY(0rem); }
.brand {position: relative;width: 100%;height: calc(100% / 6);max-height: calc(100% / 6);transform: translateY(.3rem);opacity: 0;text-align: center;border-top: 1px solid #fff;background: url(../images/pic_wl.jpg) #000;overflow: hidden;}
.brand > a {    /* position: absolute; */

    /* top: 0; */

    /* left: 0; */

    /* width: 100%; */

/* height: 100%; */ }
.brand .pic {}
.brand-logo {position: relative;text-align: center;width: 100%;background:url(../images/down.png) 90% center no-repeat;}

.brand-logo.up{ background-image:url(../images/up1.png), url(../mob/pic/pic_wl.jpg);}
.brand-logo img {width: 50%;margin: 0 auto;}
.brand-logo img.down{position: absolute;top: 50%;right: 10%;margin-top: -6px;width: auto;}
.brand-logo.up img:nth-of-type(2){transform:rotate(180deg);-ms-transform:rotate(180deg); -moz-transform:rotate(180deg); -webkit-transform:rotate(180deg);}
.brand-pic-new{overflow: hidden;}
.brand-pic-new a{display: block;text-align: center;margin:0 auto; background: #000; color: #fff;position: absolute;bottom: 1rem;left: 50%;margin-left: -.3875rem;opacity: 0;transform: translateY(.3rem); width: .775rem; height: .775rem; box-sizing: border-box; text-align: center; font-size: .16rem; line-height: .18rem; padding: .21rem 0 0; border-radius: 50%;}
.brand-pic-new a img{ width: .775rem; border-radius: 50%;}

.brand-1 { left: 0; top: 0; height: 50%; transform: translateY(.3rem); z-index: 7; }
.brand-2 { right: 0; top: 0; height: 25%; z-index: 6; }
.brand-3 { right: 0; top: 25%; height: 25%; z-index: 5; }
.brand-4 { left: 0; top: 50%; height: 25%; z-index: 4; }
.brand-5 { right: 0; top: 50%; height: 25%; z-index: 3; }
.brand-6 { left: 0; top: 75%; height: 25%; z-index: 2; }
.brand-7 { right: 0; top: 75%; height: 25%; z-index: 1; }
.brand-show{
    position: absolute;
    top: -.6rem;
    z-index: 1;
    bottom: 0;
    max-height: 9999px;
    height: auto;
}

.brand-show .brand-pic-new{
    display: block;
    position: relative;
    max-height: 100%;
    transition: all 1s;
    height:auto;
}

.brand-show .brand-pic-new a {
    opacity: 1;
    transition: all .5s .5s;
    background:url(../images/btn_know_more.png) center center / 100% 100% no-repeat;
    text-indent:-99em;
}
.brand-show .brand-pic-new a br {display:none;}

.picwall { background: #000; transition: all .5s; width: 3.75rem; }
/*
.picwall:after{content: '';background: url(../images/touch.png);background-size: .75rem;width: .75rem;height: .775rem;position: absolute;left: 50%;margin: 0 0 0 -.3725rem;z-index: 1;bottom: 0;-webkit-animation:  picwall 1s linear infinite alternate-reverse;
       -moz-animation:  picwall 1s linear infinite alternate-reverse;
            animation: picwall 1s linear infinite alternate-reverse;}
*/
.picwall-tip{content: '';background: url(../images/touch.png) no-repeat;background-size: .45rem;width: .45rem;height: .475rem;position: absolute;left: 50%;margin: 0 0 0 -.3725rem;z-index: 1;bottom: 0;-webkit-animation:  picwall 1s linear infinite alternate-reverse;
       -moz-animation:  picwall 1s linear infinite alternate-reverse;
            animation: picwall 1s linear infinite alternate-reverse;}


@-webkit-keyframes picwall { from { left: 45%; } to { left: 55%; }  }
   @-moz-keyframes picwall { from { left: 45%; } to { left: 55%; }  }
        @keyframes picwall { from { left: 45%; } to { left: 55%; }  }
.picwall li {position: relative;height: 25%;width: 100%;background: #000;color: #cbcbcb;backface-visibility: hidden;transform: rotateY(180deg);-webkit-backface-visibility: hidden;}
.picwall li .pic { position: absolute; width: 100%; height: 100%; }
.picwall li .des { position: absolute; width: 100%; height: 100%; }
.picwall li .des h3 { font-size: .14rem; line-height: .2rem; }
.picwall li .des h4 { line-height: .2rem; font-size: .1rem; }
.picwall li .des .line { width: .18rem; height: 1px; background: #525252; margin: .08rem auto 0; }
.picwall li .des p { margin: .08rem auto 0; font-size: .1rem; }
.picwall li .des-box { width: 100%; text-align: center; }
.picwall-btn { position: absolute; right: 0; bottom: 0; opacity: 0; }
.picwall-btn span { display: inline-block; vertical-align: top; width: .33rem; height: .33rem; background-color: #D8D8D8; background-position: center; background-repeat: no-repeat; background-size: .135rem; }
.picwall-btn span.prev { background-image: url(../images/arrow-left.png); border-right: 1px solid #3F517B; }
.picwall-btn span.next { background-image: url(../images/arrow-right.png); }
.foot { background: #000; color: #fff; padding: .1rem .15rem; }
.foot .f1 { font-size: .06rem; line-height: .1rem; margin: 0 0 0 -.1rem; }
.foot .f1 a { color: #fff; padding: 0 .1rem; }
.foot .f2 { font-size: .05rem; line-height: .1rem; }
.footer { color: #f2f2f2; font-size: 12px; text-align: center; }
.footer h4 { text-transform: uppercase; padding: 25px 0 0; }
.footer .share { padding: 12px 0 22px; margin: 0 4px; border-bottom: #363636 1px solid; }
.footer .share a { display: inline-block; vertical-align: top; width: 25px; height: 25px; background-color: #646464; border-radius: 50%; margin: 0 8px; background-position: center; background-repeat: no-repeat; }
.footer .share a:active { }
.footer .share a.share-wechat {background-image: url(../images/icon1.png);background-size: 13px;}
.footer .share a.share-sina { background-image: url(../images/icon2.png); background-size: 17px; }
.footer .share a.share-youku { background-image: url(../images/icon3.png); background-size: 17px; }
.footer .links { padding: 22px 0; margin: 0 4px; border-bottom: #363636 1px solid; }
.footer .links ul { }
.footer .links li { float: left; width: 25%; }
.footer .links li:first-child { }
.footer .links li a { color: #f2f2f2; }
.footer .copyright { line-height: 2; font-size: 12px; opacity: .4; padding: 2px 0 0; text-transform: uppercase; }
.pg .footer { background: #000; padding: 0 0 25px; }
.pg-news { padding: 0 0 .32rem; }
.pg-news .pic { }
.pg-news .pic img { }
.pg-news-dl { font-size: .125rem; line-height: .22rem; padding: .2rem .15rem 0; }
.pg-news-dl dt { font-weight: bold; }
.pg-news-dl dd { }
.pg-news h2 { margin: 0 .15rem; font-size: .16rem; border-bottom: #CBCBCB 1px solid; padding: .18rem 0; }
.pg-news h2 i { font-size: .125rem; }
.pg-news .news-content { }
.pg-news .news-content p { font-size: .125rem; line-height: .225rem; margin: .225rem .15rem; }
.pg-news .news-content p b { font-weight: bold; }
.pg-news .news-content p.new-pic { }
.pg-news .news-content p.new-pic img { }
.pg-news .news-content strong {display:block;box-sizing:border-box;font-size:.125rem;line-height:.225rem;margin:.225rem .15rem;}
.pg-news .news-content p strong {margin-left:0;margin-right:0;}
.pg-news .news-content2 p { font-size: .125rem; line-height: .225rem; padding: 0 .15rem; min-height: .225rem; }
.pg-news-close {padding: .1rem 0 0;text-align: right;}
.pg-news-close a {background: url(../images/close.png) center no-repeat;background-size: .26rem;height: .32rem;display: inline-block;width: .52rem;vertical-align: top;}

.pg-team { padding: 0 .15rem; }
.pg-team-item { float: left; width: 50%; box-sizing: border-box; text-align: center; padding: .3rem 0; border: #E4E4E4 1px solid; }
.pg-team-item:nth-child(2n+1) { border-width: 1px 1px 0 0; }
.pg-team-item:nth-child(2n+2) { border-width: 1px 0 0 0; }
.pg-team-item h4 { font-size: .11rem; font-weight: bold; line-height: .2rem; text-transform: uppercase; }
.pg-team-item .line { width: .15rem; background: #878787; height: 1px; margin: .12rem auto; }
.pg-team-item p { font-size: .11rem; line-height: .2rem; text-transform: uppercase; }
.pg-event { padding: 0 0 .24rem; }
.pg-event-item { position: relative; }
.pg-event-item dl { position: absolute; z-index: 1; }
.pg-event-item dt { font-size: .16rem; font-weight: bold; }
.pg-event-item dt b { font-weight: bold; display: inline-block; vertical-align: top; border-bottom: .01rem solid #000; }
.pg-event-item dd { font-size: .09rem; line-height: .16rem; padding: .06rem 0 0; }
.pg-event-item1 { margin-top: .54rem; z-index: 8; }
.pg-event-item1 dl { top: .24rem; left: 1.68rem; }
.pg-event-item1 dt { font-size: .2rem; }
.pg-event-item2 { margin-top: .5rem; z-index: 7; }
.pg-event-item2 dl { top: .72rem; left: .4rem; }
.pg-event-item3 { margin-top: -.04rem; z-index: 6; }
.pg-event-item3 dl { top: .6rem; width: 1.6rem; text-align: right; }
.pg-event-item4 { margin-top: -.46rem; }
.pg-event-item4 dl { top: .6rem; width: 1.38rem; right: 0; }
.pg-event-item5 { margin-top: .38rem; }
.pg-event-item5 dl { position: static; padding: .2rem .15rem 0; }
.pg-event-item6 { margin-top: .36rem; }
.pg-event-item6 dl { top: .35rem; right: 0; width: 1.6rem; }
.pg-event-item7 { margin-top: .35rem; }
.pg-event-item7 dl { position: static; padding: 0 .32rem; }
.pg-event-item8 { margin-top: .3rem; }
.pg-event-item8 dl { top: 1.04rem; width: 1.68rem; right: 0; }
.pg-event-item9 { margin-top: .15rem; }
.pg-event-item9 dl { top: .4rem; left: .15rem; }
.brand-swiper { height: auto !important; }
.brand-swiper img { width: 100%; }
.brand-swiper.swiper-container-horizontal>.swiper-pagination { text-align: center; left: 0; bottom: .1rem; }
.brand-swiper.swiper-container-horizontal>.swiper-pagination span { background: rgba(255, 255, 255, .5); }
.brand-swiper.swiper-container-horizontal>.swiper-pagination span.swiper-pagination-bullet-active { }
.brand-tit { padding: .4rem .15rem .3rem; }
.brand-tit img { }
.brand-link { padding: .36rem .15rem 0; }
.brand-link a { display: block; font-size: .125rem; font-weight: bold; text-decoration: underline; line-height: 2; }
.pg-share { margin: .4rem 0 0  .15rem; border-top: .01rem solid #CBCBCB; padding: .32rem 0 0; }
.pg-share dl { }
.pg-share dt { font-size: .125rem; font-weight: bold; }
.pg-share dd { padding: .24rem 0 0; font-size: 0; }
.pg-share dd a { display: inline-block; vertical-align: top; margin: 0 .1rem 0 0; }
.pg-share dd a img { width: .25rem; }
.pg-close {position: absolute;right: 0;z-index: 1;top: 0;}
.pg-close a { background: url(../images/close.png) center no-repeat; background-size: .26rem; height: .52rem; display: inline-block; width: .52rem; vertical-align: top; }

.pg-top {position: absolute;left: 0;z-index: 1;top: 0;}
.pg-top .logo { float: left; background: url(../images/logo2.png); width: 2.035rem; height: .2rem; background-size: 2.035rem; margin: .2rem 0 0 .15rem; }
.pg-top .logo-en { width:1.3rem;background: url(../images/logo2-en.png) left center no-repeat; background-size: 100% auto; }

.withus-box { height: 100%; background: #E3E3E3; box-sizing: border-box; position: absolute; top: 0; left: 0; width: 100%; overflow: hidden; }
.withus-tit { text-align: center; padding: .36rem 0 0; }
.withus-tit dt { font-size: .15rem; }
.withus-tit dd { font-size: .11rem; }
.withus {position: relative;width: 3rem;height: 3.66rem;margin: 1rem auto 0;}
.withus .front { height: 3.66rem; background-size: cover; position: relative; }
.withus .back { height: 3.66rem; background-size: cover; position: relative; }
.withus .front .introduce {position: absolute;left: 0;bottom: 0;background: #fff;width: 100%;padding: 0 0 .1rem;}

.withus .front .introduce:before {content: '';background: url(../images/up-black.png);width: .28rem;height: .26rem;position: absolute;background-size: .28rem;left: 50%; bottom: 0rem; margin-left: -.14rem;-webkit-animation:  up 1s infinite alternate-reverse;
       -moz-animation:  up 1s infinite alternate-reverse;
            animation: up 1s infinite alternate-reverse;}
.withus .front .introduce p { font-size: .15rem; padding: .1rem .15rem; }
.withus .back .introduce { position: absolute; left: 0; bottom: 0; background: #000; width: 100%; color: #fff; }
.withus .back .introduce:before {content: '';background: url(../images/up-white.png);width: .28rem;height: .26rem;position: absolute;background-size: .28rem;left: 50%; bottom: 0rem; margin-left: -.14rem;-webkit-animation:  up 1s infinite alternate-reverse;
       -moz-animation:  up 1s infinite alternate-reverse;
            animation: up 1s infinite alternate-reverse;}
.withus .back .introduce p {font-size: .11rem;padding: .1rem .15rem .3rem;}
.withus .flip-container { -webkit-perspective: 1000; perspective: 1000; position: absolute; width: 100%; height: 100%; transform: translateY(-1.6rem) scale(.512); opacity: 0; transition: all .5s; }
.withus .flipper { -webkit-transition: all .6s 0s; transition: all .6s 0s; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; position: relative; height: 100%; }
.withus .front, .withus .back { -webkit-backface-visibility: hidden; backface-visibility: hidden; position: absolute; top: 0; left: 0; width: 100%; background-size: cover; background-position: bottom center; }
.withus .front { z-index: 2; background-position: top center; }

.withus .front:before {
content: '';
background: url(../images/point.png);
width: .36rem;
height: .36rem;
position: absolute;
background-size: .36rem;
left: .4rem;
top: .4rem;
-webkit-animation:  point 1s infinite alternate-reverse;
-moz-animation:  point 1s infinite alternate-reverse;
animation: point 1s infinite alternate-reverse;
display: none;
}

@-webkit-keyframes point { from { opacity: 1; } to { opacity: .5; }  }
   @-moz-keyframes point { from { opacity: 1; } to { opacity: .5; }  }
        @keyframes point { from { opacity: 1; } to { opacity: .5; }  }
        @-webkit-keyframes up { from { bottom: 0; } to { bottom: .1rem; }  }
   @-moz-keyframes up { from { bottom: 0; } to { bottom: .1rem; }  }
        @keyframes up { from { bottom: 0; } to { bottom: .1rem; }  }
.withus .back { -webkit-transform: rotateY(180deg); transform: rotateY(180deg); background-position: top center; }
.withus .flip-container img { width: 100%; height: 100%; }
.flip-container.hover .flipper { -webkit-transform: rotateY(180deg); -webkit-transition: all .8s 0s; -moz-transform: rotateY(180deg); -moz-transition: all .8s 0s; transform: rotateY(180deg); transition: all .8s 0s; }
.withus .flip-container.rank0 { z-index: 5 !important; }
.withus .flip-container.rank1 { transform: translateY(0rem) scale(1); z-index: 4; opacity: 1; transition: all 0s; }
.withus .flip-container.rank2 { transform: translateY(-.64rem) scale(.8); opacity: .75; z-index: 3; }
.withus .flip-container.rank3 { transform: translateY(-1.16rem) scale(.64); opacity: .5; z-index: 2; }
.withus .flip-container.rank4 { transform: translateY(-1.6rem) scale(.512); opacity: .25; }
.top { height: .6rem; opacity: 0; }
.top .logo { float: left; background: url(../images/logo2.png); width: 2.035rem; height: .2rem; background-size: 2.035rem; margin: .2rem 0 0 .15rem; }
.top .logo-en { width:1.3rem;background: url(../images/logo2-en.png) left center no-repeat; background-size: 100% auto; }
.top .nav { float: right; background: url(../images/nav2.png); width: .225rem; height: .18rem; background-size: .225rem; margin: .22rem .15rem 0 0; }
.top-fix { position: absolute; left: 0; top: 0; width: 100%; z-index: 11; }
.top-fix .logo { background-image: url(../images/logo1.png); }
.top-fix .logo-en { width:1.3rem;background: url(../images/logo1-en.png) left center no-repeat; background-size: 100% auto; }
.top-fix .nav { background-image: url(../images/nav1.png); }
#homeTop.home-top-1 .logo{ background-image: url(../images/logo2.png);}
#homeTop.home-top-1 .logo-en{ width:1.3rem;background: url(../images/logo2-en.png) left center no-repeat; background-size: 100% auto;}
#homeTop.home-top-1 .nav{ background-image: url(../images/nav2.png);}
#homeTop.home-top-3 .logo{ background-image: url(../images/logo2.png);}
#homeTop.home-top-3 .logo-en{ width:1.3rem;background: url(../images/logo2-en.png) left center no-repeat; background-size: 100% auto;}
#homeTop.home-top-3 .nav{ background-image: url(../images/nav2.png);}
.pg .top { opacity: 1; }
.wx-wrap { position: fixed; width: 100%; height: 100%; background: rgba(0, 0, 0, .5); left: 0; top: 0; z-index: 1; }
.wx-wrap span { position: absolute; left: 50%; top: 50%; margin: -1rem 0 0 -1rem; }
.wx-wrap img { width: 2rem; }
#view, .swiper-container { width: 100%; height: 100%; overflow: hidden; position: relative; }
.menu { position: fixed; z-index: 9; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .9); display: none; }
.menu-close { padding: .05rem 0 0; text-align: right; }
.menu-close span { background: url(../images/close.png) center no-repeat; background-size: .26rem; height: .52rem; display: inline-block; width: .52rem; vertical-align: top; }
.menu-close span:active { }
.menu-list {/* border-top: #343434 1px solid; */margin: .16rem 0 0;}
.menu-list li {line-height: .65rem;color: #fff;text-align: center;font-size: .14rem;/* border-bottom: #343434 1px solid; */position: relative;}

.menu-list li:after {content: '';position: absolute;border-bottom: #343434 1px solid;width: 1.6em;bottom: 0;left: 50%;margin: 0 0 0 -.8em;}
.menu-list li:active { }
.menu-lg {position: absolute;bottom: .2rem;width: 100%;text-align: center;color: #fff;font-size: .1rem;}
.menu-lg a {color: #fff;padding: .1rem;}
.pg-video { position: fixed; z-index: 99; background: #000; width: 100%; height: 100%; top: 0; left: 0; }
.pg-video .playbox { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.pg-video .playbox video { position: absolute; width: 100%; height: 100%; }
.pg-video .playbox:after { content: ''; position: absolute; background: url(../images/play.png); width: .435rem; height: .435rem; background-size: .435rem; left: 50%; top: 50%; margin: -.2175rem 0 0 -.2175rem; cursor: pointer; display: none; }
.pg-footer { top: -.6rem; background: #fff; z-index: 1; position: relative; }
.news-contact{}
.news-contact p{
    font-size: .125rem;
    line-height: .225rem;
    padding: .225rem .15rem 0;
}
.news-contact p b{
    font-weight: bold;
}
.news-contact table{
    line-height: .225rem;
    margin: 0 .15rem 0;
    font-size: .09rem;
    text-align: center;
}
.news-contact table td{}
.news-contact .mail{
    border-bottom: 1px solid;
    color: #0033ff;
}
.pg-back{margin: .2rem .15rem 0; padding: .26rem 0 0; border-top: #D8D8D8 1px solid; text-align: right;}
.pg-back img{
    width: .3rem;
}
.pg-share-btn{ float: left;}
.loading-block{position: fixed;z-index: 98;background: rgba(0,0,0,1);width: 100%;height: 100%;top: 0;transition: all .5s;opacity: 1;display: block;}
.loading-bg{display: block; width: 321px; height: 12px;  top: 45%; left: 50%; margin-left: -160px; position: absolute; background:url(../images/loading1.png) no-repeat; background-size: cover;}
.loading-front{display: block; width:0px; height: 12px;  top: 45%; left: 50%; margin-left: -160px; position: absolute; background:url(../images/loading2.png) no-repeat; background-size: cover;}
.loading-num { display: block; width: 100px; text-align: center; font-size: 24px; line-height:24px; top: 50%; left: 50%; margin-left: -50px; margin-top: 0px; position: absolute; font-family: 'chalet'; color: #fff; }

.viewport-tip{position: absolute;z-index: 0;background: rgba(0,0,0,.59);width: 100%;height: 100%;top: 0;transition: all .5s;opacity: 0;display: none;}
.viewport-tip:after{content: '';background: url(../images/tip.png);background-size: .865rem;width: .865rem;height: .865rem;position: absolute;left: 50%;top: 50%;margin: -.4325rem 0 0 -.4325rem; }
.pop-wxshare{ position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.85) url(../images/wxshare.png) top right no-repeat; background-size: 2rem;    z-index: 999; display: none;}

@media all and (orientation : landscape) { 

.viewport-tip{z-index: 99;opacity: 1;display: block;}

} 
.video-page{
    color: #fff;
    background:#000000;
}
.video-page .close{
    color: #fff;
    padding: .1rem .1rem 0;
    text-align: right;
}
.video-page .close img{
    width: .33rem;
}
.video-page h1{
    color: #fff;
    text-align: center;
    padding: .36rem .2rem 0;
}
.video-page .player{
    margin: .2rem 0 0;
    position: relative;
}
.video-page .player video{}
.video-page .player a{
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1;
    top: 0;
    left: 0;
}
.video-page .player a img{
    width: .44rem;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -.22rem 0 0 -.22rem;
    display: none;
}
.video-page .share{
    border: 0;
}

.video-page .share .share-wechat {
    display: inline-block !important;
}
.picwall .fol { position: absolute; width: 100%; height: 0%; background: rgba(0, 0, 0, .5); text-align: center; transition: all .15s; overflow: hidden; }
.picwall .fol span { position: absolute; width: 100%; height: 2em; line-height: 2em; margin: -1em 0 0; left: 0; top: 50%; }
.picwall .fol a { display: inline-block; vertical-align: top; color: #fff; background: url(../images/fol.png) 0 center no-repeat; padding: 0 0 0 30px; }
.picwall li:hover .fol { height: 100%; }

.video-play-frame {display:none;position:fixed;left:0;top:0;width:100%;height:100%;background:#000000;z-index:999;}

/*fix_english*/

@media (min-height: 500px){
    .lang_en .info-list-con .pic {height: 50%;}
}

.lang_en .intro h3 {line-height:.26rem;}
.lang_en .intro .text {line-height:.2rem;}
.lang_en .intro .ceo {line-height:.2rem;padding-top:.2rem;}
.lang_en .count {max-height: 2.4rem;}
.lang_en .count li {padding: .16rem 0;}

.lang_en .info-list-con .con .des p {font-size:.08rem;line-height:.14rem;}
.lang_en .news-list .item .des2 {position:absolute;left:0;top:50%;margin-top:-.0875rem;text-transform:uppercase;}
.lang_en .news-tag ul {font-size: .08rem;padding: .15rem .1rem;}
.lang_en .news-tag li {width:auto;text-align: center;position: relative;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;padding: 0 .05rem;}

.lang_en .brand-show .brand-pic-new a {background:#000000;text-indent:0;}
.lang_en .brand-show .brand-pic-new a br {display:block;}


/*可持续发展新增*/
@keyframes devStop{
    100%{
        opacity: 1;
        transform: translateY(0rem);
    }
}
.dev-title{
    background: url("../images/dev-bg.jpg") center center no-repeat;
    background-size:  auto 100%;
    color: #fff!important;
}
.main-en .dev-title{
    padding: 0.3rem;
}
.dev-title .intro-box > *{
    opacity: 1;
}
.main-en .dev-title .intro .text {
    text-align: left;
    font-size: .2rem;
}
.dev-title .intro .line{
    background: transparent;
    margin: 0.05rem auto 0.14rem;
}


.dev-tab .news-tag{
    opacity: 1;
    text-align: center;
}
.main-en .dev-tab .news-tag {
    text-align: left;
}
.dev-tab .news-tag li{
    display: inline-block;
    float: none;
    width: auto;
    margin: 0 0.05rem;
}
.main-en .dev-tab .news-tag li{
    display: inline-block;
    float: none;
    width: auto;
    margin: 0 0.05rem;
    font-size: .09rem;
    line-height: .09rem;
    text-align: left;
    padding: 0.01rem 0 0.02rem;
    vertical-align: text-top;
}
.devpage h3{
    font-size: .2rem!important;
}
.main-en .devpage h3{
    font-size: .18rem!important;
}
.devpage p{
    font-size: .11rem;
    line-height: .225rem;
}
.devpage p.rem15 {
    padding-top: .12rem;
}
.main-en.devpage p{
    font-size: .08rem;
    line-height: .15rem;
}
.devpage .intro-text{
    background: #000;
    color: #fff!important;
    padding: .3rem;
    box-sizing: content-box;
}
.devpage .line{
    height: 1px;
    overflow: hidden;
    border-bottom: #fff 1px solid;
    width: .35rem;
    margin: .14rem 0;
}
.devpage .s-retail .intro-text{
    background: #fff;
    color: #000!important;
}
.devpage .s-retail .line{
    border-bottom: #000 1px solid;
}
.s-retail .retail-list{

}
.s-retail .retail-list li{
    height: 1.2rem;
    overflow: hidden;
    color: #fff;
}
.s-retail .retail-list h3{
    text-align: center;
    line-height: 1.2rem;
    color: #fff;
    position: relative;
}
.s-retail .retail-list h3:after{
    content: "";
    width: .135rem;
    height: .27rem;
    background: url("../images/icon-dev.png") 0 center no-repeat;
    background-size: 200% auto;
    position: absolute;
    margin: 0;
    right: .35rem;
    top:.45rem;
}
.main-en .s-retail .retail-list h3 {
    font-size: .14rem!important;
    line-height: .15rem;
    font-weight: bold;
    height: 1.2rem;
    padding-top: .46rem;
    text-transform: uppercase;
    box-sizing: border-box;
}
.s-retail .retail-list .open h3:after{
    background: url("../images/icon-dev.png") right center no-repeat;
    background-size: 200% auto;
}
.s-retail .retail-list .line{
    margin: .14rem auto;
}
.s-retail .retail-list .bg1{
    background: url("../images/dev2.jpg") 0 0 no-repeat;
    background-size: 100% auto;
}
.s-retail .retail-list .bg2{
    background: url("../images/dev3.jpg") 0 0 no-repeat;
    background-size: 100% auto;
}
.s-retail .retail-list .bg3{
    background: url("../images/dev4.jpg") 0 0 no-repeat;
    background-size: 100% auto;
}
.s-retail .retail-list .bg4{
    background: url("../images/dev5.jpg") 0 0 no-repeat;
    background-size: 100% auto;
}
.s-retail .retail-list .bg5{
    background: url("../images/dev6.jpg") 0 0 no-repeat;
    background-size: 100% auto;
}
.s-retail li .textbox{
    background: rgba(0,0,0,0.5);
    padding: 0.55rem .3rem 0;
}
.main-en .s-retail li .textbox {
    padding: 0.35rem .3rem 0;
    box-sizing: border-box;
}
.s-zoology{
    background: url("../images/dev7.jpg") 0 0 no-repeat;
    background-size: 100% auto;
}
.s-publicwelfare{
    background: url("../images/dev8.jpg") 0 0 no-repeat;
    background-size: 100% auto;
}
.s-greening{
    background: url("../images/dev9.jpg") 0 0 no-repeat;
    background-size: 100% auto;
}
.s-zoology .intro-text,.s-publicwelfare .intro-text,.s-greening .intro-text{
    background: transparent;
    text-align: center;
    padding: .6rem .3rem 0;
    box-sizing: border-box;
}
.s-publicwelfare .intro-text h3{
    margin-top: .5rem;
}
.s-greening .intro-text{
    padding: 0;
}
.s-zoology .intro-text .line,.s-publicwelfare .intro-text .line{
    margin: .14rem auto;
}
.s-zoology .swiper-slide{
    padding: .3rem .3rem .16rem;
    box-sizing: border-box;
}
.s-zoology .swiper-slide h4{
    font-size: .14rem;
    margin-bottom: 0.09rem;
}
.s-zoology .swiper-container-horizontal>.swiper-pagination{
    opacity: 1;
}
.s-zoology .swiper-container-horizontal>.swiper-pagination{
    left: 0;
    text-align: center;
}
.s-zoology .swiper-container-horizontal>.swiper-pagination span{
    background: #c4c4c4;
}
.s-zoology .swiper-container-horizontal>.swiper-pagination span.swiper-pagination-bullet-active{
    background: #000;
}
.s-publicwelfare .textbox,.s-greening .textbox{
    padding: 0 .3rem .75rem;
}
.s-publicwelfare .textbox h4,.s-greening .textbox h4{
    font-size: .14rem;
    margin-bottom: 0.09rem;
    margin-top: .2rem;
}
.s-publicwelfare .textbox p, .s-greening .textbox p {
    padding-left: 10px;
}
.main-en .s-publicwelfare .textbox h4, .main-en .s-greening .textbox h4{
    font-size: .12rem;
    line-height: .15rem;
    margin-top: .3rem;
    position: relative;
    padding-left: 10px;
}
.main-en .s-publicwelfare .textbox h4:before, .main-en .s-greening .textbox h4:before {
    content: "-";
    color: #fff;
    position: absolute;
    margin: 0;
    left: 0;
}
.main-en .s-greening .textbox h4:before {
    color:#000000;
}

.s-Human h4{
    font-size: .12rem;
    line-height: .18rem;
}
.s-Human p{
    padding-left: 10px;
    position: relative;
}
.s-Human p:before{
    content: "-";
    color: #fff;
    position: absolute;
    margin: 0;
    left: 0;
}
.s-Human .intro-text{
    padding-bottom: .45rem;
}