@charset "UTF-8";
/*通用标题*/

.max-container {
	/*max-width: 750px;
	margin: 0 auto;*/
}



body {
    max-width: 750px;
    margin: 0 auto;
	background-color: #fff;
    /* padding-bottom: 39px; */
}



@media (max-width: 900px) {
    .pt-90 {
        padding-top: 50px;
    }
    .wrap.pt-90 {
        padding-top: 76px;
    }
    .pt-170 {
        padding-top: 60px;
    }
    .pb-140,
    .pb-100 {
        padding-bottom: 60px;
    }
    .pt-110,
    .pt-80 {
        padding-top: 50px;
    }
    .pb-150 {
        padding-bottom: 60px;
    }
    .pb-110,
    .pb-90 {
        padding-bottom: 50px;
    }
    .pt-100 {
        padding-top: 50px;
    }
    .pt-70 {
        padding-top: 50px;
    }

    .f32 {
        font-size: 20px!important;
    }

    .f36 {
        font-size: 20px!important;
    }

    .f16 {
        font-size: 14px!important;
    }
}

.com-title {
    width: 100%;
    text-align: center;
    padding-bottom: 40px;
}

.com-title.t-left {
    text-align: left;
}

.com-title .tit-cn {
    line-height: 1.2;
    font-size: 20px;
    color: #333;
}

.com-title .tit-cn.wb {
    font-weight: bold;
}

.com-title.white .tit-cn,
.com-title.white .tit-des {
    color: #fff;
}

.com-title.white .tit-des {
    font-weight: 300;
    color: rgba(255, 255, 255, .9);
}

.com-title .tit-des {
    margin-top: 20px;
    font-size: 14px;
    color: #666;
    line-height: 1.75;
}

.com-title .tit-des b {
    color: #333;
    font-weight: 400;
}

.com-title .tit-des .par {
    display: inline;
}

.com-title .tit-en {
    display: block;
    font-size: 16px;
    color: #949494;
    font-family: "066-CAI978";
    text-transform: uppercase;
    margin-top: 12px;
    line-height: 1;
}

.index-title {
    padding-top: 60px;
    padding-bottom: 40px;
}

/*装饰横条*/

.bline {
    position: relative;
}

.bline:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    border-bottom: 1px solid #fff;
}

/*通用描述*/

.com-tit-24 {
    font-size: 16px;
    color: #333;
}

.com-tit-24.title-line {
    padding-bottom: 15px;
    margin-bottom: 15px;
}


/*  导航  */

.gr-header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 666;
    width: 100%;
    height: 80px;
	background-color:rgba(255, 255, 255, 0.5);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
   /* background: transparent; 
    transition: 0.5s; */
}

.gr-header.on {
    position: fixed;
    background: #fff;
    box-shadow: 0 0px 15px rgba(0, 0, 0, 0.1);
}

.page-header {
    background: #fff!important;
    box-shadow: 0 0px 15px rgba(0, 0, 0, 0.1)!important;
}

.gr-header-page {
    position: static;
    background: #c1c0c0;
}

.gr-header-placeholder {
    height: 80px;
}

.gr-header .logo-content {
    position: absolute;
    left:5%;
    top: 15px;
    text-align: center;
    margin-left: 0px;
}
.gr-header .logo-text {
    position: absolute;
    right: 5px;
    top: 18px;
    width: 90px;
    text-align: center;
    margin-left: -100px;
}

.gr-header .logo-content .logo img {
    width: 160px;
}

.gr-header .logo-content h1 {
    margin-top: 7px;
    color: #fff;
    font-size: 10px;
    transition: 0.5s;
}
.gr-header .logo-content .gp {
    font-size: 10px;
    color: #fff;
    transition:  .5s
}

.gr-header.on .logo-content h1,
.gr-header.on .global-menu,
.gr-header.on .logo-content .gp {
    color: #333;
}

.page-header .logo-content h1,
.page-header .logo-content .gp {
    color: #333!important;
}

.nav-home,
.nav-menu {
    position: fixed;
    top: 0;
    right: 15px;
    z-index: 1000;
    float: left;
    font-size: 12px;
    
    text-align: left;
    /*width: 110px;*/
    height: 80px;
    line-height: 80px;
    cursor: pointer;
    transition: 0.5s;
}

.nav-home {
    top: -2px;
    width: 35px;
    height: 60px;
    background: url(icon-hd-home.png) no-repeat center 33px;
    z-index: 999;
    display: none;
}

.nav-home.on,
.page-menu .nav-home {
    background: url(icon-hd-home-on2.png) no-repeat center 33px;
}

.nav-home.page-home {
    background: url(icon-hd-home-on2.png) no-repeat center 33px!important;
}

.nav-menu.nohome {
    /*margin-left: 40px;*/
}

.menu-open .nav-menu,
.nav-menu.fixed {
    color: #333;
}

.page-menu,
.page-header .global-menu {
    color: #333!important;
}

.menu-open .nav-menu .sp-menu,
.page-menu .sp-menu {
    background: url(wap-menu-on.png) no-repeat center!important;
    background-size: contain!important;
}

.nav-menu.on .sp-menu,
.menu-open .nav-menu .sp-menu {
    transform: scale(0.5);
    opacity: 0;
}

.nav-menu .icon-menu-on {
    position: absolute;
    left: 0;
    top: 0;
    width: 24px;
    height: 100%;
    background: url(wap-close2.png) no-repeat center!important;
    background-size: contain!important;
    transition: .5s;
    opacity: 0;
    transform: rotate(-180deg);
    z-index: 2;
}

