body{ position: relative; -webkit-text-size-adjust: 100%; font-family: "Microsoft YaHei", Arial, sans-serif; font-size: .16rem;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, span, a { margin: 0; padding: 0; vertical-align: baseline;}
ul, ol { list-style: none;}
a { text-decoration: none; color: inherit; cursor: pointer; outline: none;}
a:hover{ text-decoration:none;}
img { border: 0; object-fit: cover;}
video{ object-fit: cover; }
table { border-collapse: collapse;}
area{ outline:none; }
input, textarea, select{ -webkit-appearance: none; outline: none; resize: none; border-radius: 0;}
input::-ms-clear{ display:none;}
input[type="text"], input[type="password"] { -webkit-appearance: none; -moz-appearance: none; appearance: none;}
button { border: none; background: none; cursor: pointer; font-size: inherit;}
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0;}
h1.wm-public{height:0; line-height:0; font-size:0;}
.cf:after {content:"";display:block;height:0;clear:both;} 
.cf {zoom:1;}
.fl{ float: left; }
.fr{ float: right; }
.rel{ position: relative;}
.abs{ position: absolute;}
.auto{left: 50%; -webkit-transform:translate(-50%,0); -moz-transform:translate(-50%,0); -ms-transform:translate(-50%,0); -o-transform:translate(-50%,0); transform:translate(-50%,0);}

#wrapper{ min-width: 19.2rem; display: none;}

.header{ position: fixed; top: 0; left: 0; width: 100%; height: .99rem; background: #000; z-index: 2;}
.headerCont{ width: 15.5rem; height: 100%; margin: 0 auto; display: flex; justify-content: space-between; align-items: center;}
.logos{ height: .72rem;}
.headerRight{ display: flex; align-items: center;}
.followUs, .register{ width: 2.17rem; height: .42rem; margin-right: .2rem;}
.followUs{ background: url(../images/followUs.png) no-repeat 0 0; background-size: 100% auto;}
.register{ background: url(../images/register.png) no-repeat 0 0; background-size: 100% auto;}
.followUs:hover, .register:hover{ background-position-y: 100%;}
.share{ width: .54rem; height: .42rem; margin-right: .2rem; background: url(../images/share.png) no-repeat 0 0; background-size: 100% auto;}
.language{ display: flex; justify-content: space-between; align-items: center; width: 1.06rem;}
.language button{ width: .34rem; height: .34rem;}
.language .en{ background: url(../images/en.png) no-repeat 0 0; background-size: 100% auto;}
.language .de{ background: url(../images/de.png) no-repeat 0 0; background-size: 100% auto;}
.language .active{ background-position-y: 100%;}
.language::after{ content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: .02rem; height: .39rem; overflow: hidden; background: #FFF;}

.box1{ height: 11.58rem; background: url(../images/box1.jpg) no-repeat center; background-size: auto 100%;}
.box1Register{ top: 6.09rem; right: 50%; margin-right: 1.97rem; width: 5.98rem; height: 2.31rem; background: url(../images/box1Register.png) no-repeat 0 0; background-size: 100% auto;}
.box1Register:hover{ background-position-y: 100%;}

.box2{ height: 8.13rem; background: url(../images/box2.jpg) no-repeat center; background-size: auto 100%;}
.times{ top: 4.3rem; right: 50%; margin-right: 2.32rem;}
.times p{ width: 5.57rem; height: .5rem; margin-bottom: .05rem;}
.times p:nth-child(1){ background: url(../images/t1.png) no-repeat 0 0; background-size: 100% auto;}
.times p:nth-child(2){ background: url(../images/t2.png) no-repeat 0 0; background-size: 100% auto;}
.times p:nth-child(3){ background: url(../images/t3.png) no-repeat 0 0; background-size: 100% auto;}
.times p:nth-child(4){ background: url(../images/t4.png) no-repeat 0 0; background-size: 100% auto;}
.times p:nth-child(5){ background: url(../images/t5.png) no-repeat 0 0; background-size: 100% auto;}
.times p.active{ background-position-y: 100%;}

.box3{ height: 19.36rem; background: url(../images/box3.jpg) no-repeat center; background-size: auto 100%;;}
.moreBtn{ position: absolute; width: 4.08rem; height: .66rem; background: url(../images/moreBtn.png) no-repeat 0 0; background-size: 100% auto;}
.more1Btn{ top: 3.87rem; right: 50%; margin-right: .24rem;}
.more2Btn{ top: 11.07rem; left: 50%; margin-left: .14rem;}
.more3Btn{ top: 16.66rem; right: 50%; margin-right: .24rem;}
.moreBtn::after{ content: ""; position: absolute; top: .16rem; left: .69rem; width: .33rem; height: .33rem; background: url(../images/moreIcon.png) no-repeat 0 0; background-size: 100% auto; transition: all .4s;}
.moreBtn:hover::after{ transform: rotate(90deg);}

.box4{ height: 7.27rem; background: url(../images/box4.jpg) no-repeat center; background-size: auto 100%;;}
.demoAppointment{ top: 4.93rem; left: 50%; margin-left: 1.55rem; width: 4.94rem; height: .67rem; background: url(../images/demoAppointment.png) no-repeat 0 0; background-size: 100% auto;}
.demoAppointment:hover{ background-position-y: 100%;}

.box5{ height: 10.2rem; background: url(../images/box5.jpg) no-repeat center; background-size: auto 100%;;}
.swiper{ top: 2.3rem; width: 14.04rem;}
.swiper-slide a{ display: block; width: 4.41rem; height: 6.17rem;}
.p1{ background: url(../images/1.png) no-repeat 0 0; background-size: 200% auto;}
.p2{ background: url(../images/2.png) no-repeat 0 0; background-size: 200% auto;}
.p3{ background: url(../images/3.png) no-repeat 0 0; background-size: 200% auto;}
.p4{ background: url(../images/4.png) no-repeat 0 0; background-size: 200% auto;}
.p5{ background: url(../images/5.png) no-repeat 0 0; background-size: 200% auto;}
.swiper-slide a:hover{ background-position-x: 100%;}
.prev, .next{ top: 4.3rem; width: .54rem; height: 1.99rem;}
.prev{ right: 50%; margin-right: 7.44rem; background: url(../images/prev.png) no-repeat 0 0; background-size: 200% auto;}
.next{ left: 50%; margin-left: 7.44rem; background: url(../images/next.png) no-repeat 0 0; background-size: 200% auto;}
.prev:hover, .next:hover{ background-position-x: 100%;}

.box6{ height: 6.6rem; background: url(../images/box6.jpg) no-repeat center; background-size: auto 100%;;}
.aboutMore{ top: 3.73rem; left: 50%; margin-left: 4.84rem; width: 2.45rem; height: .29rem; background: url(../images/aboutMore.png) no-repeat 0 0; background-size: 100% auto;}
.aboutMore:hover{ background-position-y: 100%;}

#pop_msg{ background: none;}
.popMsgCont{ width: auto; line-height: 2em; padding: 0 2em; border-radius: 1.5em; background: #000; font-size: .24rem; color: #FFF; white-space: nowrap}