@charset "UTF-8";
html{
  font-size:5.208vw;
}
@media screen and  (min-width:1920px){
  html{
  font-size: 100px;
}
}
@media screen and  (max-width:300px){
  html{
  font-size:100px;
}
}


@keyframes Move {

0% { background:rgba(207,130,181,0.2); }
50% { background:rgba(207,130,181,0.1); }
100% { background:rgba(207,130,181,0.2); }

}

.pinggu{ position:fixed; left:0; top:0; z-index:6; float:left; overflow:hidden; width:100%; height:100%;}
.pinggu .colse{ float: right;line-height:0; z-index:16;position:fixed;right:11px;top:11px;cursor: pointer;-webkit-transition: all 0.5s ease-out 0s; 
-moz-transition: all 0.5s ease-out 0s; 
-o-transition: all 0.5s ease-out 0s; 
transition: all 0.5s ease-out 0s;  
}
.pinggu .colse:hover{ transform:rotate(180deg); -ms-transform:rotate(180deg);}
.section{ width:100%; height:100vh; display:flex; flex-wrap:wrap; background:#fef7ff; position:absolute; left: 0; top: 0; }
.section .wcenter{ max-width:790px; display:block; margin:0 auto;touch-action: pan-x; position:relative; min-height:100%;}
.section .title{ float:left; width:100%; font-weight:bold; color:#000; font-size:calc(12px + 0.08rem); line-height:calc(20px + 0.1rem); position:relative; padding:0 calc(30px + 0.1rem);}
.section .title .num{ float:left; position:absolute; left:0; top:0; color:#cf82b5; display:flex; align-items:flex-end; padding-right:4px;  }
.section .title .num:after{ float:left; width:12px; height:8px; content:''; position:absolute; left:100%; top:calc(8px + 0.05rem);background:url(../img/ico2.png) right center no-repeat; background-size:100% 100%;}
.section .center{ float:left; width:100%;}
.section .bli{ float:left; width:100%;}
.section .bli .li{ float:left; width:100%; height:100vh !important; padding-top:1rem; padding-bottom:1rem;display:flex; flex-wrap:wrap; align-items:center;}
.section .bli .dl{ float:left; width:100%; padding:0 calc(30px + 0.1rem); margin-top:0.26rem; display:flex; flex-wrap:wrap; flex-direction:column;}
.section .bli .mt6{ margin-top:0.06rem;}
.section .bli .dd{ float:left; position:relative; width:256px; margin-top:9px; border-radius:3px; background:rgba(207,130,181,0.2); border:1px solid #cf82b5; padding:2px 39px; color:#cf82b5;font-size:calc(12px + 0.04rem); line-height:calc(24px + 0.1rem); cursor:pointer; -webkit-transition: all 0.5s ease-out 0s; 
-moz-transition: all 0.5s ease-out 0s; 
-o-transition: all 0.5s ease-out 0s; 
transition: all 0.5s ease-out 0s;  }
.section .bli .dd:hover{ background:rgba(207,130,181,0.3);}
.section .bli .dd:after{ display:flex; width:calc(12px + 0.03rem); height:calc(12px + 0.03rem); background:url(../img/ico1.png) center no-repeat; background-size:100% 100%; position:absolute; right:10px; top:calc(7px + 0.04rem);content:''; opacity:0; }
.section .bli .dd .zm{ float:left; width:24px; height:24px; position:absolute; left:7px; top:calc(2px + 0.05rem); border-radius:2px; background:#fff; border:1px solid #cf82b5; font-weight:bold; color:#cf82b5;font-size:14px; line-height:22px; text-align:center;}
.section .bli .dd.on{box-shadow:#cf82b5 0px 0px 0px 2px inset; animation:Move 0.8s infinite;}
.section .bli .dd.on .zm{ background:#cf82b5; color:#fff;}
.section .bli .dd.on:after{ opacity:1; }
.section .bli .OK{width:123px; float:left;display:block;position:relative; margin:calc(10px + 0.09rem) 0 calc(20px + 0.04rem) 0; background:#cf82b5; border-radius:3px; color:#fff; font-weight:bold; font-size:calc(12px + 0.06rem); line-height:calc(30px + 0.1rem); height:calc(30px + 0.1rem); padding:0 15px; text-transform:uppercase; display:flex; align-items:center; cursor:pointer; -webkit-transition: all 0.5s ease-out 0s; 
-moz-transition: all 0.5s ease-out 0s; 
-o-transition: all 0.5s ease-out 0s; 
transition: all 0.5s ease-out 0s; }
.section .bli .OK::after{content:"";display:block; display:flex; width:calc(12px + 0.03rem); height:calc(12px + 0.03rem); background:url(../img/ico1.png) center no-repeat; background-size:100% 100%; margin-left:6px;}
.section .bli .OK:hover{ background:rgba(207,130,181,0.8);}
.section .bli .OK1{margin:calc(10px + 0.09rem) 0 calc(20px + 0.35rem) 0; }
.section .bli .OK_t{margin-left:calc(30px + 0.1rem);width:auto;}
.section .bli .lab{ float:left; width:100%; margin-top:calc(9px + 0.06rem)}
.section .bli .name{ float:left; width:100%; margin:0.05rem 0; color:#000;font-size:calc(12px + 0.06rem); line-height:calc(20px + 0.08rem);}
.section .bli .input{ float:left; width:100%; background:none; border:0; border-bottom:1px solid #cf82b5; padding:0.08rem 0; color:#cf82b5;font-size:calc(12px + 0.04rem); line-height:calc(30px + 0.1rem); height:calc(30px + 0.26rem);}
.section .cli{ float:left; width:100%; height:calc(100vh - 56px); padding-top:1rem; padding-bottom:1rem; display:flex; flex-wrap:wrap; align-items:center;}
.section .cli .li{ float:left; width:100%; margin-top:10px;}
.section .inp{ float:left; width:100%; margin:0.05rem 0; color:#555;font-size:calc(12px + 0.06rem); line-height:calc(20px + 0.12rem); padding:0 calc(30px + 0.1rem); margin-top:calc(10px + 0.08rem);}
.section .er{ float:left; width:130px; text-align:center; color:#555;font-size:calc(12px + 0.06rem); line-height:calc(20px + 0.08rem); margin:calc(10px + 0.3rem) 0 0 calc(30px + 0.1rem);}
.section .er i{ float:left; width:100%; line-height:0;}
.section .er span{ float:left; width:100%; margin-top:5px;}
.section .pupDown .anniu{ float: left;position:relative;}
.section .pupDown .button{ float:left; background:#cf82b5; cursor:pointer; border-radius:3px;width:37px;height:32px; position:relative; z-index:7;}
.section .pupDown .button:after{ float:left; width:10px; height:10px; content:''; position:absolute; left:50%; top:50%; border-bottom:1px solid #fff; border-right:1px solid #fff; transform:translate(-50%,-50%) rotate(45deg); -ms-transform:translate(-50%,-50%) rotate(45deg); margin-top:-3px;}
.section .pupDown .prev:after,
.section .pupDown .swiper-button-prev:after{transform:translate(-50%,-50%) rotate(225deg); -ms-transform:translate(-50%,-50%) rotate(225deg); margin-top:3px;}
.section .pupDown .button:hover{  background:#d899c4;}
.section .pupDown .prev,
.section .pupDown .swiper-button-prev{ border-radius:3px 0 0 3px;}
.section .pupDown .next,
.section .pupDown .swiper-button-next{ border-radius:0 3px 3px 0; border-left:1px solid rgba(0,0,0,0.2);}
.section .pupDown .swiper-button-disabled{ z-index:5;}
.section .pupDown .prev{ position:absolute; left: 0;top: 0; z-index: 6;}
.section .pupDown .next{ position:absolute; right: 0;top: 0; z-index: 6;}
.section .pupDown{ position:absolute; right:0; bottom:calc(10px + 0.14rem); padding:0 18px; width:100%; z-index:6; display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end}
.section .pupDown .a{ float:left; background:#cf82b5; border-radius:3px; color:#fff; font-weight:bold; font-size:calc(12px + 0.02rem); line-height:32px; max-width:186px; text-align:center; padding:0 15px; margin:0 8px;}
.section .pupDown .a:hover{  background:rgba(207,130,181,0.8); }
.section .pupDown1{ bottom:0; background:#efe8f0; padding:12px 26px;}
.section .pupDown1 .info{ float:left; color:#555; font-size:calc(12px + 0.04rem); line-height:calc(20px + 0.06rem); padding:0 13px;}


.section ::-webkit-input-placeholder{color:#cf82b5}
.section :-moz-placeholder{color:#cf82b5}
.section ::-moz-placeholder{color:#cf82b5}
.section :-ms-input-placeholder{color:#cf82b5}


.section3{  z-index:3;}
.section2{ padding:0 0.6rem; z-index:4;}
.section2 .swiper-wrapper {
  position: relative;
  width: 100%;
  height:100vh;
  z-index: 1;
}

.section1{flex-direction:row-reverse;z-index:5;}
.section1 .text{ float:left; width:43%; padding:7.1%; margin-right:7%; display:flex; flex-wrap:wrap;  align-items:center; }
.section1 .text .cont{ float:left; width:100%;}
.section1 .text .tit{ float:left; width:100%; color:#000; font-weight:bold; font-size:calc(12px + 0.18rem); line-height:calc(30px + 0.1rem);}
.section1 .text .p{ float:left; width:100%; color:#000; font-size:calc(12px + 0.08rem); line-height:calc(20px + 0.16rem); margin-top:calc(10px + 0.07rem);}
.section1 .text .btn{ float:left; width:100%; margin-top:calc(10px + 0.5rem); margin-bottom:calc(10px + 0.02rem);}
.section1 .text .btn a{ float:left; background:#cf82b5;color:#fff; font-size:calc(12px + 0.04rem); line-height:calc(30px + 0.1rem); padding:0 calc(27px + 0.1rem); border-radius:calc(27px + 0.1rem); }
.section1 .text .btn a:hover{ background:rgba(207,130,181,0.8);}
.section1 .img{ float:right; width:50%; line-height:0;}
.section1 .img img{ opacity:0;}
.section1.on{}
.section2.on{ z-index:6;}
.section3{position:fixed;left:0;top:0;z-index:999;display:none;}
.section3.act{display:block;}

.section2 .swiper-bullet{ position: absolute;top: 0px;left:0;z-index:25;width:100%; float:left; height:4px;overflow: hidden;background: rgba(207,130,181,0.3);}
.section2 .swiper-pagination{ position: absolute;top: 0px;left:-16%; z-index:26;width:100%; float:left; height:4px;overflow: hidden;display: flex; overflow:hidden; }
.section2 .swiper-pagination-bullet{ position:relative; height:4px;z-index:27; float:left;display: flex; width: 100%; }
.section2 .swiper-pagination-bullet:after{ position:absolute;right:100%; top:0; height:4px;z-index:27; float:left; background: #cf82b5; display: flex; content: '';}
.section2 .swiper-pagination-bullet-active{ overflow:visible;}
.section2 .swiper-pagination-bullet-active:after{right:0; width:6000px;
-webkit-transition: all 0.5s ease-out 0s; 
-moz-transition: all 0.5s ease-out 0s; 
-o-transition: all 0.5s ease-out 0s; 
transition: all 0.5s ease-out 0s; }




@media screen and (max-width:767px) {
.section1 .img{ width:100%; height:50vh;}
.section1 .text{ width:100%; height:50vh; margin:0;}
.section .pupDown{ padding:0 0.6rem;}
.section .pupDown1{ justify-content:center; padding:12px 0.6rem;}
.section .pupDown1 .info{ text-align:center; padding:0 0 10px 0; line-height:22px;}
.section .title .num:after{ width: 10px; top:calc(6px + 0.05rem);}
.section .cli{ height:calc(100vh - 110px);}
.section .bli .li{ padding-bottom:5rem;}
.section .bli .dd{ padding:2px 35px;}
.section .bli .dd .zm{width: 22px; height: 22px; line-height:20px; top:calc(3px + 0.05rem);}


}