.menu-open .nav-menu .icon-menu-on {
    opacity: 1;
    transform: rotate(0);
}

.menu-open .nav-menu .sp-menu,
.nav-menu.fixed .sp-menu {
    background: url(wap-menu-on.png) no-repeat center;
    background-size: contain;
}

.global-menu {
    height: 76px;
    line-height: 76px;
    position: relative;
    float: right;
    font-size: 12px;
    color: #fff;
    cursor: pointer;
    text-align: center;
}

.global-menu.fixed {
    position: fixed;
    color: #333;
    z-index: 999;
    margin-top: 25px;
}

.global-menu .icon-earth {
    width: 24px;
    height: 100%;
    background: url(wap-global.png) no-repeat center;
    background-size: contain;
}

.gr-header.on .global-menu .icon-earth,
.page-header .global-menu .icon-earth {
    background: url(wap-global-on.png) no-repeat center;
    background-size: contain;
}

.sp-menu {
    position: relative;
    float: left;
    width: 24px;
    height: 100%;
    background: url(wap-menu-on.png) no-repeat center;
	/*background: url(wap-menu.png) no-repeat center;*/
    background-size: contain;
    margin-right: 8px;
    vertical-align: top;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
}

.gr-header-fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px;
    line-height: 80px;
    background-color: #fff;
    background-color: rgba(255, 255, 255, .97);
    text-align: center;
    z-index: 998;
    font-size: 0;
    box-shadow: 0 0px 15px rgba(0, 0, 0, 0.1);
    -webkit-transform: translateY(100px);
    -ms-transform: translateY(100px);
    -o-transform: translateY(100px);
    transform: translateY(100px);
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    visibility: hidden;
    opacity: 0;
}

.gr-header-fixed.on,
.global-menu.on .select-region {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}



/*导航*/

.navigation {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    height: auto!important;
    overflow-y: scroll;
    padding-bottom:80px;
    background: #fff url(navigation-bg.png) no-repeat right bottom;
    background: rgba(255, 255, 255, .98) url(navigation-bg.png) no-repeat right bottom;
    background-size: 330px 150px;
    opacity: 0;
    visibility: hidden;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
}

.navcover {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 998;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    background-size: 300px 131px;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
}


.menu-open .navigation,
.menu-open .navcover {
    opacity: 1;
    visibility: visible;
}

.navigation .nav-logo {
    text-align: left;
    margin-top: 20px;
    margin-bottom: 30px;
	margin-left:20px;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    -o-transform: translateY(-30px);
    transform: translateY(-30px);
    -webkit-transition: .8s;
    -o-transition: .8s;
    transition: .8s;
}
.navigation .nav-logo img {
    width: 150px;
}

.menu-open .navigation .nav-logo {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}

.nav-content {
    /*padding-bottom: 200px;*/
    height: 100%;
    opacity: 0;
    visibility: hidden;
    text-align: center;
    -webkit-transform: translateY(30px);
    -ms-transform: translateY(30px);
    -o-transform: translateY(30px);
    transform: translateY(30px);
    -webkit-transition: .8s;
    -o-transition: .8s;
    transition: .8s;
}

.menu-open .navigation .nav-content {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}

.nav-content .nav-item {
    display: block;
    width: 100%;
    vertical-align: top;
    padding: 0 3%;
    text-align: left;
    padding-top: 5px;
    padding-bottom: 5px;
    border-bottom: 1px solid #FFCB03;
}

.nav-content .nav-item .nav-tit {
    /*margin-bottom: 5px;*/
    font-size: 14px;
    color: #333;
}

.nav-content .nav-item .nav-tit .icon-op {
    display: inline-block;
    position: relative;
}

.nav-content .nav-item .nav-tit .icon-op:before {
    content: "+";
}

.nav-content .nav-item .nav-tit.on .icon-op:before {
    content: "-";
}

.nav-content .nav-item .nav-tit a {
    display: block;
    width: 100%;
    font-size: 16px;
    padding: 5px 0;
    color: #333;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
}

.subnav-list {
    display: none;
    padding: 8px 15px;
}

.subnav-list li a {
    display: inline-block;
    width: 100%;
    font-size: 14px;
    color: #6b6b6b;
    line-height: 30px;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
}

.nav-content .nav-item .nav-tit a:hover,
.subnav-list li a:hover {
    color:#FFCB03;
}



/*  index-banner  */
.index-banner{ position:relative; width:100%;height:100%; margin-top:80px;}
.index-banner img{ width:100%; height:100%;}


/*放大缩小*/

@-webkit-keyframes minus {
    from {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05);
    }
    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes minus {
    from {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05);
    }
    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

/*首页*/






/*Footer*/


/*内页*/



/*动画——抖动效果*/

@-webkit-keyframes sh-shake {
    0%,
    25%,
    100% {
        -webkit-transform: translateY(0)
    }
    3%,
    9%,
    15% {
        -webkit-transform: translateY(-3px)
    }
    6%,
    12%,
    20% {
        -webkit-transform: translateY(3px)
    }
}

@keyframes sh-shake {
    0%,
    25%,
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    3%,
    9%,
    15% {
        -webkit-transform: translateY(-3px);
        transform: translateY(-3px)
    }
    6%,
    12%,
    20% {
        -webkit-transform: translateY(3px);
        transform: translateY(3px)
    }
}




@keyframes pulse {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05);
    }
    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

