body {
  margin: 0;
  padding: 0;

}
/*智慧酒店  wisdom.html*/

.centered{
    width: 1400px;
    height: auto;
    margin: 0px auto;
}
.centered li{
    list-style: none;
}
.imgDiv{
    width:100%;
    height: auto;
    background-color: #fff;
    text-align: center;
    overflow: hidden;
    margin-top: 50px;
}
.imgDiv img{
    width:100%;
    height: 40vm;
}
.tolive{
    width: 100%;
    height: 80px;
    margin: 20px auto;
    text-align: center;

}
.tolive text{
    display: block;
    margin: 0px auto;
    line-height: 80px;
    font-size: 40px;
    color: #333;
    border-bottom: 1px solid #333;
}
.advantages{
    width: 100%;
    height: 40vm;
    background: url("../img/wisdom/hotel_bg_advantage.png");
    background-size: 100% 100%;
    padding-top: 10px;
}
.ad_jsdj{
    width: 70%;
    min-width: 1200px;
    max-width: 80%;
    margin: 80px auto 0px;
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
}
.ad_jsdj ul{
    width: 130px;
    height: 260px;
}
.ad_jsdj ul img{
    width: 130px;
    height: 130px;
    margin-bottom: 15px;
}
.ad_jsdj ul text{
    width: 130px;
    line-height: 25px;
    display: block;
    text-align: center;
    color: #fff;
    font-size: 14px;
}
.guest{
    width: 70%;
    min-width: 1200px;
    max-width: 80%;
    height: 35vm;
    max-height: 40vm;
    min-height: 580px;
    margin: 40px auto 0px;
    background-size: 100% 100%;
}
.guest_left{
    background-image: url("../img/wisdom/hotel_bg_new.png");
}
.guest_right{
    background-image: url("../img/wisdom/hotel_bg_old.png");
}
.guest_right ul:nth-of-type(1){
    width: 488px;
    height: 432px;
    margin-right: 50px;
    padding-left: 50px;
    margin-top: 30px;
    background-size: 100% 100%;
}
.guest_right>.gu_tit{
    margin-left: 50px;
}
.guest_right>.gu_control{
    float: right;
    padding: 60px 60px 60px 0px;
}
.gu_control{
    width: 680px;
    height: 500px;
    padding: 60px 0px 0px 60px;
    display: flex;
}
.gu_tit{
    width: 20px;
    height: auto;
    border-top: 2px solid #D8A451;
    color: #fff;
    font-size: 18px;
    line-height: 25px;
    padding-top: 15px;
}
.gu_content{
    width: 538px;
    height: 432px;
    margin-left: 50px;
    margin-top: 30px;

    background-size: 100% 100%;
}
.gu_left{
    background-image: url("../img/wisdom/hotel_bg_new_one.png");
}
.gu_right{
    background-image: url("../img/wisdom/hotel_bg_old_one.png");

}
.gu_content li:nth-of-type(1){
    width: 90%;
    height: 60px;
    font-size: 22px;
    color: #333333;
    margin-top: 40px;
    font-weight: bold;
    background-image:none;
    padding-left: 0px;
}
.gu_content li:nth-of-type(2){
    width: 50px;
    height: 3px;
    background-color: #D8A451;
    margin-left: 10%;
    padding-left: 0px;
    margin-bottom: 30px;
    background-image:none;
}
.gu_content li{
    width: 90%;
    height:35px;
    font-size: 16px;
    color: #444;
    padding-left: 18px;
    margin-left: 10%;
    background-image: url("../img/wisdom/hotel_light_point.png");
    background-size: 10px 10px;
    background-repeat: no-repeat;
}
/*智慧酒店ending  wisdom.html*/


/** 标题样式 **/
.titles{
    width: 100%;
    height: 70px;
    margin: 50px 0px 50px;
    text-align: center;
    font-family: MicrosoftYaHeiLight;
}
.titles li{list-style: none}
.titles li:nth-of-type(1){
    width: 100%;
    color: #333333;
    font-size: 36px;
    line-height: 40px;
}
.titles li:nth-of-type(2){
    width: 100%;
    color: #999;
    font-size: 20px;
    line-height: 40px;
    letter-spacing: 4px;
    font-family: MicrosoftYaHeiLight;
}

/**标题样式  over **/

/*产品 control.html*/
.self-help{
    width: 100%;
    height: 200px;
    position: relative;
    background-color: #fff;
}
.box{
    width: 1270px;
    position: absolute;
    top: -30px;
    left: 0px;
    z-index: 2;
    box-shadow: 3px 2px 30px rgba(0,0,0,.1);
    background-color: #fff;
}
.box ul{
    float: right;
}
.box ul li{
    width: 300px;
    height: 180px;
    float: left;
    text-align: center;
    position: relative;
    transition: all .6s ease-out;
    overflow: hidden;
    color: #666666;
}

