@charset "gb2312";
/* CSS Document */
* {
}
html, body { height: 100%; }
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100% }
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td {
  margin: 0;
  padding: 0;
  font-family: "microsoft yahei", Tahoma, \5b8b\4f53, Arial;
}
ul, ol { list-style: none }
.cl:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.cl { zoom: 1; }
a { text-decoration: none; }
h2, h3, h4 { font-family: "Microsoft YaHei";  }
html{ font-size:125%;}
body {  font:1.4em/1.6 "microsoft yahei", "Tahoma", \5b8b\4f53, Arial;color: #444;  }
.wp { width: 100%; min-width: 320px; max-width: 640px; margin: 0 auto;overflow:visible; position:relative; }
.lay { padding-left:4.6875% ; padding-right:4.6875% ; }
.z{ float:left;}
.y{ float:right;}
img{ border:none; border:0; max-width:100%; height:auto; display:block; position:relative;}
.pic{ width:100%;max-width:100%; height:auto; display:block; margin:0 auto;}
.fw{ font-weight:bold;}
.tc{ text-align:center;}
.pr{ position:relative;}
.pa{ position:absolute;}
.animated {
  -webkit-animation-duration: 2s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both
}
/*看到指定区域后0s后执行fadeInUp（滑入）*/
.animated {
animation-name: fadeInUp;
animation-delay: 0s;
}
.header {
  position:relative;
  z-index:2;
  background-color:#fff;
  }
.header .topbar{ height:2rem;line-height:2rem; color:#b4acba; white-space:nowrap; text-align:center; font-size:1.3rem; text-align:center; background-color:#edeaf2;}
.header .topbar span{ display:inline-block; width:50%;}
.header .top{ overflow:hidden; padding-top:0.8rem; padding-bottom:0.8rem;}
.header .logo { display: block; border:0; float:left; width:auto; height:2.7rem;  padding-top:0.4rem;}
.header .logo img { height:2.6rem; width:auto;}
.header .top .y a{  font-size:1.2rem; line-height:1.3rem; display:block; width:3.3rem; text-align:center; padding:0.4rem 0; border-radius:0.4rem; background:#bbbbbb; color:#fff;}
.header .top .y a:last-of-type{ margin-left:1rem; background-color:#be9e7f;}
#quick-menu .arrow{  position:absolute; left:50%; bottom:0; font-size:2rem; color:#fff; margin-left:-2rem; width:4rem; height:3rem; line-height:1; text-align:center;}
#quick-menu{ position:relative;display:none; background-color:rgba(0,0,0,0.8); }
#quick-menu ul{padding:2rem 0 4rem; font-size:1.6rem;}
#quick-menu li{ height:3.4rem; line-height:3.4rem; padding:0 5rem;}
#quick-menu li a{ height:3rem; line-height:3rem; border-bottom:1px solid #999; color:#eee; display:block;}


.banner{ position:relative;}
.banner img{ width:100%; height:auto; display:block; position:relative;}
.banner .zx{ position:absolute;width:9.75rem; height:2.5rem; left:34.5%; bottom:33.8%; line-height:2.5rem; text-align:center; color:#fff; background-color:#b76387; font-size:1.2rem; border-radius:2rem;}
.banner .tel{ position:absolute;width:13.1rem; height:1.35rem; display:block; left:29.68%; bottom:28%;}
.banner .tit img{ max-width:100%; height:auto; margin:0 auto;}

.main1 .main1-n{ position:absolute; top:23.6%; left:45%; width:50.46%; height:58.6%; border:0.25rem solid #f0d0ca; text-align:right; color:#313131; font-size:1rem;}

.main1 .main1-n p{ padding-top:1rem; padding-right:1.2rem; line-height:1.8rem;}
.sw-n{ position:absolute; left:50.7%; bottom:9.3%; width:12.2rem; height:6.9rem; background-color:#C13044; border-radius:1rem; padding:0.3rem 0.3rem;}
.sw-n a{ display:block; width:100%; height:100%; color:#fff; font-size:1rem; line-height:1.5rem; text-align:center; border-radius:0.8rem; border:1px dashed #fff; }
.sw-n a span{ padding-top:0.5rem; display:inline-block;}

.sw-n .jt{ width:2.2rem; height:1.1rem; margin-left:auto; margin-right:auto;-moz-animation:f2  1s linear infinite backwards; -ms-animation:f2  1s linear infinite backwards; -o-animation:f2  1s linear infinite backwards; -webkit-animation:f2  1s linear infinite backwards; animation:f2  1s linear infinite backwards;}


.main2{ padding:4rem 0 1.5rem;}
.title11{ width:71.4%; height:auto; margin-left:auto; margin-right:auto; margin-bottom:2.3rem;}
.title2{ width:75.78%; height:auto; margin-left:auto; margin-right:auto; margin-bottom:2.2rem;}

.main2 .lw-n{ border:0.1rem solid #dad4d5; color:#333; font-size:1rem; line-height:1.5rem;padding:2rem 0.8rem 1rem}
.main2 .lw-n font{ color:#C13044;}
.main2 .lw-n p.p1{ width:58.2%; margin-left:auto; margin-right:auto; background-color:#fff; font-size:1.3rem; color:#C13044; margin-top:-3.2rem; line-height:2rem; height:2rem; text-align:center; margin-bottom:1rem;}
.main2 .lw-n p.p2{text-indent: 2em; }

.main3 p{ position:absolute; color:#333; font-size:1.1rem; line-height:1.7rem; width:41%; height:auto;}
.main3 p.yq1{ left:49.5%; top:14%;}
.main3 p.yq2{ left:54.2%; top:30%;}
.main3 p.yq3{ left:56.2%; top:44.6%;}
.main3 p.yq4{ left:54.37%; bottom:23%;}
.main3 p.yq5{ left:47.5%; bottom:10.8%;}
.zx2{ position:relative; width:55.78%; height:3.35rem; line-height:3.35rem; text-align:center; margin-left:auto; margin-right:auto; display:block; }
.main4{ padding-top:1.8rem; padding-bottom:4rem;}

.main5{ background-color:#f8f8fa; padding:3.7rem 0 2.5rem;}
.main6{}
.main6 .cs-n{ width:54.68%; height:auto; position:absolute; top:17.3%; left:11%;}
.main6 .csyz{ width:90.625%; height:15.6rem; background-color:#C13044; color:#fff; bottom:9.1%; left:4.6875%; position:absolute; border-radius:2rem;}
.ycqCore{ width:88.8%; height:auto; margin-left:auto; margin-right:auto; padding-top:2rem; font-size:1.2rem;}

.ycqCore h2{ font-size:2.2rem; font-weight:normal; text-align:center; position:relative; z-index:2; margin-bottom:1rem;}
.ycqCore h2:before {
    position: absolute;
    display: block;
    content: "";
    width: 100%;
    height: 1rem; background-color:#C13044; top:1.5rem; left:0; z-index:1}
.ycqCore h2 span{ z-index:2; position:relative;}
#ycqJS{ width:4.4rem; line-height:2rem; height:2rem; background-color:#fff; color:#C13044; font-size:1.1rem; text-align:center; float:right; border-radius:1rem; margin-right:2rem; margin-top:0.3rem;}



.js-n{ color:#313131; font-size:1rem; line-height:1.7rem;}
.js-n span{ color:#C13044;}
.js-tit{ max-width:100%; margin-top:1.5rem; margin-bottom:0.5rem}
#jstp{ width:85.8%; height:auto; margin-left:auto; margin-right:auto; padding:1rem 0;}
#jstp .bd li{ float:left;}
#jstp .hd {
    width: 8rem;
    height: 1rem;
    margin: 1.2rem auto 0;
    position: relative;
}
#jstp .hd ul { text-align: center;}
#jstp .hd li {
    float: left;
    width: 0.9rem;
    height: 0.9rem;
    background-color: #c1c1c1;
    margin-right: 0.35rem;
    border-radius: 50%;
}
#jstp .hd li.on {background-color: #C13044;}
.js-pic{ width:95.6%; margin-left:auto; margin-right:auto; padding:1.5rem 0 1rem;}

.zx3{  width:78.2%; height:auto; margin-left:auto; margin-right:auto; display:block; margin-top:2.5rem;}
.main7 .doc-n{ position:absolute; left:47.3%; top:27.4%; width:50%;}
.main7 .doc-n .docp1{ width:13rem; line-height:3rem; color:#C13044; font-size:2.2rem; font-weight:bold; height:3rem; border-bottom:0.3rem solid #ae4768;}
.main7 .doc-n .docp1 span{ font-size:1.3rem; font-weight:normal; padding-left:0.5rem;}
.main7 .doc-n .docp2{ color:#C13044; font-size:1.4rem; line-height:2rem; padding-top:0.8rem; padding-bottom:0.2rem;}
.main7 .doc-n .docp3{ color:#313131; font-size:0.9rem; line-height:1.5rem;}
.main7 .doc-n .docp4{ color:#C13044; font-size:1.4rem; line-height:2rem; padding-top:0.8rem; font-weight:bold;}

.main8{ padding:4rem 0; background-color:#fff;}
.fw-n{ width:100%; height:2rem; background-color:#ebebeb; line-height:2rem; padding:1.5rem 0;}
.fw-n p{ color:#333; font-size:1.7rem; padding-left:2.5rem;}.fw-n p span{ color:#C13044; font-size:2rem;}
.fw-n a{ width:8.45rem; height:2.2rem; line-height:2.2rem; text-align:center; background-color:#C13044; color:#fff; font-size:1rem; display:block; border-radius:0.5rem; margin-right:2.5rem;}
.title3{ margin-bottom:2.8rem;}
.ys{ position:relative; height:23rem;}
.ys .ysimg{ width:33.28%; height:auto; position:absolute;}
.ys .ys01{ left:4.6875%; top:0; z-index:1}
.ys .ys02{ left:33.4375%; top:0; z-index:2}
.ys .ys03{ right:4.6875%; top:0; z-index:3}
.ys .ys04{ left:4.6875%; top:41.3%; z-index:4}
.ys .ys05{ left:33.4375%; top:41.3%; z-index:5}
.ys .ys06{ right:4.6875%; top:41.3%; z-index:6}


.main9{ background-color:#f5f5f5; padding:3.9rem 0;}
.title4{ width:57.9%; height:auto; margin-left:auto; margin-right:auto;}
.main9 .que{ padding-top:1rem; }
.main9 .que p{ color:#b99f83; font-size:1.9rem; font-weight:bold; text-align:center; height:2rem; line-height:2rem; margin-top:-2.8rem;}
.main9 .que p span{ background-color:#fff; padding-left:1rem; padding-right:0.5rem;}
.main9 ul{ margin-top:1.5rem;}
.main9 ul li{ line-height:2.8rem; height:2.8rem; font-size:1.2rem; border-bottom:1px dashed #b99f83; margin-bottom:0.3rem; display:block;}
.main9 ul li a.z{ color:#313131;}
.main9 ul li a.y{ width:7.3rem; height:2rem; line-height:2rem; display:block; background-color:#C13044; color:#fff; text-align:center; margin-top:0.6rem; border-radius:0.5rem; font-size:1.1rem;}
.zx4{  width:80.4%; height:auto;display:block; position:absolute; left:9.8%; bottom:9.7%;}
select {
color:#b6b6b6;
  /*很关键：将默认的select选择框样式清除*/
  appearance:none;
  -moz-appearance:none;
  -webkit-appearance:none;

  /*在选择框的最右侧中间显示小箭头图片*/
  background: url("../images/arrow.png") no-repeat scroll right center #ffffff;


  /*为下拉小箭头留出一点位置，避免被文字覆盖*/
  padding-right: 14px;
}


/*清除ie的默认选择框样式清除，隐藏下拉箭头*/
select::-ms-expand { display: none; }
@-webkit-keyframes f2{0%{ margin-top:5px;}50%{ margin-top:10px;} 100%{ margin-top:5px;}}
@-o-keyframes f2{0%{ margin-top:5px;}50%{ margin-top:10px;} 100%{ margin-top:5px;}}
@-ms-keyframes f2{0%{ margin-top:5px;}50%{ margin-top:10px;} 100%{ margin-top:5px;}}
@-moz-keyframes f2{0%{ margin-top:5px;}50%{ margin-top:10px;} 100%{ margin-top:5px;}}
@keyframes f2{0%{ margin-top:5px;}50%{ margin-top:10px;} 100%{ margin-top:5px;}}

.footer{height:auto;}
.foota{ background-color:#646362; height:2.8rem; line-height:2.8rem;}
.foota li{ text-align:center; border-right:1px solid #454443; border-left:1px solid #6b6a69;}
.foota a{ color:#fff; font-size:1.4rem;}
.footbz{ width:71%; height:2.1rem; padding-top:4.5rem;}
.footbz a{ display:block; width:47%; height:2rem; text-align:center; line-height:2rem; font-size:1.4rem; border-radius:0.3rem;}
.footbz a.z{ border:1px dashed #444; color:#444;}
.footbz a.y{ border:1px dashed #fff; color:#fff;}
.footb img{ width:6.4rem; height:6.4rem;}
.footb{width:100%; height:8.9rem; background:url(../images/bt.jpg) no-repeat center center;background-size:100% 100%; padding-top:1.8rem;}

@media only screen and (min-width:640px) {
.wp {max-width: 640px}
html {font-size: 125%}
}


@media only screen and (min-width:640px) {
.wp {max-width: 640px}
html {font-size: 125%}
}

@media only screen and (max-width:600px) {
.wp {max-width: 600px}
html {font-size: 100%}
}

@media only screen and (max-width:480px) {
.wp {max-width: 480px}
html {font-size: 100%}
}
/*6p*/
@media only screen and (max-width:414px) {
.wp {max-width: 414px}
html {font-size: 75%}
}

@media only screen and (max-width: 375px) {
.wp { max-width: 375px; }
html { font-size: 72.5%; }
}
/*6*/
@media only screen and (max-width: 360px) {
.wp { max-width: 360px; }
html { font-size: 62.5%; }
}

@media only screen and (min-width:361px) and (max-width:375px) {
}

/*4、5*/
@media only screen and (max-width:320px) {
.wp {max-width: 320px}
.top{ height:4.75rem;}
html {font-size: 62.5%}
}


@-webkit-keyframes shake {
0%, 100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform:translate3d(-10px, 0, 0);
transform:translate3d(-8px, 0, 0)
}
20%, 40%, 60%, 80% {
-webkit-transform:translate3d(10px, 0, 0);
transform:translate3d(8px, 0, 0)
}
}
@keyframes shake {
0%, 60%, 70%, 80%,90%,100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
10%, 30%, 50% {
-webkit-transform:translate3d(-5px, 0, 0);
transform:translate3d(-8px, 0, 0)
}
20%, 40% {
-webkit-transform:translate3d(5px, 0, 0);
transform:translate3d(8px, 0, 0)
}
}