@charset "utf-8";

/***Reset Tag*/
* { margin:0; padding:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; -webkit-tap-highlight-color:rgba(0, 0, 0, 0); -ms-tap-highlight-color:rgba(0, 0, 0, 0); tap-highlight-color:rgba(0, 0, 0, 0); -webkit-text-size-adjust:none; -webkit-user-select:none; -ms-user-select:none; user-select:none; font-family:Microsoft YaHei;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block;}
input, textarea { -webkit-user-select:text; -ms-user-select:text; user-select:text; -webkit-appearance:none; resize:none; vertical-align:middle; color:#666;}
input:focus, select:focus, textarea:focus, button:focus { outline:none;}
input[type="text"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="date"],
textarea { -webkit-appearance:none; border:1px solid #A9A9A9; -webkit-border-radius:0; border-radius:0;}
img { max-width:100%; border:none; vertical-align:top; -ms-interpolation-mode:bicubic;}
input[type="number"]::-webkit-inner-spin-button { -webkit-appearance:none;}
em, b, s, i, cite { font-style:normal; font-weight:normal; text-decoration:none;}
a, a:hover { text-decoration:none; -webkit-touch-callout:none;}
table { border-collapse:collapse; border-spacing:0;}
h1, h2, h3, h4, h5, h6 { font-size:100%; font-weight:normal;}
form { display:inline;}
li { list-style:none;}

/***Reset FontSize*/
/* @media (min-width:320px) { html { font-size:64px !important;}}
@media (min-width:375px) { html { font-size:75px !important;}}
@media (min-width:414px) { html { font-size:82.8px !important;}} */
@media screen and (min-width:768px) and (max-width:1023px) { html { font-size:76.8px !important;}}
@media screen and (min-width:1024px) and (max-width:1025px) { html { font-size:102.4px !important;}}
body, html { min-height:100%; min-width:320px; width:100%;}
body { background:#fff; -webkit-text-size-adjust:none; -webkit-font-smoothing:antialiased; font:normal .12rem/1.3 Arial; color:#666;}
body::-webkit-scrollbar { width:0; height:0;}
/***Common CSS*/
/*Float*/
.fl { float:left;}
.fr { float:right;}
.fn { float:none;}
.dn { display:none;}
/*Padding*/
.m_0_10 { margin:0 10px;}
.m_10_0 { margin:10px 0;}
.m_10   { margin:10px;}
.m_0    { margin:0;}
.mt-1   { margin-top:-1px;}
.mt_3   { margin-top:3px;}
.mt_4   { margin-top:4px;}
.mt_5   { margin-top:5px;}
.mt_10  { margin-top:10px;}
.mt_15  { margin-top:15px;}
.mt_20  { margin-top:20px;}
.mr_5   { margin-right:5px;}
.mr_10  { margin-right:10px;}
.mr_15  { margin-right:15px;}
.mr_20  { margin-right:20px;}
.mb_5   { margin-bottom:5px;}
.mb_10  { margin-bottom:10px;}
.mb_15  { margin-bottom:15px;}
.mb_20  { margin-bottom:20px;}
.ml_5   { margin-left:5px;}
.ml_10  { margin-left:10px;}
.ml_15  { margin-left:15px;}
.ml_20  { margin-left:20px;}
.mt_0   { margin-top:0 !important;}
.mr_0   { margin-right:0 !important;}
.mb_0   { margin-bottom:0 !important;}
.ml_0   { margin-left:0 !important;}
/*Padding*/
.p_0_10 { padding:0 10px;}
.p_10_0 { padding:10px 0;}
.p_10   { padding:10px;}
.p_5    { padding:5px;}
.p_0    { padding:0;}
.pt_5   { padding-top:5px;}
.pt_10  { padding-top:10px;}
.pt_15  { padding-top:15px;}
.pt_20  { padding-top:20px;}
.pr_5   { padding-right:5px;}
.pr_10  { padding-right:10px;}
.pr_15  { padding-right:15px;}
.pr_20  { padding-right:20px;}
.pb_5   { padding-bottom:5px;}
.pb_10  { padding-bottom:10px;}
.pb_15  { padding-bottom:15px;}
.pb_20  { padding-bottom:20px;}
.pl_5   { padding-left:5px;}
.pl_10  { padding-left:10px;}
.pl_15  { padding-left:15px;}
.pl_20  { padding-left:20px;}
.pt_0   { padding-top:0 !important;}
.pr_0   { padding-right:0 !important;}
.pb_0   { padding-bottom:0 !important;}
.pl_0   { padding-left:0 !important;}
/*Text*/
.txt_l { text-align:left !important;}
.txt_r { text-align:right !important;}
.txt_m { text-align:center !important;}
.txt_u { text-decoration:underline;}
.txt_d { text-decoration:line-through;}
.txt_s { text-shadow:0 1px 0 rgba(0, 0, 0, .3);}
.fw    { font-weight:bold;}
.va_t  { vertical-align:top;}
.va_m  { vertical-align:middle;}
.va_b  { vertical-align:bottom;}
.w_100 { width:100%; display:inline-block;}
.w_50  { width:50%; display:inline-block;}
.cur_p { cursor:pointer;}
.hdot  { overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.ldot  { display:-webkit-box; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2;}
.box-c { -webkit-box-sizing:content-box; -moz-box-sizing:content-box; -ms-box-sizing:content-box; box-sizing:content-box;}
.d-flex{ display:-webkit-box !important; display:-webkit-flex !important; display:-ms-flexbox !important; display:flex !important;}
.flex-1{ -webkit-box-flex:1; -webkit-flex:1; -ms-flex:1; flex:1;}
.flex-2{ -webkit-box-flex:2; -webkit-flex:2; -ms-flex:2; flex:2;}
.bk    { display:block;}
.inbk  { display:inline-block; *display:inline;}
.t-in_2{ text-indent:2em;}
.lh1   { line-height:1 !important;}
.lh15  { line-height:1.5 !important;}
.lh2   { line-height:2 !important;}
.lh3   { line-height:3 !important;}
/*Font*/
.fs_10 { font-size:.1rem;}
.fs_11 { font-size:.11rem;}
.fs_12 { font-size:.12rem;}
.fs_13 { font-size:.13rem;}
.fs_14 { font-size:.14rem;}
.fs_15 { font-size:.15rem;}
.fs_16 { font-size:.16rem;}
.fs_18 { font-size:.18rem;}
.fs_20 { font-size:.2rem;}
.fs_22 { font-size:.22rem;}
.fs_24 { font-size:.24rem;}
.fs_26 { font-size:.26rem;}
.fs_28 { font-size:.28rem;}
.fs_30 { font-size:.3rem;}
/*Color*/
.cred { color:#f33;}
.cpur { color:#f83066;}
.cgrn { color:#8ec31f;}
.cblu { color:#08c;}
.cc00 { color:#c00;}
.cyel { color:#ff0;}
.cccc { color:#ccc;}
.c999 { color:#999;}
.caaa { color:#aaa;}
.cbbb { color:#bbb;}
.c666 { color:#666;}
.c333 { color:#333;}
.c000 { color:#000;}
.cfff { color:#fff;}
.c090 { color:#090;}
/*Clear*/
.clear { clear:both; height:0; overflow:hidden;}
.clear:after { display:block; content:""; clear:both; height:0; visibility:hidden; font-size:0;}
.clr:before,
.clr:after { display:block; content:""; clear:both; height:0; visibility:hidden; font-size:0;}
/*Time delay*/
.trans { -webkit-transition:all ease-in-out .26s; -moz-transition:all ease-in-out .26s; -ms-transition:all ease-in-out .26s; transition:all ease-in-out .26s;}
/*Srcoll*/
.scrollbar::-webkit-scrollbar { width:14px; height:14px;}
.scrollbar::-webkit-scrollbar-track,
.scrollbar::-webkit-scrollbar-thumb { border-radius:999px; border:5px solid transparent;}
.scrollbar::-webkit-scrollbar-track { box-shadow:1px 1px 5px rgba(0, 0, 0, .3) inset;}
.scrollbar::-webkit-scrollbar-thumb { min-height:20px; background-clip:content-box; box-shadow:0 0 0 5px rgba(0, 0, 0, .2) inset;}
.scrollbar::-webkit-scrollbar-corner { background:transparent;}

/*Animate*/

/*Btn*/
.btnBlue,
.btnBlueH { display:inline-block; width:100%; padding:.08rem .1rem; border:1px solid #0aaaf4; border-radius:5px; background:no-repeat; color:#666; text-align:center; overflow:hidden; font-size:.14rem; color:#fff;}
.btnBlueH { background-color:transparent; color:#0aacf5;}
.btnBlue { background-color:#0aaaf4;}
.btnBlueH:hover,
.btnBlueH:active { background-color:#fff;}
.btnBlue:hover,
.btnBlue:active { background-color:#09f; border-color:#09f;}



/* Swiper Public */

@charset "utf-8";

html, body {
    height: 100%;
    overflow: hidden;
}

/*Home arrow*/
.home-foot-arrow {
    position: fixed;
    z-index: 8;
    left: 50%;
    bottom: .2rem;
    width: 8vw;
    height: 8vw;
    margin-left: -.27rem;
}

.icon-arrow {
    display: block;
    width: 100%;
    height: 100%;
    background: url("/img/appimg/bssp/index/arrow_down.png") no-repeat center;
    background-size: 100% 100%;
    -webkit-animation-name: breath;
    animation-name: breath;
    -webkit-animation-duration: 1000ms;
    animation-duration: 1000ms;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-direction: normal;
    animation-direction: normal;
}

@-webkit-keyframes breath {from { -webkit-transform:translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
}

    to {
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0);
        opacity: 0;
    }

}
@keyframes breath {from { transform:translate3d(0, 0, 0);
    opacity: 1;
}

    to {
        transform: translate3d(0, -20px, 0);
        opacity: 0;
    }

}

/*Home Swiper*/
.slide-middle {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.swiper-container-home {
    position: static;
    width: 100%;
    height: 100%;
    color: #fff;
}

.swiper-wrapper-home {
    position: static;
}

.swiper-wrapper-home .swiper-slide {
    background: #fff no-repeat center;
    background-size: cover;
    text-align: center;
}

.swiper-wrapper-home .slide-2 {
    background-image: url("/img/appimg/bssp/index/newbg.jpg");
}

.swiper-wrapper-home .slide-3 {
    background-image: url("/img/appimg/bssp/index/02.png");
}

.swiper-wrapper-home .slide-4 {
    background-image: url("/img/appimg/bssp/index/04.png");
}

.swiper-wrapper-home .slide-5 {
    background-image: url("/img/appimg/bssp/index/05.png");
}

/*swiper-wrapper*/
/* .swiper-slide .title h5 {
	font-size: 1.066667rem
}

.swiper-slide .title h6 {
	font-size: .64rem
} */
/*one*/
.slide-1 .title {
    margin-bottom: 7%;
    color: #529ffd;
}

.slide-1 .title h6 {
    padding-top: .1rem;
}

.slide-1 .content .list-j {
    padding: 0 .3rem;
    color: #2e5b78;
}

.slide-1 .content .list-j li {
    float: left;
    width: 33.333%;
    padding: .06rem .08rem;
    font-size: .18rem;
}

.slide-1 .content .list-j li div {
    position: relative;
    width: 100%;
    height: 100%;
}

.slide-1 .content .list-j li div img {
    position: relative;
    z-index: 2;
    width: 100%;
}

.slide-1 .content .list-j li div span {
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border: 2px solid #6bb39c;
    border-radius: 50%;
}

.slide-1 .content .list-j li:nth-of-type(5) div span {
    color: #6bb39c;
    border-color: #2e5b78;
}

.slide-1 .content .list-j li:nth-of-type(4) div span, .slide-1 .content .list-j li:nth-of-type(6) div span
{
    border-color: #85b6fa;
}
/*Two*/
.slide-2 .content {
    padding: 3% 0;
}

.slide-2 .title .face {
    /* height: .9rem; */
    margin-bottom: .1rem;
}

.slide-2 .content .text {
    padding: 1.3333vw;
    font-size: 4.2667vw;
}

.slide-2 .content .text span {
    color: #6ba5eb;
    font-size: .2rem;
}
/*Three*/
.slide-3 .slide-wrap {
    width: 100%;
}

.slide-3 .title h6 {
    color: #333;
    text-shadow: 1px 1px 0 rgba(255, 255, 255, 1), -1px -1px 0
    rgba(255, 255, 255, 1);
}

.slide-3 .content {
    margin-top: 10%;
    color: #333;
    text-align: left;
}

.slide-3 .content .list-n {
    width: 90%;
    margin: 0 auto;
}

.slide-3 .content .list-n li {
    position: relative;
    display: block;
    padding: 0 0 10% 13%;
}

.slide-3 .content .list-n li:last-of-type {
    padding-bottom: 0;
}

.slide-3 .content .list-n li:before {
    position: absolute;
    left: 7%;
    top: 0;
    content: "";
    width: 2px;
    height: 100%;
    background: #333;
}

.slide-3 .content .list-n li:after {
    position: absolute;
    left: 7%;
    top: .15rem;
    content: "";
    width: 8px;
    height: 8px;
    margin-left: -3px;
    border-radius: 50%;
    background: #333;
}

.slide-3 .content .list-n li h6 {
    font-size: 4.8vw;
    font-weight: bold;
}

.slide-3 .content .list-n li p {
    font-size: 4.2667vw;
}
/*Four*/
.slide-4 .title {
    padding-top: 13%;
    color: #333;
    text-shadow: 1px 1px 0 rgba(255, 255, 255, 1), -1px -1px 0
    rgba(255, 255, 255, 1);
}

.slide-4 .content {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}

.slide-4 .content .about-wrap {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 90%;
    height: 100%;
    margin-left: -45%; no-repeat center bottom;
    background-size: 100% auto;
}

.slide-4 .content .swiper-container-about {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 67%;
    height: 80%;
    margin-left: -33.5%;
}

.slide-4 .content .swiper-container-about .swiper-slide {
    background: no-repeat center;
    background-size: 100% auto;
}
/*Five*/
.slide-5 .slide-wrap {
    width: 100%;
}

.slide-5 .title {
    text-shadow: 0 1px 0 rgba(0, 0, 0, .2), 0 -1px 0 rgba(0, 0, 0, .2);
}

.slide-5 .content .list-a {
    margin-top: 10%;
    padding: 0 .2rem;
}

.slide-5 .content .list-a li {
    position: relative;
    float: left;
    width: 100%;
    padding-top: 35%;
}

.slide-5 .content .list-a li span {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: no-repeat center top;
    background-size: 90% auto;
}

.slide-5 .content .list-a li span div {
    width: 100%;
    height: 100%;
    margin: 0 auto;
}

.slide-5 .content .list-a li span div .more {
    width: 90%;
    margin: 0 auto;
}

.more {
    position: fixed;
    z-index: 1001;
    animation: more 1s linear infinite alternate;
}

@keyframes more {from { transform:translateY(-5px);

}

    to {
        transform: translateY(5px);
    }

}

/*Animate*/
/*Pub*/
.swiper-slide .title, .swiper-slide .content {
    -webkit-transition: all 400ms ease-out;
    transition: all 400ms ease-out;
    /*opacity: 0;*/
}

.swiper-slide .title {
    /*-webkit-transform: translate3d(0, -100%, 0);*/
    /*transform: translate3d(0, -100%, 0);*/
}

.swiper-slide .content {
    /*-webkit-transform: translate3d(0, 80%, 0);*/
    /*transform: translate3d(0, 80%, 0);*/
}

.swiper-slide-active .title, .swiper-slide-active .content {
    -webkit-transition-delay: 400ms;
    transition-delay: 400ms;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
}
/*Ani-one*/
.slide-1 .content .list-j img, .slide-1 .content .list-j span {
    -webkit-transition: all 400ms ease-out;
    transition: all 400ms ease-out;
}

.slide-1 .content .list-j span {
    transform: rotateY(-90deg);
}

.swiper-slide-active .content .list-j img {
    -webkit-transition-delay: 1.2s;
    transition-delay: 1.2s;
    -webkit-transform: rotateY(90deg);
    transform: rotateY(90deg);
}

.swiper-slide-active .content .list-j span {
    -webkit-transition-delay: 1.6s;
    transition-delay: 1.6s;
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
}
/*Ani-Three*/
.slide-3 .content .list-n li {
    -webkit-transition: all 200ms ease-in;
    transition: all 200ms ease-in;
    -webkit-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0);
}

.swiper-slide-active .content .list-n li {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.swiper-slide-active .content .list-n li:nth-of-type(1) {
    -webkit-transition-delay: .8s;
    transition-delay: .8s;
}

.swiper-slide-active .content .list-n li:nth-of-type(2) {
    -webkit-transition-delay: .9s;
    transition-delay: .9s;
}

.swiper-slide-active .content .list-n li:nth-of-type(3) {
    -webkit-transition-delay: 1s;
    transition-delay: 1s;
}

.swiper-slide-active .content .list-n li:nth-of-type(4) {
    -webkit-transition-delay: 1.1s;
    transition-delay: 1.1s;
}
