/*-----------------------------------------------------------------------------------------------------------------------*/
.wrap img{ width:100%; display:block;}

.ban{ position:relative;}
.ban img{ display:block; width:100%;}
.ban .swiper-pagination{ bottom:2rem;}
.ban .swiper-pagination-bullet{opacity:1; width:0.8rem; height:0.8rem; border-radius:0.8rem;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#12aee3+0,33c4b3+100 */
background: rgb(18,174,227); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(18,174,227,1) 0%, rgba(51,196,179,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#12aee3', endColorstr='#33c4b3',GradientType=1 ); /* IE6-9 */}
.ban .swiper-pagination-bullet-active{  width:2rem;}

.tit{ text-align:center; font-size:2.5rem; font-weight:bold; color:#000;}
.tit em{display:block; font-size:1.4rem;font-weight:normal;}

.g-guide ul{box-shadow:0 0 1rem #666; margin-bottom:2.5rem; padding:1.5rem 0 2.2rem;}
.g-guide li{ width:33.33%; float:left; padding:1rem 0; text-align:center; font-size:1.2rem; color:#333; position:relative;}
.g-guide li:before{ content:""; position:absolute; top:1.5rem; right:0; width:1px; height:65%; border-right:1px dashed #666;}
.g-guide li:nth-child(3n):before{ border:0;}
.g-guide li span{ display:block; font-size:3rem; color:#333; font-weight:bold;}
.g-guide li span em{ display:inline-block; height:1.5rem; border-radius:5rem; padding:0 0.2rem;text-align:center; font-weight:normal; line-height:1.5rem; color:#fff; font-size:1.1rem;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#12aee3+0,33c4b3+100 */
background: rgb(18,174,227); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(18,174,227,1) 0%, rgba(51,196,179,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#12aee3', endColorstr='#33c4b3',GradientType=1 ); /* IE6-9 */}
.g-guide dl{ width:94.66%; margin:0 auto;}
.g-guide dd{ padding:0 3%;}
.g-guide dd h3{ font-size:2.4rem; font-weight:bold; color:#12aee3;}
.g-guide dd h3 em{ display:block; font-size:1.4rem; color:#333; text-transform:uppercase; font-weight:normal;}
.g-guide dd h3 i{ display:block; font-size:1.6rem; font-weight:normal; color:#000;}
.g-guide dd p{ font-size:1.2rem; line-height:1.9rem; color:#666; margin:0.5rem 0 2.4rem;}
.g-guide dt{ position:relative;}
.g-guide dt img{ display:block; width:100%; padding:0.8rem; border:1px solid #efefef;border-radius:0.8rem; box-sizing:border-box;}
/*.g-guide dt:before{ content:""; position:absolute; top:40%; left:43%; background:url(../images/guide_v.png) no-repeat; background-size:4.5rem 4.5rem; width:4.5rem; height:4.5rem;}*/

.g-super{padding:2.6rem 0;}
.supert{ height:4.8rem; border-bottom:1px solid #e1e1e1; box-sizing:border-box; margin:1.2rem 0 1.65rem; padding:0 3%;}
.supert em{ display:block; width:21%; margin:0 2%; float:left; font-size:1.4rem; font-weight:bold; line-height:4.7rem; text-align:center; color:#333; position:relative;}
.supert em:before{ content:""; position:absolute; top:4.25rem; left:50%; width:0.75rem; height:0.75rem; margin-left:-0.35rem; background:#fff; border:3px solid #999; border-radius:1rem;}
.supert .active{ border-bottom:3px solid #26afe5; box-sizing:border-box; position:relative;}
.supert .active:before{ content:""; position:absolute; top:4.25rem; left:50%; width:0.75rem; height:0.75rem; margin-left:-0.35rem; background:#fff; border:3px solid #27aee6; border-radius:1rem;}
.g-super dl{ padding-bottom:2.5rem; position:relative;}
.g-super dl:before{ content:""; position:absolute; bottom:0; width:100%; height:0.4rem;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#12aee3+0,33c4b3+100 */
background: rgb(18,174,227); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(18,174,227,1) 0%, rgba(51,196,179,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#12aee3', endColorstr='#33c4b3',GradientType=1 );}
.g-super dd{ width:92%; margin:1.3rem auto 0;}
.g-super dd h3{ font-size:1.5rem; font-weight:bold; color:#000;}
.g-super dd p{ font-size:1.2rem; line-height:1.9rem; color:#666; margin:0.5rem 0 1.2rem;}
.g-super dd h5 span{ display:block; float:left; text-align:center; font-size:1.2rem; font-weight:bold; color:#333; width:25%;}
.g-super dd h5 span em{ display:block; font-size:3rem; font-weight:bold;color:#0DABEA;background-image: -webkit-gradient(linear,left 0, right 0, from(#0DABEA), to(#32C4B5));-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.g-super dd h5 span i{ font-size:1.8rem;}

.fanwt,.prot{ width:94.66%; height:4.5rem; margin:1.6rem auto 3px;}
.fanwt em,.prot em{ border:1px solid #eaeaea; box-sizing:border-box; width:49.5%; margin-right:1px; background:#f5f5f5; height:4.5rem; display:block; float:left; font-size:1.4rem; text-align:center; line-height:4.5rem; color:#000;}
.fanwt .active,.prot .active{ font-weight:bold; color:#fff;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#12aee3+0,33c4b3+100 */
background: rgb(18,174,227); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(18,174,227,1) 0%, rgba(51,196,179,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#12aee3', endColorstr='#33c4b3',GradientType=1 ); }
.m-fanw{ width:94.66%; margin:0 auto 1.5rem; overflow:hidden;}
.m-fanw dt{ position:relative;}
.m-fanw dt em{ display:block; width:100%; height:3rem; background:rgba(0,0,0,0.7); text-align:center; position:absolute; bottom:0; font-size:1.2rem; line-height:3rem; color:#fff;}
.m-fanw dt em img{ width:1.7rem; height:1.7rem; vertical-align:middle; display:inline-block; margin:-0.3rem 2% 0 0;}
.m-fanw dd h3{ font-size:1.5rem; font-weight:bold; color:#000; margin:1.35rem 0 0.5rem;}
.m-fanw dd p{ font-size:1.2rem; line-height:1.9rem; color:#666;}
.m-fanw h5{font-size:1.4rem; font-weight:bold; color:#000; margin:1.35rem 0 0.7rem; padding-left:3%; position:relative;}
.m-fanw h5:before{ content:""; position:absolute; top:0.6rem; left:0;width: 0;height: 0;border-style: solid;border-width: 0.375rem 0 0.375rem 0.5rem;border-color: transparent transparent transparent #27ade6;}
.m-fanw li{ width:49.29%;}
.m-fanw li em{ display:block; text-align:center; height:3rem; font-size:1.2rem; line-height:3rem; overflow:hidden;text-overflow: ellipsis;white-space: nowrap; color:#333;}
.m-fanw a:nth-child(2n-1) li,.g-case a:nth-child(2n-1) li{ float:left;}
.m-fanw a:nth-child(2n) li,.g-case a:nth-child(2n) li{ float:right;}


.g-yanf{ background:#efefef; padding:3.5rem 0 0 0;}
.gallery-top{ width:94.66%; margin:1rem auto; overflow:hidden;}
.gallery-top dl{ position:relative;}
.gallery-top dd{ position:absolute; bottom:0; left:0; width:100%; height:3rem; background:rgba(0,0,0,0.5); font-size:1.2rem; line-height:3rem; color:#fff; overflow:hidden; text-align:center;}
.gallery-thumbs{ width:94.66%; margin:0 auto; overflow:hidden;}
.gallery-thumbs .swiper-slide{ width:32.39%;}
.gallery-thumbs em{display:block; text-align:center; height:3rem; font-size:1.2rem; line-height:3rem; overflow:hidden;text-overflow: ellipsis;white-space: nowrap; color:#333; background:#fff;}
.gallery-thumbs .swiper-slide-active em{ color:#fff;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#12aee3+0,33c4b3+100 */
background: rgb(18,174,227); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(18,174,227,1) 0%, rgba(51,196,179,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#12aee3', endColorstr='#33c4b3',GradientType=1 ); /* IE6-9 */}

.g-yanf2{ padding:2rem 0 3.8rem;}
.g-yanf2 li{ width:22%; float:left; text-align:center; font-size:1.2rem; color:#333;}
.g-yanf2 li span{ display:block;font-size:4rem; font-weight:bold;color:#0DABEA;background-image: -webkit-gradient(linear,left 0, right 0, from(#0DABEA), to(#32C4B5));-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.g-yanf2 li:nth-child(1){ width:31%;}
.g-yanf2 li:nth-child(4){ width:25%;}
.g-yanf2 li span em{ font-size:1.4rem;}

.g-case{ margin:2.5rem 0;}
.caset{ width:94.66%; margin:1rem auto 0;}
.caset a{ display:block; width:25%; float:left; border-right:2px solid #fff; border-bottom:2px solid #fff; box-sizing:border-box; background:#e1e1e1; font-size:1.5rem; color:#000; height:4rem; text-align:center; line-height:4rem; overflow:hidden;text-overflow: ellipsis;white-space: nowrap;}
.g-case dl{width:94.66%; margin:0 auto 0.4rem;}
.g-case dt{ width:50.7%; float:left;}
.g-case dd{ width:45.35%; float:right;}
.g-case dd h3{ font-size:1.5rem; font-weight:bold; color:#333; line-height:1.8rem; margin:1rem 0 0.3rem; height:3.6rem; overflow:hidden;}
.g-case dd p{ font-size:1.2rem; line-height:2rem; color:#666;}
.g-case dd em{ display:block; width:2rem; height:2rem; background:url(../images/case_arr.png) no-repeat; background-size:100% auto; margin-top:0.6rem;}
.g-case ul{ width:94.66%; margin:0 auto;}
.g-case li{ width:33.33%; border:1px solid #ccc; box-sizing:border-box; float:left;}

.m-pro{ width:94.66%; margin:0 auto; overflow:hidden;}
.m-pro li{width:48.73%; margin-bottom:0.8rem;}
.m-pro li em{ display:block;font-size:1.2rem; color:#272727; height:3rem; line-height:3rem; text-align:center;overflow:hidden;text-overflow: ellipsis;white-space: nowrap; }
.m-pro a:nth-child(1) li{ width:100%;}
.m-pro a:nth-child(1) li em{ height:3.8rem; line-height:3.8rem; background:#4c4c4c; color:#fff;}
.m-pro a:nth-child(2n-1) li{ float:right;}
.m-pro a:nth-child(2n) li{ float:left;}

.g-news{padding:2rem 0 3rem;}
.newt{ width:94.66%; height:4rem; margin:0.6rem auto 0;}
.newt em{ display:block; font-size:1.6rem; font-weight:bold; color:#1d1d1d; line-height:4rem; padding: 0 8% 0 3%; position:relative; float:left;}
.newt em:before{content:""; position:absolute; top:1.6rem; left:0;width: 0;height: 0;border-style: solid;border-width: 7.5px 0 7.5px 10.0px;border-color: transparent transparent transparent #666;}
.newt .active:before{content:""; position:absolute; top:1.6rem; left:0;width: 0;height: 0;border-style: solid;border-width: 0.375rem 0 0.375rem 0.5rem;border-color: transparent transparent transparent #27ade6;}
.newt .active{ color:#0DABEA;background-image: -webkit-gradient(linear,left 0, right 0, from(#0DABEA), to(#32C4B5));-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.newt a{ display:block; float:right; font-size:1.5rem; color:#1d1d1d; float:right; line-height:4rem;}
.m-new{ width:92%; margin:0 auto; overflow:hidden;}
.g-news dl{ margin-bottom:0.9rem;}
.g-news dt{ width:49.57%; float:left;}
.g-news dd{ width:47.32%; float:right;}
.g-news dd h3{ font-size:1.4rem; font-weight:bold; color:#333; margin:.8rem 0 0.2rem; line-height:2rem;}
.g-news dd p{ font-size:1.2rem; line-height:1.9rem; color:#666;}
.g-news li{ border-bottom:1px solid #e5e5e5; height:3.6rem; line-height:3.6rem; overflow:hidden;text-overflow: ellipsis;white-space: nowrap; font-size:1.3rem; color:#333;}
.g-news li em{ display:block; float:left; width:1.7rem; height:1.7rem; background:#999; font-size:1.2rem; text-align:center; line-height:1.7rem; color:#fff; margin:1rem 2% 0 0;}
.g-news a:nth-child(1) li em{/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#12aee3+0,33c4b3+100 */
background: rgb(18,174,227); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(18,174,227,1) 0%, rgba(51,196,179,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#12aee3', endColorstr='#33c4b3',GradientType=1 ); /* IE6-9 */}

.g-about dt img{ display:block; width:100%;}
.g-about dd{ width:94.66%; margin:-3.3rem auto 0; background:#fff; box-shadow:0.1rem 0.1rem 1rem 0.1rem #ccc; position:relative; z-index:5; padding:2rem 0 4rem;}
.g-about dd h3{ font-size:2.2rem; color:#000; text-align:center;}
.g-about dd p{ font-size:1.2rem; line-height:2rem; color:#666; margin-top:0.8rem; padding:0 4%;}
.g-about h5{ width:50%; margin:-2rem auto 0; position:relative; height:4rem; border-radius:3rem; text-align:center; line-height:4rem; font-size:1.5rem; font-weight:bold; color:#fff; z-index:6;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#12aee3+0,33c4b3+100 */
background: rgb(18,174,227); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(18,174,227,1) 0%, rgba(51,196,179,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#12aee3', endColorstr='#33c4b3',GradientType=1 ); /* IE6-9 */}

.g-sheb{ margin:1.1rem 0 2rem;}
.shebt{ width:94.66%; height:4.2rem; margin:0 auto; overflow:hidden;}
.shebt em{ display:block; width:25%; height:4.2rem; float:left; font-size:1.5rem; line-height:4.2rem; color:#000;text-align:center;overflow:hidden;text-overflow: ellipsis;white-space: nowrap; }
.shebt .active{ color:#0cabeb; font-weight:bold;}
.m-sheb{ width:94.66%; margin:0 auto; overflow:hidden;}
.m-sheb li{width:49.29%;}
.m-sheb li em{display:block;font-size:1.2rem; color:#333; height:3rem; line-height:3rem; text-align:center;overflow:hidden;text-overflow: ellipsis;white-space: nowrap;}
.m-sheb a:nth-child(2n-1) li{ float:right;}
.m-sheb a:nth-child(2n) li{ float:left;}


/*开屏秀*/
/*.wrap{ opacity:0;}*/
.pageShare img{ display:block; width:0px; height:0px;}
.loading{position:fixed;width:100%;height:100%; top:0;display:none; max-width:750px; min-width:320px; z-index:99999;}
.loading #showNext{ line-height:1.8rem; display:none; color:#fff; border:0.05rem solid #0da056;border-radius:5%; padding-left:1rem; padding-right:1rem; text-align:center; position:absolute; right:1rem; top:1rem; z-index:99;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#12aee3+0,33c4b3+100 */
background: rgb(18,174,227); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(18,174,227,1) 0%, rgba(51,196,179,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(18,174,227,1) 0%,rgba(51,196,179,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#12aee3', endColorstr='#33c4b3',GradientType=1 ); /* IE6-9 */}

.homeShow{ animation: fade 0.8s ease both;-webkit-animation: fade 0.8s ease both; }
@-webkit-keyframes fade {
  from 
  {
   opacity:1;
   display:block;
   
  }

  to {
    opacity: 0;
    display:none;
    height:0;
   
  }
}

@keyframes fade {
  from{
    opacity: 1;
   display:block;
  }

  to 
  {
    display:none;
    opacity: 0;
    height:0;
  }
}

.fade {
  -webkit-animation-name: fade;
  animation-name: fade;
}

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.06666666666667‬px;}}
@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;}}