*{ margin:0; padding:0; border:none}
@font-face {
    font-family: "兰亭黑-简";
    src: url(/resources/font/FZDHTJW.TTF);
}
img{ width:100%;}
body{background:#00cebf;font-family: "兰亭黑-简"}
header{ background:#fff}
header img.logo{ width:20%; margin-left:2%; margin-top:3%}
header .phone{float: right; margin-right:10px; margin-top:2%; width:25px}
header .phone span{ display: inline-block; vertical-align: top; line-height:30px; font-size:20px; font-weight:bold; color:#54c6b8}
header .phone a{display: inline-block;width:100%;}
header .phone img{ display: inline-block; width:100%;}
main{ width:100%; margin:0 auto; max-width:768px; font-size:14px; }
body>.title{margin-bottom:15px;font-size:18px;line-height:1.5;color:#54c6b8; background: #fff; text-align: center; font-size:4.5vw; height:35px; line-height:35px;}
section{ position: relative; margin-bottom:15px; }
section.feature{ position: relative}
section.feature a{position: absolute;    left: 55%;
    top: 87.5%;
    width: 29.5%;
    height: 6.3%;
    display: block;
    border-radius: 40px;}
section.sec > img{ width:92%; margin:0 auto; display: block; border-radius: 10px}
section.sec > a{    position: absolute;
    bottom: 2%;
    width: 100%;
    text-align: center;
    text-decoration: none;
    font-size: 12px;
    color: #a1a1a1;}
section.sec > a.v2{bottom:20%}
section.sec > a img{ width:8px; height:8px;}
section.sec.nonbottom{ margin-bottom:0;}
.showpop, .showpop_btn{    position: absolute;
    bottom: 5%;
    width: 82%;
    left: 9%;}
.video_area{ width:92%; left:4%; position: absolute; top:10%}
.video_sec{ width:44%; margin:4% 3% 0; float: left}
.video_sec .pic{ position: relative; font-size:0;}
.video_sec .pic a{ position: absolute; display: block; left:0; top:0;width:100%;height:100%;background:rgba(0,0,0,0.3); text-align: center; vertical-align: middle}
.video_sec .pic a img{     width: 34px;
    vertical-align: middle;
    height: 34px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -17px;
    margin-top: -17px;}
.video_sec .title{font-size:12px;margin:7px 0 0;min-height: 40px; color:#333333}
.video_sec .des{ color:#c7c8c8;  font-size:12px; margin-top:4px;}
.popup.video{ background:inherit}
.popup.video video{ width:100%;margin-top:20px;}

.info_area{    position: absolute;
    left: 7%;
    width: 86%;
    bottom: 26%;}
.info_area a{ color:#333}

.info_sec{ overflow: hidden;    padding: 5% 0;
    border-bottom: 1px solid #eeeeee;
}
.info_sec.last{ border-bottom:0;}
.info_sec .left{width:65%;margin-right:5%; float: left}
.info_sec .left .title{ font-size:14px;}
.info_sec .left .tag{margin: 5% 0;}
.info_sec .left .tag span{display: inline-block;
    padding: 3px 10px;
    border-radius: 25px;
    font-size: 12px;}
.tag span.red{ background:#fdf2f5; color:#e78790;}
.tag span.purple{ background:#f7f2fe; color:#af82f2;}
.info_sec .left .des{ font-size:12px; color:#c7c8c8;}
.info_sec .right{width:30%; float: left}
.info_sec .right img{ border-radius: 3px}
.form_area{ position: absolute; bottom:5%; left:8%; width:84%;}
.form { width:90%; margin:0 auto;position: absolute; bottom:10%; left:5%;}
.form .form-group{ width:90%; margin:0 auto}
.form .form-group input{ border:1px solid #54c6b8;height:40px; line-height:40px; width:100%; text-indent: 20px;font-size:1.5rem; color:#54c6b8; margin-bottom:15px;}
.form .form-group input.error{ color:#f00}
.form .submit{width: 90%;
    margin: 0 auto;}
input.error::-webkit-input-placeholder {
     color: #f00;
}
input.error::-moz-placeholder{
    color:#f00;
}
input.error:-moz-placeholder{
    color:#f00;
}
input.error:-ms-input-placeholder{
    color:#f00;
}

.form-group{}
.help-block{ height:30px; line-height:30px; color:#f00; font-size:14px; text-indent: 20px; width:100%; display: block}
html.noscroll{ overflow: hidden}
.bottom{ position: fixed; bottom:0; left:0; width:100%; overflow: hidden;z-index:7 }
.bottom img{ float: left;width: auto}
.bottom img.left{ width:42%;}
.bottom img.right{ width:58%;}
.popupbg{ position: fixed; left: 0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.6); display: none; z-index:8}
.popupbg_new{position: fixed; left: 0; top:0; width:100%; height:100%; background:#333333; display: none; z-index:8}
.popupbg.active{ display: block}
.popup{ position: fixed; left:5%; width:90%; margin-top: -155px; z-index:9; box-shadow:0 0 10px rgba(0, 0, 0, 0.5); top:50%; text-align: center; display: none}

.popup.active{ display: block}
.popup img.close-n{     width: 35px;
    height: 35px;
    left: 50%;
    bottom: 18%;
    margin-left: -17.5px;
    position: fixed;}
.popup img.close{         width: 25px;
    height: 25px;
    right: -5px;
    top: -10px;
    position: absolute;}
.popup img.success{ width:50px;  margin:30px 0 20px; display: none}
.popup img.success.active{display: inline-block;}
.popup .content{ font-size:20px; line-height:35px;}
.float_button{ width:15%; position: fixed;right:0; top:45%;z-index:8; left:auto}
section.floatArea{ position: fixed; bottom:3%; width:100%; max-width:768px;}
a.copy1{         position: absolute;
    left: 73%;
    top: 38.2%;
    width: 22.8%;
    height: 11.5%;
    display: block;}
a.copy2{         position: absolute;
    left: 73%;
    top: 67.2%;
    width: 22.8%;
    height: 11.5%;
    display: block;}
#text1,#text2{ position: fixed; left:-9999px;top:-9999px}
@media (max-width:540px){
    .popup.form{ height:240px; margin-top:-120px;}
}
@media (max-width:414px){
    .popup.form{ height:200px; margin-top:-100px;}
    .video_area{ top:10%}
    .video_sec .title{ min-height:30px;}
    .help-block{ height:20px; line-height:20px; font-size:12px;}
    .info_sec{ padding:3% 0;}
    .info_area{bottom:28%}
    section.sec > a.v2{bottom:21%}
}
@media (max-width:375px){
    .video_sec{margin: 3% 3% 0;}
    .video_sec .title{margin: 4px 0 0;}
    .video_sec .title,.info_sec .left .title{ font-size:12px;}
    .video_area{ top:10%}
    section.sec > a.v2{bottom:20%}
}
@media(max-width:360px){
    .video_area{top:7%}
    .info_area{ bottom:31%}
    section.sec > a.v2{bottom:24%}
}