/*网页样式重置reset*/
html { font-size:1em;-webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-tap-highlight:rgba(0,0,0,0);-webkit-text-size-adjust:none;}
body { font-size:0.75em;}
label { cursor:pointer}
a:link, a:visited { text-decoration:none}
input,button,select,textarea{outline:none} textarea{resize:none;}

a, abbr, acronym, address, applet, article, aside, audio, b, blockquote, big, body, center, canvas, caption, cite, code, command, datalist, dd, del, details, dfn, dl, div, dt, em, embed, fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, keygen, label, legend, li, meter, nav, menu, object, ol, output, p, pre, progress, q, s, samp, section, small, span, source, strike, strong, sub, sup, table, tbody, tfoot, thead, th, tr, tdvideo, tt,
u, ul, var { margin:0; padding:0}

article, aside, footer, header, hgroup, nav, section, figure, figcaption { display: block} /*html5设置*/

h1, h2, h3, h4, h5, h6, th, td, table, input, button, select, textarea, sub{ font-size:1em}
body, input, button, select, textarea, sub{ font-family:Arial, sans-serif}
em, cite, address, optgroup { font-style:normal}
kbd, samp, code { font-family:monospace}

img, input, button, select, textarea { vertical-align:middle}
ul, ol { list-style:none}
img, fieldset { border:0}
abbr, acronym { cursor:help; border-bottom:1px dotted black}
table {	width:100%; border-spacing:0; border:0}
table th, table td { border:0}
legend, hr { overflow:hidden; position:absolute; top:0; left:0}
legend, hr, caption { visibility:hidden; font-size:0; width:0; height:0; line-height:0}
input, select, textarea{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;-webkit-appearance:button;-moz-appearance:button;-o-appearance:button;-ms-appearance:button;border-radius:0px;}
/*全局清除浮动样式*/
.fix,{display:inline-block;}
.fix{display:block;}
.fix:after{content:"";display:block;height:0px; clear:both;visibility:hidden;}
/*------------------------------------------------------------------------------------------------------------------------------*/
/*统一样式*/
html,body{margin:0 auto;width:640px;height:100%;overflow:hidden;position:relative;font-family:"微软雅黑";font-size:26px;color:#fff;}
i{font-style:normal;}

/*动画*/
@-webkit-keyframes Shake{
	0% {-webkit-transform: translateY(-5px);}
	50% {-webkit-transform: translateY(-20px);}
	100% {-webkit-transform: translateY(-5px);}
}


@-webkit-keyframes right{
	0% {-webkit-transform:translateX(-66%);}
	50% {-webkit-transform:translateX(-33);}
	100% {-webkit-transform:translateX(0%);}
}

@-webkit-keyframes left{
	0% {-webkit-transform:translateX(0%);}
	50% {-webkit-transform:translateX(-33);}
	100% {-webkit-transform:translateX(-66%);}
}

@-webkit-keyframes fish{
	0% {-webkit-transform:translateX(0px;);}
	100% {-webkit-transform:translateX(640px);}
}

@-webkit-keyframes Shake2{
	0% {-webkit-transform: translateY(400px);}
	50% {-webkit-transform: translateY(300px);}
	100% {-webkit-transform: translateY(100px);}
}

/*load*/
.J-load{width:100%;height:100%;position:absolute; background: url(../images/loading.gif) center no-repeat #000; z-index: 10;}


/*首页*/
body{ background: url(../images/bg-top.png) top no-repeat #fff;}
.l-bg{ width: 100%; height: 100%; position: absolute; left: 0; bottom: 0; z-index: 1; overflow: hidden;}
.l-bg .m-bg{width: 1920px; position: absolute;}
.l-bg .m-tit{ position: absolute; top:0; z-index: 3; width: 100%;}
.l-bg .m-bg1{ bottom: 308px; height:303px; -webkit-animation:right 100s linear infinite; }
.l-bg .m-bg2{ height:309px; bottom: 180px; -webkit-animation:left 80s linear infinite;}
.l-bg .m-bg3{ height:309px; bottom: 68px; -webkit-animation:right 60s linear infinite;}
.l-bg .m-bg4{ height:279px; bottom:0px; -webkit-animation:left 50s linear infinite;}
.l-bg .m-bg5{ height:146px; bottom:-1px;  -webkit-animation:right 30s linear infinite;}
.l-bg .m-bg6{ width: 73px; height: 22px; position: absolute; z-index: 2; bottom: 120px; -webkit-animation:fish 10s linear infinite;}

.l-box{ width: 100%; height: auto; position: absolute; left: 0; top: 0; z-index: 2; margin-top: 495px; }
.page1{opacity:0;}
.l-box .m-section{ width: 557px; margin-left: 53px; height: auto; }
.l-box .m-section .m-ask{ width: 100%; height: auto; margin-bottom: 40px;}
.l-box .m-section .m-ask .m-left{ float: left; width: 79px; height: 79px; -webkit-border-radius: 50%;}
.l-box .m-section .m-ask .m-left{-webkit-border-radius: 50%;}
.l-box .m-section .m-ask .m-right{ float: left; width: 432px; margin-left: 20px; height: auto;}
.l-box .m-section .m-ask .m-name{ margin-left: 12px; font-size: 24px; color:#005563;}
.l-box .m-section .m-ask .m-talk{ width: 432px; height: auto; margin-top: 24px;}
.l-box .m-section .m-ask .m-talk .croe{ width: 12px; height: 8px; float: left; background: url(../images/core.png) no-repeat;}
.l-box .m-section .m-ask .m-talk .text{ width: 380px; height: auto; float: left;  font-size: 22px; background: #00424d;  padding: 15px 20px; line-height: 30px; word-wrap: break-word;}
.l-box .m-section .m-ask .m-other{ width: 418px; height: auto; margin-left: 12px; margin-top: 10px;}
.l-box .m-section .m-ask .m-other .m-zan{ float: left; width: 112px;}
.l-box .m-section .m-ask .m-other .m-zan img{ width: 22px; height: 18px;}
.l-box .m-section .m-ask .m-other .m-zan span{margin-left: 12px; line-height: 32px; font-size: 18px; color: #00424d; opacity: 0.7;}
.l-box .m-section .m-ask .m-other .m-see{ float: left; width: 112px;}
.l-box .m-section .m-ask .m-other .m-see img{ width: 26px; height: 15px;}
.l-box .m-section .m-ask .m-other .m-see span{ margin-left: 12px; line-height: 32px; font-size: 18px; color: #00424d; opacity: 0.7;}
.l-box .m-section .m-ask .m-other .m-love{ float: right;  width: 38px; height: 32px; background: url(../images/n-good.png);}
.l-box .m-section .m-fish{ width: 317px; height: 206px; position: fixed; bottom:73px; left: 50%; z-index: 10; margin-left: -157px;-webkit-animation:Shake 2s linear infinite;}
.l-box .m-section .m-fish a{ width: 317px; height: 206px; display: block;}



/*第二页*/
.l-bg .m-bg1-page2{margin-top:450px;}
.l-bg .m-bg5-page2{ position: absolute; z-index: 2; margin-top: -130px;}
.l-box-page2{ display: block; width: 100%; height: 80%; position: absolute; left: 0; top: 0; z-index: 2; margin-top: 110px; }
.l-box-page2 .m-section{ width: 100%; margin-left: 14px; height: auto; }
.l-box-page2 .m-section .m-ask{ width: 100%; height: auto; margin-bottom: 40px;}
.l-box-page2 .m-section .m-ask .m-num{ float: left; width: 14px; height: 26px; margin-top: 40px; }
.l-box-page2 .m-section .m-ask .m-left{ float: left; width: 79px; height: 79px; margin-left: 15px;}
.l-box-page2 .m-section .m-ask .m-st{ width: 101px; height: 110px; position: relative;}
.l-box-page2 .m-section .m-ask .m-st .m-num-st{ position: absolute; top: 0px; left: 0; z-index: 1;}
.l-box-page2 .m-section .m-ask .m-st .m-head{ position: absolute; top: 30px; left: 0; z-index: 0; -webkit-border-radius: 50%;}
.l-box-page2 .m-section .m-ask .m-right{ float: left; width: 432px; margin-left: 29px; height: auto;}
.l-box-page2 .m-section .m-ask .m-right-st{margin-left: 5px; margin-top: 30px;}
.l-box-page2 .m-section .m-ask .m-name{ margin-left: 12px; font-size: 24px; color:#005563;}
.l-box-page2 .m-section .m-ask .m-talk{ width: 432px; height: auto; margin-top: 24px;}
.l-box-page2 .m-section .m-ask .m-talk .croe{ width: 12px; height: 8px; float: left; background: url(../images/core.png) no-repeat;}
.l-box-page2 .m-section .m-ask .m-talk .text{ width: 380px; height: auto; float: left;  font-size: 22px; background: #00424d;  padding: 15px 20px; line-height: 30px;word-wrap: break-word;}
.l-box-page2 .m-section .m-ask .m-other{ width: 418px; height: auto; margin-left: 12px; margin-top: 10px;}
.l-box-page2 .m-section .m-ask .m-other .m-zan{ float: left; width: 112px;}
.l-box-page2 .m-section .m-ask .m-other .m-zan img{ width: 22px; height: 18px;}
.l-box-page2 .m-section .m-ask .m-other .m-zan span{margin-left: 12px; line-height: 32px; font-size: 18px; color: #00424d; opacity: 0.7;}
.l-box-page2 .m-section .m-ask .m-other .m-see{ float: left; width: 112px;}
.l-box-page2 .m-section .m-ask .m-other .m-see img{ width: 26px; height: 15px;}
.l-box-page2 .m-section .m-ask .m-other .m-see span{ margin-left: 12px; line-height: 32px; font-size: 18px; color: #00424d; opacity: 0.7;}
.l-box-page2 .m-section .m-ask .m-other .m-love{ float: right;  width: 38px; height: 32px; background: url(../images/n-good.png);}
.m-fish-page2{ width: 320px; height: 298px; position: fixed; z-index: 0; bottom:73px; left: 50%; margin-left: -157px;-webkit-animation:Shake2 5s alternate infinite;}
.m-info{ display: none; width: 416px; height: 66px; position: absolute; bottom:138px; left: 50%; margin-left: -208px; background: #a9a790; line-height: 66px; color: #fff; font-size: 22px; z-index: 10; text-align: center;}
.m-input{ width: 100%; height: 88px; position: fixed; bottom: 0; z-index: 10; background:url(../images/bl6.png);}
.m-input .m-text{ float: left;}
.m-input .m-text .text{ width: 519px; height: 51px; margin-left: 10px; margin-top: 25px; border: none; background: url(../images/write.png); padding-left: 28px;}
.m-input .m-btn{ float: right;}
.m-input .m-btn .btn{ width: 90px; height: 69px; margin-top: 14px; background: url(../images/post.png); border: none; margin-right: 6px; }

/*第三页*/
.l-box .m-section .m-fish-page3{ width: 291px; height: 312px; bottom:43px; margin-left: -145px;}
.l-share2{ width: 100%; height: 100%; display: none; position: absolute; top: 0; left: 0; z-index: 10; background: #000;}