#blue{
    color: #fff;
    background-color:#3288e6 ;
}
#white{
    background-color: #fff;
}
#blues{
    background-color:#3288e6 ;
}
#blue .tit_Robot{
    color: #fff;
}
#blue .tt{
    width: 73px;
    height: 64px;
    margin-top: 40px;
}
.box ul li h3{
    padding-top: 30px;
    color: #333;
    font-size: 18px;
}
.box ul li p{
    margin-top: 7px;
    color: #666;
    font-size: 14px;
}

.box ul .on{
    width: 700px;
    height: 180px;
    text-align: left;
}
.on .tit_Robot_fu{
    display: none;
}
.tit_Robot{
    font-size: 20px;
    color: #353535;
    width: 90%;
    padding-left: 5%;
    height: 50px;
    line-height: 50px;
}
.tit_Robot img{
    display: none;
}
.tit_Robot_fu{
    position: absolute;
    top: 0px ;
    left: 0px;
    width: 300px;
    height: 200px;
}
.tit_Robot_fu:hover{
    animation: imgtran 1s forwards;
    -webkit-animation: imgtran 1s forwards;
}
@keyframes imgtran
{
    from {
        transform: scale(1);
    }
    to {
        transform: scale(1.1);
    }
}

@-webkit-keyframes imgtran /* Safari 与 Chrome */
{
    from {
        transform: scale(1);
    }
    to {
        transform: scale(1.1);
    }
}
.tit_Robot_fu  img{
    display: block;
    width: 70px;
    height: 87px;
    margin: 30px auto 10px;
}
.tit_Robot_fu text{
    font-size: 16px;
    height: 30px;
    line-height: 30px;
    display: block;
    text-align: center;
}
.robot{
    position: relative;
}
.robot_help{
    width: 170px;
    height: 130px;
    float: left;
    cursor: pointer;
}
.robot_help img{
    display: block;
    width: 50px;
    height: 50px;
    margin: 10px auto;
}
.robot_help text{
    display: block;
    text-align: center;
    font-size: 12px;
}
.robotproducts{
    width: 100%;
    height: auto;
    background-color: #fff;
}
.robotproducts .product_tit{
    width: 1400px;
    margin: 0px auto 0px;
    padding-bottom: 20px;
    height: 93px;
    display: flex;
    justify-content: space-between;
}
.robotpresent{
    width: 100%;
    height: auto;
    position: relative;
}
.presentimg {
    width: 500px;
    height: 700px;
    position: relative;
}

.presentimg_two{
    width: 635px;
    height: 368px;
    margin-top: 240px;
}
.bgwhite{
    background-color: #fff;
}
.bggrey{
    background-color: #F9F9F9;
}
.present{
    width: 1400px;
    height: 700px;
    margin: 0px auto;
    display: flex;
    justify-content: space-between;
    position: relative;
}
.present .presentrobot{
    width: 100%;
    height: 100%;
}
.presentword{
    width:auto ;
    height: 35px;
    position: absolute;
    right: -100px;
    top: 300px;
    z-index: 2;
}
.present_text{
    width: 560px;
}
.text_right{
    text-align: right;
}
.present li{
    font-size: 16px;
    color: #333;
    line-height: 30px;
}
.present .pro_tit{
    font-size: 42px;
    color: #000;
    margin-top: 140px;
    line-height: 100px;
}
.barrager{width:100%; margin:0 auto;height:300px;overflow:hidden;position:absolute; bottom: 0px;
    left: 0px; z-index: 2}
.barrager div{position:absolute;}
.barrager img{width: auto; height: 41px;}

.selfhelpproducts .product_tit{
    width: 1400px;
    margin: 0px auto 0px;
    padding-bottom: 20px;
    height: 93px;
    display: flex;
    justify-content: space-between;
}
.selfhelpproducts{
    width: 100%;
    height: auto;
    background-color: #fff;
}
.selfhelp_lunbo{
    width: 1400px;
    height: auto;
    margin: 20px auto 50px;
}
.text_center{
    text-align: center;
}
#hwslider{width: 1360px;height: 690px;margin:40px auto; position: relative;  background: url(../img/control/pro_bg_mac@2x.png);
    background-size: 100% 100%;}
