/*Huang CSS Document QQ:52710360 */
/*
 * @author: Huang zhenghua
 * @QQ:52710360 
*/


html {font-size: 62.5%;}
 body {  font-size: 1.4rem;color:#333; background-color:#F5F5F5; font-family:"Microsoft YaHei",Tahoma,Arial,"Segoe UI", "Lucida Grande", Helvetica, "Microsoft YaHei", FreeSans, Arimo, "Droid Sans", "wenquanyi micro hei", "Hiragino Sans GB", "Hiragino Sans GB W3", "FontAwesome", sans-serif;}
html,body{width: 100%;height: 100%;}
form{margin:0px;}
img{border:none;}
ul,li { list-style:none; border:none;}
html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote,pre, form, fieldset, table, th, td { margin: 0; padding: 0;  }
a{outline: medium none;transition:all 0.2s linear 0s;
-moz-transition:all 0.2s linear 0s;
-webkit-transition:all 0.2s linear 0s;
-o-transition:all 0.2s linear 0s;color:#333;}
a:link {color:#333;text-decoration:none;}
a:visited {text-decoration:none;color:#333;}
a:hover {text-decoration:none;color:#4461F3;}
a:active {text-decoration:none;color:#4461F3;}
a{
	-webkit-tap-highlight-color:transparent;
	outline:none;
	blr:expression(this.onFocus = this.blur());
}
a:focus{
	outline:none;
}
img, input, select {vertical-align:middle;outline: medium none;}
.clear{ float:none !important;clear:both!important; overflow:hidden!important; padding:0px!important; height:0px!important;}
.clearfix:after { content: ""; display: block; clear: both;}
textarea{ font-size:12px;outline: medium none;}
i{ font-style:normal;}
button, input:not([type="radio"]):not([type="checkbox"]), select {vertical-align: middle;}

*{margin:0;padding:0;
box-sizing:border-box;  
-moz-box-sizing:border-box; 
-webkit-box-sizing:border-box; 
-o-box-sizing:border-box; 
}


.fright{ float:right !important;}
.fleft{ float:left !important;}

header.m-hd{ width:100%; z-index:999; position: absolute; top: 0; left: 0; margin:0 auto;padding: 0; height: auto;}
header.m-hd .header-top{width:100%; overflow:hidden; max-width:1820px;margin:0 auto; padding: 28px 10px;}
header.m-hd .header-top .m-logo{width:324px;overflow:hidden;display:block; float:left;}
header.m-hd .header-top .m-logo img{ width: 100%;}
header.m-hd .header-top .nav{float:right;height:30px; text-decoration:none;margin-top:32px; }
header.m-hd .header-top .nav li{font-size:16px;margin-right:40px; float: left;position: relative; line-height: 30px;}
header.m-hd .header-top .nav a{ color: rgba(255, 255, 255, 1) ;cursor: pointer; }
header.m-hd .header-top .nav a:hover{ color: #fff ;text-decoration: none;}
header.m-hd .header-top .nav li.hover a{ color: #fff ; }



.show-sm-only{display: none;}
.el-drawer__header{ margin-bottom: 0 !important; z-index: 99999!important;background-color: #333 !important;}
.v-modal{z-index:89!important;}
.am-header { color:#fff; font-size:16px;position: relative;  width: 100%;  height: 49px;  line-height: 49px;  padding: 0 10px;}
.am-header .am-header-nav { position: absolute; top: 0;}
.am-header .am-header-left { left: 10px;}
.am-header .am-header-left  img{ width: 56%;}
.am-header .am-header-title { margin: 0 30%; font-size: 2rem; font-weight: normal; text-align: center; display: block; word-wrap: normal;  text-overflow: ellipsis;  white-space: nowrap;  overflow: hidden;}
.am-header .am-header-right { right: 10px;}
.am-header .am-header-right img{margin-top: -4px;}
.am-header a{ color:#fff; text-decoration:none;}


.el-drawer__body{background-color:#333;}
.el-drawer__container .el-drawer__close-btn{ font-size: 30px !important; color: #fff!important;}
header.m-hd nav li{ransition: all 0.2s linear 0s; }
.am-offcanvas-content{ padding:15px 0; width:100%;}
.am-offcanvas-content .nav{ width: 100%;:none;margin-top:5px; font-size: 18px; overflow: hidden;}
.am-offcanvas-content .nav li{font-size: 16px;color: #fff; float: left; width: 100%; line-height:60px;height:60px;border-left: solid 5px #333;}
.am-offcanvas-content .nav li a{text-decoration:none; padding-left:20px;color: #fff; background-repeat: no-repeat; background-position:0px  center;}
.am-offcanvas-content .nav li.hover{background-color:rgba(68, 97, 243, 0.22);border-left: solid 5px #4461F3;}



.common-box{width: 100%; max-width: 1340px; margin: 0 auto; overflow: hidden;}
.common-title{width: 100%; overflow: hidden;font-weight: bold;font-size: 48px;color: #333333;}

.common-but{width: 200px;height: 58px;background: #9896E6;border-radius:10px;
margin:70px auto 0 auto; overflow: hidden; line-height: 58px; text-align: center;font-size: 24px;color: #FFFFFF !important;display: block;}



.commonad{width: 100%;margin: 0 auto; overflow: hidden; position: relative;}
.commonad .img{ width: 100%;}
.commonad dl{width:96%;max-width:1340px; overflow: hidden; position: absolute;margin:0 auto; left: 0; right: 0; color: #fff; font-weight: bold;bottom: 16%;}
.commonad dl dt{font-size: 48px;padding-bottom:10px; position: relative;}
.commonad dl dd{font-size: 24px;}



.common-list{}
.common-list li {width: 100%; float: left; overflow: hidden;}
.common-list li .box{overflow: hidden;display: block;position: relative;width: 100%;}
.common-list li .box .img{border-radius:20px;display: block; width: 100%;}
.common-list li .box .info{ width: 100%; overflow: hidden; position: absolute; bottom:8%; left: 8%;}
.common-list li .box .info .title{width: 100%; overflow: hidden;font-weight: bold;font-size: 24px;color: #FFFFFF;line-height: 34px;}
.common-list li .box .info .but{ width: 104px;height: 36px;background: #FFFFFF;border-radius: 18px;margin-top:30px; line-height: 36px; text-align: center;font-size: 16px;}



.common-list2{}
.common-list2 li { padding: 10px; width: 25%; float: left; overflow: hidden; margin-top: 10px}
.common-list2 li .box{ overflow: hidden; display: block; width: 100%;background: #FAFAFA;}
.common-list2 li .box .img{display: block; width: 100%; background-color: #fff;}
.common-list2 li .box .info{ overflow: hidden;  padding: 15px; }
.common-list2 li .box .info dt{width: 100%; overflow: hidden; font-weight: bold;font-size: 24px;color: #333333;line-height: 34px;}
.common-list2 li .box .info dd{ width: 100%;overflow: hidden;font-size: 14px;color: #333333;line-height: 24px; margin-top: 15px;}




.common-list3{ margin:20px -5px 0 -5px;overflow: hidden; padding-bottom: 50px;}
.common-list3 li{ width:16.66%; float: left;overflow: hidden; padding:5px;}
.common-list3 li .box{width: 100%; overflow: hidden; padding:0;display: block;}
.common-list3 li .img{display: block; margin: 0 auto; width:100%;border: 1px solid #DDDDDD; padding:10px;}
.common-list3 li .dt{text-align: center; width: 100%;font-size:18px;color: #333333;line-height:180%; margin-top:10px;font-weight: bold;}



.common-list4{ margin:50px -10px 0 -10px; overflow: hidden;}
.common-list4 li { padding:20px; width:50%; float: left; overflow: hidden;}
.common-list4 li .box{overflow:hidden;display:block; width:100%; position: relative;}
.common-list4 li .bg{ width: 100%; overflow: hidden;}
.common-list4 li .img{ width: 100%; position: absolute; left: 0; top: 0; padding-top: 3%;}






.indextopad {position:relative;width:100%; overflow:hidden; margin: 0 auto;}
.indextopad .swiper-slide { background-size:cover; background-repeat:no-repeat; background-position:center center; position:relative;}

.indextopad .swiper-slide .box{position: absolute; bottom:20%; margin:0 auto; left: 0; right: 0; overflow: hidden;max-width:1340px; width: 100%;  padding: 0 20px;  }
.indextopad .swiper-slide a{ overflow: hidden;display: block;}
.indextopad .swiper-slide img{width: 100%;}
.indextopad .swiper-slide dl{ width: 100%; overflow: hidden; color: #fff;}
.indextopad .swiper-slide dl dt{font-size: 48px;font-weight: bold;}
.indextopad .swiper-slide dl dd{font-size: 24px; margin-top: 20px;}
.indextopad .swiper-slide dl dd .but{width:314px;height:58px;border-radius: 10px;border: 1px solid #FFFFFF; line-height: 56px; text-align: center;display: block; margin-top: 40px;}



.indextopad2 {position:relative;width:100%; overflow:hidden; margin: 0 auto;}
.indextopad2 .img{ width: 100%;}
.indextopad2 .common-title{ color: #fff;position: absolute; top:12%; left: 8%;}
.indextopad2 dl{ width: 100%; overflow: hidden; color: #fff; position: absolute; bottom:15%; left: 8%;}
.indextopad2 dl dt{font-size: 48px;font-weight: bold;}
.indextopad2 dl dd{font-size: 24px; margin-top: 20px;}
.indextopad2 dl dd .but{width:200px;height:58px;border-radius: 10px; line-height: 56px; text-align: center;display: block; margin-top: 40px; background-color: #fff;}



.index-main01{padding:100px 0;max-width: 100%;}
.index-main01  .swiper{margin-top: 60px; }
.index-main01 .abox{}




.index-main02box{ width: 100%;background: #FAFAFA;}
.index-main02{padding:80px 0;max-width: 1340px; width: 100%;}
.index-main02 .cbox{display: flex;justify-content:space-between;}
.index-main02  .tabs{ width:30%;padding: 10px 0;overflow: visible; margin-top: 30px;}
.index-main02  .tabs li{ width:100%; height:72px; line-height: 28px;font-size: 16px; color:#333; position: relative; cursor: pointer; padding:0 0 12px 30px; overflow: hidden;}
.index-main02  .tabs li::after {content: " ";width: 12px;height: 12px;background: #E6E6E6; position: absolute; left: 0; top: 10px;  border-radius: 12px;}
.index-main02  .tabs li::before{ content: " ";position: absolute; height: 100%; width:1px;background: #E3E3E3; top: 0; left:6px;}
.index-main02  .tabs li:first-child::before{ top: 10px; }
.index-main02  .tabs li:last-child::before{height: 78%; }

.index-main02  .tabs li.active{ color: #333;font-weight: bold;}
.index-main02  .tabs li.active::after{background:#9896E6;}
.index-main02  .swiper-container{ width: 100%; margin-top: 30px;}

.index-main02 .infobox{ width: 70%; overflow: hidden; max-width: 800px;}
.index-main02 .box{width: 100%; overflow: hidden;}
.index-main02 .box dl.info{  width:100%;}
.index-main02 .box dl.info dt,
.index-main02 .box dl.info dd{ width:100%; overflow: hidden; color:#333;}
.index-main02 .box dl.info dt {font-size:28px;font-weight: bold; position: relative; padding-bottom: 20px;}
.index-main02 .box dl.info dt::after {content: " ";width: 52px;height: 5px;background: #9896E6; position: absolute; left: 0; bottom: 0;}
.index-main02 .box dl.info dd {font-size:14px; line-height: 180%; margin-top:20px; color:#333;}
.index-main02 .box dl.info dd p{color: #A1A1A1;}

.index-main02 .box .img{width: 100%; margin-top: 50px;}
.index-main02 .box .img img{ width:100%;}



.index-main03{padding:0 0px 50px 0;max-width: 1340px;}
.index-main03 .common-list2 { margin:0 -10px;}




.index-main04{ padding: 100px 0 90px 0;display: flex;justify-content:space-between;align-items:center;width: 100%; overflow: hidden;}
.index-main04 .box{}
.index-main04  .swiperbox{ width: 45%; margin: 0; overflow: hidden;}
.index-main04  .button-next,.index-main04  .button-prev{width: 44px; height: 44px; margin-right: 20px;}
.index-main04  .but{ width: 100%; overflow: hidden; margin-top: 50px;display: flex; cursor: pointer; }
.index-main04  .swiper{ width: 100%; margin:80px 0 0 0;}
.index-main04  .info{  width:100%;}
.index-main04 .info dt{ width:100%; overflow: hidden;font-weight: bold;
font-size: 16px;color: #333333; margin-top:20px; }
.index-main04 .info dd {font-size: 16px;color: #333333;line-height: 200%;}

.index-main04 .img{width:40%; overflow: hidden; }
.index-main04 .img img{ width: 100%;}





.index-main05box{ width: 100%;background: #FAFAFA;}
.index-main05{padding:70px 0px;max-width: 1340px;}
.index-main05 .common-title{ text-align: center;}

.problem-box{ max-width: 1200px; padding: 70px 0;}
.problem-box .type{ overflow: hidden; width: 100%;padding: 0 20px 30px 20px;}
.problem-box .type li{float: left; width: 20%; overflow: hidden; padding: 0 20px; text-align: center;}
.problem-box .type img{display: block; margin: 0 auto;}
.problem-box .type span{display: block; width: 100%;font-weight: bold;
font-size: 14px; margin-top: 20px;}

.problem-box .ctitle{ position: relative; height: 20px; overflow: hidden; margin-top: 40px;}
.problem-box .ctitle span{display: block;background-color: #fff; overflow: hidden; height: 20px; line-height: 20px; font-size: 18px; color: #333;font-weight: bold; z-index: 5;float: left; position: absolute; padding-right: 10px;}
.problem-box .ctitle::after {content: " ";width: 100%;height:1px;background: #9896E6; position: absolute; left: 0; top: 9px;}
.problem-box .ctitle::before{content: " ";width: 100%;height:1px;background: #9896E6; position: absolute; left: 0; top: 14px;}

.problem-list .common-title2{text-align: center;}
.problem-list .pcontent{padding: 20px 15px;font-size: 16px;color:rgba(0, 0, 0, 0.6);line-height:220%;}
.problem-list  .el-collapse-item__header{font-size: 16px; height: auto; line-height: 24px; padding-top: 12px; padding-left: 30px; padding-bottom: 12px; padding-right: 26px; position: relative;}
.problem-list .el-collapse{ border: 0; margin-top: 20px;}
.problem-list .el-collapse-item__header{ border-bottom: solid 1px #EDEDED !important;}
.problem-list .el-collapse-item__wrap{ border: 0;}

.problem-list  .el-collapse-item__arrow{ position: absolute; left: 0px;background:url("../images/icon_add1.png") no-repeat; width: 16px; height: 16px;}

.problem-list .el-collapse-item__arrow::before{display: none;}
.problem-list .el-collapse-item__arrow.is-active{background-image: url("../images/icon_jian2.png");transform: rotate(0deg);}

.problem-list .el-collapse-item__content{ padding-bottom: 0;}
.problem-list .el-collapse-item{ margin-bottom: 0;}



.reservation-box{display: flex; padding: 70px 0;align-items:flex-start;justify-content:space-between;}
.reservation-box .common-title{ font-size: 32px; text-align: center; padding-bottom: 30px;}
.reservation-box .img {border: 1px solid #DDDDDD; overflow: hidden; width: 350px; padding: 10px;}
.reservation-box .img img{ width: 100%;}

.reservation-box .rbox{flex: 1;overflow: hidden; padding-left: 48px; max-width: 755px;}
.reservation-box .el-date-editor{ width: 100% !important;}
.reservation-box .el-select{ width: 100% !important;}


.reservation-box  .el-form-item__label{color: #333;font-size: 16px;}
.reservation-box .el-input__inner{ height: 64px;border:0; font-size: 16px;border-radius: 0; background: #F5F5F5;}
.reservation-box .el-textarea__inner{border:0; font-size: 16px; height: 98px;border-radius: 0;font-family:"Microsoft YaHei",Tahoma,Arial,"Segoe UI", "Lucida Grande";background: #F5F5F5;}
.reservation-box .but{text-decoration: none;color:#ffffff;font-size: 16px; justify-content:center; align-items:center; display: flex; border: 0; border-radius: 0;height: 64px;background: #9896E6!important;max-width:426px ; width: 100%; margin:40px auto 0 auto;}

.reservation-box .stitle{ width: 100%; overflow: hidden;font-size: 16px;
color: #333333;line-height:200%;}
.reservation-box .stitle i{color: #FB3535;}
.reservation-box  p{font-size: 16px;color: #333333;line-height:200%; padding-left: 15px;}
.reservation-box  p a{color:#2EACFF;}
.reservation-box .cbox{ overflow: hidden; width: 100%; padding: 20px 0;border-bottom: solid 1px #F5F5F5;}
.reservation-box .el-checkbox__label{font-size: 16px;color: #333333;}

.reservation-box .utxt{font-size: 16px; color: #9896E6;}
.reservation-box .el-upload-list{ max-width: 440px; margin-top: 8px;}
.reservation-box .el-upload-list__item .el-icon-close{display: block;}
.reservation-box .el-icon-close:before{content: "删除";color: #2EACFF;}
.reservation-box .el-checkbox__input.is-checked+.el-checkbox__label{color: #9896E6;}
.reservation-box .el-checkbox__input.is-checked .el-checkbox__inner{background-color: #9896E6;   border-color: #9896E6;}

.inquire-box{ overflow: hidden;padding:80px 0; max-width: 950px;}
.inquire-box .common-title{width: 100%; text-align: center;font-size: 32px;}
.inquire-box .formbox{width: 100%; overflow: hidden; margin-top: 30px;}
.inquire-box  .el-form-item__label{color: #333;font-size: 16px;}
.inquire-box .el-input__inner{ height: 64px;border:0; font-size: 16px;border-radius: 0; background: #F5F5F5;}
.inquire-box .el-textarea__inner{border:0; font-size: 16px; height: 98px;border-radius: 0;font-family:"Microsoft YaHei",Tahoma,Arial,"Segoe UI", "Lucida Grande";background: #F5F5F5;}
.inquire-box .but{text-decoration: none;color:#ffffff;font-size: 16px; justify-content:center; align-items:center; display: flex; border: 0; border-radius: 0;height: 64px;
background: #9896E6!important;max-width:426px ; width: 100%;}


.register-box{background-color: #fff;}
.register-box header.hd{ padding: 38px 0; overflow: hidden;}
.register-box header.hd .logo{ width: 224px;}

.register-box .nav{ width: 100%; overflow: hidden;border-bottom: solid 1px ##EEEEEE;display: flex; border-bottom: solid 1px #EEEEEE;}
.register-box .nav li{  padding: 20px 0; margin-right: 30px;overflow:hidden;font-weight: bold;}
.register-box .nav li a{color:#C1C1C1;font-size: 16px; line-height: 34px;}
.register-box .nav li.hover{font-size: 24px;color: #333333;}
.register-box .nav li.hover a{font-size: 24px;color: #333333;}


.register-box .formbox{width: 100%; max-width: 950px; overflow: hidden; margin-top: 30px; padding-bottom: 60px;}
.register-box  .el-form-item__label{color: #333;font-size: 16px;}
.register-box .el-input__inner{ height: 64px;border:0; font-size: 16px;border-radius: 0; background: #F5F5F5;}
.register-box .el-textarea__inner{border:0; font-size: 16px; height: 98px;border-radius: 0;font-family:"Microsoft YaHei",Tahoma,Arial,"Segoe UI", "Lucida Grande";background: #F5F5F5;}
.register-box  .fx{margin-top: 50px;color:#BCBCBC; line-height: 64px;}
.register-box  .ont{margin-top: 50px;}

.register-box .but{text-decoration: none;color:#ffffff;font-size: 16px; justify-content:center; align-items:center; display: flex; border: 0; border-radius: 0;height: 64px;
background: #9896E6!important;max-width:426px ; width: 100%; margin-top: 30px;}
.register-box .el-date-editor{ width: 100% !important;}
.register-box .el-select{ width: 100% !important;}
.register-box .el-checkbox__input.is-checked+.el-checkbox__label{color: #9896E6;}
.register-box .el-checkbox__input.is-checked .el-checkbox__inner{background-color: #9896E6;   border-color: #9896E6;}
.register-box .el-radio__inner{width: 16px;height: 16px;}
.register-box .el-radio__label{font-size: 16px; color: #333333;}
.register-box .el-radio__input.is-checked+.el-radio__label{color: #39AEFF;}
.register-box .el-radio__input.is-checked .el-radio__inner{background-color: #39AEFF;   border-color: #39AEFF;}

.register-box  .codebut{ position: absolute; top:14px; right: 0; border: 0!important; background:none!important; color:#9896E6 !important;font-size: 16px;font-weight: bold;}

.register-box .el-form-item__content{transform: scale(1);}   
.register-box  .clause .el-checkbox__label{font-size: 16px; color: #333333;}
.register-box  .clause  a{color: #39AEFF;}

.register-box .confirmlist{ margin-top: 30px; padding-bottom: 50px;}
.register-box .confirmlist,
.register-box .confirmlist dl{ overflow: hidden; width: 100%;}
.register-box .confirmlist dl{ margin-top:10px;font-size: 16px;color: #333333; line-height: 180%;display: flex;align-items:flex-start;}
.register-box .confirmlist dl dt{ width: 120px; text-align: right; overflow: hidden;}
.register-box .confirmlist dl dd{flex: 1;overflow: hidden; padding-left:48px;}




.lease-box { max-width: 880px; padding-bottom: 80px;}
.lease-box ul.list li{ width: 100%;display: flex; margin-top: 60px; overflow: hidden;align-items:flex-start;}
.lease-box ul.list li .phbox{width:200px; overflow: hidden;}
.lease-box ul.list li .phbox .ph{font-family:'Microsoft YaHei-Bold';color: #9896E6;font-size: 36px;font-weight: bold; text-align: center;}
.lease-box ul.list li .phbox .ph i{font-size: 64px;}
.lease-box ul.list li .phbox  img{max-width: 100%;display: block; margin: 20px auto 0 auto;}
.lease-box ul.list li .box{flex: 1;overflow: hidden; padding-left: 10%;}
.lease-box ul.list li .box dl{color: #333333; overflow:hidden; margin-top: 10px;}
.lease-box ul.list li .box dt{font-weight: bold;font-size:28px; position: relative; padding-bottom:20px;}
.lease-box ul.list li .box dt::after {content: " ";width: 52px;height: 5px;background: #9896E6;position: absolute; left: 0;bottom: 0; }
.lease-box ul.list li .box dd{font-size: 14px;line-height:200%; margin-top: 30px;}
.lease-box ul.list li .box p.m1{margin-top:16px;}
.lease-box ul.list li .box p.t1{color:#A1A1A1;}
.lease-box ul.list li .box dd p:first-child{ margin-top: 20px;}



.product-box{ padding: 60px 0;display: flex;}
.product-box .lnav{ width: 320px; overflow: hidden; background-color: #fff;}
.product-box .rbox{flex: 1;overflow: hidden; padding-left: 48px;}
.product-box .lnav ul{ width: 100%; overflow: hidden; padding: 15px;}
.product-box .lnav ul li{padding-left: 20px;font-size: 16px;color: #333333; line-height: 120%; width: 100%; overflow: hidden; margin-top: 16px; padding-left: 30px; line-height:180%;}
.product-box .lnav ul li.hover{background: url("../images/sekuai.png") 10px  center no-repeat;}


.product-box .rbox ul.list{ margin: -10px -20px; overflow: hidden;}
.product-box .rbox ul.list li{ width: 33.33%; float: left;overflow: hidden; padding:10px;}
.product-box .rbox ul.list li .box{background: #fff;width: 100%; overflow: hidden;display: block;}
.product-box .rbox ul.list li .img{display: block; margin: 0 auto; width:100%; max-width: 429px;}
.product-box .rbox ul.list li .dt{text-align: center; width: 100%;font-size:24px;color: #333333;line-height: 32px; margin-top: 40px;font-weight: bold;}


.product-details{ margin-top: 60px; max-width: 1720px;}
.product-details .cbox{ width: 100%; overflow: hidden;display: flex;}
.product-details .imgbox{ float: left; overflow: hidden;display: flex; width: 640px; margin-right: 42px;}
.product-details .li-images{ width:90px;float: left; overflow: hidden;display: flex; flex-wrap:wrap; margin-top: 100px;}
.product-details .li-images .li{ height:52px; width:52px; margin-top: 10px;float: left;opacity: 0.4;display: flex;align-items:center; justify-content:center;border: 1px solid #DDDDDD; padding: 2px;cursor: pointer;justify-content:center;}
.product-details .li-images .li img{ max-width: 100%; height: 100%; width: auto;}
.product-details .li-images .li.hover{opacity: 1;border: 1px solid #000;}


.product-details .dmain{float: left; overflow: hidden;  width: 550px; height: 550px; margin-top: 10px;display: flex;align-items:center; justify-content:center;border: 1px solid #DDDDDD;}
.product-details .dmain .main-image{width: 100%; height: 100%;}

.product-details .inli{ width: 100%; overflow: hidden; margin-top: 20px;}
.product-details .inli li{ width: 100%; overflow: hidden;font-weight: bold;font-size: 14px;color: #333333;line-height: 200%; padding-left: 25px;background: url('../images/icon_shouzhi.png') 0 5px no-repeat; margin-top:8px;}

.product-details .data{overflow: hidden; margin:0 -5px 0 -5px;}

.product-details .data li{ padding: 0 5px; overflow: hidden;float: left; margin-top: 20px;}
.product-details .data li .box{ width: 138px; height: 168px;background: #FFFFFF;
border-radius: 10px;border: 1px solid #AEAEAE; text-align: center; overflow: hidden;}
.product-details .data li .box .da{height: 58px;background: #9896E6; overflow: hidden; width: 100%; line-height: 58px;font-weight: bold;font-size: 16px;color: #FFFFFF;}
.product-details .data li .box .pr{font-size: 16px;color: #333333;overflow: hidden; width: 100%; margin-top:24px;}
.product-details .data li .box .pr strong{font-size: 24px;}
.product-details .data li .box .ti{color: rgba(51, 51, 51, 0.5);overflow: hidden; width: 100%;margin-top: 15px;}


.product-details .info{flex: 1; overflow: hidden;color: #2D3240; position: relative; min-height: 430px; margin-top:10px;}
.product-details .info .dt{width: 100%; overflow: hidden;font-size: 28px;font-weight: bold; margin-top: 20px; position: relative; padding-bottom: 30px;}
.product-details .info .dt::after {content: " ";width: 76px;height: 8px;background: #9896E6;position: absolute; left: 0; bottom: 0;}

.product-details .info .price{font-size: 16px;color: #FB3535;margin-top:20px;}
.product-details .info .price strong{font-size: 32px;}

.product-details .info .butbox{display: flex; justify-content:space-between; margin-top: 40px;}
.product-details .info .butbox .el-button{width:49%;height: 64px;background: #9896E6;border: 0; border-radius: 0;font-weight: bold;font-size: 14px;color: #fff;}
.product-details .info .butbox .bt2{background: #3633A7;}


.product-details .contentbox{ width:100%; overflow: hidden; padding-bottom: 80px; max-width: 1340px; margin: 60px auto 0 auto; }
.product-details .contentbox .htitle{font-weight: bold;font-size: 32px;color: #333333;padding-bottom:20px; width: 100%; overflow: hidden; margin-bottom: 10px; text-align: center;}
.product-details .contentbox .con{ width: 100%;overflow: hidden;color: #333333; margin-top: 20px; line-height: 200%;font-size: 16px;}





.el-dialog{border-radius:6px !important;}

.login-dialogbox .el-dialog{ max-width: 506px;  }

.login-box{ padding:0 10px !important; overflow: hidden; width: 100%;font-size: 16px;}
.el-dialog__headerbtn .el-dialog__close{font-size: 30px;font-weight: bold;color: #333 !important;}
.login-box .el-form-item__label{font-size: 16px;color: #333333;}
.el-dialog__body{ padding-top:12px!important; padding-bottom: 10px !important;}
.login-box h3.title{font-size: 32px;color: #333333; margin-bottom: 30px;}
.login-box  .el-input__inner{ height: 60px;border:0;background: #F5F5F5;border-radius: 0;font-size: 16px;}
.login-box .but{ width: 100%; height: 60px; font-size: 16px; margin-top: 10px; background-color: #9896E6 !important;border: 0;border-radius: 0;}
.login-box .url{width:100%;overflow: hidden; padding-top:0; margin-top: 30px;}
.login-box .url a{color: #9896E6;display: block; width: 100%;font-size: 16px; text-align: center; padding: 12px 0;cursor: pointer;}
.login-box .url a:first-child{border-bottom:solid 1px #F5F5F5;}

.login-box .type{ padding: 10px 0; margin-bottom:10px;}
.login-box .el-textarea__inner{ height: 150px;}
.login-box  .codebut{ position: absolute; top:52px; right: 0; border: 0!important; background:none!important; color:#9896E6 !important;font-size: 16px;}
.login-box .el-textarea__inner{background: #F5F5F5;border-radius: 0;font-size: 16px;border:0;height: 100px;}

.login-diareserve .el-dialog{ max-width:1030px;  }
.login-diareserve .el-date-editor{ width: 100% !important;}


.success-box{background-color: #fff;}
.success-box   .prompt{ width:100%;overflow:hidden; margin:140px auto 0 auto ; text-align:center; color: #333333; padding-bottom: 40px;} 
.success-box   .prompt .logo{ width:100%; overflow: hidden;border-bottom: solid 1px #EEEEEE; padding-bottom: 40px;}
.success-box   .prompt .logo img{ white:224px; display: block;margin:0 auto;}
.success-box   .prompt .img{ width: 100%; overflow: hidden; margin: 75px auto 0 auto;}
.success-box   .prompt .dt{font-size: 32px;color: #333333; margin-top:40px;font-weight: bold;}
.success-box   .prompt .dd{ font-size:16px; margin:30px auto 0 auto;color: #333; max-width: 440px; width: 100%; line-height: 200%;}
.success-box   .prompt .but{ width: 100%;max-width: 426px;height: 64px; margin: 60px auto 0 auto; background-color: #9896E6;color: #fff; font-size: 16px;display: block; line-height: 64px;}


.Animation-Editing01{display: flex;justify-content:space-between; margin-top: 60px; padding-bottom: 60px;}
.Animation-Editing01 ul{ width: 33.33%;}
.Animation-Editing01 ul li{ padding: 7px;}
.Animation-Editing01 ul li .box{height: 204px;background: #FFFFFF;border-radius: 10px; overflow: hidden; padding: 20px; position: relative; }
.Animation-Editing01 ul strong{position: absolute;font-family: Arial, Helvetica, sans-serif;font-weight: bold;font-size: 68px;color: #C9BDF5;font-style:italic; top: 0; right: 20px;}
.Animation-Editing01 ul dt{font-size: 24px; font-weight: bold; margin-top: 10px;}
.Animation-Editing01 ul dd{font-size: 16px; line-height: 28px; margin-top:30px;}


.Animation-Editing01 .edbox{ width: 33.33%;padding: 7px;}
.Animation-Editing01 .edbox .box{height: 422px;background: #FFFFFF;border-radius: 10px; overflow: hidden; padding: 20px;}
.Animation-Editing01 .edbox img{display: block; margin:20px auto auto;}
.Animation-Editing01 .edbox dl{ text-align: center;color: #333333;}
.Animation-Editing01 .edbox dt{font-weight: bold;font-size: 24px;}
.Animation-Editing01 .edbox dd{font-size: 16px;line-height:200%; margin-top: 30px;}
.Animation-Editing01 .edbox .but{ margin:45px auto 0 auto;width: 162px;height: 48px;background: #9896E6;border-radius: 24px;border: 0;display: block;}


.Animation-Editing02{width: 100%; overflow: hidden;background-color: #fff;padding-bottom:50px;}



.commission01 {display: flex; max-width: 1200px; margin-top: 60px;justify-content:
space-between; align-items:center;}
.commission01 .box{ width:40%;padding: 7px; max-width: 452px; padding: 0 20px;}
.commission01 .box dl{ text-align: center;color: #333333;}
.commission01 .box dt{font-weight: bold;font-size: 36px; position: relative; padding-bottom: 20px;}
.commission01 .box dt::after {content: " ";width: 52px;height: 5px;background: #9896E6;position: absolute; left: 0; right: 0; bottom: 0; margin: 0 auto;}
.commission01 .box dd{font-size: 16px;line-height:200%; margin-top: 30px;}
.commission01 .box .but{ margin:45px auto 0 auto;width: 162px;height: 48px;background: #9896E6;border-radius: 24px;border: 0;display: block;font-size: 16px; color: #fff; line-height: 48px; text-align: center;}

.commission01 .img{display: block; width:46%;}

.commission02 {display: flex; max-width: 1200px; margin-top: 60px;justify-content:
space-between; align-items:center; padding-bottom: 60px;}
.commission02 .info {width:46%; overflow: hidden;}
.commission02 .info .dt{width: 100%; overflow: hidden;font-size: 36px;font-weight: bold; margin-top: 20px; position: relative; padding-bottom:25px;}
.commission02 .info .dt::after {content: " ";width: 52px;height: 5px;background: #9896E6;position: absolute; left: 0; bottom: 0;}
.commission02 .info .inli{ width: 100%; overflow: hidden; margin-top: 20px;}
.commission02 .info .inli li{ width: 100%; overflow: hidden;font-size: 14px;color: #333333;line-height: 200%; padding-left: 25px;background: url('../images/icon_shouzhi.png') 0 5px no-repeat; margin-top:8px;}

.commission02 .type{overflow: hidden;width:46%;}
.commission02 .type li{ padding: 10px 20px; overflow: hidden;float: left; margin-top: 20px;width:50%;}
.commission02 .type li .box{ width:100%; background: #FFFFFF;border-radius: 10px;text-align: center; overflow: hidden;box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.08);}
.commission02 .type li .box .da{height:80px;background: #9896E6; overflow: hidden; width: 100%; line-height: 80px;font-weight: bold;font-size: 16px;color: #FFFFFF;}
.commission02 .type li .box .pr{font-size: 16px;color: #333333;overflow: hidden; width: 100%; margin:0 auto;padding:32px 0; width: 80%; border-bottom:solid 1px #E3E3E3;}
.commission02 .type li .box .pr strong{font-size: 24px;}
.commission02 .type li .box .ti{color: rgba(51, 51, 51, 0.5);overflow: hidden; width: 100%;border-bottom:solid 1px #E3E3E3;margin:0 auto; width: 80%; padding: 16px 0;font-size: 16px;}
.commission02 .type li .box .ti:last-of-type{border: 0;}

.commission03{ margin-top: 40px;}
.commission03 .common-list3{ margin:10px -10px 0 -10px;}
.commission03 .common-list3 li{ width: 25%; padding: 10px; margin-top: 20px;}
.commission03 .common-list3 li .img{ padding: 0;}
.commission03 .common-list3 li .dt{ margin-top: 20px;}

.commission04{ margin-top: 40px; padding-bottom: 60px;}

input::placeholder,textarea::placeholder{
  color: #555555 !important;font-family:"Microsoft YaHei"}



footer.footer{font-size:14px;overflow: hidden;background:#012049;}
footer.footer .box{width:100%; max-width:1340px; margin:0 auto; overflow: hidden; display: flex;justify-content:space-between}

footer.footer .box .navbox{overflow:hidden;display: flex;justify-content:flex-end; }

footer.footer .box .navboxs{justify-content:space-between;border-right:solid rgba(255, 255, 255,0.18) 1px;flex:0.4;padding-top:40px; }
footer.footer .box .navboxs .logo{ width:186px;}

footer.footer .box .contact{overflow: hidden;flex: 1;display: flex; margin-right:100px;padding-top:40px; }
footer.footer .box .contact .li{ margin-right: 50px;}
footer.footer .box .contact .li dt{font-size: 20px;color: #FFFFFF;line-height: 80px;}
footer.footer .box .contact .li dd{ line-height: 200%;font-size:16px;color:rgba(255, 255, 255, 0.62);}
footer.footer .box .contact .li dd a{color:rgba(255, 255, 255, 0.62);} 


footer.footer .box  .consultation{padding-top:40px; }
footer.footer .box  .consultation .but{width: 162px;height: 45px;background: #9896E6;display: flex; margin: 0 auto; justify-content:center;align-items:center;font-size: 16px;
color: #FFFFFF; margin-top: 60px;}
footer.footer .box  .consultation .but .el-icon-right{font-size:24px; position: relative; top: 1px;}
footer.footer .box  .consultation .but .icon{ width:18px;}
footer.footer .box  .consultation .but span{ margin: 0 10px; padding-left: 10px; border-left: solid 1px rgba(255,255,255,0.19);}

footer.footer .txtall{ width:100%;line-height:25px;font-size:16px; color:rgba(255, 255, 255,0.55); overflow: hidden;max-width: 1340px; margin:40px auto 0 auto; text-align: right; padding: 20px 0;}


.paging-box{overflow:hidden;display:flex;flex-direction:row;justify-content:center;align-items:center;flex-wrap:wrap; padding-bottom: 30px; width: 100%; padding-top: 40px;}
.paging-box a{display: inline-block; line-height: 32px;min-width: 32px;  border: 1px solid #F6F6F6; padding: 0 4px; color:#333;font-size: 14px;font-family: DIN, DIN;text-decoration: none; margin: 0 5px;height: 32px;text-align: center;}
.paging-box a.hover{ color:#fff;background-color: #9896E6;}
.paging-box a.first{background: url(../images/icon-left1.png) center center no-repeat;}
.paging-box a.prev{background: url(../images/icon_left2.png) center center no-repeat;}
.paging-box a.next{background: url(../images/icon_right4.png) center center no-repeat;}
.paging-box a.last{background: url(../images/icon_right3.png) center center no-repeat;}



.border0{ border:0 !important;}
a.co4{color:#048ac2;text-decoration:underline;}
a.co4:hover{ color:#F00;}
.cf00{ color:#ff0000;}
.padding0{ padding:0 !important;}
.margin0{ margin:0 !important;}
.margintop20{ margin-top:20px!important;}
.margintop10{ margin-top:10px!important;}
.margintop40{ margin-top:40px!important;}
.margintop0{ margin-top:70px!important;}
.margintop00{ margin-top:0!important;}
/*Huang CSS Document QQ:52710360 */
/*
 * @author: Huang zhenghua
 * @QQ:52710360 
*/


@media only screen and (max-width:1700px){

}

@media only screen and (max-width:1500px){

}

@media only screen and (max-width:1400px){

}



@media only screen and (max-width:1340px){

.common-box{ padding-left: 10px; padding-right: 10px;}

}
@media only screen and (max-width:1200px){
header.m-hd .header-top .nav li{ margin-right: 20px;}

.product-details .imgbox{ width: 500px;}
.product-details .dmain{    width: 450px;    height: 450px;}

}
@media only screen and (max-width:1100px){
	.product-box .rbox ul.list li{ width:50%;}
}

@media only screen and (max-width:1000px){
header.m-hd .header-top .nav li{ margin-right: 10px;}
}


@media only screen and (max-width:950px){

.show-sm-only{display: block;}
.show-md-up{display: none;}
.am-offcanvas {display: block;}
.am-offcanvas-bar{display: block;}


.product-details .imgbox{ width: 400px;}
.product-details .dmain{    width: 350px;    height: 350px;}


.product-box .lnav{ width: 250px;}
}

@media only screen and (max-width:850px)
{	
.indextopad .swiper-slide dl dt{font-size: 38px;}
.indextopad .swiper-slide dl dd{font-size:18px;}

.common-list li .box .info .title{font-size:18px;}
.common-list li .box .info .but{ margin-top: 16px;}

.common-title{font-size: 38px;}
.indextopad2 dl dt{font-size: 38px;}
.indextopad2 dl dd{font-size:18px; margin-top: 10px;}
.indextopad2 dl dd .but{ height:50px; line-height: 50px;margin-top: 10px;}
.common-list2 li{ width: 50%;}
.index-main02 .tabs{ width: 40%;}

.index-main01 .swiper{ margin-top: 20px;}
.index-main02,
.index-main01,
.index-main05,
.index-main04{ padding: 30px 10px;}
.index-main03{ padding-bottom: 30px;}
.index-main04 .swiper{ margin-top: 20px;}
.index-main04 .swiperbox{ width: 50%;}
.index-main04 .img{ width: 48%;}
.common-but{ margin-top: 20px;}

footer.footer .box{display: block;}
footer.footer .box .navboxs{text-align: center;}
footer.footer .box .contact{ margin: 0;}
footer.footer .box .navbox{ justify-content:space-around;}
footer.footer .box .contact .li{ margin: 0;}
footer.footer .box .consultation .but{ margin-top: 0;}
footer.footer .txtall{ text-align: center; margin-top: 20px;}
.reservation-box .img{ width: 40%;}
	.reservation-box .rbox{ width: 60%;}
}


@media only screen and (max-width:768px)
{	


}



@media only screen and (max-width:640px){
	header.m-hd{ position: inherit;background: #9896E6;}
	
	.el-dialog__body{ padding: 20px 10px!important;}
	
	
	.am-header .am-header-left img{ width:46%;}
.common-title{font-size: 28px;}		
.indextopad .swiper-slide dl dt{font-size: 28px;}
.indextopad .swiper-slide dl dd{font-size:16px;}
.indextopad .swiper-slide dl dd .but{ margin-top: 10px;  width: 180px;    height: 40px; line-height: 40px;}
.indextopad .swiper-slide .box{ bottom: 10%;}
.indextopad .swiper-slide dl dd{ margin-top: 10px;}
	
.indextopad2 .common-title{ top: 5%; left: 5%;}
.indextopad2 dl{ bottom: 8%;left: 5%;}
.indextopad2 dl dt{font-size: 20px;}
.indextopad2 dl dd{font-size:16px; margin-top: 5px;}
.indextopad2 dl dd .but{ height:40px; line-height: 40px;margin-top:10px; width: 120px;}
	
.commonad dl dt{font-size: 24px;}
.commonad dl dd{font-size:16px;}
	
	.common-list2 li{ padding: 5px ;}
	.index-main03 .common-list2{ margin: 0 -5px;}
	.common-list2 li .box .info{ padding:5px;}
	.common-list2 li .box .info dt{ font-size: 18px;}
	.common-list2 li .box .info dd{ line-height: 160%;}
	
	.index-main02 .cbox{display: block; }
	.index-main02 .tabs{ margin-top: 10px;}
	.index-main02 .tabs,.index-main02 .infobox{ width: 100%;}
	.index-main02 .tabs li{ height: 30px;}
	.index-main02 .tabs li p{float: left;}
	.index-main02 .swiper-container{ margin-top: 10px;}
	.index-main02 .box .img{ margin-top: 10px;}
	.index-main04{display: block;}
	.index-main04 .swiperbox{ width: 100%;}
	.index-main04 .img{ width: 100%;}
	.index-main04 .but{justify-content:center;}
	.index-main04 .button-next, .index-main04 .button-prev{ margin: 0 10px;}
	.index-main04 .but{ margin-top: 10px;}
	
	footer.footer{ padding:0 10px;}
	footer.footer .box .navboxs .logo{ width: 100px;}
	footer.footer .box .contact{display: block; padding-top: 20px;}
	footer.footer .box .contact .li{ width: 100%; margin-top:20px; overflow: hidden;}
	footer.footer .box .contact .li dt{ line-height: 40px; text-align: left;}
	footer.footer .box .contact .li dd{ width: 50%;float: left; text-align: left;}
	
	footer.footer .box .contact .li:nth-child(3) dd{ width: 100%;float: left;}
	
	
	.Animation-Editing01{display: block;margin-top: 30px;padding-bottom: 30px;}
	.Animation-Editing01 ul{ width: 100%;}
	.Animation-Editing01 .edbox{ width: 100%;}
	.Animation-Editing01 .edbox .but{ margin-top: 20px;}
	.Animation-Editing01 .edbox .box{ height: 390px;}
	
	.common-list4{ margin: 10px -5px 0 -5px;}
	.common-list4 li{ padding: 5px;}
	
	.commission01{ margin-top: 30px;display: block;}
	.commission01 .box{ width: 100%;}
	.commission01 .box .but{ margin-top: 20px;}
	.commission01 .img{ width: 100%;margin-top: 20px;}
	
	.commission02{display: block;margin-top: 30px;padding-bottom: 30px;}
	.commission02 .type{ width: 100%;}
	.commission02 .type li{ padding: 10px 5px; margin-top: 0;}
	.commission02 .type li .box .pr{ padding: 20px 0; width: 90%;}
	.commission02 .type li .box .ti{font-size: 14px; width: 90%;}
	
	.commission02 .info .dt{font-size: 28px;}
	.commission02 .info{ width: 100%;}
	
	.commission03{ margin: 0; overflow: hidden; }
	.commission03 .common-list3 li{ width: 50%; margin-top: 0;}
	.commission03 .common-list3 li .dt{ margin-top: 10px;font-size: 16px;}
	.common-list3{padding-bottom: 0;}
	
	
	.inquire-box{ padding: 20px 10px;}
	
	.lease-box ul.list li{display: block; margin-top: 40px;}
	.lease-box ul.list li .box{ padding: 0;}
	.lease-box ul.list li .phbox{ width: 100%;}
	.lease-box ul.list li .phbox .ph{float: left;font-size: 20px;}
	.lease-box ul.list li .phbox .ph i{font-size: 34px;}
	.lease-box ul.list li .phbox img{float: right; width: 50px; margin-top: 0;}
	
	.problem-box .type li{ width: 50%; margin-top:20px; padding: 0 10px;}
	.problem-box{ padding: 30px 10px;}
	.problem-box .type{ padding: 0 10px 20px 10px;}
	
	
	.product-details .imgbox{ width: 370px; margin: 0 auto;float: none;}
	.product-details .cbox{display: block;}
	.product-details .info{ width: 100%;}
	.product-details{ margin-top: 20px;}
	.product-details .li-images{ width: 70px; margin-top:0;}
	.product-details .dmain{ width: 300px; height: 300px;}
	
	.product-details .data li { width: 33.33%;}
	.product-details .data li .box{ width: 100%;}
	
	.product-details .contentbox{ margin-top:30px;}
	.common-list3 li{ width: 50%;}
	.product-details .contentbox .htitle{ margin-top:40px;}
	
	.product-details .contentbox .htitle{ font-size: 28px;}
	
	.product-box{display: block; padding: 30px 10px;}
	
	.product-box .lnav{ width: 100%;}
	.product-box .rbox{ width: 100%; padding: 0px; margin-top: 20px;}
	.product-box .rbox ul.list li .box{ padding:5px;}
	.product-box .rbox ul.list li .dt{ font-size: 16px; margin-top: 10px; padding-bottom: 10px;}
	
	.register-box .but{ margin-left: auto; margin-right: auto;}
	.register-box header.hd{ text-align: center;}
	
	
	.register-box .el-col-12{ width: 100% ;}
	.register-box .ont{ margin-top: 0;}
	.register-box  .el-col-3{ width: 35%;}
	.register-box .el-col-8{ width: 55%;}
	.register-box .el-col-1{ width: 10%;}
	.register-box .teont{  margin-top: 50px;}
	.success-box .prompt{ margin-top: 40px;}
	
	.reservation-box{ padding:30px 10px;}
	.reservation-box{display: block;}
	.reservation-box .img{ width: 100%; margin-top: 0;}
	.reservation-box .rbox{ width: 100%; padding: 0;margin-top: 20px;}
	.reservation-box .common-title{font-size: 24px;}
	
}

@media only screen and (max-width:520px){
	
	

}

@media only screen and (max-width:430px){

}

@media only screen and (max-width:330px){
}