body{font-size: 16px; overflow-x: hidden;} 
.w90{ width:90%;  margin: 0 auto;  }

.inner{ width:1300px;   margin: 0 auto;  }
.pl-inner{ padding-left: calc((100vw - 1300px)/2);}
.pr-inner{ padding-right: calc((100vw - 1300px)/2);}
.ml-inner{ margin-left: calc((100vw - 1300px)/2);}
.mr-inner{ margin-right: calc((100vw - 1300px)/2);}

.w1200{ width: 1200px; margin: 0 auto;}

header{ background: #fff; width: 100%; position: relative; z-index: 100; }
/* header{ background: #fff; width: 100%; transform:translateY(0) ; z-index: 100; position: sticky; left: 0; top: 0; right: 0; -webkit-transform:translateY(0) ; -moz-transform:translateY(0) ; -ms-transform:translateY(0) ; -o-transform:translateY(0) ; } */
header.scroll{ background:#fff ;  position: fixed; top: 0; left: 0; top: 0;   color: #333; box-shadow: 0 0 15px rgba(0, 0, 0, .12);}
header.sticky{ transform:translateY(-200px) ; -webkit-transform:translateY(-200px) ; -moz-transform:translateY(-200px) ; -ms-transform:translateY(-200px) ; -o-transform:translateY(-200px) ; }


.zw{ margin-top: -170px; padding-top: 170px;}
.zwHeader{ height: 170px;}
 
 .loginBox .layui-icon{ font-size: 1em;  }
.logoImg{  height: 50px;}
 
nav li a:hover { color: var(--black);  }
.oneNav{ padding: 0 1.5vw; background: rgba(255, 255, 255, .15); color: rgba(0, 0, 0, 0.6); line-height: 50px; display: block; font-size:18px;   }
nav li.on .oneNav{ color: var(--black);  /*color: var(--orange);*/}
.headerMen{ width: 35px; height: 35px;}
.iconsvg{ height: 20px; width: 16px;}
.h_nav{ height: 60px; width:40px;  padding: 18px 0 ;    align-items: flex-end; display: flex;}
.h_nav .burger{ width: 100%;  height: 1px ; background: #333;  transition: .8s; display:inline-block;       }
.h_nav .burger:first-child{ animation: long 2s linear infinite; -webkit-animation:; }
.h_nav .burger:nth-of-type(2){  width: 50%;}
.h_nav .burger:nth-of-type(3){ animation: long 3s linear infinite; -webkit-animation: long 3s linear infinite; }
.h_nav.close .burger:first-child{ display: none;}
.h_nav.close .burger:nth-of-type(3){ display: none;}
.h_nav.close .burger:nth-of-type(2) {    position: relative;    z-index: 1; width: 80%;}
.h_nav.close .burger:nth-of-type(2):before, .h_nav.close .burger:nth-of-type(2):after {      content: '';   position: absolute;      top: 0;      left: 0;      width: 100%;      height: 100%;      background: #333;      opacity: 0;      z-index: 1;}
.h_nav.close .burger:nth-of-type(2) {    background: transparent;    transform: rotate(-180deg); }
.h_nav.close .burger:nth-of-type(2):before, .h_nav.close .burger:nth-of-type(2):after {      opacity: 1;      transition: all .3s; }
.h_nav.close .burger:nth-of-type(2):before {     transform: rotate(45deg); }   .h_nav .burger:nth-of-type(2):after {     transform: rotate(-45deg); }

.nav{ color: #fff !important; padding-bottom: 60px; width: 100%; height:  130vh ; transition:all .6s ; transform: translateX(100%); background-color: var(--color); position: fixed; top: 60px; right: 0; flex-direction: column; -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); -webkit-transition:all .6s ; -moz-transition:all .6s ; -ms-transition:all .6s ; -o-transition:all .6s ; }
.nav.show{ transform:translateX(0) ;  -webkit-transform:translateX(0) ; -moz-transform:translateX(0) ; -ms-transform:translateX(0) ; -o-transform:translateX(0) ; }
.nav li.go-child{ border-top: 1px solid rgba(255, 255, 255, 0.25); position: relative;}
.nav li.go-child>a{ line-height: 60px; padding: 0 20px; font-size: 16px;}
.h_nav.close{align-items: center; justify-content: center;}
.erji{ width: 60px; height: 60px; position: absolute; right: 0 ; top: 0; display: flex; align-items: center; justify-content: center; font-size: 30px; z-index: 10;
 background: url(../images/jia.png) no-repeat center center; background-size: 40% auto;}
 .nav li.go-child.on .erji{ background: url(../images/jian.png) no-repeat center center; background-size: 40% auto;}
.nav-down li a{ line-height: 50px; border-top: 1px solid rgba(255, 255, 255, 0.25); display: block; padding-left: 25px; font-size: 14px; opacity: 0.8; }
.nav{   overflow-y: scroll;   }
.nav::-webkit-scrollbar {/*滚动条整体样式*/    /*高宽分别对应横竖滚动条的尺寸*/  width: 1px;}
.nav::-webkit-scrollbar-thumb {/*滚动条里面小方块*/border-radius: 3px; background: #77d5ae; width: 1px; }
.nav::-webkit-scrollbar-track {/*滚动条里面轨道*/border-radius: 3px; background: #0b4f33; width: 1px; }

/* background: url(../images/idxBanBg.jpg) no-repeat center center / cover; */
.idxBan{  background-image: linear-gradient(to right,#4a21bd,#af68ea);}
/* .banCon { background: url(../images/banCircle.png) no-repeat left top #f3f3f9 ; background-size:  20% auto ; border-radius: 2vw; -webkit-border-radius: 2vw; -moz-border-radius: 2vw; -ms-border-radius: 2vw; -o-border-radius: 2vw; } */
.w62{ width: 62%;}.w38{ width: 38%;}.w54{ width: 54%;}.h-50{ height: 50px;} .h-60{ height: 60px;}
.w-50{ width: 50px;} .w-60{ width: 60px;}
 
.h-70{ height:70px;}

.banCon .right::before{ display: block; content: ''; width: 100%; height: 15%; background-image: linear-gradient(to bottom,#af68ea, #af68ea 10%,transparent); position: absolute; top: 0; left: 0; z-index: 5; }
.banCon .right::after{ display: block; content: ''; width: 100%; height: 15%; background-image: linear-gradient(to top,#af68ea, #af68ea 10%,transparent); position: absolute; bottom: 0; left: 0; z-index: 5; }
.banCon .banScoll{ height: 80vh; max-height: 560px;}
.banCon .x-li .img{ width: 100%; height: 0; padding-bottom: 200%;}
.idx1bg_video { border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; }

 /* idxCourses */
 .idxCoursesSwiper{ padding: 20px;}
 .idxTit .tip::after{ display: block; content: ''; width:.5em; height: .5em; border-radius: 50%; position: absolute; left: -.2em; top: .1em; background:var(--green) ; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
 .idxCoursesItem{ border-width: 2px; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
 .idxCoursesItem:hover{ transform: scale(1.01); box-shadow: 0 0 15px rgba(0, 0, 0, .12); -webkit-transform: scale(1.01); -moz-transform: scale(1.01); -ms-transform: scale(1.01); -o-transform: scale(1.01); }
 .idxCoursesItem .img{ width: 100%; padding-bottom: 65%; height: 0;}
 /* .idxCoursesItem .desc{ height: 7.5em;} */
 .buttonClick{ transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.buttonClick:hover{ opacity: .8;}
.idxCoursesSwiper  .swiper-slide{ height: auto;}

.mypagination .swiper-pagination-bullet{ width: 6px; height: 6px;  margin: 15px 3px 0 3px;}
.mypagination .swiper-pagination-bullet.swiper-pagination-bullet-active{}

.idxCaseImgSwiper .swiper-slide { padding-left: 1px;}
.idxCaseImgSwiper .swiper-slide .idxCaseImg{ filter:none; -webkit-filter:none; }
.idxCaseImgSwiper .swiper-slide-active .idxCaseImg{ filter: drop-shadow(5px 0 10px  rgba(74, 33, 189, .1)); -webkit-filter: drop-shadow(5px 0 10px  rgba(74, 33, 189, .1)); }
.idxCaseDian{ position: absolute; bottom: 0; left: 0; width: 20%;}
.idxCaseTextSwiper .circle{ width: 100px; height: 100px;}

.idxCaseTeach img{ width: 62px; height: 62px; border: 3px solid #f3f3f9;  margin-left: -28px;}
.idxCaseTeach img:first-child{ margin-left: 0;}
.idxCase .btn:hover{ background: var(--color); color: #fff;}

.idxLogo{ background-image: linear-gradient(45deg,#4a21bd,#af68ea);}
.idxLogoUl{ height: 120px;}
.idxLogoUl li{ height: 120px; width: 20vw;}
.idxLogoUl li img{ max-width: 60%;}

.idxFaq .left{ position: sticky; left: 0; top: 20px;}
.idxFaq .more .iconfont{ transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); }

.idxFaqul li{ background: #f3f3f9;}
.idxFaqul li:last-child{ margin-bottom: 0;}
.idxFaqul li .bottom{ display: none;}
.idxFaqul li.on{ background: #fff; box-shadow: 0 0 8px rgba(74, 33, 189, .1);}
.idxFaqul li.on .icon-arrow-down-bold:before {content: "\e687";}

/* background: url(../images/idxBanBg.jpg) no-repeat center center / cover; */
footer{ background-image: linear-gradient(to right,#4a21bd,#af68ea);  color: #fff;}
/* .footerTop { background: url(../images/banCircle.png) no-repeat left top   #f3f3f9 ; background-size:  15% auto ; border-radius: 2vw; -webkit-border-radius: 2vw; -moz-border-radius: 2vw; -ms-border-radius: 2vw; -o-border-radius: 2vw; } */
footer a:hover{ opacity: .8;}
 
.footLogo{ height: 60px;}
.ApplyBtn .circle .iconfont{ transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); }
.ApplyBtn:hover  .circle .iconfont{ transform: rotate(0); -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); }
.ApplyBtn:hover strong{ letter-spacing: 1px;}
.footNav a:last-child{ margin-bottom: 0;}
.OurLinkIcon{ width: 20px;}
 

/* background: url(../images/idxBanBg.jpg) no-repeat center center / cove */
.courseInfoTop .bg{  width: 100%;   position: absolute; left: 0; top: 0; background-image: linear-gradient(to right,#4a21bd,#af68ea); r;}
.location .icon-arrow-right2-copy{ transform:scale(.7) ; -webkit-transform:scale(.7) ; -moz-transform:scale(.7) ; -ms-transform:scale(.7) ; -o-transform:scale(.7) ; } 
.courseInfoTop .location a:hover{ color: #fff;}

.courseInfoRight{ position: sticky; top: 20px; right: 0; box-shadow: 0 0 15px rgba(74, 33, 189, .15);}
.courseInfoRight .img{ width: 100%; height: 0; padding-bottom: 65%;}
.courseInfoRight .infoImg ul{ padding-left: 1em;}
.courseInfoRight .infoImg ul,.courseInfoRight .infoImg  li{list-style:  disc ; list-style-position:outside}

button,
input,
select,
textarea {
    font-size: 100%
}
 
.loginBody{ width: 100vw; height: 100vh;}
.w46{ width: 46%;}
.shadow-color{ box-shadow: 0 0 15px rgba(74, 33, 189, .15);}
.loginLeft { background-image: linear-gradient(to right,#4a21bd,#af68ea);}
/*  background: url(../images/jianBg.jpg) no-repeat center center / cover; */
.bg-jian{background-image: linear-gradient(to right,#4a21bd,#af68ea);}
.Remember { margin-right: 10px;
    width: 20px;
    height: 20px;
    background-color: #fff;
    -webkit-appearance: none;
    border: 1px solid var(--color);
    border-radius: 2px;
    outline: none;
  }
.Remember:checked {
    background: url(../images/duiIcon.png) no-repeat center center ;
    background-size: 100% 100%;}
.LogNavimg{ height:9vw ;}
.LogNav a.on{ font-weight: bold; color: var(--color);}
.LogNav a.on img{ opacity: 1;}

.OurStory{ margin-top: -5vw; padding-top: 10vw;}
.OurStorytitle{ position: sticky; left: 0; top: 150px;}
.OurStoryUl .left .line{ width: 3px; height: 100% ;}
.imgHeight{ height: 1em;}

/* .TestimonialSwiper .swiper-slide { padding-left: 1px;}
.TestimonialSwiper .img{ width: 20vw; height: 20vw; background: url(../images/TestimonialSwiperBg.png) no-repeat center center / 100% 100%; }
.TestimonialSwiper .text{ width: calc(100% - 24vw);} */

.TestimonialSwiper .img{ width: 8.3VW; height: 8.3VW; min-width: 66px; min-height: 66px; }
.TestimonialSwiper .text{ width: calc(100% - 8.3VW);}



.Testimonial .pagination{ }
.Testimonial .pagination .swiper-pagination-bullet,.customizepagination .swiper-pagination-bullet{ margin-right: 8px; width: 2em; height: 8px; background: #f3f3f9; transition: all .36s; border-radius: 15px; opacity: 1; -webkit-border-radius: 15px; -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.Testimonial .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active,.customizepagination .swiper-pagination-bullet.swiper-pagination-bullet-active{ width: 3em; background: var(--color);}

.fourUl{ display: grid; grid-gap: 30px; grid-template-columns: repeat(3,1fr);}
.fourUl li {min-width:2px}
.fourUl li .icon01{  }
.fourUl li:nth-child(1){ background: #b168eb;}
.fourUl li:nth-child(2){ background: #8c3fcf;}
.fourUl li:nth-child(3){ background: #4a21bd;}
.fourUl li .tip{  position: absolute; right: 0; top: 0; background: rgba(255, 255, 255, .15);}
.fourUl li .pic{ position: absolute; right: 0; top: 40%;}
.fourUl li:hover{ box-shadow: 0 0 15px rgba(74, 33, 189, .3); transform: translateY(-8px); -webkit-transform: translateY(-8px); -moz-transform: translateY(-8px); -ms-transform: translateY(-8px); -o-transform: translateY(-8px); }

.courseClass{  }
.courseClass .inner::before{ display: block; content: ''; height: 22vw; position: absolute; width: calc(100% + 8vw); left: -4vw; top: 0; background-image: linear-gradient(to bottom,#f6f4fc,transparent); border-top-left-radius: 2vw; border-top-right-radius: 2vw;}

.courseBlogUl{ display: grid; grid-gap: 30px; grid-template-columns: repeat(3,1fr);}
.courseBlogUl li {min-width:2px}
.courseBlogUl li .img{ width: 100%; height: 0; padding-bottom: 70%;}
.courseBlogUl li .buttonClick:hover{ letter-spacing: 1px;}

.courseMoreUl{ display: grid; grid-gap: 30px; grid-template-columns: repeat(3,1fr);}
.courseMoreUl li {min-width:2px}

.loginBox{ z-index: 100;}
.loginBox .img{  border: 1px solid var(--orange);}
.loginBox  dl{ color: #333;   z-index: 999;}
.loginBox  dl {position: absolute; ;width: 180px; top:100%;background: #fff;left: 50%;margin-left: -90px;-webkit-box-shadow: 0 13px 10px 0px rgba(151, 150, 150, 0.22);box-shadow: 0  0px 10px  rgba(74, 33, 189, .15);border-bottom-left-radius: 5px;border-bottom-right-radius: 5px}
.loginBox  dl dd {height: 40px;  padding-left: 25px; transition: all .36s ease;-ms-transition: all .36s ease;-o-transition: all .36s ease;-webkit-transition: all .36s ease;-moz-transition: all .36s ease}
.loginBox  dl dd:last-child {border-bottom: 0}
.loginBox  dl dd a { color: #333  ;font-weight: normal ;transition: all .36s ease;-ms-transition: all .36s ease;-o-transition: all .36s ease;-webkit-transition: all .36s ease;-moz-transition: all .36s ease;display: block}
.loginBox  dl dd {  display: flex; align-items: center; }
.loginBox  dl .line{ width: 100%; background: #ccc; height: 1px; margin: 5px 0;}
.loginBox  dl dd img{ height: 15px; width: auto; margin-right: 15px; }
.loginBox  dl dd a:hover {color: var(--color) ; font-weight: bold;transform: translateX(6px);}
 
.loginBox  dl {visibility: hidden;opacity: 0;filter: alpha(opacity=0);transform: translateY(20px);-ms-transform: translateY(20px);-o-transform: translateY(20px);-webkit-transform: translateY(20px);-moz-transform: translateY(20px);transition: all .5s ease;-ms-transition: all .5s ease;-o-transition: all .5s ease;-webkit-transition: all .5s ease;-moz-transition: all .5s ease}
.loginBox:hover dl {visibility: visible;opacity: 1;filter: alpha(opacity=100);transform: none;-ms-transform: none;-o-transform: none;-webkit-transform: none;-moz-transform: none}

.courseClassUl{ display: grid; grid-gap:30px; grid-template-columns: repeat(4,1fr);}
.courseClassUl li {min-width:0}
.courseClassUl li.div1{grid-area: 1 / 1 / 2 / 3;}
.courseClassUl li .img{ width: 100%; height: 0; padding-bottom: 79%;}
.courseClassUl li .img .tip{ position: absolute; left: 0; bottom: 0; z-index: 10;}

.courseClassUl li.div1 .img{ width: 100%; height: 0; padding-bottom: 60%;}
.courseClassUl li.div1 .img .tip{ position: absolute; right: 0; top: 0; z-index: 10; left: auto; bottom: auto;}
.courseClassUl li.div1 .text{ position: absolute; bottom: -2px; left: 0; width: 100%; background: rgba(255, 255, 255, .9); z-index: 10;}

.sixSticky{ position: sticky; top: 0; left: 0; width: 100%; z-index:80;}
.sixSearch .icon-sousuo{ position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.sixSearch input{ padding-left: 70px;}
.sixNav a{ height:5vw; min-height: 40px;}
.sixNav a::after{ display: block; content: ''; width:0; height: 4px; position: absolute; left: 0; bottom: -1px; background:var(--color) ; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.sixNav a.on::after{ width: 100%;}
.sixNav a.on,.sixNav a:hover{ color: var(--color);}

.airBox .img{ width: 100%; height: 0; padding-bottom: 48%;}
.airBox .paly{
	z-index: 20;
	width: 100px;
	cursor: pointer;
	background: var(--color);
	border-radius: 50%;
	height: 100px;
	position: absolute;
	left: 50%;
	margin-left: -50px;
	margin-top: -50px;
	top: 50%;
	box-shadow: 0 0 rgba(255, 255, 255, 0.1),0 0 0 15px rgba(255, 255, 255, 0.1),0 0 0 30px rgba(255, 255, 255, 0.1);
	animation: ripple-wave1 1s linear infinite;
	animation-play-state: running;
	opacity: 1;
	visibility: visible;
	transform: scale(1);
	transform: scale(0.8);
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	-webkit-animation: ripple-wave1 1s linear infinite;
}
#slideVideo{ width: 100%;  height: 100%;}
@keyframes ripple-wave1{
    to {
        box-shadow: 0 0 0 15px rgba(255, 255, 255, 0.1),0 0 0 30px rgba(255, 255, 255, 0.1),0 0 0 45px rgba(255, 255, 255, 0.02);
    }
}
.courseClassUl li:hover{ box-shadow: 0 0 15px rgba(74, 33, 189, .1);   }
.courseClassUl li:hover .img .bigImg{ transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }

.liveBoxUl{ background: #fbfbfe;}
.liveBoxUl a:last-child{ border-bottom: none;}

.relestTime{ width:15vw ; min-width: 200px;}

.relestTime .layui-form-select .layui-input{ border-radius: 40px; padding: 0 25px; height: 60px; line-height: 60px; background: var(--color); color: #fff; -webkit-border-radius: 40px; -moz-border-radius: 40px; -ms-border-radius: 40px; -o-border-radius: 40px; }
.relestTime .layui-form-select .layui-edge{border-top-color:#fff; border-width: 10px; margin-top: -5px; right: 25px;}
.relestTime .layui-form-select dl{ top: 60px;}

.newInfoTit{ position: sticky; top: 120px; left: 0;}
.newsPage a:hover{ color: var(--orange);}

.progress-container{ width: 100%; height: 5px; background: #eeeef6;}
.progress-bar {  background: #af68ea; height: 100%;  width: 10%;  transition: width 0.5s ease-in-out;  color: transparent; 
    -webkit-transition: width 0.5s ease-in-out;-moz-transition: width 0.5s ease-in-out;-ms-transition: width 0.5s ease-in-out;  -o-transition: width 0.5s ease-in-out;
}

.question-box {}
.nineRadio[type="radio"] { width: 1em; height: 1em; border: 1px solid var(--color); border-radius: 50%; position: relative; margin-right: 10px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%;
}
.nineRadio[type="radio"]::before{ display: none; content: ''; width: 46%; height: 46%; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); border-radius: 50%; background:var(--color) ; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); }
.nineRadio[type="radio"]:checked::before{ display: block;}


.tenLeft{ width: 63%;}


.tenRadio[type="radio"] {  position: absolute !important; left: 0; top: 50%; transform: translateY(-50%);  width: 1.6em; height: 1.6em; border: 1px solid #7b7da5; border-radius: 50%; position: relative; margin-right: 10px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%;
}
.tenRadio[type="radio"]::before{ display: none; content: ''; width: 46%; height: 46%; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); border-radius: 50%; background:var(--color) ; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); }
.tenRadio[type="radio"]:checked::before{ display: block;}

.tenLeft .radio-label label{ padding-left: 70px;}
.Payment-radioItem .radio-label  .tenRadio[type="radio"]:checked + label{ background: #f3f3f9;}
.tenLeft .border{ border-width: 2px;}
.border-width{ border-width: 2px;}

.CardsList{ position: absolute; right: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }

.PaymentBottom{ display: none;}
.saveCheck { margin-right: 10px;
    width: 22px;
    height: 22px;
    background-color: #fff;
    -webkit-appearance: none;
    border: 1px solid var(--color);
    border-radius: 2px;
    outline: none;
  }
.saveCheck:checked {
    background: url(../images/saveduiIcon.jpg) no-repeat center center ;
    background-size: 100% 100%;}
.priceBot li::after{ display: none; content: ''; width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 14.5px 17px;
    border-color: transparent transparent #F3F3F9;  position: absolute;left: 15%; top: calc(100% + 25px); }
.priceBot li.on::after{ display: block;}
    .pricezekou{ margin-top: 42px;}
.tenRightDetail .img{ width: 100px; height: 65px;}
.tenRightDetail .text{ width: calc(100% - 120px);}
.tenRightInfo{ position: sticky; right: 0; top: 10px;}
.pricePop{ position: absolute; right: calc(100% + 16px); top: -50px; width: 400px; display: none; animation: rightFloat .3s; -webkit-animation: rightFloat .3s; }
.PriceHove::before{ display: none; content: '';width: 0; position: absolute; z-index: 15;
    height: 0;
    border-style: solid;
    border-width: 16px 0 16px 17px;
    border-color: transparent transparent transparent #FFFFFF;    right: calc(100% + 5px); top: -5px; }
.PriceHove:hover::before{ display: block;}
.PriceHove:hover .pricePop{ display: block;}

.pop{ width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 500; display: none;}
.pop .bg{ background: rgba(0, 0, 0, .4);}
.pop .con{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 15; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); }
.tenPop .con{ width: 90%; max-width: 500px;}
.tenPop .con .close{ position: absolute; right: 0; top: 0;}
.tenPop .con .close:hover{ color: var(--red);}
.tenPopIcon{ filter: drop-shadow(10px  0 30px rgba(74, 33, 189, .3)); -webkit-filter: drop-shadow(10px  0 30px rgba(74, 33, 189, .3)); }

.loginPop .con{  width: 90%; max-width: 600px;}
.loginPop .con .close{ position: absolute; right: 0; top: 0;}
.loginPop .con .close:hover{ color: var(--red);}

.SignPop .con{  width: 90%; max-width: 600px;}
.SignPop .con .close{ position: absolute; right: 0; top: 0;}
.SignPop .con .close:hover{ color: var(--red);}


.memberTopImg{ width: 130px; height: 130px; margin-left: -1vw;}
.memberNav a{ text-align: center;}
.memberNav a::after{ display: block; content: ''; width:0; transition: all .36s; height: 6px; position: absolute; left: 0; bottom: 0; background:var(--orange) ; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.memberNav a.on::after{ width: 100%;}
.memberNav a:hover{ color: var(--orange); }

.borderWidth{ border-width: 2px;}
.memberEwm{ width: 7vw; }

.PaymentInfo table{   box-shadow: 0 0 15px rgba(74, 33, 189, .15);border-radius: 10px; overflow: hidden; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; }
.PaymentInfo table tr  td{ padding-left: 3em; color: var(--black);}
.PaymentInfo table thead tr td{ background: var(--color); color: #fff; font-weight: bold;  height: 4.4em;}
.PaymentInfo table tbody tr  td{   height: 100px; }
.PaymentInfo table tbody tr:nth-child(2n) td{ background: #f3f3f9;}
.PaymentInfo table .CardsIcon{ height: 50px;}

.w18{ width: 18%;}
.orderInfoTop .img{ width: 100%; height: 0; padding-bottom: 70%;}
.params-container {display: table;}
.param-item {display: table-row;}
.param-cell {display: table-cell;}
.WelcomeIcon{ margin-left: -.3em; height: 2em;}

.tenPop .con::before{ display: block; content: ''; height:  30%; position: absolute; width: 100% ; left: 0; top: 0; background-image: linear-gradient(to bottom,#f6f4fc,transparent); }