#hwslider ul{width: 1360px; height: 660px; position: absolute; z-index: 1;overflow: hidden; }
#hwslider ul li{display:none;position:absolute; left:0; top:0; width: 1360px;height: 660px; overflow: hidden;}
#hwslider ul li.actives{display: block;}
#dots{ width: 1360px; border-bottom: 1px solid #DDDDDD; height: 30px; margin: 0px auto; z-index: 2; display: flex; justify-content: center;}
#dots span{text-align: center; width:200px;height: 30px; border-bottom: 1px solid #ddd;  background: #fff; margin-right: 0px; cursor: pointer;}
#dots text{height:20px;border-right: 1px solid #ddd;}
#dots span.actives{border-bottom: 1px solid #106CEB;color: #106CEB;}
.arr{
    width: 76px;
    height: 112px;
    display: inline-block;
    position: absolute;
    top: 290px; z-index: 99;opacity: 0.6;}
.arr:hover{opacity: 1}
#prev{
    left: -70px;
    background: url("../img/control/buttons.png") no-repeat;
    background-position: 0px 0;
}
#next{
    right: -70px;
    background: url("../img/control/buttons.png") no-repeat;
    background-position: -76px 0;
}

#cList{
    width: 1360px;
    position: relative;
    background: url("../img/control/pro_bg_mac@2x.png") no-repeat;
    background-size: 100%;
}
#btnLeft{
    width: 76px;
    height: 112px;
    display: inline-block;
    position: absolute;
    left: -70px;
    top: 290px;
    background: url("../img/control/buttons.png") no-repeat;
    background-position: 0px 0;
}
#btnRight{
    width: 76px;
    height: 112px;
    display: inline-block;
    position: absolute;
    right: -70px;
    top: 290px;
    background: url("../img/control/buttons.png") no-repeat;
    background-position: -76px 0;
}



.lunboself{
    width: 100%;
    height: 660px;
    margin: 0px auto;
    overflow: hidden;
    display: flex;
    justify-content: start;

}
.mac_img{
    width: 294px;
    height: 567px;
    margin-top: 60px;
    margin-left: 28%;
}
.mac_text{
    width: 420px;
    height: auto;
    margin-left: 10%;
}
.mac_text text:nth-of-type(1){
    font-size: 30px;
    color: #333333;
    margin-top: 250px;
    line-height: 50px;
}
.mac_text text:nth-of-type(2){
    margin-bottom: 50px;
}
.mac_text text{
    display: block;
    font-size: 14px;
    color: #666;
    list-style: none;
    line-height: 24px;
}
.interface_img{
    width: 533px;
    height: 366px;
    margin-top: 180px;
    margin-left: 10%;
}
.lunbo_selfstep{
    width: 80%;
    height: 660px;
    margin: 0px auto;
    overflow: hidden;
}
.step_tit{
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: right;
    margin-top: 50px;
    font-size: 28px;
    margin-bottom: 30px;

}
.pro_step{
    width: 100%;
    height: 250px;
    margin-top: 120px;
    display: flex;
    justify-content: space-between;
}
.pro_step img{
    width: auto;
    height: 250px;
}
.step_type{
    width: 90%;
    height: 40px;
    line-height: 40px;
    margin: 80px auto 0px;
    display: flex;
    justify-content: space-between;
    font-size: 16px;
    color: #333333;
}
.step_type text{
    padding-bottom: 5px;
}
.blue_bor{
    border-bottom: 2px solid #106CEB;
}
.step_type div{
    padding: 0px 40px;
}
#selfimg{
    width: 363px;
    height: 475px;
    position: absolute;
    top: 88px;
    left: 51px;
}

.presentimg_self{
    width: 450px;
    height: 577px;
    position: relative;
    margin: 123px 0px 0px 30px;
}
.presentimg_self img{
    width: 210px;
    height: 577px;
}

.unite_tree img:hover{
    animation: imgtran 1s forwards;
    -webkit-animation: imgtran 1s forwards;
}

.pagehide{
    animation:pagehide 2s forwards;
    -webkit-animation: pagehide 2s forwards;
    display: none;
}

@keyframes pagehide
{
    from {
        opacity: 1;
        display: block;
    }
    to {
        opacity: 0;
        display: none;
    }
}

@-webkit-keyframes pagehide /* Safari 与 Chrome */
{
    from {
        opacity: 1;
        display: block;
    }
    to {
        opacity: 0;
        display: none;
    }
}

/*产品ending control.html */

