*{margin:0;padding:0;font-family: '微软雅黑','microsoft yahei','',sans-serif;outline:none;}
html{display:block;} 
body{background:#fff;display:block;-webkit-text-size-adjust:none;overflow-x:hidden;width:100%;margin:0 auto; }
footer,header,section,figure,nav,article,aside,hgroup{display:block;}
audio,canvas,progress,video{display: inline-block;vertical-align: baseline;vertical-align:top;}
audio:not([controls]) {display: none;height: 0;}
i,em{font-style:normal;}
img{vertical-align:middle;border:none;}
svg:not(:root) {overflow: hidden;}
button,input,optgroup,select,textarea {font: inherit;color: inherit;}
button {overflow: visible;}
button,select { text-transform: none;}
button,html input[type="button"],input[type="reset"],input[type="submit"] {appearance: button;cursor: pointer;}
button[disabled],html input[disabled] {cursor: default;background:none}
input{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
input[type="checkbox"],
input[type="radio"] { box-sizing: border-box;  padding: 0;margin-right:5px;width:auto;max-height:16px;max-width:16px;position:relative;top:1px}
fieldset {padding: .35em .625em .75em;margin: 0 2px;border: 1px solid #c0c0c0;}
fieldset {padding: .35em .625em .75em;margin: 0 2px;border: 1px solid #c0c0c0;}
legend {padding: 0; border: 0;}
textarea {overflow: auto;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;vertical-align:top}
option{padding:5px 0;display:block;line-height:20px;text-indent:10px;}
optgroup {font-weight: bold;}
table { border-spacing: 0;border-collapse: collapse;width:100%;}
td,th {padding: 0;}
input,button,select,textarea {font-family: inherit;font-size: inherit;line-height: inherit;}
a{text-decoration: none;border: 0;color:inherit;-webkit-transition:color 0.5s ease;transition:color 0.5s ease;}
a:active,a:hover{ outline: 0;outline:none;color:#f3a474}f3a474
hr {border: none;height:0;}
p {margin: 0;display:block;}
small,.small { font-size: 85%;}
.nowrap{white-space: nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;}
.text-lowercase {text-transform: lowercase;}
.text-uppercase {text-transform: uppercase;}
.text-capitalize {text-transform: capitalize;}
ul,ol,dl { padding:0;margin:0;}
li{list-style:none;padding:0;margin:0;}
dt,dd {font-weight:normal;display:block;}
abbr[title],abbr[data-original-title] {cursor: help;border-bottom: 1px dotted #777;}
table { background-color: transparent;}
caption { padding-top: 8px;padding-bottom: 8px;color: #777; text-align: left;}
th {text-align: left;}
input[type="file"] {display: block;}
input[type="range"] {display: block;width: 100%;}
input[type="file"]:focus,input[type="radio"]:focus,input[type="checkbox"]:focus {outline:none}
output {display: block;font-size:14px; line-height: 14px;color: #333333;}
.form-control {width: 272px;height: 20px;line-height:20px;padding:4px 0 4px 10px;font-size: 14x;
color: #333333;background-color: #fff;background-image: none; border: 1px solid #ccc;-webkit-box-shadow: inset 2px 2px 3px rgba(0, 0, 0, .1);
 box-shadow: inset 1px 1px 2px rgba(0, 0, 0, .1); transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;}
.form-control:focus { border-color:#;outline:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(222,35,54,.7);box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(222,35,54,.7);}
input::placeholder{ color: #666;}
input::-webkit-input-placeholder{color: #666;}
input:-moz-placeholder{color:#666;}
input::-moz-placeholder{color:#666;}
.form-group {margin-bottom: 15px;width:100%;}
.radio,.checkbox {position: relative;display: block;}
.radio label,.checkbox label {min-height: 14px;padding-left: 20px;  font-weight: normal;cursor: pointer;}
input[type="radio"],input[type="checkbox"]{width:14px;outline:none;}
input[type="radio"][disabled],input[type="checkbox"][disabled],input[type="radio"].disabled,input[type="checkbox"].disabled { cursor: not-allowed;}
button{border:none}
.btn {background:#222222;color:#fff; font-size:16px;text-align:center;border-radius:2px;line-height:38px; width:174px;display:inline-block;border:1px solid #101010;vertical-align:top;-webkit-transition:all 0.5s ease;transition:all 0.5s ease;opacity:1}
.btn:hover,.btn:focus,.btn.focus { background:#101010;color:#fff}
.pager {text-align:center;font-size:0;padding-top: 1%;clear:both;letter-spacing:-4px;}
.pager li {display: inline-block;vertical-align:top;margin-right:1px;letter-spacing:normal;color:#333333}
.pager li.sp{border:none;margin:0;}
.pager li > a {padding:0 18px;line-height:42px;color:#222;font-size:14px;display:block; -webkit-transition:all 0.5s ease; transition:all 0.5s ease }
.pager.sp li > a,.pager.sp li > span {color:#fff;}
.pager li > span{line-height:42px;color:#222;font-size:14px; padding:0 9px}
.pager li > a:hover,.pager li > a:focus,.pager li.active > a {color:#fff; background:#cacaca; }
.pager.sp li > a:hover,.pager.sp li > a:focus,.pager.sp li.active > a {color:#333; background:#cacaca;border-color:#cacaca;}
select{padding:0 0 0 10px;-webkit-appearance:none;-moz-appearance:none; -ms-appearance:none; appearance:none;}
.clear{clear:both;display:block;}
.modal{position:fixed;top:0;left:0;height:100%;width:100%;background:#000;background:rgba(0,0,0,.8);z-index:4200;align-items:center;display:none;}
.modal>img{max-width:100%;position:fixed;max-height:96%;top:30%;left:40%;box-shadow:10px 10px 20px rgba(0,0,0,.5);filter:alpha(opacity=0);opacity:0; -webkit-transform: translateY(-80px);-webkit-transition:all 0.5s ease-out 0.2s;transform: translateY(-80px);transition:all 0.5s ease-out 0.2s;transition:all 0.5s ease-out 0.2s;}
.modal.active>img{ -webkit-transform: translateY(0);transform: translateY(0);filter:alpha(opacity=100);opacity:1;}
a.corn{position:absolute;top:0;right:0;width:30px;display:block;height:30px;margin-top:-40px; }
a.corn b{display:block;height:100%;width:4px;background:#fff;position:absolute;left:13px;top:0;-webkit-transform:rotate(135deg);transform:rotate(135deg);}
a.corn b.sp{display:block;height:4px;width:100%;background:#fff;position:absolute;left:0px;top:13px;-webkit-transform:rotate(-225deg);transform:rotate(-225deg);}
.label{position:relative;display:block;padding-bottom:75%;overflow:hidden;width:100%}
.label>img{position:absolute;top:0;left:0;height:100%;min-width:100%;}
.head{background:#252525;line-height:106px;height:106px;-webkit-transition:all 1s ease;transition:all 1s ease;position:fixed;top:0;left:0;width:100%;z-index:3000}
a.logo{float:left;height:106px;-webkit-transition:all 1s ease;transition:all 1s ease;}
a.logo img{max-height:70%;margin-top:-2px}
.distance{clear:both;height:106px;}
.margin{height:70px;clear:both;display:block;width:100%;}
.cont{width:1200px;margin:0 auto}
.guide{text-align:center;font-size:16px;color:#fff;float:right;}
.guide a{margin-left:36px; float:left;position:relative;color:#fff; }
.guide a::after,.guide a::after{width:100%;height:2px;background:#cacaca;position:absolute;bottom:25%;left:0;content:'';display:block;filter:alpha(opacity=0);opacity:0;-webkit-transition:all 0.5s ease;transition:all 0.5s ease;}
.guide a.active::after,.guide a:hover::after{filter:alpha(opacity=100);opacity:1;}
.bg{clear:both;overflow:hidden;padding-bottom:70px;}
.home{text-align:center;padding:65px 0 38px}
.home dt{font-size:28px;color:#222222;line-height:1.2;padding-bottom:1.5%;background:url(../img/rect.png) no-repeat bottom center} 
@font-face { 
  font-family:app; /*这里是说明调用来的字体名字*/ 
  src: url(../ttf/app.ttf); /*这里是字体文件路径*/ 
}  
.foot{background:url(../img/foot.jpg) no-repeat center center;background-size:cover;padding-top:40px;text-align:center;border-top:3px solid #f3a474}
.copy{display:inline-block;font-size:12px;color:#fff;vertical-align:middle;text-align:left}
.copy>dd:nth-child(2){margin:10px 0}
.copy>dd  img,.tell>dt  img{margin-right:10px;margin-top:-2px}
.share{display:inline-block;border-left:1px solid #373737;border-right:1px solid #373737;padding:15px 52px;margin:0 7.5%;vertical-align:middle }
.share a{margin:0 11px;display:inline-block;position:relative;}
.share a img.sp{display:none;}
.tell{display:inline-block;vertical-align:middle;text-align:left;font-size:12px;color:#fff}
.tell h3{font-family:app;font-size:34px;line-height:1.1;}
.share a:hover img{display:none;}
.share a:hover img.sp{display:inline;}
.totop{position:fixed;bottom:21%;right:50%;margin-right:-660px;z-index:1000;display:none}
.totop img.sp{display:none;}
.totop:hover img{display:none;}
.totop:hover img.sp{display:inline;}
.cright{padding:30px 0;font-size:14px;color:#fff}
.modal{position:fixed;top:0;left:0;height:100%;width:100%;background:#000;background:rgba(0,0,0,.8);z-index:4000;display:none;}
.modal>img,.modal>video{max-width:100%;position:fixed;max-height:96%;top:30%;left:30%;box-shadow:10px 10px 20px rgba(0,0,0,.5);-webkit-transform:scale(0);transform:scale(0);transition:all 0.4s ease;display:block;}
.modal.active>img,.modal.active>video{-webkit-transform:scale(1);transform:scale(1);}
a.corn{filter:alpha(opacity=0);opacity:0;position:absolute;top:10%;left:90%;width:30px;display:block;height:30px;margin-left:-30px;margin-top:-30px;-webkit-transform:translate(100px,-100px);transform:translate(100px,-100px);-webkit-transition:all 1s ease 0.5s;transition:all 1s ease 0.5s;}
a.corn b{display:block;height:100%;width:4px;background:#fff;position:absolute;left:13px;top:0;-webkit-transform:rotate(0deg);-webkit-transition:all 1s ease 0.5s;transform:rotate(0deg);transition:all 1s ease 0.5s;}
a.corn b.sp{display:block;height:4px;width:100%;background:#fff;position:absolute;left:0px;top:13px;}
.modal.active a.corn b{-webkit-transform:rotate(135deg);transform:rotate(135deg);}
.modal.active a.corn b.sp{-webkit-transform:rotate(-225deg);transform:rotate(-225deg);}
.modal.active a.corn {filter:alpha(opacity=100);opacity:1;-webkit-transform:translate(0px,0px);transform:translate(0px,0px);}
.modal>video{width:800px} 
.share a label{position:absolute;bottom:100%;border:2px solid #fff;background:#060606;border-radius:5px;color:#fff;text-align:center;width:200px;font-size:20px;font-weight:bold;padding:20px;margin-bottom:15px;z-index:200;margin-left:-102px;-webkit-transform:scale(0);transform:scale(0);filter:alpha(opacity=0);opacity:0;-webkit-transition:all 0.5s ease;-webkit-transform-origin:50% 100%;transition:all 0.5s ease;transform-origin:50% 100%;left:0} 
.share a label img{width:100%;display:block!important}
.share a label em{width:26px;height:13px;background:url(../img/co.png) no-repeat bottom center;position:absolute;bottom:-13px;left:107px;display:block;}
.share a:hover  label{-webkit-transform:scale(1);transform:scale(1);filter:alpha(opacity=100);opacity:1;}
.pose{margin-left:25px;transform:translateY(6px)}



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

 }

 @media screen and (max-width: 1200px) {
.cont{width:98%; }
.bg{padding-bottom:5%} 
.margin{height:0px;padding-bottom:5%}
.home{text-align:center;padding:4.5% 0 3.5%}
.foot{padding-top:4%}
.cright{padding:3% 0;font-size:12px}
.totop{right:2%;margin-right:0}
.pose{display:none}
 }
 @media screen and (max-width: 1000px) { 
.head{height:80px;line-height:80px}
a.logo{margin-left:2%;height:80px}
a.menu{position:fixed;z-index:4000;display:block;width:40px;height:40px;top:20px;right:3%;}
a.menu b{height:4px;display:block;background:#fff;-webkit-transition:all 0.5s ease;transition:all 0.5s ease;margin-top:4px;box-shadow:0 0 4px rgba(0,0,0,.5)}
a.menu b.sp{margin-top:10px;}
a.menu b.mi{margin-top:10px;}
a.menu.active b{margin-top:18px;margin-bottom:-4px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);box-shadow:none}
a.menu.active b.sp{margin-top:-4px; }
a.menu.active b.mi{margin-top:-4px;-webkit-transform:rotate(45deg);transform:rotate(45deg);}
.guide{width:200px;background:#252525;position:fixed;top:0;top:80px;z-index:4000;padding-bottom:20px;-webkit-transition:all 1.5s cubic-bezier(0.5,0,0.03,1);transition:all 1.5s cubic-bezier(0.5,0,0.03,1);overflow-y:auto;right:-200px;border-radius:10px 0 0 10px}
.guide.active{right:0;}
.guide a{display:block;float:none;font-size:18px;line-height:2.6;color:#fff;width:100%;margin-left:0 }  
.guide a.active::after,.guide a:hover::after{display:none;}
.guide a.active,.guide a:hover{color:#f3a474}
.distance{height:80px}
.share{border-left:none;border-right:none;padding:0;margin:0 2%}
.pose{display:inline}
 .pose{margin-left:15px}

 }
 
 @media screen and (max-width: 640px) {  
.head{line-height:50px;height:50px}
a.logo,.distance {height:50px;} 
a.menu{top:5px;}
.guide a{font-size:16px}
.guide{top:50px;width:160px;right:-160px;padding-bottom:12px;border-radius:6px 0 0 6px}
.tell h3{font-size:20px}
.home dt{font-size:15px;background-size:10%;padding-bottom:2%}
.share a{margin:0}
.copy{padding:0 20px 2%}
a.menu{-webkit-transform:scale(0.8);transform:scale(0.8);}
.share a label{width:140px; margin-left:-60px;} 
.share a label em{left:64px}
.pager li > a {padding:0 15px;line-height:32px;font-size:14px;}
.pager li > span{line-height:32px; }
 .pose{margin-left:8px;height:30px;transform:translateY(2px)}

 }