/* reset */ html, body, h1, h2, h3, h4, h5, h6, div, dl, dt, dd, ul, ol, li, p, blockquote, pre, hr, figure, table, caption, th, td, form, fieldset, legend, input, button, textarea, menu { margin:0; padding:0; } header, footer, section, article, aside, nav, hgroup, address, figure, figcaption, menu, details { display:block; } table { border-collapse:collapse; border-spacing:0; } caption, th { text-align:left; font-weight:normal; } html, body, fieldset, img, iframe, abbr { border:0; } i, cite, em, var, address, dfn { font-style:normal; vertical-align:middle; } [hidefocus], summary { outline:0; } li { list-style:none; } /*h1,h2,h3,h4,h5,h6,small{font-size:100%;}*/ sup, sub { font-size:83%; } pre, code, kbd, samp { font-family:inherit; } q:before, q:after { content:none; } textarea { overflow:auto; resize:none; } label, summary { cursor:default; } a, button { cursor:pointer; } input[type="text"], input[type="button"] { -webkit-appearance: none; border:0; } select { -webkit-appearance: none; } h1, h2, h3, h4, h5, h6, em, strong{ font-weight:normal; } b{ font-weight:bold;} del, ins, u, s, a, a:hover { text-decoration:none; } body, textarea, input, button, select, keygen, legend { font:12px/1.14 "Microsoft Yahei"; color:#333; outline:0; } body { } a, a:hover { color:inherit; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } img { vertical-align: middle; max-width:100%; } /*conmon*/ .fl { float:left; } .fr { float:right; } .clearfix { zoom: 1 } .clearfix:after { content: ""; display: table; clear: both; height:0; visibility:hidden; line-height: 0; font-size:0; } .textl { text-align:left; } .textr { text-align:right; } .textc { text-align:center; } .c-green { color: #06bf04 !important } .c-red { color: #ed5050 !important } .c-gray { color: #b2b2b2 !important } .c-yellow { color: #ffe850 !important } .btn { display: inline-block; background-color: #fafafa; border: 1px solid #e5e5e5; border-radius: 5px; padding: 7px 10px; text-align: center; margin: 0; color: #606060; cursor: pointer; line-height: 1.5; -webkit-appearance: none; } .btn:hover { color: #606060 } .btn:active { background-color: #e9e9e9; color: #999 } .btn.disabled, .btn[disabled] { background-color: #c9c9c9 !important; background-image: none !important; border: 1px solid transparent !important; color: #fff !important } .btn.disabled:active, .btn[disabled]:active { background-color: #c9c9c9 !important; background-image: none !important; border: 1px solid #bcbcbc !important } .btn.btn-blue { color: #fff; background-color: #2797d1; border-color: #fff; border: 1px solid #2797d1; } .btn.btn-block { text-align: center; width: 100%; padding: 11px 10px; line-height: 1.5; border-radius: 4px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .icon { background-repeat:no-repeat; display:inline-block; background-size:100%; } .fixbottom { position: fixed; z-index: 999; bottom: 0px; width:100%; display: block; overflow: hidden; } /*swiper*/ .swiper-container { margin:0 auto; position:relative; overflow:hidden; z-index:1 } .swiper-container-no-flexbox .swiper-slide { float:left } .swiper-container-vertical>.swiper-wrapper { -webkit-box-orient:vertical; -moz-box-orient:vertical; -ms-flex-direction:column; -webkit-flex-direction:column; flex-direction:column } .swiper-wrapper { position:relative; width:100%; height:100%; z-index:1; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-transition-property:-webkit-transform; -moz-transition-property:-moz-transform; -o-transition-property:-o-transform; -ms-transition-property:-ms-transform; transition-property:transform; -webkit-box-sizing:content-box; -moz-box-sizing:content-box; box-sizing:content-box } .swiper-container-android .swiper-slide, .swiper-wrapper { -webkit-transform:translate3d(0, 0, 0); -moz-transform:translate3d(0, 0, 0); -o-transform:translate(0, 0); -ms-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0) } .swiper-container-multirow>.swiper-wrapper { -webkit-box-lines:multiple; -moz-box-lines:multiple; -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap } .swiper-container-free-mode>.swiper-wrapper { -webkit-transition-timing-function:ease-out; -moz-transition-timing-function:ease-out; -ms-transition-timing-function:ease-out; -o-transition-timing-function:ease-out; transition-timing-function:ease-out; margin:0 auto } .swiper-slide { -webkit-flex-shrink:0; -ms-flex:0 0 auto; flex-shrink:0; width:100%; height:100%; position:relative } .swiper-container-autoheight, .swiper-container-autoheight .swiper-slide { height:auto } .swiper-container-autoheight .swiper-wrapper { -webkit-box-align:start; -ms-flex-align:start; -webkit-align-items:flex-start; align-items:flex-start; -webkit-transition-property:-webkit-transform, height; -moz-transition-property:-moz-transform; -o-transition-property:-o-transform; -ms-transition-property:-ms-transform; transition-property:transform, height } .swiper-container .swiper-notification { position:absolute; left:0; top:0; pointer-events:none; opacity:0; z-index:-1000 } .swiper-wp8-horizontal { -ms-touch-action:pan-y; touch-action:pan-y } .swiper-wp8-vertical { -ms-touch-action:pan-x; touch-action:pan-x } .swiper-button-next, .swiper-button-prev { position:absolute; top:50%; width:27px; height:44px; margin-top:-22px; z-index:10; cursor:pointer; -moz-background-size:27px 44px; -webkit-background-size:27px 44px; background-size:27px 44px; background-position:center; background-repeat:no-repeat } .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled { opacity:.35; cursor:auto; pointer-events:none } .swiper-button-prev, .swiper-container-rtl .swiper-button-next { background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); left:10px; right:auto } .swiper-button-prev.swiper-button-black, .swiper-container-rtl .swiper-button-next.swiper-button-black { background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E") } .swiper-button-prev.swiper-button-white, .swiper-container-rtl .swiper-button-next.swiper-button-white { background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E") } .swiper-button-next, .swiper-container-rtl .swiper-button-prev { background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); right:10px; left:auto } .swiper-button-next.swiper-button-black, .swiper-container-rtl .swiper-button-prev.swiper-button-black { background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E") } .swiper-button-next.swiper-button-white, .swiper-container-rtl .swiper-button-prev.swiper-button-white { background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E") } .swiper-pagination { position:absolute; text-align:center; -webkit-transition:.3s; -moz-transition:.3s; -o-transition:.3s; transition:.3s; -webkit-transform:translate3d(0, 0, 0); -ms-transform:translate3d(0, 0, 0); -o-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); z-index:10 } .swiper-pagination.swiper-pagination-hidden { opacity:0 } .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom:10px; left:0; width:100% } .swiper-pagination-bullet { width:8px; height:8px; display:inline-block; border-radius:100%; background:#000; opacity:.2 } button.swiper-pagination-bullet { border:none; margin:0; padding:0; box-shadow:none; -moz-appearance:none; -ms-appearance:none; -webkit-appearance:none; appearance:none } .swiper-pagination-clickable .swiper-pagination-bullet { cursor:pointer } .swiper-pagination-white .swiper-pagination-bullet { background:#fff } .swiper-pagination-bullet-active { opacity:1; background:#007aff } .swiper-pagination-white .swiper-pagination-bullet-active { background:#fff } .swiper-pagination-black .swiper-pagination-bullet-active { background:#000 } .swiper-container-vertical>.swiper-pagination-bullets { right:10px; top:50%; -webkit-transform:translate3d(0, -50%, 0); -moz-transform:translate3d(0, -50%, 0); -o-transform:translate(0, -50%); -ms-transform:translate3d(0, -50%, 0); transform:translate3d(0, -50%, 0) } .swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet { margin:5px 0; display:block } .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { margin:0 5px } .swiper-pagination-progress { background:rgba(0, 0, 0, .25); position:absolute } .swiper-pagination-progress .swiper-pagination-progressbar { background:#007aff; position:absolute; left:0; top:0; width:100%; height:100%; -webkit-transform:scale(0); -ms-transform:scale(0); -o-transform:scale(0); transform:scale(0); -webkit-transform-origin:left top; -moz-transform-origin:left top; -ms-transform-origin:left top; -o-transform-origin:left top; transform-origin:left top } .swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar { -webkit-transform-origin:right top; -moz-transform-origin:right top; -ms-transform-origin:right top; -o-transform-origin:right top; transform-origin:right top } .swiper-container-horizontal>.swiper-pagination-progress { width:100%; height:4px; left:0; top:0 } .swiper-container-vertical>.swiper-pagination-progress { width:4px; height:100%; left:0; top:0 } .swiper-pagination-progress.swiper-pagination-white { background:rgba(255, 255, 255, .5) } .swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar { background:#fff } .swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar { background:#000 } .swiper-container-3d { -webkit-perspective:1200px; -moz-perspective:1200px; -o-perspective:1200px; perspective:1200px } .swiper-container-3d .swiper-cube-shadow, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-wrapper { -webkit-transform-style:preserve-3d; -moz-transform-style:preserve-3d; -ms-transform-style:preserve-3d; transform-style:preserve-3d } .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top { position:absolute; left:0; top:0; width:100%; height:100%; pointer-events:none; z-index:10 } .swiper-container-3d .swiper-slide-shadow-left { background-image:-webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0))); background-image:-webkit-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-moz-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-o-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:linear-gradient(to left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)) } .swiper-container-3d .swiper-slide-shadow-right { background-image:-webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0))); background-image:-webkit-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-moz-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-o-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:linear-gradient(to right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)) } .swiper-container-3d .swiper-slide-shadow-top { background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0))); background-image:-webkit-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-moz-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-o-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:linear-gradient(to top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)) } .swiper-container-3d .swiper-slide-shadow-bottom { background-image:-webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0))); background-image:-webkit-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-moz-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-o-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:linear-gradient(to bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)) } .swiper-container-coverflow .swiper-wrapper, .swiper-container-flip .swiper-wrapper { -ms-perspective:1200px } .swiper-container-cube, .swiper-container-flip { overflow:visible } .swiper-container-cube .swiper-slide, .swiper-container-flip .swiper-slide { pointer-events:none; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -ms-backface-visibility:hidden; backface-visibility:hidden; z-index:1 } .swiper-container-cube .swiper-slide .swiper-slide, .swiper-container-flip .swiper-slide .swiper-slide { pointer-events:none } .swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-active .swiper-slide-active, .swiper-container-flip .swiper-slide-active, .swiper-container-flip .swiper-slide-active .swiper-slide-active { pointer-events:auto } .swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right, .swiper-container-cube .swiper-slide-shadow-top, .swiper-container-flip .swiper-slide-shadow-bottom, .swiper-container-flip .swiper-slide-shadow-left, .swiper-container-flip .swiper-slide-shadow-right, .swiper-container-flip .swiper-slide-shadow-top { z-index:0; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -ms-backface-visibility:hidden; backface-visibility:hidden } .swiper-container-cube .swiper-slide { visibility:hidden; -webkit-transform-origin:0 0; -moz-transform-origin:0 0; -ms-transform-origin:0 0; transform-origin:0 0; width:100%; height:100% } .swiper-container-cube.swiper-container-rtl .swiper-slide { -webkit-transform-origin:100% 0; -moz-transform-origin:100% 0; -ms-transform-origin:100% 0; transform-origin:100% 0 } .swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-next+.swiper-slide, .swiper-container-cube .swiper-slide-prev { pointer-events:auto; visibility:visible } .swiper-container-cube .swiper-cube-shadow { position:absolute; left:0; bottom:0; width:100%; height:100%; background:#000; opacity:.6; -webkit-filter:blur(50px); filter:blur(50px); z-index:0 } .swiper-container-fade.swiper-container-free-mode .swiper-slide { -webkit-transition-timing-function:ease-out; -moz-transition-timing-function:ease-out; -ms-transition-timing-function:ease-out; -o-transition-timing-function:ease-out; transition-timing-function:ease-out } .swiper-container-fade .swiper-slide { pointer-events:none; -webkit-transition-property:opacity; -moz-transition-property:opacity; -o-transition-property:opacity; transition-property:opacity } .swiper-container-fade .swiper-slide .swiper-slide { pointer-events:none } .swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active { pointer-events:auto } .swiper-scrollbar { border-radius:10px; position:relative; -ms-touch-action:none; background:rgba(0, 0, 0, .1) } .swiper-container-horizontal>.swiper-scrollbar { position:absolute; left:1%; bottom:3px; z-index:50; height:5px; width:98% } .swiper-container-vertical>.swiper-scrollbar { position:absolute; right:3px; top:1%; z-index:50; width:5px; height:98% } .swiper-scrollbar-drag { height:100%; width:100%; position:relative; background:rgba(0, 0, 0, .5); border-radius:10px; left:0; top:0 } .swiper-scrollbar-cursor-drag { cursor:move } .swiper-lazy-preloader { width:42px; height:42px; position:absolute; left:50%; top:50%; margin-left:-21px; margin-top:-21px; z-index:10; -webkit-transform-origin:50%; -moz-transform-origin:50%; transform-origin:50%; -webkit-animation:swiper-preloader-spin 1s steps(12, end) infinite; -moz-animation:swiper-preloader-spin 1s steps(12, end) infinite; animation:swiper-preloader-spin 1s steps(12, end) infinite } .swiper-lazy-preloader:after { display:block; content:""; width:100%; height:100%; background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); background-position:50%; -webkit-background-size:100%; background-size:100%; background-repeat:no-repeat } .swiper-lazy-preloader-white:after { background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") } @-webkit-keyframes swiper-preloader-spin { 100% { -webkit-transform:rotate(360deg) } } @keyframes swiper-preloader-spin { 100% { transform:rotate(360deg) } } /*switchery*/ .switchery { background-color:#fff; border:1px solid #dfdfdf; border-radius:20px; cursor:pointer; display:inline-block; height:30px; position:relative; vertical-align:middle; width:50px } .switchery>small { background:#fff; border-radius:100%; box-shadow:0 1px 3px rgba(0, 0, 0, 0.4); height:30px; position:absolute; top:0; width:30px } /*layui*/ .layui-m-layer { position:relative; z-index:19891014 } .layui-m-layer * { -webkit-box-sizing:content-box; -moz-box-sizing:content-box; box-sizing:content-box } .layui-m-layermain, .layui-m-layershade { position:fixed; left:0; top:0; width:100%; height:100% } .layui-m-layershade { background-color:rgba(0, 0, 0, .7); pointer-events:auto } .layui-m-layermain { display:table; font-family:Helvetica, arial, sans-serif; pointer-events:none } .layui-m-layermain .layui-m-layersection { display:table-cell; vertical-align:middle; text-align:center } .layui-m-layerchild { position:relative; display:inline-block; text-align:left; background-color:#fff; font-size:14px; border-radius:5px; box-shadow:0 0 8px rgba(0, 0, 0, .1); pointer-events:auto; -webkit-overflow-scrolling:touch; -webkit-animation-fill-mode:both; animation-fill-mode:both; -webkit-animation-duration:.2s; animation-duration:.2s } @-webkit-keyframes layui-m-anim-scale { 0% { opacity:0; -webkit-transform:scale(.5); transform:scale(.5) } 100% { opacity:1; -webkit-transform:scale(1); transform:scale(1) } } @keyframes layui-m-anim-scale { 0% { opacity:0; -webkit-transform:scale(.5); transform:scale(.5) } 100% { opacity:1; -webkit-transform:scale(1); transform:scale(1) } } .layui-m-anim-scale { animation-name:layui-m-anim-scale; -webkit-animation-name:layui-m-anim-scale } @-webkit-keyframes layui-m-anim-up { 0% { opacity:0; -webkit-transform:translateY(800px); transform:translateY(800px) } 100% { opacity:1; -webkit-transform:translateY(0); transform:translateY(0) } } @keyframes layui-m-anim-up { 0% { opacity:0; -webkit-transform:translateY(800px); transform:translateY(800px) } 100% { opacity:1; -webkit-transform:translateY(0); transform:translateY(0) } } .layui-m-anim-up { -webkit-animation-name:layui-m-anim-up; animation-name:layui-m-anim-up } .layui-m-layer0 .layui-m-layerchild { width:90%; max-width:640px } .layui-m-layer1 .layui-m-layerchild { border:none; border-radius:0 } .layui-m-layer2 .layui-m-layerchild { width:auto; max-width:260px; min-width:40px; border:none; background:0 0; box-shadow:none; color:#fff } .layui-m-layerchild h3 { padding:0 10px; height:60px; line-height:60px; font-size:16px; font-weight:400; border-radius:5px 5px 0 0; text-align:center } .layui-m-layerbtn span, .layui-m-layerchild h3 { text-overflow:ellipsis; overflow:hidden; white-space:nowrap } .layui-m-layercont { padding:10px; line-height:22px; text-align:center } .layui-m-layer1 .layui-m-layercont { padding:0; text-align:left } .layui-m-layer2 .layui-m-layercont { text-align:center; padding:0; line-height:0 } .layui-m-layer2 .layui-m-layercont i { width:25px; height:25px; margin-left:8px; display:inline-block; background-color:#fff; border-radius:100%; -webkit-animation:layui-m-anim-loading 1.4s infinite ease-in-out; animation:layui-m-anim-loading 1.4s infinite ease-in-out; -webkit-animation-fill-mode:both; animation-fill-mode:both } .layui-m-layerbtn, .layui-m-layerbtn span { position:relative; text-align:center; border-radius:0 0 5px 5px } .layui-m-layer2 .layui-m-layercont p { margin-top:20px } @-webkit-keyframes layui-m-anim-loading { 0%, 100%, 80% { transform:scale(0); -webkit-transform:scale(0) } 40% { transform:scale(1); -webkit-transform:scale(1) } } @keyframes layui-m-anim-loading { 0%, 100%, 80% { transform:scale(0); -webkit-transform:scale(0) } 40% { transform:scale(1); -webkit-transform:scale(1) } } .layui-m-layer2 .layui-m-layercont i:first-child { margin-left:0; -webkit-animation-delay:-.32s; animation-delay:-.32s } .layui-m-layer2 .layui-m-layercont i.layui-m-layerload { -webkit-animation-delay:-.16s; animation-delay:-.16s } .layui-m-layer2 .layui-m-layercont>div { line-height:22px; padding-top:7px; margin-bottom:20px; font-size:14px } .layui-m-layerbtn { display:box; display:-moz-box; display:-webkit-box; width:100%; height:50px; line-height:50px; font-size:0; border-top:1px solid #D0D0D0; background-color:#F2F2F2 } .layui-m-layerbtn span { display:block; -moz-box-flex:1; box-flex:1; -webkit-box-flex:1; font-size:14px; cursor:pointer } .layui-m-layerbtn span[yes] { color:#40AFFE } .layui-m-layerbtn span[no] { border-right:1px solid #D0D0D0; border-radius:0 0 0 5px } .layui-m-layerbtn span:active { background-color:#F6F6F6 } .layui-m-layerend { position:absolute; right:7px; top:10px; width:30px; height:30px; border:0; font-weight:400; background:0 0; cursor:pointer; -webkit-appearance:none; font-size:30px } .layui-m-layerend::after, .layui-m-layerend::before { position:absolute; left:5px; top:15px; content:''; width:18px; height:1px; background-color:#999; transform:rotate(45deg); -webkit-transform:rotate(45deg); border-radius:3px } .layui-m-layerend::after { transform:rotate(-45deg); -webkit-transform:rotate(-45deg) } body .layui-m-layer .layui-m-layer-footer { position:fixed; width:95%; max-width:100%; margin:0 auto; left:0; right:0; bottom:10px; background:0 0 } .layui-m-layer-footer .layui-m-layercont { padding:20px; border-radius:5px 5px 0 0; background-color:rgba(255, 255, 255, .8) } .layui-m-layer-footer .layui-m-layerbtn { display:block; height:auto; background:0 0; border-top:none } .layui-m-layer-footer .layui-m-layerbtn span { background-color:rgba(255, 255, 255, .8) } .layui-m-layer-footer .layui-m-layerbtn span[no] { color:#FD482C; border-top:1px solid #c2c2c2; border-radius:0 0 5px 5px } .layui-m-layer-footer .layui-m-layerbtn span[yes] { margin-top:10px; border-radius:5px } body .layui-m-layer .layui-m-layer-msg { width:auto; max-width:90%; margin:0 auto; bottom:-150px; background-color:rgba(0, 0, 0, .7); color:#fff } .layui-m-layer-msg .layui-m-layercont { padding:10px 20px } .layer-closed { height:40px; } .layer-closed .btn-closed { z-index:2; top:10px; right:10px; position:absolute; width:18px; height:18px; display:block; background:url(../images/layer_closerbtn.png) no-repeat; background-size:100%; } .layui-m-layerbtns{ text-align:center;} .layui-m-layerbtns .btn-gray{ background-color:#e6e6e6;border-radius:0; font-size:1.4rem; color:#1a1a1a;padding: 7px 35px; margin:0 10px;} html { font-family: "Helvetica Neue", Helvetica, STHeiTi, Arial, sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-size: 62.5%; } body { margin: 0; font-size: 1.4rem; line-height: 1.5; color: #333; background-color: white; min-height: 100%; overflow-x: hidden; -webkit-overflow-scrolling: touch; } .wrap { width:100%; max-width:1200px; margin:0 auto; } .flex { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap } .flex>.cell { -webkit-box-flex:1; -webkit-flex:1; -ms-flex:1; flex:1; width:0; -webkit-flex-basis:0; -ms-flex-preferred-size:0; flex-basis:0; max-width:100%; display:block; position:relative } .flex>.cell.fixed { -webkit-box-flex:0; -webkit-flex:none; -ms-flex:none; flex:none; width:auto } .container { position:absolute; width:100%; min-height:100%; } /* index */ .index_top { position:relative; } .index_top img, .ad img { width:100%; height:auto; } .user_box { z-index:2; position:absolute; left:0; top:16%; width:92%; padding-left:8%; } .user_avatar, .user_info { display:inline-block; float: left; } .user_avatar { position:relative; margin-right:1.8rem; margin-top:0.2rem; } .avatar, .avatar img { width:6.5rem; height:6.5rem; border-radius:999px; } .user_avatar .avatar img { border:3px solid rgba(255, 255, 255, 0.2); } .user_avatar .icon-rz { z-index:2; position:absolute; right:-3px; bottom:-3px; } .icon-rz { width:1.4rem; height:1.4rem; background-image: url(../images/icon_rz.png); background-size:100%; } .user_info { width:43%; color:#fff; } .user_info li { font-size:1.2rem; line-height:1.6; } .user_info .username { font-size:1.8rem; } .signday { font-size:1.4rem; } .user_info .label_yellow { margin-left:0.6rem; } .label_yellow { padding:0 .3rem; font-size:1.2rem; background-color:#ffd153; border-radius:5px; color:#44474d; line-height:1.0625rem; } .signin { margin-top:0.7rem; line-height:2rem; } .btn-signin { background:none; border:1px solid #fff!important; color:#fff; padding:0 0.9375rem; font-size:1.2rem; line-height:2rem; margin-top:-.2rem; } .btn-signin[disabled] { background:none!important; border:1px solid #999!important; color:#999!important; } .bgwhite, .marginbottom15 { margin-bottom:1.2rem } .marginbottom20 { margin-bottom:1.3rem } .bgwhite { background-color:#fff; } .navs li { text-align:center; } .navs li a { display:block; padding:1.5rem 0; font-size:1.5rem; line-height:1.8; } .navs li img { width:4.5rem; height:4.5rem; display:inline-block; } .menus li, .list li { text-align:left; border-bottom:1px solid #adadad; display:block; } .menus li a { display:block; font-size:1.125rem; padding:1rem; background-color:#fff; font-size:1.8rem; line-height:2.5rem; color:#404041; } .menus li:last-child { border-bottom:0; } .icon-left, .icon-left2 { margin-right:1rem; float:left; } .icon-left, .icon-left img, .icon-arrowright, .icon-arrowdown { width:2.5rem; height:2.5rem; display:inline-block; } .icon-left2, .icon-left2 img { width:3.6rem; height:3.6rem; } .icon-arrowright { background-image:url(../images/icon_arrowright.png); background-size:100%; float:right; } .icon-arrowdown { background-image: url(../images/icon_arrowdown.png); background-size:100%; float:right; } .list li, .list dt, .list dd { background-color:#fff; padding:1rem; color:#333; line-height:2.5rem; border-bottom:1px solid #dbdbdb; } .list ul { margin-bottom:0.75rem; width:100%; } .list li { } .list li ul { width:100%; float:left; } .list li ul li { padding:1rem 3.5rem 1rem 4rem; background-color:#f1eded; } .list .left, .list .right { margin:0; float:left; display:inline-block; } .list .left { width:45%; } .list .right { width:55%; text-align:right; color:#999; } .list dl { padding:0 1.2rem; background-color:#fff; } .list dt, .list dd { font-size:1.3rem; } .list dd:last-child { border-bottom:0; } /*gamecenter*/ .gamecenter_top { position:relative; } .gamecenter_top img { width:100%; height:auto; } .gamecenter_top .search_btn { z-index:22; position:absolute; right:.8rem; top:.8rem; width:3.5rem; height:3.5rem; overflow:hidden; } .icon-search { width:3.5rem; height:3.5rem; background-image:url(../images/icon_search.png); } .gamecenter_nav { margin-bottom:0; } .gamecenter_nav li img { width:3.7rem; height:3.7rem; } .gamecenter_nav li a { font-size:1.4rem; } .gamecenter_tit { padding:.625rem .9375rem; } .gamecenter_tit, .gamecenter_tit .tit, .gamecenter_tit .more { color:#9a9a9a; font-size:1.3rem; line-height:1.5; } .gamecenter_cell { } .gamecenter_list { padding:1.7rem .8rem; background-color:#fff; box-sizing:border-box; } .gamecenter_list li { width:25%; height:auto; padding:0 .8rem; display:inline-block; text-align:center; float:left; box-sizing:border-box; } .gamecenter_list li a { } .gamecenter_list li img { /*width:7.2rem; height:7.2rem; */ max-width:100%; } .gamecenter_list li b { height:2rem; font-size:1.3rem; color:#343434; line-height:2; overflow:hidden; display:block; margin-top:.3rem; } .gamecenter_list li p { padding:0 .5rem; font-size:1rem; color:#b2b2b2; line-height:1.2; height:1.2em; overflow:hidden; text-overflow: ellipsis; } .game_list a { display:block; } .game_list dl { position:relative; display:table; width:100%; padding:1.5rem 0; border-bottom:1px solid #dcdcdc; } .game_list dt, .game_list dd { display: table-cell; vertical-align: top; } .game_list .gameimg { padding-left:1.5rem; padding-right:1.3rem; } .game_list .gameinfo { padding-right:1.6rem; } .game_list .gameimg, .game_list .gameimg img { width:6.5rem; height:6.5rem; } .game_list .gameinfo { } .game_list .gamename { font-size:1.5rem; color:#333; line-height:2; } .game_list .meta { font-size:1.2rem; color:#b2b2b2; } .game_list .icon-arrowright4 { z-index:2; position:absolute; top:50%; right:1rem; margin-top:-.5rem; } .icon-arrowright4 { width:1.3rem; height:1.3rem; background-image:url(../images/icon_arrowright4.png); } .search-box { margin:1rem 1rem 0 1rem; } .searchinput { width:100%; height:1.5rem; display:block; text-align:center; background-color:#eee; padding:.8rem 0; border-radius:8px; color:#646464; overflow:hidden; font-size:1.3rem; } .gamecenter_tit2 { font-size:1.3rem; border-bottom:1px solid #eaeaea; padding:0 1rem; line-height:2.8; } .icon-search2 { width:1.6rem; height:1.6rem; background-image:url(../images/icon_search2.png); margin-top:-.5rem; } .game_ranklist { } .game_ranklist dl { width:98%; border-bottom:0; border-radius:8px; margin:2%; margin-top:.5rem; margin-bottom:.5rem; } .game_ranklist dt, .game_ranklist dd { vertical-align:middle; } .game_ranklist .gameimg { padding-left:0; } .game_ranklist .gameimg, .game_ranklist .gameimg img { width:9rem; height:9rem; } .game_ranklist .gameinfo { padding-right:1.5rem; } .game_ranklist .gamename { font-size:2rem; color:#040404; } .game_ranklist .gamemeta { position:relative; min-height:2.2rem; padding-bottom:.5rem; padding-right:5.2rem; } .game_ranklist .meta { display:inline-block; color:#a8a5a5; } .game_ranklist .btn-border3 { z-index:2; position:absolute; right:0; top:0; border:1px solid #0080fc; border-radius:2px; color:#0080fc; font-size:1.4rem; line-height:2.5rem; height:2.5rem; width:5rem; text-align:center; padding:0; background-color:#fff; margin-top:-.7rem; } .game_ranklist .recommend { } .game_ranklist .gamenumber { width:3.5rem; text-align:center; font-family:Arial; font-style:italic; font-weight:bold; color:#ccc; font-size:3.6rem; } .game_ranklist .number01 { color:#d931ed; } .game_ranklist .number02 { color:#ff6e13; } .game_ranklist .number03 { color:#dd128e; } .game_ranklist .number04 { color:#36d026; } .game_ranklist .number05 { color:#2fdcd6; } .game_ranklist .number06 { color:#2f95dc; } .game_ranklist .starbox, .game_ranklist .sentimen { font-size:1.3rem; color:#040404; width:50%; float:left; line-height:1.5rem; } .game_ranklist .starbox { width:60%; } .game_ranklist .sentimen { width:40%; } .star { color:#f4d60f; display:inline-block; font-size:1.5rem; } .game_ranklist .sentimen { text-align:right; } .c-yellow2 { color:#ff6e13; } @media only screen and (min-width:640px) and (max-width:1024px) { .cards_box .cards_top, .cards_box .cards_act { margin-top:2.7rem; } .cards_box2 { min-height:30rem; } .card-moreinfo { margin-top:2.5rem; } } @media only screen and (min-width:480px) and (max-width:1024px) { .user_box { top:30%; padding-left:15%; } .user_avatar .avatar, .user_avatar .avatar img { width:6.8rem; height:6.8rem; } .index_cell5 .li02 a, .index_cell5 .li03 a { padding:0.85rem 0.625rem; } .members_box .members_cell { padding:10% 15%; } .members_box .user_info { margin-top:0.875rem; } .task_list .tit, .task_list .tit2 { width:55%; } .area-selbox li { width:10%; } } @media only screen and (max-width:768px) { } @media only screen and (max-width:480px) { .cards_box2 { min-height:28rem; } } @media only screen and (max-width:375px) { .index_cell5 .li02 a { padding:0.8rem 0.5rem; } .index_cell5 .li03 a { padding:0.1rem 0.5rem; } .task_list .tit, .task_list .tit2 { width:48%; } .game_ranklist .gameimg, .game_ranklist .gameimg img { width:7.6rem; height:7.6rem; } .game_ranklist .gamename { font-size:1.8rem; } .game_ranklist .gamenumber { width:3rem; font-size:3rem; } .game_ranklist .gameimg { padding-right:1rem; } .conments_box .fl { width:50%; } .cards_box2 { min-height:31rem; } } @media only screen and (max-width:320px) { .user_info { margin-top:-0.6rem; } .avatar, .avatar img { width:5rem; height:5rem; } .user_info .username { font-size: 1.6rem; } .index_cell5 .li02 a, .index_cell5 .li03 a { padding:0.1rem 0.5rem; } .edit-form li { font-size:1.2rem; } .members_box .members_cell { padding:5% 6%; } .members_box .user_info { margin-top:0; } .task_list .tit, .task_list .tit2 { width:42%; } .sesrch-tips span { width:14%; } .sesrch-tips p { width:86%; } .gamecenter_list li b { font-size:1.2rem; } .game_list dl { padding:1rem 0; } .game_list .gameimg { padding-left:1rem; padding-right:1rem; } .game_ranklist .gameinfo { padding-right:1rem; } .game_ranklist .gamenumber { width:2rem; font-size:2rem; } .game_ranklist .gamename { font-size:1.6rem; } .game_ranklist .gameimg, .game_ranklist .gameimg img { width:6rem; height:6rem; padding-left:0; } .game_ranklist .gamemeta { padding-right:4.2rem; } .game_ranklist .btn-border3 { width:4rem; height:2rem; line-height:2rem; } .maintenance_note .dropdown b { width:22%; } .maintenance_note .dropdown span { width:77%; } .appointment-form .btns2 .btn { padding:1.4rem 2.4rem; margin:0 1rem; } .conments_box .fl { width:55%; margin-bottom:.5rem; } .imgload-pic img { width:7rem; height:7rem; margin-right:.8rem; } .comments-list .avatar { margin-right:1rem; } .comments-list .username { font-size:1.4rem; } .comments-list dl { padding: 1.2rem 1rem; } .comments-list .con { font-size:1.2rem; } .area-selbox li { width:20%; } .map-info .btn { margin:0 .3rem; } .cards_box2 { min-height:31rem; } }