body{background: #f9f9f9;}
.wrap img{display: block;width: 100%;}
.tit01{text-align: center; font-size:2.4rem; font-weight:bold; color:#333;}
.tit01 em{ display:block; font-size:1.2rem; color:#333; padding-top:0.7rem; font-weight:normal;}


.m-adv {width: 100%;  position:relative;}
.m-adv img{ width:100%; display: block;}
.m-adv .swiper-pagination{bottom: 2rem !important; z-index: 1}
.m-adv .swiper-pagination .swiper-pagination-bullet{width: 0.8rem; height: 0.8rem;margin:0 0.5rem !important;background: #000;border-radius: 0; opacity: 1; position: relative; border-radius:1rem;}
.m-adv .swiper-pagination .swiper-pagination-bullet-active{background:#00a1e9; width:2.6rem;}

/**/
.m-guide{ margin:3.2rem auto; width:86.66666%; text-align:center;}
.m-guide h2{ text-align:center; font-size:2.4rem; font-weight:bold; color:#18a5b7; line-height:2.5rem;}
.m-guide h2 em{ display:block; font-size:1.4rem; color:#333; margin:0.4rem 0 1.7rem;}
.m-guide dt{ margin:1.3rem 0; font-size:1.2rem; line-height:2rem; text-align:left; color:#333; font-weight:normal;}
.m-guide dd{ overflow:hidden; position:relative;}
.m-guide dd em{ display:block; position:absolute; bottom:2rem; left:16%; width:5rem; height:5rem; background:url(../images/guide_v.png) no-repeat center center; background-size:5rem 5rem;}


/**/
.g_pro{ padding:3rem 0; position:relative; background:url(../images/pro_bg.jpg) no-repeat center top; background-size:100% auto;}
.g_pro .tit01,.g_pro .tit01 em{ color:#fff;}
.pro_tit{ margin:2rem 0 0 7%;}
.pro_tit a{ display:block; width:29%; height:4rem; float:left; border:1px solid #fff; box-sizing:border-box; box-sizing:border-box; margin:0 2% 0.7rem 0; text-align:center; font-size:1.2rem; line-height:4rem; color:#fff;}
.pro_tit .active{ color:#00a1e9;background:#fff;}
.m_pro{ margin-top:1.8rem;}
.m_pro ul{width:86.66666%; margin:0 auto 3rem;}
.m_pro li{ width:48.7692%; float:left; margin-bottom:0.8rem; background:#fff; padding:0.9rem 0 1.3rem;}
.m_pro li span{ display:block; width:14.7rem; height:14.7rem; margin:0 auto 0.5rem; background:url(../images/pro_bg.png) no-repeat; background-size:100% auto;}
.m_pro li em{display:block;font-size:1.2rem; text-align:center; line-height:1.6rem; overflow:hidden; color:#333; font-weight:bold; padding:0 5%;}
.m_pro li img{ display:block; width:9.5rem; height:9.5rem; border-radius:10rem; margin:0 auto; padding-top:2.6rem;}
.m_pro a:nth-child(2n) li{ float:right;}
.probtn{ width:8rem; position:absolute; bottom:-4rem; left:50%; margin-left:-4rem;}
.probtn span{display:block; width:7rem; height:7rem; background:#fff; padding:0.5rem; margin:0 auto; border-radius:7rem; position:relative; z-index:1;}
.probtn span:before{position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        margin-left: -7%;
		margin-top: -5%;
        border: 1px solid #fff;
        border-radius: inherit;
        animation: wave 2s ease-out infinite; z-index:0; animation-delay: 0.1s;}
.probtn span em{ display:block; width:7rem; height:5.25rem; background:#18a5b7; text-align:center; color:#fff; font-weight:bold; line-height:1.5rem;border-radius:7rem; font-size:1rem; padding-top:1.75rem; position:relative; z-index:5;}
.probtn span em:before{position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        margin-left: -21%;
		margin-top: -25%;
        border: 1px solid #fff;
        border-radius: inherit;
        animation: wave 2s ease-out infinite; z-index:4; animation-delay: 0.1s;}
.probtn a{ color:#fff; position:relative; z-index:8;}
@keyframes wave {
        50%,
        75% {
            transform: scale(1.6);
        }
        60%,
        100% {
            opacity: 0;
        }
    }
	

/**/
.g_yous{ position:relative; padding:6rem 0 2rem;}
.yous_tit{ padding:0 6%; border-top:1px solid #c7c7c7; margin-top:1.6rem; height:10rem;}
.yous_tit a{display:block; width:25%; float:left;  padding-top:1.5rem;text-align:center; font-size:1.3rem; color:#0d1221; line-height:1.7rem;}
.yous_tit span{ display:block; width:2.8rem; height:2.8rem; margin:0 auto 0.6rem; overflow:hidden;}
.yous_tit .active{ font-weight:bold; border-top:2px solid #00a1e9;}
.m_yous{ margin:0 auto;}
.m_yous dd{ padding:0 6% 4rem; margin:0 auto; background:#fff;}
.m_yous dd h3{ height:3.7rem; padding:1.8rem 0;border-bottom:1px solid #ccc;}
.m_yous dd h3 b{ display:block; width:4rem; height:3.7rem; padding-right:4%; border-right:1px solid #ccc; float:left;}
.m_yous dd h3 b img{display:block; width:4rem; height:3.7rem;}
.m_yous dd h3 span{ display:block; width:80%; float:right; font-size:2.5rem; font-weight:bold; color:#18a5b7;}
.m_yous dd h3 em{ display:block; font-size:0.9rem; text-transform:uppercase; color:#2b3438; font-weight:normal; margin-top:0.4rem;}
.m_yous dd p{ font-size:1.15rem; line-height:2rem; margin-top:1rem;}
.g_yous .swiper-pagination{bottom: 3rem !important; z-index: 1}
.g_yous .swiper-pagination .swiper-pagination-bullet{width:0.8rem; height: 0.8rem;margin:0 0.7rem !important;background: #00a1e9;border-radius: 0; opacity: 1; position: relative; border-radius:1rem;}
.g_yous .swiper-pagination .swiper-pagination-bullet-active{background:#00a1e9; width:2.5rem;}


/**/


/**/


/**/
.g_case{ background:#f5f5f5; padding:3rem 0;}
.m_case{ margin:1.6rem auto 0; position:relative;}
.m_case dl{ width:87%; margin:0 auto;}
.m_case dd{ padding:1.5rem 0 2rem;}
.m_case dd h3{ font-size:1.8rem; font-weight:bold; color:#333333; margin:0 0 0.5rem;}
.m_case dd h3 em{ display:block;}
.m_case dd h3 em i{font-size:1.2rem; color:#666; background:url(../images/case_ad.png) no-repeat left center; background-size:0.95rem 1.25rem; padding-left:4%; margin-left:2%; font-weight:normal;}
.m_case dd h3 span{ display:block; height:3.3rem; background:#00a1e9; border-radius:4rem; text-align:center; line-height:3.3rem; color:#fff; font-size:1.5rem; font-weight:normal; margin-top:0.5rem;}
.m_case dd p{ font-size:1.2rem; line-height:2rem; color:#666; padding-top:0.5rem;}
.m_case .swiper-button-prev{ background:url(../images/case_l.png) no-repeat; background-size:100% auto; width:1.05rem; height:1.85rem; overflow:hidden; position:absolute; top:25%; left:2%; z-index:1;}
.m_case .swiper-button-next{ background:url(../images/case_r.png) no-repeat; background-size:100% auto; width:1.05rem; height:1.85rem; overflow:hidden; position:absolute; top:25%; right:2%;z-index:1;}
.m_case .swiper-button-prev:after,.m_case .swiper-button-next:after{ content:"";}


/**/
.m_cooper{width:87%; margin:0 auto; overflow:hidden; padding-bottom:1.5rem; background:#fff; box-shadow:0.1rem 0.1rem 1rem #ccc;}
.m_cooper h3{ height:4.2rem; text-align:center; font-weight:bold; color:#333; font-size:1.3rem; line-height:4.2rem;}
.m_cooper li{ width:31.2%; float:left; border:1px solid #ccc; box-sizing:border-box; margin-left:1.5%;}



/**/


/* */
.g_news{ margin:3.5rem 0 2rem;}
.news_tit{ width:87%; height:5rem; background:#e1effa; overflow:hidden; margin:1.5rem auto 0.9rem;}
.news_tit em{ display:block; width:33.33%; height:5rem; line-height:5rem; color:#333; border-right:1px solid rgba(255,255,255,0.4); float:left; box-sizing:border-box;white-space: nowrap;overflow: hidden;text-overflow: ellipsis; border-right:1px solid #c8d3dc;}
.news_tit em i{ display:block; width:1.5rem;height:1.5rem; float:left; margin:1.9rem 5% 0 10%; overflow:hidden;}
.news_tit em:nth-child(2){ width:38.33%;}
.news_tit em:nth-child(3){width:28.33%; border:0;}
.news_tit .active{ background:#00a1e9; color:#fff;}
.news_tit .active i img{ margin-top:-1.5rem;}
.m_news{ width:87%; margin:0 auto; overflow:hidden;}
.m_news dl{ padding:1.5rem 0; border-bottom:1px solid #e2e2e2;}
.m_news dt{ width:50.769%; float:left;}
.m_news dd{ width:46.1538%; float:right;}
.m_news dd h3{ font-size:1.5rem; font-weight:bold; color:#333; margin-top:2.8rem;}
.m_news dd h3 em{ display:block; font-size:1rem; color:#999; margin:0.3rem 0 0.5rem;}
.m_news a:last-child dl{ border:0;}

/* */
.g_about{ position:relative; background:url(../images/about_bg.jpg) no-repeat center top; background-size:100% auto; padding:3.3rem 0 6rem;}
.g_about .tit01,.g_about .tit01 em{ color:#fff;}
.g_about p{ width:87%; padding:1.5rem 0 2rem; margin:0 auto; color:#fff; font-size:1.2rem; line-height:2rem; text-align:center; position:relative; margin-top:1.5rem;}
.g_about p:before{ content:""; position:absolute; top:0; left:50%; width:4.5rem; height:1px; background:#5abeef; margin-left:-2.25rem;}
.g_about ul{width:87%; margin:2rem auto 0;}
.g_about li{ width:50%; float:left; padding:1.5rem 0; border:1px solid #fff; box-sizing:border-box; color:#fff; font-size:1.2rem; text-align:center;}
.g_about li span{ display:block; font-weight:bold; font-size:1.2rem;}
.g_about li span b{ font-size:3rem;}
.g_about .probtn em{ line-height:3.5rem;}

/**/
.m_pic{ width:87%; margin:6rem auto 2rem; overflow:hidden;}
.m_pic li{ width:48.76923%; float:left;}
.m_pic li em{ display:block; text-align:center; font-size:1.2rem; height:3.3rem; line-height:3.3rem; color:#333;}
.m_pic a:last-child li{ float:right;}



html{font-size:10px;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0);}
@media screen and (min-width:320px){html{font-size:8.5333px;}}
@media screen and (min-width:360px){html{font-size:9.6px;}}
@media screen and (min-width:375px){html{font-size:10px;}}
@media screen and (min-width:400px){html{font-size:10.66666666666px;}}
@media screen and (min-width:414px){html{font-size:11.04px;}}
@media screen and (min-width:440px){html{font-size:11.73333333333333px;}}
@media screen and (min-width:480px){html{font-size:12.8px;}}
@media screen and (min-width:520px){html{font-size:13.86666666666667px;}}
@media screen and (min-width:560px){html{font-size:14.93333333333333px;}}
@media screen and (min-width:600px){html{font-size:16px;}}
@media screen and (min-width:640px){html{font-size:17.06666666666667px;}}
@media screen and (min-width:680px){html{font-size:18.1333333333px;}}
@media screen and (min-width:700px){html{font-size:18.66666666666667px;}}
@media screen and (min-width:720px){html{font-size:19.2px;}}
@media screen and (min-width:750px){html{font-size:20px;}}