/* stone web public */ @charset "utf-8"; html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, pre, a, big, cite, code, del, em, img, q, s, samp, small, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, canvas, footer, header, menu, nav, section, summary, time, mark, audio, video, p { border: none; margin: 0; padding: 0; outline: 0; -webkit-overflow-scrolling: touch } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, iframe { display: block } fieldset, img { max-width: 100%; width: auto; height: auto; border: 0; vertical-align: middle } address, caption, cite, code, dfn, em, var, i { font-weight: normal; font-style: normal } ol, ul, dl, li, dt, dd { list-style: none } h1, h2, h3, h4, h5, h6, button, input, select, textarea { font-size: 100%; font-weight: normal } q:before, q:after { content: '' } abbr, acronym { border: 0 } input, textarea { outline: none } input:focus, textarea:focus { outline: none } ul:after, dl:after { content: ""; display: block; height: 0; clear: both; visibility: hidden; overflow: hidden } html.mic, html.mic body { width: 100%; height: 100%; overflow: hidden } body { font: 14px/1.5 'Microsoft YaHei', Helvetica, Arial, sans-serif; outline: none; background-color: #FFF; color: #666; min-width: 1280px; -webkit-text-size-adjust: none } img { image-rendering: -webkit-optimize-contrast; image-rendering: crisp-edges; } a { color: #333; text-decoration: none; outline: none; } a:hover { color: #203cb6; outline: none } .lt, .fl_left { float: left } .rt, .fl_right { float: right } .clear { clear: both; overflow: hidden; height: 0 } .clearFix { zoom: 1 } .clfix:after, .clearFix:after { content: ""; display: block; height: 0; clear: both; visibility: hidden; overflow: hidden } * html .clfix { height: 1% } *+html .clfix { min-height: 1px } .both { clear: both; overflow: hidden; height: 2em } .box { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box } .transi { transition: all .5s; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s } .opaci { filter: alpha(opacity=0); opacity: 0 } .wrap, .container { width: 80%; max-width: 1440px; min-width: 1100px; margin: 0 auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .transi, #web-Header, #Header, .nav ul, .leader-desc { transition: all .3s; -webkit-transition: all .3s } .profile-list .img-box img, .support-tab .tabNav a, .plan-list li a, .product-list .img-box img, .jr-case-list .case-img img, .related-plan li a, .related-plan li img, #grid-pubu li .imgholder img, .shops-list .case-img img { transition: all .5s; -webkit-transition: all .5s } .ui-scale { overflow: hidden } .ui-scale img { transition: all .5s; -webkit-transition: all .5s } .ui-scale:hover img { transform: scale(1.1); -webkit-transform: scale(1.1) } #web-Header { height: 80px; width: 100%; position: fixed; background: #FFF; z-index: 10000 } #web-Header.scrolled {} #Header { height: 80px; width: 100%; position: relative; top: 0px; background: #203cb6; z-index: 10000; overflow: visible !important; } #Header.navFixed { /* position:fixed; */ /* top:0px; */ /* left:0px; */ /* height:78px; */ /* box-shadow:0 4px 8px rgba(0,0,0,.1); */ } #Header .wrapper { position: relative; width: 84%; height: 100%; margin: 0px auto; min-width: 1100px; z-index: 990; } #Header .logo { float: left; width: 168px; height: 100%; display: table } #Header .logo a { display: block; width: 100%; height: 100%; display: table-cell; vertical-align: middle } #Header .menu { float: left; height: 100%; position: absolute; z-index: 1000; left: 50%; margin-left: -370px; } #Header .nav { height: 100%; float: left; padding-right: 100px; } #Header .nav ul { width: 100%; height: 60px; margin-top: 18px; } #Header .nav li { display: block; height: 60px; float: left; position: relative; padding: 0px 25px; } #Header .nav li a.one { display: block; height: 54px; line-height: 30px; font-size: 16px; position: relative; transition: all .5s; -webkit-transition: all .5s; margin-top: 8px; color: #fff; } #Header .nav li a.one em { display: block; width: 0%; height: 3px; position: absolute; bottom: 0px; left: 50%; background: #fff; } #Header .nav li a.one:hover em, #Header .nav li.current a.one em { width: 64px; margin-left: -32px; } #Header .nav li.current a.one { color: #fff; } #Header .subnav { position: absolute; top: 60px; left: 50%; padding: 20px 0px; transition: all .3s; -webkit-transition: all .3s; display: none } #Header .subnav.normal { width: 205px; height: auto; left: 0% } #Header .subnav.work { /* width:760px; */ /* height:auto; */ /* position:fixed; */ /* top:108px; */ /* left:50%; */ /* margin-left:-360px; */ /* text-align:center; */ } #Header .subnav.scheme { /* width:980px; */ /* height:auto; */ /* position:fixed; */ /* top: 80px; */ /* left:50%; */ /* margin-left:-340px; */ } #Header .subnav dl { height: 100%; float: left } #Header .subnav dl.product { margin: 0px 20px; float: left; text-align: left } #Header .subnav dl.plan { margin: 0px 60px; } #Header .subnav.normal dl { width: 100% } #Header .subnav.normal dd { padding: 3px 25px; } #Header .subnav dt { display: block; height: 30px; line-height: 28px; font-size: 20px; color: #203cb6; margin-bottom: 15px; padding-top: 10px; } #Header .subnav dd { display: block; height: 28px; line-height: 28px; text-align: left; margin-bottom: 8px; } #Header .subnav dd a { height: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block; transition: all .5s; -webkit-transition: all .5s } #Header .subnav dd a:hover { color: #203cb6; } #Header .stock { height: 60px; width: 170px; position: absolute; top: 50%; right: 0px; text-align: right; margin-top: -30px } #Header .reg_stock { display: block; color: #fff; line-height: 30px; position: relative; top: 15px; } #Header .reg_text { position: absolute; bottom: 0%; right: 0px; height: 30px; line-height: 30px } #Header .reg_text a { color: #666; font-size: 14px } #Header .submenu { height: 135px; width: 100%; position: absolute; top: 80px; left: 0px; z-index: 100; background: #f7f9fc; display: none } #Header .menuBtn { width: 40px; height: 40px; position: absolute; right: 0px; top: 50%; margin-top: -20px; display: none } #Header .menuBtn i { display: block; width: 70%; height: 3px; position: absolute; right: 0px; background: #454545; } #Header .menuBtn i:nth-child(1) { top: 10px; } #Header .menuBtn i:nth-child(2) { top: 50%; margin-top: -2px; } #Header .menuBtn i:nth-child(3) { bottom: 10px; } #Header.navFixed .nav ul { margin-top: 18px } #Header.navFixed .submenu { top: 78px } #Header.navFixed .subnav.work { /* top:78px; */ } #Header.navFixed .subnav.scheme { /* top:78px; */ } .icon_content { position: fixed; top: 46%; right: 0px; z-index: 999; margin-top: -100px; display: block } .icon_aBlock { position: relative; display: block; width: 48px; height: 48px; background-color: #b5b5b5; margin-bottom: 2px } .icon_aBlock:hover { background-color: #565c72 } .icon_aBlock.a1 { background-image: url(../images/b4_2.png); height: 0 } .icon_aBlock.a2 { background-image: url(../images/b4_1.png) } .icon_aBlock.a3 { background-image: url(../images/b4_3.png) } .icon_aBlock.a4 { background-image: url(../images/b4_4.png) } #Footer { position: relative; width: 100%; background: #62646b; min-width: 960px; height: auto } #canvas { position: absolute; top: 0px; left: 0px; z-index: -1px; width: 100%; height: 100%; overflow: hidden } #Footer .foot-wrap { position: relative; width: 100%; z-index: 99; padding: 40px 0px; overflow: hidden } #Footer .foot-nav { position: relative; height: 100%; margin: 0px 35px; min-width: 960px; z-index: 990; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } #Footer .wrapper { position: relative; width: 84%; height: 100%; margin: 0px auto; min-width: 1200px; z-index: 990; -webkit-box-sizing: border-box; box-sizing: border-box; } #Footer .footer-menu { float: left; font-size: 14px } #Footer .footer-menu dl { color: #FFF; margin-right: 65px; float: left } #Footer .footer-menu dl a { color: #FFF; line-height: 24px } #Footer .footer-menu dt { margin-bottom: 10px } #Footer .f-logo { float: right; color: #fff; padding-top: 50px; position: absolute; right: 0; top: 80px; } #Footer .f-logo a { display: block; margin-bottom: 20px; text-align: center; } #Footer .QR-code { text-align: center } #Footer .foot-rights { position: relative; width: 100%; color: #FFF } #Footer .foot-copyright { position: relative; float: left; font-size: 14px; opacity: 0.7; } #Footer .foot-reserved { position: relative; float: right; font-size: 14px; opacity: 0.7; } #Footer .foot-reserved a { position: relative; font-size: 14px; color: #FFF } #goTopBtn { width: 40px; height: 40px; position: fixed; bottom: 100px; right: 5px; z-index: 1000; background: #000; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); opacity: 0.5; cursor: pointer; display: none } #goTopBtn a { display: block; width: 100%; height: 100%; background: url(../images/icon-top.png) no-repeat center } #goTopBtn.solute { bottom: 400px; position: absolute } .color-title { color: #203cb6 } .video-poster img, .desc-img img, .flotage img, .leader-img img, .jr-case-list .case-img img, .j-desc-img img { display: block } .wall-glay { /* background: #F5F5F5; */ } .wall-back { background: #F0F0F0 } .wrap-contnet img, .product-list img { max-width: 100% } .rwb_navpath { position: relative; width: 80%; height: 100%; margin: 0px auto; max-width: 1440px; min-width: 960px; height: 40px; line-height: 40px; padding: 6px 0px; font-size: 16px; background: #F0F0F0 } .padin { padding: 45px 0px } .clear20 { clear: both; overflow: hidden; height: 30px } .cont-box { width: 100%; margin: 0 auto; min-width: 1100px; max-width: 1440px; } .cont-box-news { width: 100%; margin: 0 auto; min-width: 800px; max-width: 1200px } .cont-box img, .cont-box-wrap img { max-width: 100% } .cont-box-wrap { width: 70%; margin: 0 auto; min-width: 700px; max-width: 1200px } .public-main { padding: 45px 0px 55px; /* background: #FFF; */ } .paroduct-page { width: 100%; min-width: 960px; height: 40px; line-height: 40px; padding: 10px 0px; font-size: 16px; background: #EEE; font-size: 14px; } .paroduct-page .wrap, .scraps .wrap { height: 100% } .paroduct-page a, .scraps a { float: left; display: inline-block; } .paroduct-page em, .scraps em { float: left; display: inline-block; padding: 0 8px; } .paroduct-page .select-prod { float: left; padding: 0px 10px; outline: none; height: 32px; line-height: 32px; margin-top: 5px; border: 0; } .page-relat { width: 100%; min-width: 960px; height: 40px; line-height: 40px; padding: 6px 0px; font-size: 16px; border-bottom: 1px solid #FFF; background: #FFF } .model-content { width: 62%; margin: 0 auto } .j-desc-img img { width: 100% } .pageBanner { width: 100%; height: auto; min-width: 960px } .pageBanner img { width: 100%; height: auto; display: block } .page-mark { width: 100%; height: 370px; display: none; } .about-mark { background: url(../images/ab/about-title.png) no-repeat center } .Sug-mark { background: url(../images/Investor/title.png) no-repeat center } .contact-mark { background: url(../images/contact-title.png) no-repeat center } .wrap-top { width: 100%; margin-bottom: 50px; text-align: center } .wrap-top h1 { font-size: 26px; text-align: left; position: relative; } .wrap-top span { text-transform: uppercase; color: #999; line-height: 26px; margin: 0px; display: block; width: 100%; margin-bottom: 5px; display: none; } .wrap-top em { display: block; width: 32px; height: 1px; background: #84c225; line-height: 20px; margin: 0px auto; display: none; } .lanmu-lane { width: 100%; margin-bottom: 40px } .lanmu-lane .lanmu-top { text-align: center; margin-bottom: 40px; font-size: 40px } .lanmu-lane .lanmu-infor { width: 100%; text-align: justify; line-height: 24px } #rightMenu { width: 150px; position: fixed; top: 260px; right: 0px; background: #FFF; z-index: 1000; box-shadow: 0 0 10px rgba(0, 0, 0, .5); filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000') } #rightMenu ul { width: 100%; padding: 0px 0px } #rightMenu li { height: 30px; line-height: 30px; display: block } #rightMenu li a { display: block; padding: 0 10px } #rightMenu li.current a { background: #203cb6; color: #FFF } #webbox { position: relative; width: 100%; z-index: 0; overflow: hidden; padding-top: 80px; } #webbox.padd { padding-top: 108px } #banner { width: 100%; height: auto; margin-bottom: 30px; position: relative } #banner ul { width: 100%; height: auto; position: relative } #banner li { width: 100%; height: auto; position: relative; top: 0px; left: 0px } #banner .wrap { display: table; height: 100% } #banner .wrap p { display: table-cell; width: 100%; height: 100%; vertical-align: middle } #banner li a { display: block; width: 100%; height: 100%; position: relative } #banner li img { width: 100% } #container { width: 100%; min-width: 960px; margin: 0px auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } #container .row-box { margin: 0px 20px; height: 100%; overflow: hidden } #container .row { margin: 0px -10px; margin-bottom: 30px; position: relative } #container .cow-desc { width: 50%; position: relative; display: inline-block; float: left } #container .rank-wrap, .rank-model { margin: 0 10px; position: relative } #container .rank-model { height: 50% } #container .etc-hover a, #container a.etc-hover { display: block; width: 100%; position: relative } #container .n-fly a.etc-hover { position: absolute; bottom: 0px; left: 0px } #container .desc-img { width: 100%; overflow: hidden } #container .desc-img img { width: 100%; height: auto; transition: all .5s; -webkit-transition: all .5s } #container .etc-wall { width: 100%; height: 100%; display: block; filter: alpha(opacity=0); opacity: 0; background: #000; position: absolute; top: 0px; left: 0px; transition: all .5s; -webkit-transition: all .5s } #container .desc-text { width: 100%; position: absolute; bottom: 34px; left: 0px; z-index: 100; color: #FFF; transition: all .5s; -webkit-transition: all .5s } #container .desc-text-top { font-size: 36px; padding: 0px 40px; line-height: 46px; margin-bottom: 10px } #container .desc-text-cont { padding: 0px 40px; opacity: 0; visibility: hidden; transform: translate(0px, 50%); -webkit-transform: translate(0px, 50%); transition: all .5s; -webkit-transition: all .5s } #container .rank-text h1 { font-size: 36px; display: block } #container .rank-text h2 { font-size: 30px; display: block } #container .under-text { padding: 0px 60px; position: absolute; top: 20px; left: 0px; z-index: 100; color: #FFF; transition: all .5s; -webkit-transition: all .5s } #container .under-text h1 { font-size: 45px; display: block } #container .under-text h2 { font-size: 36px; display: block } #container .etc-hover:hover .desc-img img { transform: scale(1.1); -webkit-transform: scale(1.1) } #container .etc-hover:hover .etc-wall { filter: alpha(opacity=70); opacity: 0.7 } #container .etc-hover:hover .desc-text { bottom: 45px !important } #container .etc-hover:hover .rank-text { bottom: 40px } #container .etc-hover:hover .under-text { top: 40px } #container .etc-hover:hover .desc-text-cont { opacity: 1; visibility: visible; transform: translate(0px, 0%); -webkit-transform: translate(0px, 0%); transition: all .5s; -webkit-transition: all .5s } #container .index-video { height: auto; position: relative } #container #tl_player { width: 100%; height: 100% } #container .video-poster { width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; z-index: 200 } #container .video-poster img { width: 100%; display: block; height: 100% } #container .video-poster p { width: 100%; height: 100%; display: block; position: absolute; top: 0px; left: 0px; filter: alpha(opacity=0); opacity: 0; background: #000; transition: all .5s; -webkit-transition: all .5s } #container .video-poster h1 { padding: 0 60px; font-size: 30px; position: absolute; bottom: 20px; left: 0px; color: #FFF } #container .video-poster .play { width: 81px; height: 81px; position: absolute; top: 50%; left: 50%; margin-top: -60px; margin-left: -40px; background: url(../images/play.png) no-repeat; cursor: pointer } #container .index-video:hover .video-poster p { filter: alpha(opacity=75); opacity: 0.7 } .subpage { border-bottom: 1px solid #C0C0C0; padding-bottom: 10px; margin-bottom: 40px } .sub-left, .sub-right { height: 27px; font-size: 18px } .sub-left em { display: block; float: left; width: 10px; height: 100%; margin-right: 5px; background: url(../images/ab/adder.png) no-repeat left center } .sub-left i { display: block; float: left; width: 10px; height: 100%; margin: 0px 5px; background: url(../images/ab/sNav_icon.png) no-repeat center } .sub-left a { display: block; float: left; font-size: 18px } .sub-right a { display: inline-block; margin-left: 10px; height: 27px; position: relative } .sub-right a.current i { display: block; width: 100%; height: 3px; position: absolute; bottom: -16px; left: 0px; background: #203cb6 } #container .about-company { margin-bottom: 25px } #container .about-company h1 { font-size: 26px; margin-bottom: 5px } #container .about-company p { font-size: 18px } #container .about-company em { font-size: 20px; color: #1f4396 } #container .details-module { text-align: justify; font-size: 16px; line-height: 30px; margin-bottom: 40px } #page-banner { width: 100%; position: relative; min-width: 1000px } #page-banner.server { height: 277px; line-height: 277px; text-align: center; margin-bottom: 40px; font-size: 30px; font-family: "SimSun" } #page-banner a { display: block; width: 100%; height: 100%; color: #333 } #page-banner.server a { background: url(../images/service/banner.jpg) no-repeat center } #page-banner img { display: block; width: 100% } #page-banner .bane-desc { width: 80%; height: 100%; position: absolute; top: 0px; left: 50%; margin-left: -40% } #page-banner .bane-con { width: 587px; position: absolute; bottom: 36px; left: -40px; background: rgba(0, 0, 0, .7); color: #FFF } #page-banner .bane-con h1 { display: block; padding: 20px 40px 0px; font-size: 36px; line-height: 40px } #page-banner .bane-con p { display: block; padding: 10px 40px 20px; font-size: 16px } .item-content { width: 100%; height: auto } .item-content .etc-picre { width: 49%; float: left; height: 822px; overflow: hidden } .item-content .etc-picre a { display: block; width: 100%; height: 100%; overflow: hidden; position: relative; color: #FFF } .item-content .etc-picre img { width: 100%; display: block } .item-content .etc-picre .item-desc { width: 100%; position: absolute; bottom: 50px; left: 0px } .item-content .etc-picre .item-desc h1 { font-size: 65px; margin: 0 40px; line-height: 70px } .item-content .etc-picre .item-desc h2 { font-size: 54px; margin: 0 40px } .index-news { padding: 40px 0px; background: #f0f0f0 } .index-news .warpw { margin: 0 35px } .i-news-lett { float: left; height: 100%; width: 28.25% } .i-news-top { margin-bottom: 20px; width: 100%; margin-bottom: 15px } .i-news-top h1 { display: block; font-size: 24px; font-weight: normal; margin-bottom: 18px } .i-news-top p { display: block; font-size: 20px; margin-bottom: 45px; height: 26px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap } .i-news-top i { display: block; width: 44px; height: 1px; border-bottom: 1px solid #666 } .i-news-text { line-height: 24px; text-align: justify; margin-bottom: 5px } .i-news-time { line-height: 24px; margin-bottom: 5px } .i-news-look { height: 28px } .i-news-look a { display: block; width: 70px; height: 26px; line-height: 26px; border: 1px solid #ccc; text-align: center; transition: all .5s; -webkit-transition: all .5s } .i-news-look a:hover { border: 1px solid #203cb6 } .i-news-img { float: left; width: 31%; height: 248px; margin-left: 45px; overflow: hidden; text-align: center } .i-news-img ul, .i-news-img li, .i-news-img a { width: 100%; height: 100% } .i-news-img a { display: block } .i-news-list { float: right; width: 33%; height: 248px } .i-news-list ul { width: 100% } .i-news-list li { height: 52px; padding: 15px 0px; border-bottom: 1px solid #ccc } .i-news-list li a { display: block; cursor: pointer } .i-news-list li p { display: block; font-size: 16px; margin-bottom: 6px; height: 24px; line-height: 24px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap } .container { position: relative; box-sizing: border-box; background: #FFF } .container .wrap-box { padding: 40px 0px 30px } .container .top-box { width: 100%; height: 438px; margin-bottom: 45px } .container .big-pictrue { float: left; width: 30%; height: 412px; overflow: hidden } .container .big-pictrue a { display: block; width: 100%; height: 100%; position: relative } .container .big-pictrue img { display: block; width: 100%; height: auto; transition: all .5s; -webkit-transition: all .5s } .container .big-pictrue i { display: block; width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; background: url(../images/shade-big.png) no-repeat; background-size: cover } .container .big-pictrue a:hover img { transform: scale(1.1); -webkit-transform: scale(1.1) } .container .pictrue-right { margin-left: 30%; height: 100% } .container .etc-list { width: 100%; height: 100% } .container .etc-list ul { width: 100% } .container .etc-list li { width: 50%; height: 100%; display: inline-block; float: left } .container .etc-list .li-box { margin-left: 67px } .container .etc-list-box { width: 100%; margin-bottom: 40px } .container .etc-list-box ul { margin-left: -40px } .container .etc-list-box li { width: 33.33%; float: left; display: inline-block } .container .etc-list-box .li-box { margin-left: 40px } .container .wrap-box .li-box a { width: 100%; height: 100%; display: block } .container .wrap-box .img-war { width: 100%; position: relative; overflow: hidden } .container .wrap-box .img-war img { display: block; width: 100%; transition: all .5s; -webkit-transition: all .5s } .container .wrap-box .img-war i { display: block; width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; background: url(../images/shade-short.png) no-repeat; background-size: cover } .container .wrap-box .etc-name { margin: 10px 20px; height: 56px; line-height: 28px; font-size: 21px; overflow: hidden } .container .wrap-box .etc-desc { padding: 0px 0px 20px; margin: 0 20px; height: 102px; line-height: 24px; font-size: 16px; color: #666; overflow: hidden } .container .wrap-box .etc-botom { display: none; height: 25px; line-height: 25px; background: url(../images/yz.png) no-repeat center; text-align: right } .container .wrap-box .etc-botom span { display: inline-block; background: url(../images/icon-ready.png) no-repeat left center; padding-left: 20px; margin-right: 10px; color: #666 } .container .wrap-box .etc-botom em { display: inline-block; background: url(../images/icon-xin.png) no-repeat left center; padding-left: 20px; margin-right: 20px; color: #666 } .container .wrap-box .li-box a:hover .img-war img { transform: scale(1.1); -webkit-transform: scale(1.1) } .wrap-contnet { position: relative; width: 100%; min-width: 960px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .index-profile { padding: 40px 0px 45px; background: #203cb6 } .profile-title { padding-bottom: 45px; margin: 0 auto } .profile-title .text-title { font-size: 37px; color: #FFF; text-align: center; margin-bottom: 15px } .profile-title .text-infor { color: #FFF; font-size: 16px; text-align: justify; line-height: 27px } .profile-list { position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .profile-list .w-line { width: 100%; height: 1px; position: absolute; left: 0px } .profile-list .line-top { top: 0px; border-top: 1px solid #FFF } .profile-list .line-bot { bottom: 0px; border-bottom: 1px solid #FFF } .profile-wrap { position: relative; overflow: hidden } .profile-list ul { margin-left: -65px; height: 100% } .etcInfo-list ul { margin-left: -85px !important; height: 100% } .profile-list li { width: 33.33%; float: left; height: 100%; position: relative } .etcInfo-list li { width: 50%; float: left; height: 100%; position: relative } .profile-list li .profile-cont { margin-left: 65px; padding: 25px 0px } .etcInfo-list li .profile-cont { margin-left: 85px !important; padding: 25px 0px } .profile-list li a { display: block; width: 100%; height: 100%; color: #FFF } .profile-list li.lt { border-right: 1px solid #FFF } .profile-list li.rt { border-left: 1px solid #FFF } .profile-list .img-box { margin-bottom: 20px; width: 100%; overflow: hidden } .profile-list .img-box img { width: 100%; display: block } .profile-list .item-text { margin: 0px 35px 0px 35px; padding: 0px 0px 2px 0px; text-align: center; color: #FFF } .profile-list .item-text h1 { font-size: 32px } .profile-list .item-text p { font-size: 20px; display: block; margin-bottom: 20px } .profile-list .item-text span { display: block; width: 52px; height: 52px; margin: 0 auto; background: url(../images/icon-more.png) no-repeat } .profile-list li a:hover img { transform: scale(1.1); -webkit-transform: scale(1.1) } .profile-list em { display: block; width: 20px; height: 100%; border-left: 1px solid #FFF; border-right: 1px solid #FFF; border-top: 1px solid #203cb6; border-bottom: 1px solid #203cb6; background: #203cb6; position: absolute; top: -1px; left: 20px } .etcInfo-list em { width: 30px !important; left: 26px !important } .page-column-title { font-size: 26px; margin-bottom: 10px; color: #203cb6 } .future-video { padding: 40px 0px 40px; margin-bottom: 40px } .future-video .text-title { font-size: 36px; color: #203cb6; margin-bottom: 30px; text-align: center } .future-video .text-infor { width: 90%; line-height: 24px; margin: 0px auto 30px; text-align: justify } .future-video .text-infor p { margin-bottom: 10px } .future-video .media-box { width: 778px; height: 410px; position: relative; margin: 0 auto; background: #203cb6 } .future-video #media-video { width: 100%; height: 100%; position: relative } .future-video .video-poster { width: 100%; height: 100%; position: absolute; top: 0px; left: 0px } .future-video #play { width: 81px; height: 81px; position: absolute; top: 50%; left: 50%; margin-top: -40px; margin-left: -40px; background: url(../images/play.png) no-repeat; cursor: pointer; display: none } .page-column { width: 100%; height: 30px; position: relative; margin-bottom: 40px } .page-column i { display: block; width: 3px; height: 22px; float: left; margin-top: 5px; margin-right: 10px; background: #84c225; display: none; } .page-column span { display: block; float: left; font-size: 26px; line-height: 30px; font-weight: bold; } .page-column em { color: #999; text-transform: uppercase; float: left; margin-left: 10px; margin-top: 10px; font-family: Arial } .page-column-top { width: 100%; height: 30px; font-size: 24px; text-align: center; color: #203cb6; position: relative; margin-bottom: 40px; overflow: hidden } .stock-wrap { width: 75% } .stock-wrap img { width: 100% } .stock-right { float: right; width: 20%; background: #e6cc99 } .stock-right ul { padding: 35px } .stock-right li { font-size: 25px; line-height: 40px } .out-top { width: 100%; height: 60px; position: absolute; top: -60px; left: 0px; background: #FFF } .detail-top { font-size: 40px; width: 100%; text-align: left; margin-bottom: 45px } .share-model { height: 45px; border-bottom: 1px solid #333 } .share-model .news-titme { float: left; font-size: 22px; background: #FFF; padding-right: 15px; margin-top: 13px } .share-model #share { float: right } .rela-nav { padding: 18px 0px; margin-bottom: 20px } .detail-infor, .jj-desc .jj-desc-infor { text-align: justify; line-height: 24px; font-size: 16px; margin-bottom: 45px } .detail-infor p, .jj-desc .jj-desc-infor p { margin-bottom: 5px } .detail-infor img, .jj-desc .jj-desc-infor img { max-width: 100% } .detail-infor table { border-collapse: collapse } .detail-infor table td { border: 1px solid #b5b1b1; display: table-cell; vertical-align: inherit; border-collapse: collapse } .detail_ul dl { border: 1px solid #aaa; margin-bottom: 30px } .detail_ul dd { border-bottom: 1px solid #aaa; padding-left: 10px; line-height: 26px; height: 26px; text-align: justify } .detail_ul dd span { display: block; width: 49%; float: left; border-right: 1px solid #aaa } .detail_ul dd span:nth-child(2) { border-right: none; padding-left: 10px } .detail_ul dd:last-child { border-bottom: none } .jj-list { position: relative; width: 100% } .jj-list .w-line { width: 100%; height: 1px; position: absolute; left: 0px; background: #FFF } .jj-list .line-top { top: 0px } .jj-list .line-bot { bottom: 0px } .jj-list .jj-ul-box { width: 100%; overflow: hidden; background: #203cb6 } .jj-list .ul-list { margin-left: -70px; height: 100% } .jj-list .ul-list li { width: 33.33%; height: 100%; float: left; position: relative; display: inline-block } .jj-list .ul-list .bor { display: block; width: 30px; height: 100%; position: absolute; left: 20px; top: 0px; background: #203cb6; border-left: 1px solid #FFF; border-right: 1px solid #FFF; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .jj-list .ul-list .jj-box { padding: 20px 0px; margin-left: 70px } .jj-list .ul-list .jj-box a { display: block; width: 100%; height: 100% } .jj-list .img-box { margin-bottom: 20px; width: 100%; overflow: hidden } .jj-list .img-box img { width: 100%; height: auto; display: block; transition: all .5s; -webkit-transition: all .5s } .jj-list .padd-left { padding: 28px 35px 0px 0px } .jj-list .padd-right { padding: 28px 0px 0px 35px } .jj-list .item-text { margin: 0px 20px 0px 20px; padding-bottom: 10px; text-align: center; color: #FFF } .jj-list .item-text h1 { font-size: 28px; height: 36px; line-height: 36px; overflow: hidden; margin-bottom: 5px; text-overflow: ellipsis; white-space: nowrap } .jj-list .item-text p { font-size: 20px; display: block; margin-bottom: 20px } .jj-list .item-text span { display: block; width: 42px; height: 42px; margin: 0 auto; background: url(../images/icon-more.png) no-repeat } .jj-list .ul-list .jj-box:hover .img-box img { transform: scale(1.1); -webkit-transform: scale(1.1) } .jj-desc { padding: 40px 0px; margin-bottom: 40px } .jj-desc .jj-desc-top { font-size: 36px; text-align: center; margin-bottom: 30px } .jj-product { margin-bottom: 40px } .jj-product li { margin-bottom: 40px } .jj-product-infor { width: 56%; padding-top: 30px; text-align: justify } .jj-product-infor h1 { display: block; height: 50px; line-height: 50px; margin-bottom: 30px; font-size: 30px } .jj-product-infor p { display: block; font-size: 16px; line-height: 24px; margin-bottom: 20px; margin-bottom: 30px } .jj-product-infor a { display: block; width: 200px; height: 32px; line-height: 32px; text-align: center; color: #333; background: #CCC; transition: all .5s; -webkit-transition: all .5s } .jj-product-infor a:hover { background: #203cb6; color: #FFF; border-radius: 3px } .jj-product img, .jr-case-list .case-img img { display: block; width: 100% } .jj-product-img { width: 38% } .flotage { width: 100%; height: 490px; position: RELATIVE; top: 0px; left: 0px; z-index: -1; overflow: hidden } .flotage img { width: 100% } .about-proflie { background: url(../images/ab/banner33.jpg) no-repeat 50% 0px } .about-proflie-noFixed { background: url(../images/ab/banner33.jpg) no-repeat center top } .innovata { background: url(../images/ab/banner2.jpg) no-repeat 50% 78px fixed } .three-rows { width: 100% } .three-rows ul { margin-left: -20px } .three-rows li { width: 33.33%; float: left; display: inline-block; margin-bottom: 40px } .three-rows li a { display: block; width: 100% } .three-rows li a.fc-wall { background: #203cb6; color: #FFF } .three-rows .rows-cont { margin-left: 20px } .three-rows .rows-img { width: 100%; margin-bottom: 15px; overflow: hidden } .three-rows .rows-img img { display: block; width: 100% } .three-rows .row-cont { line-height: 26px } .three-rows .row-cont h1 { font-size: 30px; line-height: 48px; margin-bottom: 10px } .three-rows .row-desc { display: block; height: 78px; color: #454545 } .three-rows .fc-cont { padding: 0px 15px 15px; text-align: left; font-size: 20px; line-height: 26px } .three-rows .fc-table { width: 100%; height: 52px; display: table } .three-rows .table-cell { width: 100%; height: 100%; display: table-cell; vertical-align: middle } .course, .kernel { width: 100%; font-size: 16px; line-height: 30px; margin-bottom: 45px } .course dl { width: 100%; margin-bottom: 30px } .course dt { float: left; height: 100%; width: 100px } .course dd { margin-left: 110px } .kernel, .strength { border-top: 1px dashed #203cb6 } .kernel dl { padding: 35px 0px; border-bottom: 1px dashed #203cb6 } .kernel dt { float: left; height: 100%; width: 165px; text-align: center; display: block; font-size: 20px; color: #203cb6 } .kernel dd { margin-left: 170px } .strength { line-height: 30px; text-align: justify; margin-bottom: 45px; font-size: 16px; padding-top: 40px } .strength img { max-width: 100% } .leader { width: 100%; overflow: hidden } .leader ul { margin-left: -50px } .leader li { float: left; width: 33.33%; margin-bottom: 30px } .leader .leader-box { margin-left: 50px; border-bottom: 1px solid #FFF; transition: all .5s; -webkit-transition: all .5s } .leader .leader-img { width: 100%; margin-bottom: 20px; overflow: hidden } .leader .leader-desc { line-height: 26px; height: 160px; font-size: 16px; text-align: justify; overflow: hidden } .leader .leader-box:hover { border-bottom: 1px solid #203cb6 } .select-news { width: 202px; height: 28px; border: 1px solid #808080; position: relative; } .ui-text { float: left; width: 160px; height: 28px; line-height: 28px; outline: 0px; border: 0px; padding: 0px 5px } .ui-button { float: right; width: 32px; height: 28px; border: 0px; border-left: 1px solid #999; background: url(../images/ab/find.png) no-repeat center; cursor: pointer } .select-news ul { width: 100%; height: 32px; position: absolute; top: 50px; left: 0px; font-size: 18px; } .select-news li { margin-right: 12px; line-height: 32px; display: inline-block; float: left } .select-news li.at { color: Blue } #grid-pubu { position: relative; width: 100%; margin: 0 auto 25px; padding-bottom: 10px; padding-top: 20px; } #grid-pubu ul { width: 100% } #grid-pubu li { width: 100%; height: 175px; padding: 0px 0px 30px 0px; margin-bottom: 30px; display: block; border-bottom: 1px solid #666 } #grid-pubu li a { display: block; height: 175px } #grid-pubu li .imgholder { width: 262px; height: 100%; float: left; overflow: hidden } #grid-pubu li .imgholder img { max-width: 100%; height: auto; background: #ccc; display: block } #grid-pubu li .news-grid { margin-left: 285px; height: 100% } #grid-pubu li .news-grid h1 { font-size: 26px; color: #333; line-height: 32px; height: 64px; overflow: hidden; margin-bottom: 5px; overflow: hidden } #grid-pubu li .news-grid p { display: block; height: 48px; overflow: hidden; color: #999; margin-bottom: 10px } #grid-pubu li .news-grid span { display: block; font-size: 14px; color: #666 } #grid-pubu li .news-grid em { display: block; font-size: 14px; color: #203cb6 } #grid-pubu li a:hover img { transform: scale(1.1); -webkit-transform: scale(1.1) } #grid-pubu li a:hover h1 { color: #203cb6 } .news-detail-top { font-size: 36px; width: 100%; margin-bottom: 45px; line-height: 47px } .QA-cont, .product-list { width: 100% } .QA-left { width: 50%; line-height: 24px; text-align: justify } .QA-left p { margin-bottom: 5px } .QA-right { width: 48% } .QA-right img { width: 100% } .service-tab { width: 100%; background: #FFF } .service-tab .tabNav { width: 100%; height: 70px; border-bottom: 1px solid #caccc6 } .service-tab .tabNav a { display: block; height: 100%; line-height: 70px; text-align: center; width: 16.66%; float: left; font-size: 18px; position: relative } .service-tab .tabNav i { display: block; height: 4px; width: 0%; position: absolute; bottom: -1px; left: 50%; background: #84c225 } .service-tab .tabNav a.current i { width: 100%; left: 0% } .service-tab .tabCont { width: 100% } .service-tab .layer { width: 100% } .service-tab .layer dl { width: 100%; margin-bottom: 1px } .service-tab .layer dt { height: 65px; padding: 0 50px; line-height: 65px; font-size: 18px; background: #dbdbdb; cursor: pointer } .service-tab .layer dt span { margin-right: 50px; float: left } .service-tab .layer dt em { margin-right: 50px; float: left } .service-tab .layer dt i { float: right; color: #203cb6 } .service-tab .layer dd { padding: 30px 50px; display: none } .service-tab .QA-question { border-bottom: 1px solid #ccc; padding-bottom: 30px; margin-bottom: 30px } .service-tab .QA-ren { width: 220px } .service-tab .QA-ren h1 { color: #203cb6; font-size: 20px } .service-tab .QA-ren h2 { font-size: 16px; margin-bottom: 15px } .service-tab .QA-ren p { font-size: 14px } .service-tab .QA-puzi { margin-left: 245px; line-height: 26px } .service-list { width: 100% } .service-list ul { width: 100% } .service-list li { width: 25%; float: left; margin: 0px 0px 40px; display: inline-block; text-align: center; height: 270px } .service-list .cont-wox { margin: 0 20px; line-height: 26px } .service-list li h2 { color: #454545; font-size: 20px; margin-bottom: 10px } .service-list li p { display: block; color: #777 } .network-title { font-size: 23px; margin-bottom: 20px; padding-bottom: 0px; border-bottom: 1px solid #dcdcdc; color: #203cb6; } .network-title.no-bor { border-bottom: none; padding-bottom: 0px; margin-bottom: 10px; } .network-list, .sales, .layer { width: 100% } .network-list ul, .sales ul { margin: 0px -35px } .network-list ul li, .sales ul li { width: 33.33%; float: left; display: inline-block; margin-bottom: 35px } .network-list dl, .sales dl { margin: 0px 35px; line-height: 26px; min-height: 180px; overflow: hidden } .network-list dt, .sales dt { color: #203cb6; font-weight: 700; } .network-list dd, .sales dd { font-size: 14px; } .network-list li.code { width: 420px; } .network-list li.code dt { display: inline-block; text-align: center; } .tact-info { padding-top: 6%; } .info-text { line-height: 30px; } .marg { margin-bottom: 40px; } .support-tab .tabNav { width: 100%; height: 40px; text-align: center; margin-bottom: 40px } .support-tab .tabNav a { display: inline-block; margin: 0 10px; padding: 0 20px; height: 38px; line-height: 38px; border: 1px solid #989997; font-size: 18px; color: #333 } .support-tab .tabNav a.current { border: 1px solid #203cb6; color: #FFF; background: #203cb6 } .support-tab .support-list ul { margin-left: -70px } .support-tab .support-list li { width: 33.33%; float: left; margin: 0px 0px 40px; display: inline-block; text-align: center } .support-tab .support-list .cont-wox { margin-left: 70px; line-height: 26px } .support-tab .support-list li h1 { margin-bottom: 10px } .support-tab .support-list li h2 { color: #454545; font-size: 24px; margin-bottom: 10px } .support-tab .support-list li p { display: block } .product-banner { width: 100%; height: 612px; background: url(../images/prod/bannerr.jpg) no-repeat center } .product-wall { padding: 35px 0px; background: #FFF } .name-list { width: 100%; text-align: center } .name-list dl { display: block; margin: 0 4%; float: left; width: 17%; } .name-list dl.plan { margin: 0 18px } .name-list dt { color: #203cb6; font-size: 24px; margin-bottom: 10px; cursor: default } .name-list dd { display: block; height: 26px; line-height: 26px } .product-type { width: 100%; margin-bottom: 40px; text-align: center } .product-type dl { width: auto; min-height: 32px; margin: 0 auto; display: inline-block } .product-type dd { margin-right: 60px; float: left; display: inline-block } .product-type dd a { display: block; height: 30px; line-height: 20px; border-bottom: 1px solid #FFF; color: #999; position: relative } .product-type dd a i { display: block; width: 0px; height: 0px; border: 10px solid transparent; border-top: 10px solid #203cb6; position: absolute; bottom: -20px; left: 50%; margin-left: -10px; visibility: hidden } .product-type dd a.current { border-bottom: 1px solid #203cb6; color: #203cb6 } .product-type dd a.current i { visibility: visible } #product-picture { float: left; position: relative; text-align: center; width: 533px; height: auto; padding-bottom: 29px; position: relative } #product-picture ul { width: 100%; height: 390px; position: relative; margin-bottom: 10px; border: 1px solid #DDD } #product-picture li { width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; text-align: center; display: none } #product-picture li img { max-width: 100%; height: auto; max-height: 440px } #product-picture .butom { width: 100%; height: 62px } #product-picture .butom span { display: block; width: 83px; height: 60px; display: inline-block; margin: 0 5px; cursor: pointer; border: 1px solid #CCC; overflow: hidden } #product-picture .butom img { display: block; width: 100%; height: 100% } #product-picture .butom span.current { border: 1px solid #203cb6 } .product-infor { margin-left: 635px; padding-top: 75px } .product-infor .product-name { font-size: 40px; line-height: 48px; margin-bottom: 10px; color: #203cb6 } .product-infor .product-text { font-size: 36px; line-height: 45px; margin-bottom: 40px; color: #ccc } .product-infor .product-desc { line-height: 26px; /* margin-bottom: 40px; */ } .product-detail { padding-bottom: 40px; } .product-detail .detail-nav { height: 50px; border-top: 1px solid #203cb6; border-bottom: 1px solid #203cb6; background: #203cb6 } .product-detail .tannav { height: 100%; min-width: 700px; font-size: 20px; text-align: center } .product-detail .tannav a { display: inline-block; width: 280px; line-height: 50px; text-align: center; color: #FFF } .product-detail .tannav a.current { background: #FFF; color: #203cb6 } .product-detail .layer { width: 100%; padding: 0px 0% 0px; display: none } .product-detail .layer td { padding: 10px 20px; vertical-align: middle; background: #fafafa } .product-detail .layer img { max-width: 100% } .trait-list { margin-bottom: 40px } .trait-list dl { width: 100%; margin-bottom: 60px } .trait-list dt { width: 45% } .trait-list dd { width: 28%; text-align: center } .trait-list dd img { max-width: 100% } .trait-list dt h1 { height: 45px; line-height: 40px; display: block; position: relative; font-size: 32px; padding-left: 45px; background: url(../images/prod/icon-wall.png) no-repeat 0px 6px; margin-bottom: 10px; margin-top: 20px } .trait-list .trait-desc { padding-left: 45px; text-align: justify } .product-detail .gn-param { padding-top: 45px } .product-detail .gn-param ul { margin-left: -30px } .product-detail .gn-param li { float: left; width: 12.5%; height: 204px; display: inline-block; text-align: center; margin-bottom: 20px } .product-detail .gn-param .gn-box { margin-left: 30px } .product-detail .gn-param .gn-box h1 { display: block; margin-bottom: 10px } .product-detail .gn-param .gn-box p { height: 72px; line-height: 24px; overflow: hidden } .product-detail .param-top { width: 100%; line-height: 60px; font-size: 26px; color: #000 } .product-detail .layer dl.list { width: 100%; margin-bottom: 10px } .product-detail .layer dl.list dt { width: 220px; float: left; padding: 0px 40px 0px 10px } .product-detail .layer dl.list dd { margin-left: 260px; padding: 0px 0px 0px 10px } .product-detail .param-list { margin-bottom: 20px } .product-detail .param-list h1 { width: 100%; font-size: 22px; padding: 5px 0px; border-bottom: 1px solid #999; border-top: 1px solid #999; margin-bottom: 20px } .product-detail .param-list dl.list dt { font-size: 20px } .product-detail .trait-list, .product-detail .param-list, .gn-param { width: 100% } .shops-list { width: 100%; overflow: hidden; padding: 20px 20px } .shops-list ul { margin-left: -15px } .shops-list li { width: 25%; float: left; display: inline } .shops-list li a { display: block; padding: 10px } .shops-list .case-cont { margin-left: 20px; text-align: center; transition: all .5s; -webkit-transition: all .5s } .shops-list .box-cont { margin-left: 15px; text-align: center; border-radius: 3px; background: #FFF; box-shadow: 0px 0px 10px RGBA(0, 0, 0, .5) } .shops-list .case-img { width: 100%; overflow: hidden; margin-bottom: 15px } .shops-list .case-img img { display: block; width: 100%; height: auto } .shops-list .case-name { width: 100% } .shops-list .case-name h1 { display: block; font-size: 20px; margin-bottom: 10px; line-height: 26px; height: 52px; overflow: hidden; text-align: left } .shops-list .case-name p { display: block; line-height: 24px; height: 48px; font-size: 14px; overflow: hidden; color: #666; margin-bottom: 10px; text-align: left } .shops-list .case-name span { display: block; line-height: 24px; color: #203cb6; visibility: hidden; opacity: 0; transform: translateY(20px); -webkit-transform: translateY(20px); transition: all .5s; -webkit-transition: all .5s } .shops-list li:hover .case-cont { border-radius: 3px; background: #FFF; box-shadow: 0px 0px 10px RGBA(0, 0, 0, .5) } .shops-list li:hover .case-img img { transform: scale(1.1); -webkit-transform: scale(1.1) } .shops-list li:hover .case-name span { visibility: visible; opacity: 1; transform: none; -webkit-transform: none } .j-case-text { margin-bottom: 30px; text-align: justify; line-height: 26px } .j-referral { border-bottom: 1px solid #999; padding-bottom: 70px; margin-bottom: 70px } .jr-top-title { margin-bottom: 35px; margin-top: -30px } .title-a { font-size: 22px } .title-big { font-size: 2.1em } .title-b { font-size: 48px; line-height: 50px; display: inline-block; color: #203cb6; padding-right: 40px; /* background: url(../images/jeck/icon-arrow.png) no-repeat right bottom; */ font-size: 26px; color: #203cb6; position: relative; margin-bottom: 30px; } .jr-top { height: 60px; line-height: 60px; margin-bottom: 40px; font-size: 36px; color: #203cb6; /* padding-left: 70px; */ /* background: url(../images/jeck/ivon.png) no-repeat left center; */ font-size: 26px; color: #203cb6; position: relative; margin-bottom: 30px; } .jr-desc { width: 100%; text-align: justify } .jr-desc-tb { width: 80%; text-align: center; margin-left: 10%; position: relative } .jr-media { width: 40%; height: auto; background: #000; position: relative } .jr-media .video-poster { width: 100%; height: 100%; position: absolute; top: 0px; left: 0px } .jr-media img { display: block; width: 100% } .jr-media #mediaPlay { width: 81px; height: 81px; position: absolute; top: 50%; left: 50%; margin-top: -40px; margin-left: -40px; background: url(../images/play.png) no-repeat; cursor: pointer } .jr-media #media-video { width: 100%; height: 100% } .plan-list ul { margin-left: -25px } .plan-list li { display: inline-block; width: 33.33%; margin-bottom: 30px; float: left } .plan-list li a { display: block; width: 100%; background: #203cb6; color: #FFF } .plan-list li img { display: block; width: 100%; transition: all .5s; -webkit-transition: all .5s } .plan-list .jr-box { margin-left: 25px; min-height: 360px } .plan-list .img-box { width: 100%; overflow: hidden } .plan-list .jr-profile { padding: 15px 30px; border: 1px solid #203cb6 } .plan-list .jr-profile h1 { font-size: 26px; line-height: 32px; height: 64px; margin-bottom: 10px; overflow: hidden } .plan-list .jr-profile span { color: #00ffff } .plan-list li a:hover { background: #FFF; color: #203cb6 } .plan-list li a:hover img { transform: scale(1.1); -webkit-transform: scale(1.1) } .product-list ul { width: 100%; overflow: hidden } .product-list li { width: 33.33%; margin-left: -1px; margin-bottom: 40px; float: left; display: inline-block; border-left: 1px dashed #999 } .product-list li a { display: block; width: 100% } .product-list .good-box { margin: 0px 25px; text-align: center } .product-list .img-box { width: 100%; overflow: hidden; margin-bottom: 10px } .product-list .img-box img, .jr-case-list .case-img img { height: auto } .product-list li a:hover img, .jr-case-list li a:hover img { transform: scale(1.1); -webkit-transform: scale(1.1) } .jr-case-map { margin-bottom: 40px; width: 100% } .jr-case-list, .jr-case-list .case-img, .related-plan { width: 100%; overflow: hidden } .jr-case-list ul { margin-left: -15px } .jr-case-list li { width: 33.33%; float: left; margin-bottom: 20px } .jr-case-list li a { display: block; width: 100%; text-align: center } .jr-case-list .case-cont { margin-left: 15px } .jr-case-list .case-img { margin-bottom: 10px } .jr-case-list .more-case { padding: 40px 0px; text-align: right; font-size: 26px } .j-case-top { line-height: 60px; margin-bottom: 40px; font-size: 30px } .j-desc-img { width: 42%; position: relative; margin-top: 100px } .related-plan ul { margin-left: -25px } .related-plan li { display: inline-block; width: 25%; margin-bottom: 30px; float: left } .related-plan li a { display: block; width: 100%; background: #203cb6; color: #FFF } .related-plan li img { display: block; width: 100%; transition: all .5s; -webkit-transition: all .5s } .related-plan .jr-box { margin-left: 25px; min-height: 360px } .related-plan .img-box { width: 100%; overflow: hidden } .related-plan .jr-profile { padding: 15px 20px; border: 1px solid #203cb6 } .related-plan .jr-profile h1 { height: 52px; display: block; font-size: 20px; line-height: 26px; margin-bottom: 10px; overflow: hidden } .related-plan .jr-profile span { color: #00ffff } .related-plan li a:hover { background: #FFF; color: #203cb6 } .related-plan li a:hover img { transform: scale(1.1); -webkit-transform: scale(1.1) } .area-name { font-size: 24px; margin-bottom: 10px } .area-map { width: 1024px; position: relative; margin: 0 auto } .area-map img { max-width: 100%; } .area-map .place { width: auto; height: 24px; line-height: 24px; position: absolute; top: 0px; left: 0px; z-index: 10; cursor: pointer } .area-map .place p { display: block; transition: all .5s; -webkit-transition: all .5s } .area-map .area-on p { background: url(../images/jeck/round.png) no-repeat left center; padding-left: 17px; color: #203cb6 } .case-list-box { width: 100% } .case-list-box dl { width: 100%; margin-bottom: 20px } .case-list-box dl.blue { background: #0db8ee } .case-list-box dl.gree { background: #8dc31e } .case-list-box dl.yellow { background: #f9be00 } .case-list-box .lanmu-title { width: 100px; height: 100%; min-height: 170px; float: left; text-align: center; font-size: 26px; line-height: 30px; color: #FFF; display: table } .case-list-box .lanmu-title p { display: table-cell; vertical-align: middle; width: 100%; height: 100% } .four-row { margin-left: 100px; min-height: 170px; background: #FFF; padding-left: 40px; overflow: hidden; display: block } .four-row ul { margin-left: -40px } .four-row li { width: 25%; float: left; display: inline-block } .four-row .row-infor { margin-left: 40px; text-align: center } .four-row .row-infor p { display: block; width: 100%; overflow: hidden; margin-bottom: 10px } .four-row .row-infor p img { display: block; width: 100% } .four-row .row-infor h1 { height: 40px; line-height: 40px } .Inves_Bg { background: url(../images/Investor/a1.jpg) no-repeat 50% 0px } #container .Hot_title { background: url(../images/Investor/title2.png) no-repeat center } .twain ul { margin-left: -40px } .twain li { width: 50%; float: left; display: inline-block; margin-bottom: 30px } .twain .twain-wrap { margin-left: 40px; text-align: center; padding: 20px } .twain .twain-wrap h1 { font-size: 14px; color: #808080 } .twain .twain-wrap h2 { font-size: 24px; color: #84c225 } .twain .twain-wrap .infor { font-size: 18px; padding: 5px 0px } .he-log { width: 100%; padding: 50px 0px } .he-log dl { margin-left: -20px } .he-log dd { width: 25%; float: left; display: inline-block } .he-log .dd-cont { margin-left: 20px; text-align: center } .he-log .dd-cont img { max-width: 100%; height: auto } .contact-infor { width: 100%; padding: 20px 0px; text-align: left } .contact-infor p { font-size: 14px; line-height: 30px } .contact-infor em { color: #999; display: block; float: left; width: 70px; text-align: right } .contact-infor span { display: block; margin-left: 90px } .radius { border-radius: 3px; border: 1px solid #ccc } .m30 { margin-bottom: 30px } @media screen and (min-width:900px) and (max-width:1270px) { #Header .menu { float: right; height: 100%; width: 870px; position: absolute; right: 0; top: 0; } #Header .nav ul { width: 900px; } } #Header .subnav { width: 980px; position: absolute; top: 62px; left: 50%; padding: 20px 0px; transition: all .3s; -webkit-transition: all .3s; display: none } #Header .subnav.work { /* height:auto; */ margin-left: -259px; /* text-align:center; */ } #Header .subnav.scheme { width: 1080px; /* height:auto; */ margin-left: -220px; } #Header .subnav.work dl { height: 100%; /*float:none;display:inline-block;*/ } #Header .subnav.work dl.product { margin: 0px 90px; left: -200px; position: relative; } #Header .subnav.work dl.plan { margin: 0px 22px } #Footer { position: relative; width: 100%; background: #203cb6; min-width: 960px; height: auto; overflow: hidden } #Footer .foot-nav { position: relative; height: 100%; margin: 0px 15px; min-width: 960px; z-index: 990; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } #container .row-box { margin: 0px 10px; height: 100%; overflow: hidden } #container .row { margin: 0px -5px; margin-bottom: 20px; position: relative } #container .rank-wrap, .rank-model { margin: 0 5px; position: relative } .index-news .warpw { width: 970px; margin: 0 auto } .i-news-lett { float: left; height: 100%; width: 260px } .i-news-top p { height: 65px; margin-bottom: 0px; overflow: hidden } .i-news-img { float: left; width: 381px; height: 248px; margin-left: 25px } .i-news-list { float: right; width: 290px; height: 248px; margin-left: 0px } #container { max-width: 1440px; min-width: 960px; margin: 0px auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 80%; } .container .wrap-box { width: 940px; margin: 0 auto } .container .etc-list-box ul { margin-left: -20px } .container .etc-list-box li { width: 33.33%; float: left; display: inline-block } .container .wrap-box .li-box { margin-left: 20px; height: 438px } .container .wrap-box .li-box a { width: 100%; height: 100%; display: block } .container .wrap-box .img-war { width: 100%; height: auto; position: relative; overflow: hidden } .container .wrap-box .img-war i { display: none } .container .wrap-box .etc-name { padding: 10px 0px; margin: 0 0px; max-height: 48px; height: 48px; line-height: 24px; font-size: 16px } .container .wrap-box .etc-desc { padding: 0px 0px 20px; margin: 0 0px; max-height: 72px; line-height: 24px; font-size: 14px; color: #666 } .container .wrap-box .etc-desc { padding: 0px 0px 20px; margin: 0 0px; max-height: 72px; line-height: 24px; font-size: 14px; color: #666 } .stock-right li { font-size: 16px; line-height: 30px } .product-detail .tannav { min-width: 800px } .product-detail .tannav a { width: 190px } .product-infor { margin-left: 580px } .sub-right a.current i { bottom: -10px } #page-banner .bane-desc { min-width: 960px; width: 80%; height: 100%; position: absolute; top: 0px; left: 50%; margin-left: -490px } } .ani-left { animation: boxInLeft .7s ease-out .5s backwards; -webkit-animation: boxInLeft .7s ease-out .5s backwards } .ani-right { animation: boxInRight .7s ease-out .7s backwards; -webkit-animation: boxInRight .7s ease-out .7s backwards } .ani-zmIn { animation: zmIn .7s ease-out .5s backwards; -webkit-animation: zmIn .7s ease-out .5s backwards } .ani-InUp { animation: boxInUp .7s ease-out .5s backwards; -webkit-animation: boxInUp .7s ease-out .5s backwards } .ani-InDown { animation: boxInUp .7s ease-out .7s backwards; -webkit-animation: boxInUp .7s ease-out .7s backwards } @-webkit-keyframes boxInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-30px, 0, 0); transform: translate3d(-30px, 0, 0) } 100% { opacity: 1; -webkit-transform: none; transform: none } } @keyframes boxInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-30px, 0, 0); -ms-transform: translate3d(-30px, 0, 0); transform: translate3d(-30px, 0, 0) } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft } @-webkit-keyframes boxInRight { 0% { opacity: 0; -webkit-transform: translate3d(30px, 0, 0); transform: translate3d(30px, 0, 0) } 100% { opacity: 1; -webkit-transform: none; transform: none } } @keyframes boxInRight { 0% { opacity: 0; -webkit-transform: translate3d(30px, 0, 0); -ms-transform: translate3d(30px, 0, 0); transform: translate3d(30px, 0, 0) } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight } @-webkit-keyframes boxInUp { 0% { opacity: 0; -webkit-transform: translate3d(0px, 30px, 0); transform: translate3d(0, 30px, 0) } 100% { opacity: 1; -webkit-transform: none; transform: none } } @keyframes boxInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 30px, 0); -ms-transform: translate3d(0, 30px, 0); transform: translate3d(0, 30px, 0) } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none } } .boxInUp { -webkit-animation-name: boxInUp; animation-name: boxInUp } @-webkit-keyframes boxInDown { 0% { opacity: 0; -webkit-transform: translate3d(0px, -30px, 0); transform: translate3d(0, -30px, 0) } 100% { opacity: 1; -webkit-transform: none; transform: none } } @keyframes boxInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -30px, 0); -ms-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0) } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none } } .boxInDown { -webkit-animation-name: boxInDown; animation-name: boxInDown } @-webkit-keyframes boxOutDown { 0% { opacity: 1; -webkit-transform: none; transform: none } 100% { opacity: 0; -webkit-transform: translate3d(0px, -30px, 0); transform: translate3d(0, -30px, 0) } } @keyframes boxOutDown { 0% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none } 100% { opacity: 0; -webkit-transform: translate3d(0, -30px, 0); -ms-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0) } } .boxInDown { -webkit-animation-name: boxInDown; animation-name: boxInDown } @-webkit-keyframes zmIn { 0% { opacity: 0; -webkit-transform: scale(.85, .85); transform: scale(.85, .85) } 100% { opacity: 1; -webkit-transform: none; transform: none } } @keyframes zmIn { 0% { opacity: 0; -webkit-transform: scale(.85, .85); -ms-transform: scale(.85, .85); transform: scale(.85, .85) } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none } } @-webkit-keyframes zmOut { 0% { opacity: 1; -webkit-transform: scale(1, 1); transform: scale(1, 1) } 100% { opacity: 0; -webkit-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1) } } @keyframes zmOut { 0% { opacity: 1; -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1) } 100% { opacity: 0; -webkit-transform: scale(1.1, 1.1); -ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1) } } .zmOut { animation: zmOut .5s ease-out backwards; -webkit-animation: zmOut .5s ease-out backwards } @-webkit-keyframes fingerLeft { 0% { -webkit-transform: scale(1.05, 1.05) translateX(-50px); transform: scale(1.05, 1.05) translateX(-50px) } 20% { opacity: 1; -webkit-transform: scale(1, 1) translateX(50px); transform: scale(1, 1) translateX(-50px) } 100% { opacity: 0; -webkit-transform: none; transform: none } } @keyframes fingerLeft { 0% { -webkit-transform: scale(1.05, 1.05) translateX(-50px); -ms-transform: scale(1.05, 1.05) translateX(-50px); transform: scale(1.05, 1.05) translateX(-50px) } 20% { opacity: 1; -webkit-transform: scale(1, 1) translateX(-50px); -ms-transform: scale(1, 1) translateX(-50px); transform: scale(1, 1) translateX(-50px) } 100% { opacity: 0; -webkit-transform: none; -ms-transform: none; transform: none } } @-webkit-keyframes fingerRight { 0% { -webkit-transform: scale(1.05, 1.05) translateX(50px); transform: scale(1.05, 1.05) translateX(50px) } 20% { opacity: 1; -webkit-transform: scale(1, 1) translateX(50px); transform: scale(1, 1) translateX(50px) } 100% { opacity: 0; -webkit-transform: none; transform: none } } @keyframes fingerRight { 0% { -webkit-transform: scale(1.05, 1.05) translateX(50px); -ms-transform: scale(1.05, 1.05) translateX(50px); transform: scale(1.05, 1.05) translateX(50px) } 20% { opacity: 1; -webkit-transform: scale(1, 1) translateX(50px); -ms-transform: scale(1, 1) translateX(50px); transform: scale(1, 1) translateX(50px) } 100% { opacity: 0; -webkit-transform: none; -ms-transform: none; transform: none } } .inv_img { position: relative; width: 100%; padding: 30px 0 } .sh_textBlock { font-size: 14px; line-height: 26px; width: 100%; position: relative } .sh_textBlock p { min-height: 26px; color: #666; text-align: justify } .sh_textBlock img { margin: 15px 0 } .sh_textBlock h3 { font-size: 18px } .contentWrap { width: 100%; } .brandActivity { margin-bottom: 30px; padding: 0px 0px 30px; } .bomber { border-bottom: 20px solid #F5F5F5 } .clmTop { height: 40px; line-height: 40px; font-size: 18px; color: #353535; padding-left: 20px; padding-right: 20px; position: relative; border: 1px solid #F6FBFF; background: #fff } .clmTop:before { content: ""; width: 4px; height: 20px; position: absolute; background: #1d9ed1; left: 0; top: 50%; margin-top: -10px; border-top-right-radius: 4px } .contentBox { margin: 0 20px; } .brandAct ul { padding-top: 18px; margin: 0 -10px; } .brandAct ul li { display: block; width: 25%; float: left; } .brandAct .business { margin: 0 10px; max-height: 180px; overflow: hidden; position: relative; } .business .info, .business .targ { position: absolute; color: #fff; text-align: center } .business .info { font-size: 12px; border-radius: 2px; width: 88px; line-height: 20px; height: 20px; left: 50%; top: 64%; margin-left: -44px } .business .info.orange { background: #F68C22 } .business .info.blue { background: #1D9ED2 } .business .info.green { background: #07BB67 } .business .info.purple { background: #BD0FE1 } .business .targ { padding: 0 10px; height: 26px; line-height: 26px; top: 10px; left: 0; font-size: 14px; background: #052375 } .activeSift { margin: 20px 20px; } .vocationMark, .active_list { width: 100%; margin-bottom: 30px; } .markWrap { border-bottom: 1px solid #f2f2f2; padding-bottom: 10px; margin-top: 10px } .markWrap h3 { display: block; float: left; width: 80px; margin-top: 10px; font-size: 14px; color: #6d6d6d } .markWrap ul { margin-left: 80px; } .markWrap li { display: block; float: left; height: 30px; line-height: 30px; border-radius: 4px; margin-top: 10px; } .markWrap li a { display: inline-block; padding: 0 18px; font-size: 14px; color: #353535 } .markWrap li a.active { background: #1d9ed1; color: #fff; border-radius: 4px } .active_list ul { margin: 0 -10px; } .active_list ul li { display: block; width: 33.3%; float: left; margin-bottom: 25px; } .active_list .liLists { margin: 0 10px; min-height: 324px; overflow: hidden; position: relative; border: 1px solid #f1f1f1; transition: all .5s } .active_list .liLists:hover { transform: scale(1.05, 1.05) } .active_list .business { max-height: 305px; min-height: 176px } .active_list .liLists .desc { padding: 7px 10px } .active_list .liLists .busName { font-size: 16px; color: #353535; overflow: hidden; -webkit-line-clamp: 2; -ms-line-clamp: 2; -moz-line-clamp: 2; -o-line-clamp: 2; display: -webkit-inline-box; white-space: normal; text-overflow: ellipsis; -webkit-box-orient: vertical; -ms-box-orient: vertical; -moz-box-orient: vertical; -o-box-orient: vertical; vertical-align: top; max-height: 48px; height: 48px } .active_list .liLists .bottom { padding: 0 10px; color: #9b9b9b } .active_list .liLists .applyWrap { padding: 0 10px } .active_list .liLists .applyButton { width: 100%; height: 40px; border: none; font-size: 16px; border-radius: 4px; margin-top: 15px; margin-bottom: 15px; cursor: pointer } .active_list .liLists .applyButton.signUp_ing { background: #1D9ED2; color: #fff } .active_list .liLists .applyButton.over { background: #f4f4f4; color: #6d6d6d } .active_list .liLists .applyButton.overReadTopic { background: #DDE9F6; color: #6d6d6d } .column-wrap { position: relative; margin: 20px 20px; position: relative } .swiperWrap { position: relative; margin: 0px 30px; } .swiper-container2 { width: 100%; overflow: hidden; } .swiper-container2 .swiper-slide { width: 246px; overflow: hidden } .a_without .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'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E") !important } .a_without .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'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E") !important } .a_without .swiper-button-next { right: 0px; opacity: 1 } .a_without .swiper-button-prev { left: 0px; opacity: 1 } .a_without .swiper-button-next, .a_without .swiper-button-prev { width: 16px; height: 26px; background-size: 100%; } .swiper-container222 { padding-bottom: 20px; } .figureLists dl { width: 16.66%; height: 190px; max-height: 190px; float: left; text-align: center; margin-top: 20px; margin-bottom: 20px; } .figureLists dl:nth-child(6n) { margin-right: 0 } .figureLists dl dt { width: 110px; height: 110px; border-radius: 50%; overflow: hidden; margin: 0 auto } .figureLists dl dd.name { font-size: 18px; color: #353535; margin: 10px 17px 8px; line-height: 23px; } .figureLists dl dd.job { font-size: 14px; color: #353535; margin: 10px 20px 8px; } .cooperation { overflow: hidden } .cooperation .brandLists {} .cooperation .brandLists a { display: block; width: auto; height: 60px; margin: 30px 10px 4px; overflow: hidden; float: left } .cooperation .brandLists a img { width: 100% } .contentWrap a { display: block } .contentWrap a.signUp_ing { background: #1D9ED2; color: #fff } .contentWrap a.over { background: #f4f4f4; color: #6d6d6d } .applyBtn { width: 100%; height: 40px; line-height: 40px; text-align: center; font-size: 16px; margin-top: 15px; cursor: pointer } .applyBtn.signUp_ing { background: #1D9ED2; color: #fff } .applyBtn.over { background: #f4f4f4; color: #6d6d6d } .applyBtn.overReadTopic { background: #DDE9F6; color: #6d6d6d } .review { margin: 0 auto; width: 100%; position: relative; min-height: 200px; *height: 200px; } .review .list li { width: 33.33%; float: left; position: relative } .review .list li.current { width: 800px; position: absolute; top: 80px; left: 50%; margin-left: -400px; z-index: 999 } .review .list li.current .info { position: absolute; font-size: 12px; width: 88px; line-height: 20px; height: 20px; left: 50%; top: 75%; margin-left: -44px; background: #F68C22; color: #fff; text-align: center; border-radius: 4px } .review .list li.current .info.orange { background: #F68C22 } .review .list li.current .info.blue { background: #1D9ED2 } .review .list li.current .info.green { background: #07BB67 } .review .list li.current .info.purple { background: #BD0FE1 } .review .list li img { width: 100%; display: block } .review .list li .cover { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #000; opacity: .4; z-index: 99 } .mainContent { background: #fff; padding-top: 218px; padding-bottom: 10px } .mainContent .description { padding: 0 48px 35px } .mainContent .description h2 { font-size: 26px; color: #1D9ED2; position: relative; padding-left: 32px } .mainContent .description h2:before { content: ''; position: absolute; width: 18px; height: 4px; background: #1D9ED2; left: -8px; top: 50%; margin-top: -2px } .mainContent .description p { width: 800px; margin: 20px auto 0; color: #333; font-size: 14px; line-height: 22px } .yearList { border-left: 1px dashed #1D9ED2; margin-left: 48px; padding-left: 31px } .yearList.remove { height: 315px; overflow: hidden } .yearList .yearTime { font-size: 18px; color: #6d6d6d; letter-spacing: 0; margin-bottom: 20px; position: relative } .yearList .yearTime .lookMore { position: absolute; width: 14px; height: 8px; background: url(/Public/Main/PC/images/activity/index/turnDown.png); left: 56px; top: 50%; margin-top: -4px; cursor: pointer; transition: all .5s } .yearList .yearTime .lookMore.active { transform: rotate(-180deg) } .yearList .yearTime.now { font-size: 24px; color: #1D9ED2 } .yearList .yearTime:before { content: ''; position: absolute } .yearList .yearTime.now:before { width: 23px; height: 23px; background: url(../images/circle.png); left: -43px; top: -2px } .yearList .yearTime.old:before { width: 8px; height: 8px; background: #6d6d6d; left: -35px; top: 50%; margin-top: -4px; border-radius: 50% } .yearLists { padding-bottom: 25px } .yearList .liLists { width: 280px; margin: 0 } .yearList .liLists:nth-child(3n+1) { margin: 0 } .yearList .business { max-height: 186px; overflow: hidden; position: relative; } .yearList .business img { transition: all 1s } .yearList .business img:hover { transform: scale(1.1, 1.1) } .yearList .liLists .applyWrap { padding: 0 } .yearList .liLists .applyWrap button { border-radius: 0 } .yearList .leftImg { width: 280px } .yearList .rightInfo { margin-left: 305px } .yearList .rightInfo .title { height: 24px; font-size: 16px; color: #353535; letter-spacing: 0; line-height: 20px; margin-bottom: 10px } .yearList .rightInfo .title .time { font-size: 12px; color: #9d9d9d; margin-right: 30px } .yearList .rightInfo ul li { width: 185px; height: 100px; background: #F6F9FC; float: left; margin-right: 10px; margin-bottom: 10px; border: 1px solid #F6F9FC } .yearList .rightInfo ul li.haveLink:hover { border: 1px solid #1D9ED2 } .yearList .rightInfo ul li:nth-child(4n) { margin-right: 0 } .yearList .rightInfo dt { width: 68px; height: 100px; text-align: right; line-height: 100px; margin-right: 10px } .yearList .rightInfo dd { height: 70px; padding-top: 30px } .yearList .rightInfo dd p { color: #6d6d6d } .yearList .rightInfo dd.haveArrow p { color: #1391C2 } .yearList .rightInfo dd p:first-child { font-size: 16px; letter-spacing: 0; line-height: 20px; margin-bottom: 2px } .yearList .rightInfo dd p:last-child { font-size: 14px; letter-spacing: 0; line-height: 20px; color: #9d9d9d; position: relative } .yearList .rightInfo dd.haveArrow p:last-child { color: #1391C2 } .yearList .rightInfo dd.haveArrow p:last-child:before { content: ''; position: absolute; width: 9px; height: 9px; background: url(/Public/Main/PC/images/activity/index/right_info.png); right: -16px; top: 50%; margin-top: -4px } @media screen and (min-width:800px) and (max-width:1024px) { .review .list li.current { width: 500px; margin-left: -250px } .mainContent { padding-top: 200px } } @media screen and (min-width:1025px) and (max-width:1366px) { .review .list li.current { width: 600px; margin-left: -300px } .mainContent { padding-top: 200px } } @media screen and (min-width:1367px) and (max-width:1600px) { .review .list li.current { width: 600px; margin-left: -300px } .mainContent { padding-top: 200px } } @media screen and (min-width:1601px) and (max-width:1680px) { .review .list li.current { width: 600px; margin-left: -300px } .mainContent { padding-top: 158px } } .webWall { width: 100%; height: 100%; position: fixed; top: 0; left: 0; background-image: url(../images/wall.jpg); background-position: center bottom; background-size: 100% 100%; } .webWall p { display: block; width: 100%; position: absolute; bottom: 0px; left: 0px; } .webWall img { display: block; width: 100%; } .nav_page { width: 100%; height: 70px; min-width: 1000px; position: fixed; top: 0px; left: 0px; z-index: 11000; background: #FFF; border-bottom: 1px solid #e5e5e5; box-shadow: 0 0px 5px rgba(0, 0, 0, .1) } .nav_page .wrap { position: relative; width: 90%; height: 100%; margin: 0px auto; max-width: 1440px; min-width: 960px; z-index: 990; -webkit-box-sizing: border-box; box-sizing: border-box } .nav_page .logo { float: left; width: 200px; height: 100%; } .nav_page .logo a { display: block; width: 100%; height: 100%; line-height: 65px; display: block; vertical-align: middle } #meetNav { float: right; height: 70px; } #meetNav li { display: block; height: 100%; float: left; line-height: 70px; margin-left: 20px; padding-left: 20px; } #meetNav li a { display: block; height: 100%; position: relative; font-size: 14px; transition: all .5s; -webkit-transition: all .5s } #meetNav li a:after { content: ""; display: block; width: 0%; height: 2px; position: absolute; bottom: 0px; left: 0px; background: #203cb6; transition: all .5s; -webkit-transition: all .5s } #meetNav li a:hover:after, #meetNav li a.active:after { width: 100%; } #meetNav li.active a:after { width: 100%; } #fullpage, #fullpage .section, .banBox { width: 100%; color: #333; } #fullpage { padding-top: 0px; position: relative; z-index: 10; zoom: 1 } #fullpage .section { padding: 0px 0px 0px; } #fullpage .banBox { height: 100%; } #fullpage .pageTitle { color: #333; line-height: 27px; text-align: center; margin-bottom: 3%; font-size: 24px } #fullpage .profile { color: #333; line-height: 27px; width: 80%; text-align: justify; margin: 0 auto; } #fullpage .pageTop { color: #333; line-height: 27px; text-align: center; margin-bottom: 3%; font-size: 34px } #fullpage .forum-box { width: 80%; /*height:400px;*/ margin: 0 auto } #fullpage .forum-box ul, #fullpage .forum-box li { width: 100% } #fullpage .forum-box li { margin-bottom: 20px; } #fullpage .forum-box li a { color: #333; } #fullpage .forum-box .rum-img { width: 270px; float: left; position: relative; overflow: hidden } #fullpage .forum-box .rum-img img { display: block; width: 100%; transition: all 1s; -webkit-transition: all 1s } #fullpage .forum-box .rum-img p { display: block; padding: 0 10px; height: 30px; line-height: 30px; position: absolute; top: 10px; left: 0px; font-size: 14px; } #fullpage .rum-infor { margin-left: 300px; height: 100% } #fullpage .rum-infor dl { width: 100% } #fullpage .r-title { height: 24px; line-height: 24px; margin-bottom: 15px; } #fullpage .r-title span { float: left; } #fullpage .r-title em { float: right; } #fullpage .rum-infor dd { width: 185px; height: 100px; border: 1px solid #F6F9FC; background: #F6F9FC; margin-right: 30px; float: left; color: #9d9d9d; transition: all 1s; -webkit-transition: all 1s } #fullpage .rum-infor dd i { display: block; width: 68px; height: 100px; line-height: 100px; text-align: right; float: left } #fullpage .rum-infor dd img { vertical-align: middle; } #fullpage .rum-infor dd p { display: block; margin-left: 80px; height: 100%; padding-top: 27px; } #fullpage .rum-infor dd em, #fullpage .rum-infor dd span { display: block; } #fullpage .forum-box .rum-img:hover img { -webkit-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1) } #fullpage .rum-infor dd:hover { border: 1px solid #203cb6; background: #203cb6; color: #FFF } #fullpage .metCont { width: 70%; text-align: center; margin: 0 auto } #fullpage .metCont p { margin-bottom: 20px; } #fullpage .lm-profile { line-height: 1.5; width: 60%; text-align: justify; margin: 0 auto; font-size: 24px; letter-spacing: 2px; } #fullpage .agenda_profile { color: #FFF; line-height: 27px; width: 80%; text-align: center; margin: 0 auto 1%; } #fullpage .agenda_infor { width: 70%; margin: 0 auto; } #fullpage .agenda_infor dl { border: 1px solid #203cb6; border-bottom: none; } #fullpage .agenda_infor dt { width: 100%; height: 40px; line-height: 40px; text-align: center; background: #203cb6; } #fullpage .agenda_infor dt span, #fullpage .date_box, #fullpage .cont_box { display: block; width: 40%; height: 100%; float: left } #fullpage .agenda_infor dt em, #fullpage .adde_box { display: block; width: 20%; height: 100%; float: right } #fullpage .agenda_infor dd { width: 100%; height: 50px; line-height: 40px; text-align: center; border-bottom: 1px solid #203cb6 } #fullpage .agenda_infor dd:hover { background: #1057CD } #fullpage .date_box span, #fullpage .date_box p { display: block; width: 49%; float: left; padding: 5px 0px; } #fullpage .date_box p, #fullpage .cont_box p, #fullpage .adde_box p { display: block; border-left: 1px solid #203cb6; padding: 5px 0px; } #fullpage .meet_adder { height: 350px; width: 80%; margin: 0 auto; } #fullpage .map_box { width: 420px; height: 350px; float: left; } #fullpage .meet-infor { margin-left: 480px; padding: 50px 0px; font-size: 20px; line-height: 30px; letter-spacing: 2px; } #fullpage .meet-infor p { padding: 20px 0px; } #fullpage .form-box { width: 60%; margin: 0 auto; } #fullpage .form-box li { display: block; width: 50%; height: 40px; margin-bottom: 20px; float: left; } #fullpage .form-box input { color: #FFF } #fullpage .form-box .textBox { height: 40px; line-height: 40px; padding: 0 10px; width: 80%; background: #1057CD; color: #FFF; border: none; margin: 0 auto; display: block } #fullpage .btn { width: 295px; height: 50px; margin: 0 auto; } #fullpage .ui-reset, #fullpage .btn-button { width: 120px; height: 40px; border: none; } #fullpage .ui-reset { background: #454545; margin-right: 50px; } #fullpage .btn-button { background: #203cb6; } #fullpage .jiabin-box { width: 100% } #fullpage #jiaBin { padding-bottom: 40px; } #fullpage #jiaBin, #fullpage #jiaBin .swiper-wrapper { width: 100% } #fullpage #jiaBin .swiper-slide { width: 20%; float: left; } #fullpage #jiaBin .swiper-slide a { display: block; margin-bottom: 20px; text-align: center } #fullpage #jiaBin .swiper-slide span { display: block; width: 164px; margin: 0 auto 10px; border-radius: 50%; -webkit-border-radius: 50%; } #fullpage ul.hezuo-list { width: 100% } #fullpage ul.hezuo-list li { float: left; width: 20%; display: block; margin-bottom: 10px; } #fullpage ul.hezuo-list li p { width: 208px; height: 84px; display: block; margin: 0 auto; } #fullpage .tables { display: table; width: 100%; height: 100% } #fullpage .table-cell { display: table-cell; width: 100%; vertical-align: middle; padding: 90px 0px 10px; } .btn-wrap { width: 120px; height: 122px; position: absolute; top: 50%; right: 0%; margin-top: -61px; z-index: 110000; cursor: pointer } /* ::-webkit-input-placeholder { color: #fff !important; font-size: 14px } :-moz-placeholder { color: #fff !important; font-size: 14px } ::-moz-placeholder { color: #fff !important; font-size: 14px } :-ms-input-placeholder { color: #fff !important; font-size: 14px } */ .moni-select { width: 100%; height: 37px; margin-bottom: 30px; } .moni-select .sele-wrap { width: 54%; height: 100%; position: relative; z-index: 100; zoom: 1 } .moni-select .sele-value { border: 1px solid #e5e5e5; height: 35px; background: url(../images/icon-down.png) no-repeat 97% 50%; } .moni-select .sele-value .ui-wrod { width: 90%; height: 35px; line-height: 35px; border: none; padding: 0 10px; background-color: transparent; color: #999 } .moni-select .sele-value .ui-wrod::-webkit-input-placeholder { color: #999 !important; font-size: 16px } .moni-select .sele-value .ui-wrod:-moz-placeholder { color: #999 !important; font-size: 16px } .moni-select .sele-value .ui-wrod::-moz-placeholder { color: #999 !important; font-size: 16px } .moni-select .sele-value .ui-wrod:-ms-input-placeholder { color: #999 !important; font-size: 16px } .moni-select .sele-option { width: 100%; position: absolute; top: 35px; left: 0px; background: #e5e5e5; padding: 1px 0px; display: none } .moni-select .sele-option li { display: block; padding: 0px 10px; height: 30px; line-height: 30px; border-bottom: 1px solid #e5e5e5; cursor: default; font-size: 14px; } .moni-select .sele-option li:hover { background: #1057CD; color: #FFF } .film-wrap { padding: 0px 60px; position: relative; } .film-wrap .swiper-slide { width: 33%; float: left; } .film-wrap .swiper-slide a { display: block; } .film-wrap .swiper-slide img { width: 100%; vertical-align: middle } .film-wrap .btm { display: block; width: 30px; height: 30px; position: absolute; top: 50%; margin-top: -15px; z-index: 10; zoom: 1; cursor: pointer } .film-wrap .fm-prev { left: 0px; } .film-wrap .fm-next { right: 0px; } table { margin: 0; border: 0; border: 1px solid #ccc; border-collapse: collapse; border-spacing: 0 } table td { padding: 0; border: 1px solid #ccc } .not_ul { position: relative; width: 100%; border-top: 1px solid #ccc } a.not_li { position: relative; display: block; padding: 30px 0; width: 100%; border-bottom: 1px solid #ccc } .not_date { position: relative; padding-bottom: 15px; color: #999 } .not_text { font-size: 20px } .not_more { position: absolute; right: 0; bottom: 36px; color: #203cb6; font-size: 14px } .pagination { position: absolute; bottom: 20px; left: 0; z-index: 90; width: 100%; text-align: center } .swiper-pagination-switch { display: inline-block; margin: 0 10px; width: 14px; height: 14px; border-radius: 10px; background: #fff; box-shadow: 0 1px 2px #555 inset; cursor: pointer } .swiper-active-switch { background: #203cb6 } #banner .swiper-container, #banner .swiper-slide { position: relative; width: 100%; height: 100% } #banner .swiper-slide a, #banner .swiper-slide img { display: block; width: 100% } iframe.price_iframe { margin-top: 60px; width: 100%; border: 0px; overflow: hidden; height: 600px; margin-bottom: 20px; } .desc-img2 { width: 100%; overflow: hidden; } .desc-img2 img { transform: scale(1); -webkit-transform: scale(1); transition: all 0.6s; } #container .etc-hover:hover .desc-img2 img { transform: scale(1.1); -webkit-transform: scale(1.1); } .lanmu-infor table, .lanmu-infor tr, .lanmu-infor td { border: 0; } @keyframes fadeTop { 0% { transform: translate(0, 20px); opacity: 0; } 100% { transform: translate(0, 0px); opacity: 1; } } #Header .subnav, #Header .submenu { animation: fadeTop 0.6s backwards; } #Header .subnav:before { content: ""; display: block; position: absolute; top: -20px; left: 0; width: 100%; height: 22px; } ::-webkit-scrollbar { width: 5px; height: 8px; background-color: rgba(210, 210, 210, 0.48); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 0; } ::-webkit-scrollbar-thumb { background-color: #203cb6; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 0; } .fo_logo { text-align: center; position: relative; overflow: hidden; } .fo_logo:after { content: ""; display: block; position: absolute; left: -120px; top: 50%; width: 50%; border-bottom: 2px solid #fff; opacity: 0.2; margin-top: -1px; } .fo_logo:before { content: ""; display: block; position: absolute; right: -120px; top: 50%; width: 50%; border-bottom: 2px solid #fff; opacity: 0.2; margin-top: -1px; } .fo_content { position: relative; margin-top: 50px; float: left; width: 117%; } .fo_content a { color: #fff; display: block; opacity: 0.7; line-height: 1.8em; } .fo_li { float: left; margin-right: 5%; max-width: 200px; } .fo_content:after { content: ""; display: block; clear: both; } .fo_li h3 { font-size: 18px; margin-bottom: 20px; } .fo_li a { margin-bottom: 6px; transition: all 0.3s; } .fo_li h3 a { opacity: 1; } #Footer .f-logo h3 { margin-top: 15px; opacity: 0.7; } #Footer .f-logo img { width: 120px; } .foot-rights .wrapper { border-top: 1px solid rgba(255, 255, 255, 0.2); padding: 28px 0; } .fo_li a:hover { opacity: 1; } .ind_banner { position: relative; } .ind_banner .comIco { position: absolute; bottom: 30px; z-index: 90; left: 0; width: 100%; text-align: center; } .ind_banner span.swiper-pagination-switch { width: 8px; height: 8px; opacity: 0.5; } .ind_banner span.swiper-pagination-switch.swiper-visible-switch.swiper-active-switch { background: #fff; opacity: 1; } .indB_ul { position: relative; width: 100%; margin: auto; z-index: 90; height: 132px; } .indB_block img { width: 83px; float: left; transition: all 0.3s; } .indB_li { position: relative; width: 33.3%; float: left; height: 100%; } .indB_ul:after { content: ""; display: block; clear: both; } .indB_li .indB_block { position: absolute; left: 22%; top: 50%; transform: translate(0px, -50%); z-index: 90; transition: all 0.3s; } .indB_block h3 { position: relative; font-size: 18px; float: left; padding-top: 28px; padding-left: 25px; font-weight: bold; } .indB_li:nth-child(3) .indB_block {} .indB_li:nth-child(2) .indB_block { width: 430px; margin: auto; } .indB_li:nth-child(3) .indB_block { left: auto; right: 22%; white-space: nowrap; } .indB_block:after { content: ""; display: block; clear: both; } .ind2_ti { position: relative; width: 300px; margin: auto; text-align: center; padding: 20px 0; } .ind2_ti h2 { font-size: 32px; letter-spacing: 2px; } .ind2_ti h3 { font-size: 19px; color: #818b95; /*text-transform: uppercase;*/ } .ind2_ul { position: relative; width: 100%; margin-top: 20px; } .ind2_li { position: relative; width: 25%; float: left; text-align: center; background: #f4f4f4; padding: 20px 0; font-size: 18px; cursor: pointer; transition: all 0.3s; font-weight: bold; } .ind2_li.active, .ind2_li:hover { background: #203cb6; color: #fff; } .ind2_ul:after { content: ""; display: block; clear: both; } .ind2_block { position: relative; width: 100%; overflow: hidden; } .ind2_block:after { content: ""; display: block; clear: both; } .ind2_img { position: relative; width: 60%; float: right; } .ind2_text { position: absolute; left: 8%; top: 40%; width: 28%; transform: translate(0px, -50%); z-index: 90; } .ind2_text h2 { font-size: 29px; color: #203cb6; margin-bottom: 30px; } .ind2_text .text { line-height: 1.8em; text-align: justify; margin-bottom: 50px; } .ind2_liBl { position: relative; float: left; width: 25%; } .ind2_liBl .comIco { display: none; } .ind2_ulBl { width: 400%; position: relative; } .ind2_ulBl .sw_prev { position: absolute; bottom: 12%; left: 8%; width: 40px; height: 40px; background: url(/images/a1_5.png) no-repeat center; cursor: pointer; margin-left: -10px; z-index: 90; } .ind2_ulBl .sw_next { position: absolute; bottom: 12%; left: 8%; width: 40px; height: 40px; background: url(/images/a1_51.png) no-repeat center; cursor: pointer; margin-left: 70px; z-index: 90; } .ind2_ulBl .sw_prev:after { content: ""; display: block; height: 15px; border-right: 1px solid #ccc; margin-right: -20px; position: relative; margin-top: 13px; } .ind2_ulBl .sw_prev:hover { background: url(/images/a1_5a.png) no-repeat center; } .ind2_ulBl .sw_next:hover { background: url(/images/a1_51a.png) no-repeat center; } .ind3_content { background: url(/images/a1_4.jpg); position: relative; padding: 40px 0 60px; background-size: cover; } .com_InnerContent { position: relative; width: 84%; margin: auto; min-width: 1100px; } .ind3_content .ind2_ti { text-align: left; margin: initial; } .ind3_contentBlock:after { content: ""; display: block; clear: both; } .ind3_img { position: absolute; left: 52%; bottom: 0; } .ind3_block { position: relative; width: 50%; float: left; margin-top: 45px; min-height: 400px; max-width: 600px; } .ind3_ul:after { content: ""; display: block; clear: both; } .ind3_li { float: left; margin-right: 50px; cursor: pointer; color: #333; font-weight: bold; } .ind3_ul { font-size: 20px; margin-bottom: 35px; color: #818b95; } .ind3_li.active { color: #203cb6; } .ind3_bl { float: left; padding: 20px 0px; margin-right: 20px; margin-bottom: 20px; color: #595959; padding-left: 86px; background: #eef3fd; background-size: 45px; width: 175px; transition: all 0.3s; position: relative; } .ind3_liBl:after { content: ""; display: block; clear: both; } .ind3_bl h3 { font-size: 16px; color: #333; margin-bottom: 10px; font-weight: bold; } .ind3_liBl:nth-child(1) .ind3_bl {} .ind3_liBl:nth-child(2) {} .ind3_liBl:nth-child(2) .ind3_bl { /* padding-top: 25px; */ /* padding-left: 4%; */ /* padding-right: 4%; */ /* width: 38%; */ /* background-position: 8% 16px; */ /* max-width: 260px; */ padding-left: 70px; width: 180px; padding-right: 15px; } .ind3_liBl:nth-child(2) h3 { /* padding-left: 60px; */ /* margin-bottom: 20px; */ } .ind3_bl.a4 { background: #eef3fd; background-size: 45px; } .ind3_bl.a5 { background: #eef3fd; background-size: 45px; } .ind3_bl.a6 { background: #eef3fd; background-size: 45px; } .ind3_bl.a1 { background: #eef3fd; background-size: 45px; } .ind3_bl.a2 { background: #eef3fd; background-size: 45px; } .ind3_liBl:nth-child(2) .ind3_bl div { position: relative; width: 100%; height: 62px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-height: 1.6em; } .ind4_content { position: relative; width: 100%; } .ind4_bgImg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(/images/a1_6.jpg) no-repeat center; background-size: cover; background-attachment: fixed; } .ind4_contentBlock { position: relative; z-index: 90; color: #fff; padding: 50px 0 110px 0; } .ind4_contentBlock .ind2_ti { text-align: left; margin: initial; } .ind4_contentBlock .ind2_ti h3 { color: #fff; } .ind4_text { position: relative; width: 55%; padding-top: 20px; } .ind4_text p { margin-bottom: 20px; line-height: 2em; } .ind4_bgImg img { display: none; } a.ind4_more { position: absolute; right: 0; top: 35px; color: #fff; z-index: 90; } .ind4_ul { position: absolute; right: -6%; top: 100px; width: 36%; } .ind4_li { position: relative; float: left; width: 50%; margin-bottom: 60px; } .ind4_li span { font-size: 44px; margin-right: 10px; } .ind4_ul:after { content: ""; display: block; position: absolute; left: 37%; top: 0; height: 86%; border-right: 1px solid #ccc; opacity: 0.3; } .ind4_ul:before { content: ""; display: block; position: absolute; left: 0; top: 42%; width: 79%; border-top: 1px solid #ccc; opacity: 0.3; } .ind2_ti h2 { margin-bottom: 5px; } .ind5_content { position: relative; width: 100%; overflow: hidden; } .ind5_bgImg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; /*background: url(/images/a1_8.jpg) no-repeat center; background-size: cover;*/ } .ind5_contentBlock { position: relative; width: 100%; z-index: 90; padding: 30px 0 120px 0; } .ind5_contentBlock .ind2_ti { text-align: left; margin: initial; } .ind5_ul { position: relative; margin-top: 50px; width: 103%; } .ind5_ul:after { content: ""; display: block; clear: both; } a.ind5_li { position: relative; display: block; width: 22%; float: left; margin-right: 3%; transition: all 0.3s; } .ind5_ico { color: #6ba53a; border: 1px solid #6ba53a; width: 85px; text-align: center; padding: 5px 0; border-radius: 200px; margin-bottom: 25px; } h3.com_title { font-size: 18px; position: relative; margin-bottom: 25px; line-height: 1.8em; overflow: hidden; -webkit-box-orient: vertical; line-clamp: 2; -webkit-line-clamp: 2; height: 64px; } .com_text2 { color: #666; position: relative; width: 100%; height: 52px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; margin-bottom: 20px; line-height: 1.8em; } a.ind5_more { position: absolute; right: 0; top: 40px; } .ind5_img img { width: 100%; } .indB_li:nth-child(2) .indB_block { left: 50%; transform: translate(-50%, -50%); white-space: nowrap; } .indB_li:after { content: ""; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 110%; transition: all 0.3s; } .indB_li:hover:after { background: #203cb6; height: 100%; } .ind_img img { display: block; } .indB_li:hover .indB_block { color: #fff; } .indB_li:hover .indB_block img { transform: scale(1.2); filter: saturate(10); } .ind2_liBl .swiper-container { min-height: 337px; } .ind2_showBlock { position: relative; width: 100%; overflow: hidden; margin: 40px 0; } .ind2_ulBl:after { content: ""; display: block; clear: both; } .ind2_ulBl.le0 { left: 0%; } .ind2_ulBl.le1 { left: -100%; } .ind2_ulBl.le2 { left: -200%; } .ind2_ulBl.le3 { left: -300%; } .ind3_bl:hover { transform: scale(1.1); box-shadow: 0 0 5px 0 #ccc; color: #fff; background: #203cb6; } a.ind5_li:hover:after { /* content: ""; */ display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 1px solid #ccc; transform: scale(1.15); background: #203cb6; } .ind5_InBl { position: relative; z-index: 90; } .ind2_block:before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 40%; height: 100%; /* background: url(/images/a2_1.jpg); */ background-size: cover; } @keyframes fadeIn01 { 0% { opacity: 0; } 100% { opacity: 1; } } body { animation: fadeIn01 1s; } .fadeTop.animNode { transition: all 1.5s; transform: translate(0px, 200px); opacity: 0; } .fadeTop.animNode.animPlay { opacity: 1; transform: translate(0px, 0px); } @keyframes leftAnim { 0% { transform: translate(60px, 0); opacity: 0; } 100% { transform: translate(0); opacity: 1; } } .indB_li:nth-child(1) { animation: leftAnim 0.6s ease-in-out 0.3s backwards; } .indB_li:nth-child(2) { animation: leftAnim 0.6s ease-in-out 0.6s backwards; } .indB_li:nth-child(3) { animation: leftAnim 0.6s ease-in-out 0.9s backwards; } @keyframes animScale { 0% { transform: scale(1); } 50% { transform: scale(1.05); } 100% { transform: scale(1); } } .ind2_block:before, .ind3_img img, .ind5_bgImg img, .jo3_img img { /* animation: 10s linear 0s infinite normal none running animScale; */ } .ind3_bl {} .ind3_bl:hover h3 { color: #fff; } .ind3_bl.a1:hover { background: #203cb6; background-size: 45px; color: #fff; } .ind3_bl.a2:hover { background: #203cb6; background-size: 45px; color: #fff; } .ind3_bl.a3:hover { background: #203cb6; background-size: 45px; color: #fff; background-position: 8% 16px; } .ind3_bl.a4:hover { background: #203cb6; background-size: 45px; color: #fff; background-position: 8% 16px; } .ind3_bl.a5:hover { background: #203cb6; background-size: 45px; color: #fff; background-position: 8% 16px; } .ind3_bl.a6:hover { background: #203cb6; background-size: 45px; color: #fff; background-position: 8% 16px; } a.ind5_li:hover { z-index: 90; } a.ind5_li:hover .ind5_ico { /* color: #203cb6; */ /* border: 1px solid #203cb6; */ } a.ind5_li:hover h3.com_title { color: #203cb6; } a.ind5_li:hover .com_text2 { color: #fff; } .ind3_bl img { position: absolute; top: 23px; left: 25px; width: 32px; } .ind3_bl:hover img { filter: brightness(100); } .ind3_liBl:nth-child(2) .ind3_bl img { top: 16px; left: 6%; } #Header .subnav dt a { color: #203cb6; } .subnav:after { content: ""; display: block; position: absolute; left: 0px; top: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.95); } .subnav dl { position: relative; z-index: 90; } #Header .subnav.scheme dd, #Header .subnav.work dd { padding-left: 18px; position: relative; } #Header .subnav.scheme dd:after, #Header .subnav.work dd:after { content: ""; position: absolute; width: 5px; height: 5px; background: #999; border-radius: 200px; left: 0; top: 12px; } #Header .subnav dd:hover:after, #Header .subnav.work dd:hover:after { background: #203cb6; } #Header .subnav.scheme::after { width: 2400px; left: -700px; } #Header .subnav.work:after { width: 2200px; left: -900px; } .ind_video, .ind_video video { position: relative; width: 100%; height: 100%; background: #000; object-fit: cover; } #animation_container, #animation_container #canvas { max-width: 735px; max-height: 468px; } @media screen and (max-width: 1500px) { #animation_container, #animation_container #canvas { max-width: 630px; max-height: 400px; } } .ind4_li:nth-child(4) span { font-size: 25px; margin-bottom: 17px; display: block; padding-top: 10px; } .ind5_img { position: relative; overflow: hidden; } .ind5_img img { transition: all 1s; } a.ind5_li:hover .ind5_img img { transform: scale(1.1); } div#goTopBtn { opacity: 0; height: 0; overflow: hidden; } @keyframes leftAn { 0% { left: -40%; opacity: 0; } 100% { left: 8%; opacity: 1; } } @keyframes leftAn2 { 0% { transform: translate(-200px, 0); opacity: 0; } 100% { transform: translate(0%, 0); opacity: 1; } } @keyframes rightAn { 0% { transform: translate(200px, 0); opacity: 0; } 100% { transform: translate(0%, 0); opacity: 1; } } .ind2_text .more { position: absolute; } .ind2_liBl.active .ind2_text h2, .ind2_liBl.active .ind2_text .text, .ind2_liBl.active .ind2_text a.more, .ind2_liBl.active .sw_prev, .ind2_liBl.active .sw_next { animation: leftAn2 1s ease-in-out 0s backwards; } .ind2_liBl.active .ind2_img { animation: rightAn 1s ease-in-out 0s backwards; } .car_banner img { width: 100%; } .car_banner { overflow: hidden; position: relative; padding-top: 80px; } .nav2_content { background: #f2f4f7; height: 60px; } .com_InnContent { position: relative; height: 100%; margin: 0px auto; z-index: 90; width: 80%; max-width: 1440px; min-width: 1100px; } .nav2_ul:after { content: ""; display: block; clear: both; } a.nav2_li { float: left; height: 60px; line-height: 60px; padding: 0 30px; font-size: 16px; transition: all 0; -webkit-transition: color 0s; } .nav2_block { position: absolute; left: -17px; top: 0; } .car_body { background: #fff; } .car_content { padding: 60px 0; position: relative; } .car_content:after { content: ""; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 50%; background: #f5f6f7; } .car_block { position: relative; background: #fff; border: 1px solid #eee; box-shadow: 0 0 5px 0 #eee; } .car_block:after { content: ""; display: block; clear: both; } .car_img { float: left; width: 50%; } .car_textBlock { position: relative; float: right; width: 38%; padding: 4% 6%; } h1.car_ti { font-size: 26px; color: #333; margin-bottom: 20px; font-weight: bold; } .car_text { line-height: 2em; font-size: 16px; } .car_block:before { content: ""; display: block; position: absolute; right: 0; bottom: 0; width: 50%; border-bottom: 5px solid #203cb6; height: 50%; background: url(/images/a3_3.jpg) no-repeat right; background-size: auto 100%; } .car_img img { width: 100%; } .car2_ul { position: relative; border-bottom: 1px solid #eee; width: 80%; max-width: 1440px; min-width: 960px; margin: auto; } .car2_ul:after { content: ""; display: block; clear: both; } .car2_li { float: left; width: 25%; text-align: center; height: 60px; line-height: 60px; font-size: 18px; position: relative; cursor: pointer; transition: all 0.3s; font-weight: bold; } .car2_li.active, .car2_li:hover { background: #e8ebf8; color: #203cb6; } .car2_li.active:after { content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 3px; background: #203cb6; } .car2_liBl { /* padding: 60px 0; */ position: relative; } .car2_textBlock { position: relative; width: 50%; float: left; } .car2_ti { font-size: 26px; color: #203cb6; position: relative; margin-bottom: 30px; } .car2_ti:after { content: ""; display: block; position: absolute; top: 50px; left: 0; width: 40px; border-bottom: 3px solid #203cb6; } .car2_text { line-height: 2em; font-size: 16px; min-height: 128px; } .car2_img { position: absolute; width: 40%; float: left; margin-left: 10%; max-width: 400px; right: 0; height: 90%; top: 5%; } .car2_liBl:after { content: ""; display: block; clear: both; } .car3_content { background: #f5f6f7; padding: 40px 0; font-size: 16px; } a.nav2_li:hover { background: #203cb6; color: #fff; } .car3_text { line-height: 2em; margin-bottom: 40px; } a.nav2_liR { float: left; height: 60px; line-height: 60px; padding-left: 20px; background: url(/images/a3_7.png) no-repeat left; margin-left: 16px; } a.nav2_liR.home { background: url(/images/a3_6.png) no-repeat left; padding-left: 26px; } .car3_ul { position: relative; margin-bottom: 30px; } .car3_li { float: left; margin-left: 60px; cursor: pointer; position: relative; font-size: 18px; font-weight: bold; } .car3_ul:after { content: ""; display: block; clear: both; } .car3_li:nth-child(1) { padding-left: 0; margin-left: 0; border-left: 0; } .car3_li.active { color: #203cb6; } .car3_te { line-height: 2em; margin-bottom: 30px; margin-top: -15px; position: relative; } .car3_teUl:after { content: ""; display: block; clear: both; } .car3_teLi { float: left; margin-right: 30px; text-align: center; } .car3_teLi img { margin-bottom: 12px; } .car2_bl:after { content: ""; display: block; clear: both; } .car2_bl { position: relative; padding: 40px 0; } .cur32_block:after { content: ""; display: block; clear: both; } .cur32_img { float: left; margin-right: 40px; max-width: 40%; border: 1px solid #ddd; } .cur32_block { margin-bottom: 40px; } .cur32_textBlock h2 { font-size: 20px; color: #333; margin-bottom: 20px; top: -3px; position: relative; } .cur32_textBlock .text { line-height: 2em; } .cur32_textBlock { float: left; width: 50%; } .car3_liBl:after { content: ""; display: block; clear: both; } .cur32_textBlock .text p { min-height: 34px; position: relative; top: -6px; } .car3_ulBl { padding-bottom: 20px; position: relative; width: 100%; } .car4_ti { font-size: 20px; color: #333; margin-bottom: 50px; } .car4_ul:after { content: ""; display: block; clear: both; } .car4_li { position: relative; width: 24%; float: left; margin-right: 1%; } .cur4_block { position: absolute; top: 50%; left: 10%; width: 80%; z-index: 90; text-align: center; color: #fff; margin-top: -60px; } .cur4_block h2 { margin-top: 15px; font-size: 18px; font-weight: bold; } .car4_ul { position: relative; width: 101%; padding-bottom: 20px; } .car4_img img { width: 100%; } .cur5_li { position: relative; width: 19%; float: left; margin-right: 7.3%; border: 1px solid #ddd; padding: 30px 3% 20px; transition: all 0.3s; } .cur5_ul:after { content: ""; display: block; clear: both; } .cur5_ul { position: relative; width: 111%; margin-bottom: 40px; } .cur5_li h2 { font-size: 18px; padding: 20px 0; text-align: center; padding-bottom: 10px; transition: all 0.3s; font-weight: bold; } .cur5_li .ul { width: 190px; margin: auto; font-size: 14px; } .cur5_li .ul p { margin-bottom: 5px; } .cur5_li img { display: block; margin: auto; } .cur5_iUl:after { content: ""; display: block; clear: both; } .cur5_iLi { float: left; width: 12.5%; font-size: 14px; transition: all 0.3s; } .cur5_ico { position: relative; width: 40px; /* margin: auto; */ padding: 10px; border: 1px solid #ccc; border-radius: 200px; margin-bottom: 12px; transition: all 0.3s; left: 13px; } .cur5_iLi:hover .cur5_ico { border: 1px solid #203cb6; } .cur5_iLi .cur5_ico:after { content: ""; display: block; position: absolute; top: 50%; width: 0%; left: 50%; height: 0%; background: #203cb6; border-radius: 200px; transition: all 0.3s; } .cur5_ico img { position: relative; z-index: 80; } .cur5_iLi:hover .cur5_ico img { transform: scale(0.8); filter: brightness(100); transition: all 0.3s; } .cur5_iLi:hover .cur5_ico:after { left: 8%; width: 84%; top: 8%; height: 84%; } .cur5_iLi:hover { color: #203cb6; } .cur5_li:hover { border: 1px solid #203cb6; } .cur5_li:hover h2 { color: #203cb6; } .car6_li { float: left; padding: 3% 0; width: 8.5%; margin-right: 4%; border-radius: 200px; text-align: center; white-space: nowrap; transition: all 0.3s; } .car6_ul { position: relative; width: 104.2%; } .car6_ul:after { content: ""; display: block; clear: both; } .car6_li img { width: 50px; /* border: 2px solid #999; */ border-radius: 200px; margin-bottom: 20px; transition: all 0.3s; } .car6_li h3 {} .car6_li .text { /* background: rgba(255, 255, 255, 0.5); */ border-radius: 200px; font-size: 14px; padding: 2px 0; width: 80px; margin: auto; } .car6_li:hover { background: #058ede; color: #fff; } .car6_li:hover .text { /* color: #058ede; */ } .car6_li:hover img { filter: brightness(100); } @keyframes scale02 { 0% { transform: scale(1); } 50% { transform: scale(1.05); } 100% { transform: scale(1); } } .car_banner img { /* animation: scale02 10s ease-in-out infinite; */ } .nav2_li:nth-child(1) { /* animation: leftAnim 0.6s ease-in-out 0.3s backwards; */ } .nav2_li:nth-child(2), .nav2_liR:nth-child(1) { /* animation: leftAnim 0.6s ease-in-out 0.5s backwards; */ } .nav2_li:nth-child(3), .nav2_liR:nth-child(3) { /* animation: leftAnim 0.6s ease-in-out 0.7s backwards; */ } .nav2_li:nth-child(4), .nav2_liR:nth-child(2) { /* animation: leftAnim 0.6s ease-in-out 0.9s backwards; */ } .nav2_li:nth-child(5) { animation: leftAnim 0.6s ease-in-out 1.1s backwards; } .nav2_li:nth-child(6) { animation: leftAnim 0.6s ease-in-out 1.3s backwards; } @keyframes top02 { 0% { transform: translate(0, 60px); opacity: 0; } 100% { transform: translate(0, 0); opacity: 1; } } .car_block { animation: top02 0.6s ease-in-out 1.3s backwards; } .int_contentBlock { position: relative; width: 100%; margin-top: -180px; z-index: 120; font-size: 16px; } .int_title { color: #fff; font-size: 38px; letter-spacing: 3px; position: relative; left: 12%; margin-bottom: 60px; display: none; } .int_block { background: #fff; padding: 40px 4%; border-radius: 30px; } .int_block:after { content: ""; display: block; clear: both; } .int_text { float: left; width: 42%; line-height: 2em; padding-top: 80px; } .int_img { position: relative; width: 50%; float: right; } .int_ul:after { content: ""; display: block; clear: both; } .int_li { position: relative; float: left; padding: 30px 0; padding-left: 12%; width: 13%; transition: all 0.3s; } .int_li img { position: absolute; right: 56%; transition: all 0.3s; width: 70px; top: 37px; } .int_li p { /* padding: 4px 0; */ } .int_li.active, .int_li:hover { background: #203cb6; color: #fff; } .int_li.active img, .int_li:hover img { filter: brightness(100); } .int_ul { margin-bottom: 100px; } .int_tUl { border: 1px solid #ddd; border-radius: 200px; text-align: center; margin-bottom: 80px; overflow: hidden; } .int_tUl:after { content: ""; display: block; clear: both; } .int_tLi { display: inline-block; padding: 20px 12%; transition: all 0.3s; cursor: pointer; font-size: 18px; font-weight: bold; } .int_tLi.active, .int_tLi:hover { background: #203cb6; color: #fff; border-radius: 200px; } .int_InUl { position: relative; width: 116%; left: -8%; } .inb_ti { font-size: 28px; text-align: center; margin-bottom: 40px; letter-spacing: 3px; } .inb_ti:after { content: ""; display: block; width: 40px; height: 3px; background: #203cb6; left: 50%; position: relative; margin-left: -20px; top: 10px; } .inb_te { text-align: center; margin-bottom: 70px; } .int2_content { position: relative; background: url(/images/a6_5.jpg) no-repeat center; background-size: cover; color: #fff; padding: 60px 0; font-size: 16px; } .int2_ti { font-size: 28px; text-align: center; letter-spacing: 3px; margin-bottom: 40px; } .int2_ti:after { content: ""; display: block; width: 40px; height: 3px; background: #fff; left: 50%; position: relative; margin-left: -20px; top: 10px; } .int2_te { text-align: center; } .int2_block { margin-top: 30px; } .int2_t { margin-bottom: 40px; font-size: 20px; font-weight: bold; } .int2_li { position: relative; width: 28.3%; float: left; margin-right: 5%; background: #fff; color: #666; transition: all 0.6s; } .int2_ul:after { content: ""; display: block; clear: both; } .int2_ul { position: relative; width: 105.4%; } .int2_bl { padding: 15px 10%; line-height: 1.8em; min-height: 98px; padding-bottom: 8px; } .int2_bl h2 { font-size: 20px; text-align: center; margin-bottom: 5px; font-weight: bold; } .int3_block { position: relative; margin-top: 50px; } .int3_t { margin-bottom: 30px; font-size: 20px; font-weight: bold; } .int3_li { position: relative; width: 20%; float: left; text-align: center; } .int3_ul:after { content: ""; display: block; clear: both; } .int3_ul { padding-bottom: 20px; position: relative; width: 116.8%; left: -9.3%; /* border: 1px solid #fff; */ padding: 25px 0 17px; } .int3_li img { border: 1px solid #fff; border-radius: 200px; padding: 5px; margin-bottom: 15px; width: 50px; } .int4_content { padding: 60px 0; font-size: 16px; } .int4_te { text-align: center; } .int61_teUl:after { content: ""; display: block; clear: both; } .int61_teLi { position: relative; width: 24%; float: left; margin-right: 1%; text-align: center; margin-bottom: 40px; transition: all 0.6s; } .int61_teLi img { width: 100%; } .int61_teUl { position: relative; width: 101%; } .int61_teLi img { margin-bottom: 15px; } .int4_contentBlock { margin-top: 60px; } .int62_teLi { float: left; margin-right: 3%; width: 30.3%; background: #f4f4f4; text-align: center; color: #203cb6; font-size: 18px; padding-bottom: 25px; transition: all 0.6s; } .int62_teUl { position: relative; width: 103%; } .int62_teLi img { width: 100%; } .int62_teLi .ico { position: relative; width: 60px; height: 60px; margin: auto; background: #203cb6; color: #fff; line-height: 60px; border-radius: 200px; margin-top: -30px; margin-bottom: 20px; } .int2_img img { width: 100%; } .int65_teUl:after { content: ""; display: block; clear: both; } .int65_teLi { position: relative; width: 20%; float: left; text-align: center; padding: 40px 0; padding-bottom: 60px; } .int65_teLi img { margin-bottom: 12px; } .int65_teLi p { margin-bottom: 5px; display: block; } .int65_teLi h3 { margin-top: 5px; } .int65_teUl { position: relative; width: 111%; left: -5.5%; } .int8_teUl:after { content: ""; display: block; clear: both; } .int8_li { position: relative; width: 28%; float: left; margin-right: 5%; margin-bottom: 50px; } .int8_teUl { position: relative; width: 106.3%; } .int8_img { position: relative; } .int8_img .img { width: 100%; } .int8_img .ico { position: absolute; bottom: 0; left: 0; background: #203cb6; border-radius: 0 200px 0 0; padding: 15px 15px 0 0; } .int8_li h2 { margin-top: 15px; text-align: center; } .int7_teUl { position: relative; padding-bottom: 20px; } .int7_teUl:after { content: ""; display: block; clear: both; } .int7_li { position: relative; float: left; background: #f7f8fb; border-radius: 200px; width: 16.3%; margin-right: 6%; margin-bottom: 40px; padding: 25px 0; padding-left: 11%; transition: all 0.6s; } .int7_li img { position: absolute; right: 66%; top: 26px; border: 1px solid #203cb6; border-radius: 200px; width: 60px; transition: all 0.6s; } .car2_img img { height: 100%; } .car3_teLi img { border: 1px solid #ddd; } .car3_li:after { content: ""; display: block; position: absolute; left: 0px; width: 100%; border-bottom: 1px solid #999; top: 23px; } .car3_li:before { content: ""; display: block; position: absolute; left: -30px; height: 22px; border-right: 2px solid #eee; top: 1px; } .car3_li:nth-child(1):before { opacity: 0; } .car3_li.active .car3_li:after {} .car3_li.active:after { border-bottom: 1px solid #203cb6; } .cur5_iUl { position: relative; padding-bottom: 10px; width: 108%; } .con_ul:after { content: ""; display: block; clear: both; } .con_li { position: relative; width: 50%; float: left; padding: 50px 0; padding-bottom: 0; } .con_contentBlock { /* border-bottom: 1px solid #ddd; */ font-size: 16px; } .con_li h1 { font-size: 25px; color: #333; position: relative; margin-bottom: 40px; font-weight: bold; } .con_li h1:after { content: ""; display: block; width: 40px; border-bottom: 3px solid #203cb6; position: absolute; top: 48px; } .con_li p { margin-bottom: 10px; } .con_li:nth-child(1):after { border-right: 1px solid #ccc; content: ""; display: block; position: absolute; right: 0; top: 0; height: 100%; opacity: 0; } .con_li:nth-child(2) { width: 40%; padding-left: 10%; } .con2_ul { padding: 30px 0; font-size: 16px; border-bottom: 1px solid #ddd; margin-bottom: 60px; padding-bottom: 45px; } .con2_li { float: left; margin-right: 100px; } .con2_ul:after { content: ""; display: block; clear: both; } .con2_li img { background: #203cb6; padding: 10px; border-radius: 200px; margin-right: 15px; } .con2_block { background: #f5f6f7; /* margin-top: 20px; */ position: relative; padding: 40px 0; padding-left: 500px; padding-right: 90px; margin-bottom: 80px; padding-bottom: 48px; } .con2_leBl { position: absolute; padding: 50px 55px; width: 311px; background: #203cb6; color: #fff; font-size: 16px; left: 0; top: 0; padding-bottom: 100px; } .con2_leBl h2 { font-size: 26px; margin-bottom: 100px; position: relative; } .con2_leBl h2:after { content: ""; } .con2_leBl h2:after { content: ""; display: block; width: 36px; border-bottom: 3px solid #fff; position: absolute; top: 52px; } .con3_ul { position: relative; width: 114%; margin-top: 30px; } .con3_li { position: relative; float: left; font-size: 13px; background: #fff; margin-right: 35px; color: #666; text-align: center; padding: 10px; width: 118px; } .con3_ul:after { content: ""; display: block; clear: both; } h2.con4_ti { font-size: 26px; margin-bottom: 60px; position: relative; font-weight: bold; } h2.con4_ti:after { content: ""; display: block; width: 36px; border-bottom: 3px solid #203cb6; position: absolute; top: 52px; } .con4_block { position: relative; margin-bottom: 25px; } .con4_bl { position: relative; padding-left: 60px; } .con4_name { position: absolute; left: 0; top: 0; line-height: 40px; } .con4_content { font-size: 16px; } input.con4_text { position: relative; width: 94%; height: 40px; line-height: 40px; background: no-repeat; border: 1px solid #ddd; padding: 0 3%; color: #666; } textarea.con4_textarea { position: relative; width: 94%; height: 80px; padding: 17px 3%; background: no-repeat; border: 1px solid #ddd; } .con4_button { background: #203cb6; width: 120px; text-align: center; color: #fff; padding: 10px 0; position: relative; left: 60px; font-size: 14px; } placeholder { color: #666; } .con4_li { position: relative; width: 40%; float: left; margin-right: 10%; } .con4_ul:after { content: ""; display: block; clear: both; } .con4_ul { position: relative; width: 111%; } .con4_content ::-webkit-input-placeholder { color: #666 !important; } .con4_content :-moz-placeholder { color: #666 !important; } .con4_content ::-moz-placeholder { color: #666 !important; } .con4_content :-ms-input-placeholder { color: #666 !important; } .con4_li input.con4_text { padding: 0 8%; width: 84%; } .ab_ti { font-size: 26px; position: relative; margin-bottom: 50px; font-weight: bold; } .ab_ti:after { content: ""; display: block; position: absolute; top: 50px; left: 0; width: 40px; border-bottom: 3px solid #203cb6; } .ab_contentBlock { padding-top: 80px; } .ab_ul { position: absolute; right: -22px; top: 0; width: 670px; } .ab_li { position: relative; margin-left: 2%; float: left; padding: 12px 3%; font-size: 15px; white-space: nowrap; transition: all 0.6s; padding-left: 50px; padding-right: 0; margin-left: 80px; } .ab_text { margin-top: 60px; line-height: 2em; padding-bottom: 60px; } .ab_li img { margin-right: 10px; width: 40px; } .ab_text p { margin-bottom: 20px; } .ab_iUl { background: #fff; padding: 20px 5% 20px 2%; margin-top: 40px; margin-bottom: 60px; } .ab_content { background: #fff; } .ab_iUl:after { content: ""; display: block; clear: both; } .ab_iLi { position: relative; float: left; width: 16%; padding: 25px 1% 15px 0; margin-right: 3%; padding-left: 3%; transition: all 0.6s; } .ab_iLi h2 { font-size: 20px; color: #203cb6; } .abB_img img { width: 100%; } .abB_block { position: relative; } .abB_text { position: absolute; top: 50%; left: 20%; width: 60%; text-align: center; z-index: 90; color: #fff; transform: translate(0px, -50%); } .abB_text h2 { font-size: 26px; text-align: center; margin-bottom: 40px; font-weight: bold; } .abB_text h2:after { content: ""; display: block; width: 40px; height: 3px; background: #fff; left: 50%; position: relative; margin-left: -20px; top: 10px; } .abB_text h3 { font-size: 45px; font-weight: 100; letter-spacing: 5px; } .ab_InBl { position: relative; width: 115%; } .ab2_text { position: relative; width: 100%; } .ab2_te { position: relative; width: 55%; float: left; } .ab2_img { position: relative; float: right; width: 37%; } .ab2_text:after { content: ""; display: block; clear: both; } .ab2_te p { margin-bottom: 20px; line-height: 2em; text-align: justify; } .ab2_ul { margin-top: 60px; width: 113.6%; padding-bottom: 30px; } .ab2_ul:after { content: ""; display: block; clear: both; } .ab2_li { position: relative; width: 25%; padding: 20px 2%; float: left; margin-bottom: 20px; transition: all 0.6s; text-align: center; margin-left: 10%; padding-bottom: 40px; } .ab2_li h3 { font-size: 16px; color: #333; margin-bottom: 10px; } p { line-height: 2em; text-align: justify; } .ab21_block { position: relative; font-size: 52px; color: #203cb6; font-size: none; } .ab21_block .t { font-size: 16px; } .ab2_iul { position: relative; width: 101.8%; } .ab2_ili { width: 24%; float: left; margin-right: 1%; margin-bottom: 0.5%; margin-top: 0.5%; } .ab2_iul:after { content: ""; display: block; clear: both; } .ab2_conBlock { padding-bottom: 60px; } .ab_contentBlock.ab3_bg { background: url(/images/a8_7.png) no-repeat center; background-size: cover; background: #f5f6f7; padding-top: 60px; } .ab_contentBlock.ab_bg { background: #fafafa; } .ab3_ti { font-size: 26px; margin-bottom: 50px; position: absolute; left: 0; top: 86px; font-weight: bold; } .ab3_ti:after { content: ""; display: block; position: absolute; top: 50px; left: 0; width: 40px; border-bottom: 3px solid #203cb6; } .ab3_contentBlock { padding-left: 200px; padding-bottom: 80px; position: relative; } .ab3_yarn { font-size: 22px; margin-bottom: 10px; position: relative; } .ab3_contentBlock:after { content: ""; display: block; position: absolute; top: -20px; right: 12px; height: 96%; border-right: 2px solid #ccc; opacity: 0.3; } .ab3_yarn:after { content: ""; display: block; width: 7px; height: 7px; background: #fff; position: absolute; left: -43px; border-radius: 200px; top: 13px; } .ab3_li { position: relative; margin-bottom: 20px; } .ab3_yarn:before { content: ""; display: block; width: 20px; height: 20px; border: 1px solid #fff; border-radius: 200px; position: absolute; left: -51px; top: 5px; background: rgba(255, 255, 255, 0.3); opacity: 0; } .ab3_text p { margin-bottom: 3px; } .ab3_li.active:before { opacity: 1; } .ab3_li.active .ab3_yarn:before { opacity: 1; } .ab3_text { font-size: 16px; position: relative; /* max-height: 0; */ overflow: hidden; transition: all 1s ease; } .ab3_li.active .ab3_text { max-height: 500px; /* height: 545px; */ } .ab3_contentBlock:before { content: ""; display: block; } .ab3_showBlock { position: relative; height: 515px; overflow: hidden; left: 0px; padding-right: 200px; } .ab3_bottom { position: absolute; bottom: 15px; right: 0; width: 26px; height: 26px; background: #999 url(/images/a8_8.png) no-repeat center; border-radius: 200px; cursor: pointer; opacity: 0.3; transition: all 0.3s; } .ab4_ul { position: relative; width: 102%; padding-bottom: 60px; padding-top: 10px; font-size: 16px; height: 547px; } .ab4_ul:after { content: ""; display: block; clear: both; } .ab4_li { position: relative; width: 23.5%; float: left; background: #f8f8f8; margin-right: 1.5%; margin-bottom: 20px; height: 120px; color: #333; transition: all 0.3s; } .ab4_block { position: absolute; top: 50%; left: 0; width: 100%; text-align: center; transform: translate(0px, -50%); } .ab4_li:hover { background: #203cb6; font-size: 18px; color: #fff; } .ab4_li:nth-child(1), .ab4_li:nth-child(6), .ab4_li:nth-child(9) { width: 33%; } .ab4_li:nth-child(2), .ab4_li:nth-child(3), .ab4_li:nth-child(4), .ab4_li:nth-child(5), .ab4_li:nth-child(7), .ab4_li:nth-child(8), .ab4_li:nth-child(13), .ab4_li:nth-child(14), .ab4_li:nth-child(12) { width: 20.3%; } .ab4_li:nth-child(11) { width: 42.2%; } .ab4_li:nth-child(10) { width: 20.3%; } .ab4_li:nth-child(15) { width: 33%; } .car3_liBl { padding-top: 20px; } .car3_teUl { position: relative; width: 103%; } .cur5_iLi h2 { width: 88px; text-align: center; } .car3_text p { text-align: justify; } .int8_li:nth-child(5), .int8_li:nth-child(6) { margin-bottom: 0; } .jo_contentBlock.jo_1 { padding: 60px 0; } .jo_contentBlock.jo_2 { background: #f5f6f7; padding: 50px 0; } .jo_textBlock { position: relative; width: 48%; float: left; } .jo_img { position: relative; width: 44%; float: right; } .jo_contentBlock.jo_1 .com_InnContent:after { content: ""; display: block; clear: both; } .jo_textBlock h1 { font-size: 25px; color: #203cb6; margin-bottom: 20px; } .jo_textBlock p { margin-bottom: 20px; } h2.jo_ti { font-size: 26px; position: relative; margin-bottom: 50px; color: #333; font-weight: bold; } h2.jo_ti:after { content: ""; width: 36px; border-bottom: 3px solid #203cb6; display: block; margin-top: 10px; } .jo2_block { position: absolute; right: 0; top: 0; background: #edeff0; padding: 10px 20px; border-radius: 200px; padding-right: 60px; } input.jo2_input { background: none; border: 0; color: #666; } .jo2_button { position: absolute; right: 0; top: 0; width: 60px; height: 40px; background: url(/images/a9_4.png) no-repeat center; cursor: pointer; } .jo2_ul:after { content: ""; display: block; clear: both; } .jo2_li { position: relative; width: 27.8%; float: left; margin-right: 1.5%; background: #fff; margin-bottom: 1.5%; padding: 2%; transition: all 0.6s; } .jo2_ul { position: relative; width: 101.5%; } .jo2_li h2 { font-size: 18px; color: #333; margin-bottom: 5px; } .jo2_bu { position: absolute; right: 6%; top: 20%; background: #e6edfa; padding: 5px 15px; border-radius: 200px; font-size: 12px; color: #203cb6; } .jo2_li .text { margin-top: 20px; height: 42px; position: relative; overflow: hidden; } .jo_contentBlock.jo_3 { background: url(/images/a9_5.jpg) no-repeat center; background-size: cover; color: #fff; padding: 60px 0; background-repeat: no-repeat; background-position: center; } .jo_contentBlock.jo_3 .jo3_textBlock { width: 40%; float: left; max-width: 600px; position: absolute; top: 50%; transform: translate(0px, -50%); padding-bottom: 60px; } .jo_contentBlock.jo_3 .jo3_img { width: 45%; float: right; min-height: 360px; position: relative; } .jo_contentBlock.jo_3 .com_InnContent:after { content: ""; display: block; clear: both; } .jo3_textBlock h2 { font-size: 26px; margin-bottom: 30px; font-weight: bold; } .jo3_textBlock h2:after { content: ""; width: 36px; border-bottom: 3px solid #fff; display: block; margin-top: 10px; } .jo_contentBlock.jo_4 { background: #f5f6f7; padding: 60px 0; } .jo4_txtBlock { position: relative; width: 40%; float: left; } .jo4_txtBlock h3 { font-size: 18px; color: #203cb6; margin-bottom: 20px; } .jo4_block { position: relative; width: 60%; float: right; } .jo_contentBlock.jo_4 .com_InnContent:after { content: ""; display: block; clear: both; } .jo4_block:after { content: ""; display: block; clear: both; } .jo4_bl { float: right; background: rgba(255, 255, 255, 0.5); padding: 30px 60px; min-height: 216px; max-width: 100px; position: relative; padding-top: 70px; } .jo4_bl2 { position: relative; background: rgba(255, 255, 255, 0.5); float: right; margin-left: 20px; padding: 30px 30px; max-width: 390px; padding-top: 70px; } .jo4_block h2 { font-size: 18px; color: #203cb6; margin-bottom: 14px; text-align: center; } .jo4_block p { margin-bottom: 8px; } .jo_contentBlock.jo_5 { padding: 60px 0 20px; } .jo5_block:after { content: ""; display: block; clear: both; } .jo5_ti { background: #203cb6; width: 130px; color: #fff; padding: 20px 30px; font-size: 26px; float: left; position: absolute; left: 0; top: 0; font-weight: bold; } .jo5_ti:after { content: ""; display: block; width: 36px; border-bottom: 3px solid #fff; margin-top: 12px; margin-bottom: 10px; } .jo5_ul { position: relative; width: 100%; margin-top: 40px; min-height: 550px; } .jo5_li { float: left; width: 24%; margin-right: 1%; margin-bottom: 34px; } .jo5_li h3 { text-align: center; padding: 8px 0; } .jo5_text { position: relative; float: left; } .jo5_text h2 { font-size: 20px; color: #203cb6; margin-bottom: 8px; padding-top: 5px; } .jo5_block { position: relative; padding-left: 240px; height: 104px; } .jo5_ul:after { content: ""; display: block; clear: both; } .jo5_li:nth-child(1) { height: 360px; } .ab3_ul { position: relative; transition: all 1s; } .ab_text:after { content: ""; display: block; clear: both; } .ab0_te { position: relative; width: 54%; float: left; width: 100%; } .ab0_img { position: relative; width: 40%; float: right; display: none; } .int2_bl p br { display: none; } .int2_bl p { line-height: 1.8em; } .ab5_swiper .swiper-slide { overflow: hidden; position: relative; } .ab5_swiper { padding-bottom: 130px; } .ab5_swiper .comIco.swiper0 { text-align: center; margin-top: 15px; } .int7_li:hover { background: #203cb6; color: #fff; } .int7_li:hover img { filter: brightness(100); } .int2_li, .int8_li, .int62_teLi, .int61_teLi, .int65_teLi, .int3_li, .int7_li, .int_li, .jo2_li, .ab_li, .jo4_bl, .jo4_bl2, .jo5_li { transition: all 0.6s; } .int2_li:hover, .int8_li:hover, .int62_teLi:hover, .int61_teLi:hover, .int65_teLi:hover, .int3_li:hover, .int7_li:hover, .int_li:hover, .jo2_li:hover, .ab_li:hover, .jo4_bl:hover, .jo4_bl2:hover, .jo5_li:hover { transform: scale(1.05); } .int2_li:hover { background: #203cb6; color: #fff; } .int2_li:hover .int2_bl h2 { color: #fff; } .ab_iLi:hover img { box-shadow: 0 0 0px 1px #203cb6; border-radius: 200px; top: -5px; } .ab_iLi img { padding: 5px; left: -5px; transition: all 0.3s; top: 0px; position: relative; } .int3_li:after { content: ""; display: block; position: absolute; left: -32%; width: 65%; border-top: 1px dashed #fff; top: 32px; } .int3_li:nth-child(1):after { opacity: 0; } .ab5_swiper .swiper-slide { width: 100%; } .ab3_top { position: absolute; top: -46px; right: 0px; width: 26px; height: 26px; background: #999 url(/images/a8_8.png) no-repeat center; border-radius: 200px; cursor: pointer; transform: rotate(180deg); opacity: 0.3; transition: all 0.3s; } .jo2_li:hover { background: #203cb6; color: #fff; } .jo2_li:hover h2 { color: #fff; } h2.title-b:after { content: ""; display: block; position: absolute; top: 55px; left: 0; width: 40px; border-bottom: 3px solid #203cb6; } .jr-top:after { content: ""; display: block; position: absolute; top: 60px; left: 0; width: 40px; border-bottom: 3px solid #203cb6; } @media screen and (min-width: 1600px) { #Header .nav li { padding: 0 35px; } #Header .menu { margin-left: -450px; } .ind3_liBl .ind3_bl { min-width: 254px; } } .ind3_ulBl { width: 730px; } .nav2_block.leftBl { right: auto; left: -15px; } .cur4_block img { width: 60px; } .car4_img { position: relative; width: 100%; overflow: hidden; } .car4_img img { margin-bottom: -100px; } .ab2_li:hover { background: #203cb6; color: #fff; } .ab2_li:hover .ab21_block { color: #fff; } .ab2_li:hover h3 { color: #fff; } .ab_iLi:hover { background: #203cb6; color: #fff; } .ab_iLi:hover h2 { color: #fff; } .ab_iLi:hover img.img_node { filter: brightness(100); } .joA_ul:after { content: ""; display: block; clear: both; } .joA_li { position: relative; float: left; width: 25%; } .joA_li h2 { width: 65px; text-align: center; font-size: 16px; } .joA_ul { position: relative; width: 112%; padding-top: 10px; } .ab3_li.active .ab3_yarn { font-size: 50px; font-weight: bold; } .ab4_li:nth-child(1) { width: 26%; } .ab4_li:nth-child(2) { width: 27.3%; } .ab3_y { position: absolute; right: -188px; font-size: 16px; top: 0px; border-right: 2px solid rgba(255, 255, 255, 0); padding-right: 20px; opacity: 0.5; } .ab3_li.active {} .ab3_li.active .ab3_y { opacity: 1; border-right: 2px solid #203cb6; color: #203cb6; font-size: 20px; } .ab3_bottom:hover, .ab3_top:hover { opacity: 1; } .ab3_numUl { position: absolute; right: 12px; top: -41px; text-align: right; } .ab3_numUl div { margin: 21px 0; padding-right: 20px; opacity: 0.5; cursor: pointer; transition: all 0.6s; } .ab3_numUl .active { font-size: 20px; opacity: 1; color: #203cb6; border-right: 2px solid #203cb6; } .nav2_ul { float: right; } .jo4_bl2 h2, .jo4_block h2 { background: #203cb6; color: #fff; padding: 10px 0; position: absolute; top: 0; left: 0; width: 100%; } .jo3_img .a1 { position: absolute; top: 10%; left: 22.5%; width: 67%; height: 83%; border: 1px dashed #fff; border-radius: 1000px; opacity: 0.5; } .jo3_img img { position: relative; z-index: 80; width: 100%; } .jo3_img .a1:after { content: ""; display: block; width: 10px; height: 10px; border-radius: 200px; position: absolute; top: 2.6%; background: #fff; left: 66%; margin-left: -5px; margin-top: -5px; } .jo3_img .a2 { position: absolute; top: 19%; left: 29.5%; width: 52%; height: 64%; border: 1px dashed #fff; border-radius: 1000px; opacity: 0.8; } .jo3_img .a2:after { content: ""; display: block; width: 10px; height: 10px; border-radius: 200px; position: absolute; top: 48.5%; background: #fff; left: 100.1%; margin-left: -5px; margin-top: -5px; } .jo3_img .a3 { position: absolute; top: 27.5%; left: 36.5%; width: 38.5%; height: 47.5%; border-radius: 1000px; opacity: 0.8; border: 1px solid #fff; } .jo3_img .a3:after { content: ""; display: block; width: 10px; height: 10px; border-radius: 200px; position: absolute; top: 10.3%; background: #fff; left: 19%; margin-left: -5px; margin-top: -5px; } @keyframes rotate01 { 0% { transform: rotate(0deg); } 100% { transform: rotate(-360deg); } } @keyframes rotate02 { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .jo3_img .a1 { animation: rotate01 20s linear infinite; } .jo3_img .a2 { animation: rotate02 15s linear infinite; } .jo3_img .a3 { animation: rotate01 10s linear infinite; } .paroduct-page a:nth-child(1) { background: url(/images/a3_6.png) no-repeat left; padding-left: 26px; } #Header .subnav.no_Block dt {} #Header .subnav.no_Block { padding-top: 25px; } .ab5_swiper .comIco { display: none; } .ab5_swiper .sw_prev { position: absolute; width: 60px; height: 60px; background: url(/images/a1_5.png) no-repeat center; float: left; transition: all 0.3s; cursor: pointer; right: 80px; bottom: 60px; } .ab5_swiper .sw_next { position: absolute; width: 60px; height: 60px; background: url(/images/a1_51.png) no-repeat center; float: left; transition: all 0.3s; right: 0; cursor: pointer; bottom: 60px; } .ab5_swiper .sw_prev:hover { background: url(/images/a1_5a.png) no-repeat center; } .ab5_swiper .sw_next:hover { background: url(/images/a1_51a.png) no-repeat center; } .ab5_swiper .sw_next:after { content: ""; display: block; position: absolute; right: 69px; bottom: 22px; height: 16px; border-right: 1px solid #ddd; } .page-column span:after { content: ""; display: block; position: absolute; top: 50px; left: 0; width: 40px; border-bottom: 3px solid #203cb6; } .ab_ti.ab02_ti { text-align: center; margin-bottom: 60px; } .ab_ti.ab02_ti:after { left: 50%; margin-left: -20px; } .wrap-top h1:after { content: ""; display: block; position: absolute; top: 50px; left: 0; width: 40px; border-bottom: 3px solid #203cb6; } .ab2_li p { text-align: center; } .ab2_li:after { content: ""; display: block; width: 36px; border-bottom: 3px solid #203cb6; margin: auto; margin-top: 20px; } .ab2_li:hover:after { border-bottom: 3px solid #fff; } .ab3_li br { display: none; } .ab_li img { position: absolute; left: 0; top: 13px; } .ab_InBL { padding-left: 200px; } .paroduct-page .wrap { position: relative; } .detail-nav { position: absolute; right: 0; top: -10px; font-size: 16px; } .detail-nav a:nth-child(1) { background: none; padding: 10px 30px; } .detail-nav a { padding: 10px 30px; display: block; } .detail-nav:after { content: ""; display: block; clear: both; } .pro_block { height: 40px; } .detail-nav a.active, .detail-nav a:hover { background: #203cb6; color: #fff; } .product-detail .detail-nav { display: none; } .jr-top, .title-b, .car2_ti, .inb_ti, .int2_ti { font-weight: bold; } .product-wall .container .clear20 { display: none; } .product-detail .layer { background: #f7f6f7; padding: 40px; width: auto; } .product-detail .layer h2.inb_ti { margin-bottom: 60px; } .int_tUl:hover .int_tLi.active { background: none; color: #666; } .int_tUl:hover .int_tLi:hover {background: #203cb6; color: #fff;} .nav2_content.fixed { position: fixed; top: 80px; z-index: 990; left: 0; width: 100%; } .paroduct-page.fixed { position: fixed; top: 80px; left: 0; z-index: 990; } .car_banner.fixed { margin-bottom: 60px; }