.wrap {
  position: absolute;
  top: 20px;
  left: 20px;
  margin: auto;
  width: 150px;
  height: 150px;
  filter: url("../index.html/#filt");
  -webkit-filter: url("#filt");
}
.wrap .blob {
  display: block;
  cursor: pointer;
  border: none;
  outline: none;
  position: absolute;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  z-index: 10;
  background-color: transparent;
}
.wrap .blob.checking,.wrap .blob.checking2,.wrap .blob.checking3{
  z-index: 30;
	font-size: 36px;
	text-align: center;
	color: #333;
	border: 1px solid #333;
	line-height: 150px;
  transition: transform 0.5s ease-in-out 0.2s;
  -webkit-transition: -webkit-transform 0.5s ease-in-out 0.2s;
  -moz-transition: transform 0.5s ease-in-out 0.2s;
  -o-transition: transform 0.5s ease-in-out 0.2s;
  -ms-transition: transform 0.5s ease-in-out 0.2s;
}
.wrap .blob:not(label) {
  width: 56px;
	height: 56px;
	line-height: 56px;
	top: 50%;
	left: 50%;
	padding: 0;
  transform: translate(-50%,-50%);
  font-size: 30px;
  transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
}
.wrap > #checking:checked ~ .blob:nth-child(2),.wrap > #checking2:checked ~ .blob:nth-child(2) {
  margin-left: -115px;
  margin-top: -50px;
  background: #00a0ea url(../img/WeChat.png) no-repeat center;
}
.wrap > #checking2:checked ~ .blob:nth-child(2){
	background: #00a0ea url(../img/service.png) no-repeat center;
}
.wrap > #checking3:checked ~ .blob:nth-child(2) {
  margin-top: -50px;
  margin-left: 115px;
  background: #00a0ea url(../img/key.png) no-repeat center;
}

.wrap > #checking:checked ~ .blob:nth-child(3),.wrap > #checking2:checked ~ .blob:nth-child(3) {
  margin-top: -115px;
	margin-left: -45px;
  background: #00a0ea url(../img/app.png) no-repeat center;
}
.wrap > #checking2:checked ~ .blob:nth-child(3){
	background: #00a0ea url(../img/scene.png) no-repeat center;
}

.wrap > #checking:checked ~ .blob:nth-child(4),.wrap > #checking2:checked ~ .blob:nth-child(4) {
  margin-top: -115px;
  margin-left: 45px;
  background: #00a0ea url(../img/robot.png) no-repeat center;
}
.wrap > #checking2:checked ~ .blob:nth-child(4) {
  background: #00a0ea url(../img/face.png) no-repeat center;
}
.wrap > #checking:checked ~ .blob:nth-child(5),.wrap > #checking2:checked ~ .blob:nth-child(5) {
  margin-top: -50px;
  margin-left: 115px;
  background: #00a0ea url(../img/Self-help.png) no-repeat center;
}
.wrap > #checking2:checked ~ .blob:nth-child(5) {
  background: #00a0ea url(../img/interactive.png) no-repeat center;
}

.writingshit {
  width: 60%;
  margin: 50px auto;
  background-color: #fff;
  text-align: center;
  box-shadow: 0 0 10px 2px #000;
  -webkit-box-shadow: 0 0 10px 2px #000;
  -moz-box-shadow: 0 0 10px 2px #000;
  -o-box-shadow: 0 0 10px 2px #000;
  -ms-box-shadow: 0 0 10px 2px #000;
}
.writingshit .wow {
  padding: 30px;
}
.writingshit .wow p {
  padding: 0 30px;
}

.fontBG,.fontBGF{
	position: absolute;
	width: 300px;
	height: 95px;
	font-size: 14px;
	color: #333;
	background: url(../img/Line.png) no-repeat right bottom;
}

.fontBGF{
	display: none;
	top: -80px;
  left: 190px;
	background: url(../img/Line_F.png) no-repeat left bottom;
}

.fontBG > p{
  width: 75%;
	text-align: right;
	margin: 0 0 0 35px;

}

.fontBGF > p{
	width: 95%;
	margin-left: 13%;
	text-align: left;
}

.wrap > .fontBG:nth-of-type(1){
	top: -80px;
	left: -350px;
	display: none;
}

.wrap > .fontBG:nth-of-type(2){
	top: -150px;
  left: -270px;
  display: none;
}

.wrap > .fontBGF:nth-of-type(3){
	top: -150px;
	left: 120px;
	display: none;
}

.wrap > .fontBGF:nth-of-type(4){
	top: -80px;
	left: 190px;
	display: none;
}

.wrap > #checking:checked ~ .fontBG:nth-of-type(1),.wrap > #checking:checked ~ .fontBG:nth-of-type(2),.wrap > #checking:checked ~ .fontBGF:nth-of-type(3),.wrap > #checking:checked ~ .fontBGF:nth-of-type(4),.wrap > #checking2:checked ~ .fontBG:nth-of-type(1),.wrap > #checking2:checked ~ .fontBG:nth-of-type(2),.wrap > #checking2:checked ~ .fontBGF:nth-of-type(3),.wrap > #checking2:checked ~ .fontBGF:nth-of-type(4),.wrap > #checking3:checked ~ .fontBGF{
	display: block;
}