/*banner*/
.banner, .expert { width: 100%; overflow: hidden; }
.banner .swiper-container, .expert .swiper-container { width: 100%; height: 100%; }
.banner .swiper-container .swiper-pagination, .expert .swiper-container .swiper-pagination { bottom: 7px; }
.banner .swiper-container .swiper-pagination span, .expert .swiper-container .swiper-pagination span { width: 7.7%; height: 3px; background: #fff; border-radius: 0; opacity: 1; }
.banner .swiper-container .swiper-pagination .swiper-pagination-bullet-active, .expert .swiper-container .swiper-pagination .swiper-pagination-bullet-active { background: #000; }
/*section item*/
.items { width: 100%; padding: 30px 0 20px; overflow: hidden; background: #fff;}
.items .itemCon { width: 25%; float: left; text-align: center; }
.items .itemCon a { display: block; width: 71.875%; padding-bottom: 71.875%; border-radius: 50%; background: #00b2c4; margin: 0 auto; box-shadow: 0 7px 15px rgba(0,189,209,.8); position: relative; }
.items .itemCon span { font-size: 2.6rem; color: #898989; line-height: 2.5; }
.items .itemCon a:before { position: absolute; content: ''; width: 48px; height: 40px; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background-position: -290px 0; }
.items .itemCon:nth-of-type(1) a:before { width: 64px; height: 40px; background-position: -380px 0; }
.items .itemCon:nth-of-type(2) a:before { width: 80px; height: 34px; background-position: -446px 0; }
.items .itemCon:nth-of-type(3) a:before { width: 91px; height: 38px; background-position: -531px 0; }
.items .itemCon:nth-of-type(4) a:before { width: 37px; height: 47px; background-position: -641px 0; }
/*section list*/
.lists { padding: 0 7px; width: 100%; background:#FFF; overflow: hidden; }
.lists ul { text-align: center; width: 100%; overflow: hidden; }
.lists li { width: 32.4%; display: inline-block; padding-top: 1px; }
.lists li a { display: block; width: 100%; height: 100%; }
/*activity*/
.activity { width: 100%; overflow: hidden; }
.activity .swiper-container { width: 100%; padding: 40px 0 20px; }
.activity .swiper-container .swiper-slide { width: 85%; -webkit-transform: scale(0.96); transform: scale(0.96); -webkit-transition: scale 0.3s; transition: scale 0.3s; }
.activity .swiper-container .swiper-slide-active { -webkit-transform: scale(1); transform: scale(1); box-shadow: 0 0 20px rgba(0,189,209,.66); }
/*notice*/
.notice { width: 100%; overflow: hidden; margin-top:20px; margin-bottom: 40px; background:#FFF;}
.notice .nCon { width: 95%; overflow: hidden; margin: 0 auto; }
.notice .nIcon { width: 30px; height: 28px; background-position: -711px 0; margin-right: 5px; }
.notice .nTitles { height: 28px; width: 93%; overflow: hidden; }
.notice .nTitles a { font-size: 2.6rem; line-height: 28px; color: #898989; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; width: 100%; display: block; }
@media screen and (min-width:320px) and (max-width:359px) {
    html { font-size: 31.25%!important; } /*0.5*/
    /*banner*/
    .banner .swiper-container .swiper-pagination span, .expert .swiper-container .swiper-pagination span { height: 2px; }
    /*section item*/
    .items { padding: 15px 0 10px; }
    .items .itemCon a { box-shadow: 0 5px 10px rgba(0,189,209,.8); }
    .items .itemCon a:before { width: 26px; height: 21px; background-position: -194px 0; }
	.items .itemCon:nth-of-type(1) a:before { width: 25px; height: 20px; background-position: -195px 0; }
    .items .itemCon:nth-of-type(2) a:before { width: 37px; height: 18px; background-position: -225px 0; }
    .items .itemCon:nth-of-type(3) a:before { width: 46px; height: 20px; background-position: -265px 0; }
    .items .itemCon:nth-of-type(4) a:before { width: 20px; height: 24px; background-position: -320px 0; }
    /*section list*/
    .lists { padding: 0 4px; }
    /*activity*/
    .activity .swiper-container { padding: 20px 0 10px; }
    .activity .swiper-container .swiper-slide-active { box-shadow: 0 0 10px rgba(0,189,209,.66); }
    /*notice*/
    .notice {margin-top:10px; margin-bottom: 14px; }
    .notice .nIcon { width: 16px; height: 20px; background-position: -355px 0; margin-right: 4px; margin-top: 3px; }
    .notice .nTitles { height: 20px; width: 92%; }
    .notice .nTitles a { line-height: 20px; }
}
@media screen and (min-width:360px) and (max-width:409px) {
    html { font-size: 35%!important; }  /*0.56*/
    /*banner*/
    .banner .swiper-container .swiper-pagination span, .expert .swiper-container .swiper-pagination span { height: 2px; }
    /*section item*/
    .items { padding: 22px 0 12px; }
    .items .itemCon a { box-shadow: 0 7px 12px rgba(0,189,209,.8); }
    .items .itemCon a:before { width: 28px; height: 23px; background-position: -218px 0; }
	.items .itemCon:nth-of-type(1) a:before { width: 27px; height: 23px; background-position: -218px 0; }
    .items .itemCon:nth-of-type(2) a:before { width: 41px; height: 20px; background-position: -252px 0; }
    .items .itemCon:nth-of-type(3) a:before { width: 52px; height: 22px; background-position: -297px 0; }
    .items .itemCon:nth-of-type(4) a:before { width: 22px; height: 27px; background-position: -358px 0; }
    /*section list*/
    .lists { padding: 0 5px; }
    /*activity*/
    .activity .swiper-container { padding: 25px 0 12px; }
    .activity .swiper-container .swiper-slide-active { box-shadow: 0 0 12px rgba(0,189,209,.66); }
    /*notice*/
    .notice {margin-top:10px; margin-bottom: 16px; }
    .notice .nIcon { width: 17px; height: 24px; background-position: -398px 0; margin: 3px 4px 0 0; }
    .notice .nTitles { height: 24px; }
    .notice .nTitles a { line-height: 24px; }
}
@media screen and (min-width:410px) and (max-width:479px) {
    html { font-size: 40%!important; }  /*0.64*/
    /*banner*/
    .banner .swiper-container .swiper-pagination span, .expert .swiper-container .swiper-pagination span { height: 2px; }
    .items { padding: 26px 0 13px; }
    .items .itemCon a { box-shadow: 0 8px 14px rgba(0,189,209,.8); }
    .items .itemCon a:before { width: 32px; height: 26px; background-position: -249px 0; }
	.items .itemCon:nth-of-type(1) a:before { width: 35px; height: 26px; background-position: -247px 0; }
    .items .itemCon:nth-of-type(2) a:before { width: 47px; height: 22px; background-position: -288px 0; }
    .items .itemCon:nth-of-type(3) a:before { width: 59px; height: 25px; background-position: -339px 0; }
    .items .itemCon:nth-of-type(4) a:before { width: 24px; height: 31px; background-position: -410px 0; }
    /*section list*/
    .lists { padding: 0 6px; }
    /*activity*/
    .activity .swiper-container { padding: 30px 0 15px; }
    .activity .swiper-container .swiper-slide-active { box-shadow: 0 0 15px rgba(0,189,209,.66); }
    /*notice*/
    .notice {margin-top:10px; margin-bottom: 22px; }
    .notice .nIcon { width: 21px; height: 26px; background-position: -454px 0; margin: 3px 4px 0 0; }
    .notice .nTitles { height: 26px; width: 92%; }
    .notice .nTitles a { line-height: 26px; }
}
@media screen and (min-width:480px) and (max-width:750px) {
    html { font-size: 47%!important; }  /*0.75*/
    /*banner*/
    .banner .swiper-container .swiper-pagination span, .expert .swiper-container .swiper-pagination span { height: 2px; }
    .items { padding: 26px 0 14px; }
    .items .itemCon a { box-shadow: 0 8px 14px rgba(0,189,209,.8); }
    .items .itemCon a:before { width: 37px; height: 31px; background-position: -292px 0; }
	.items .itemCon:nth-of-type(1) a:before { width: 39px; height: 31px; background-position: -291px 0; }
    .items .itemCon:nth-of-type(2) a:before { width: 70px; height: 26px; background-position: -328px 0; }
    .items .itemCon:nth-of-type(3) a:before { width: 70px; height: 29px; background-position: -397px 0; }
    .items .itemCon:nth-of-type(4) a:before { width: 29px; height: 36px; background-position: -480px 0; }
    /*section list*/
    .lists { padding: 0 7px; }
    /*activity*/
    .activity .swiper-container { padding: 35px 0 17px; }
    .activity .swiper-container .swiper-slide-active { box-shadow: 0 0 17px rgba(0,189,209,.66); }
    /*notice*/
    .notice {margin-top:20px; margin-bottom: 32px; }
    .notice .nIcon { width: 24px; height: 27px; background-position: -532px 0; margin: 1px 4px 0 0; }
    .notice .nTitles { height: 27px; }
    .notice .nTitles a { line-height: 27px; }
}