@charset "utf-8"; $maxWidth: 100%; $comWidth: 1350px; $midWidth: 990px; $wColor: #fff; $blackColor: #000; $comFontSize: 16px; //背景色--浅黑 .lightBlack { background-color:#151515; } //背景色--浅灰 .lightGray { background-color:#e1e1e1; } //白色 .white { color: #fff; } .black { color: #000; } .lf { float: left; } .rt { float: right; } .s-bg { min-width: 1400px !important; } img { background: url(images/loading.gif) center no-repeat; } iframe{ display: none; } .header-box { position: relative; width: $maxWidth; min-width: 1350px; height: 290px; margin: 0 auto; background-color: $blackColor; border-bottom: 5px solid #d71c11; font-size: 16px; } .header { width: $comWidth; height: 290px; margin: 0 auto; border: 1px solid transparent; color: $wColor; > a> img { display: block; width: 970px; height: 115px; margin: 60px auto; } > ul { width: $midWidth; margin: 0 auto; &:after { content: ''; display: block; clear: both; } li { float: left; height: 25px; margin: 0 34px; line-height: 25px; text-align: center; border-radius: 5px; .active { color: #777777; } &:hover { color: #777777; } a { letter-spacing: 3px; text-decoration: none; } } & > li:first-child { padding-left: 10px; text-align: left; margin-left: 0; } & > li.hd-last { text-align: right; margin-right: 0; color: #d71c11; img{ vertical-align: middle; margin-bottom: 2px; } } } } .banner-wrap { position: relative; width: $maxWidth; min-width: 1350px; height: 715px; margin: 0 auto; background: no-repeat center center; overflow: hidden; > img { width: 100%; height: 100%; } } .address { position: fixed; top: 45%; z-index: 100; right: 0; width: 80px; height: 90px; padding-top: 15px; background-color: $blackColor; text-align: center; font-style: normal; > img { width: 35px; height: 40px; } > p { line-height: 17px; font-size: 14px; color: #4daabb; } } .hst-wrap { width: $maxWidth; min-width: 1350px; height: 850px; margin: 0 auto; padding-top: 75px; background-color: #151515; .hst { width: 1065px; height: 340px; margin: 0 auto; > img { float: left; width: 488px; height: 327px; margin-right: 50px; } > div { float: left; width: 488px; height: 327px; > h1 { padding-top: 10px; margin-bottom: 30px; line-height: 50px; font-size: 34px; letter-spacing: 3px; color: #fff; } > p { width: 495px; font-size: 16px; line-height: 30px; letter-spacing: 1.5px; &.hst-Int { margin-top: 25px; height: 90px; } } } } > ul:after { display: block; clear: both; content: ''; } > ul { width: 1065px; height: 340px; margin: 60px auto; li { float: left; width: 260px; height: 350px; margin: 0 45px; text-align: center; > img { width: 255px; } > span { display: block; margin-top: 15px; line-height: 30px; text-align: center; font-size: 16px; letter-spacing: 2px; } } } } .shop-box { width: $maxWidth; min-width: 1350px; height: 860px; margin: 0 auto; background: no-repeat center center; } .shop-wrap { width: $comWidth; height: 860px; margin: 0 auto; padding-top: 250px; > div { width: 520px; height: 170px; margin: 0 auto; letter-spacing: 2px; color: #d6d6d8; > h2 { width: 100%; height: 35px; line-height: 35px; font-size: 34px; text-align: center; color: $wColor; } > p { width: 100%; height: 85px; margin: 35px 0; padding: 0 5px; line-height: 34px; font-size: 18px; text-align: center; } } > ul { width: $midWidth; margin: 150px auto 0; &:after { content: ''; display: block; clear: both; } > li { float: left; &.mid-shop { margin: 0 50px; } > img { width: 288px; height: 181px; } } } > p { width: 100%; height: 20px; margin-top: 20px; line-height: 20px; text-align: center; font-size: 16px; letter-spacing: 2px; color: #777b7f; } } .coopArmy-box { width: $maxWidth; min-width: 1350px; height: 800px; margin: 0 auto; background-color: #151515; } .coopArmy-wrap { width: $comWidth; height: 800px; margin: 0 auto; padding-top: 40px; letter-spacing: 2px; > div { position: relative; width: $comWidth; height: 625px; border: 1px solid transparent; box-sizing: border-box; text-align: center; color: $wColor; > img { width: 1325px; height: 624px; border: none; vertical-align: bottom; } > div { position: absolute; top: 35px; left: 40px; width: 520px; height: 550px; z-index: 2; > img { display: block; width: 225px; height: 115px; margin: 60px auto; opacity: .7; background: no-repeat; } > p { width: 100%; height: 50px; padding: 0 60px; line-height: 50px; text-align: center; font-size: 34px; letter-spacing: 5px; } em { display: block; width: 100%; height: 100px; line-height: 30px; margin-top: 25px; text-align: left; padding: 0 65px; font-size: 16px; letter-spacing: 2px; color: #c2c1c1; } } > .transBg { position: absolute; top: 35px; left: 40px; width: 520px; height: 550px; background-color: $blackColor; opacity: .8; z-index: 1; } } > ul { width: 100%; margin: 50px auto; font-size: $comFontSize; color: #a0a0a0; &:after { content: ''; display: block; clear: both; } > li { float: left; margin: 0 27px; > img { width: 33px; height: 23px; margin-right: 10px; margin-bottom:3px; vertical-align: middle; } } } } .affect-box { width: $maxWidth; min-width: 1350px; height: 930px; background-color: #e1e1e1; } .affect-wrap { width: $comWidth; height: 930px; margin: 0 auto; padding-top: 85px; font-size: 16px; text-align: center; color: #070707; > h3 { width: 100%; line-height: 34px; font-size: 34px; letter-spacing: 3px; } > p { width: 100%; margin: 35px 0 55px 0; padding: 0 260px; line-height: 30px; letter-spacing: 1px; } > img { width: 810px; height: 628px; } & > img.aff_img_rt { width: 427px; height: 628px; margin-left: 20px; } } .video-box { width: $maxWidth; min-width: 1350px; height: 930px; background: no-repeat center center; } .video { color: #d6d6d8; > h4 { width: 100%; line-height: 48px; font-size: 34px; letter-spacing: 3px; color: $wColor; } > p { padding: 0 245px; } > video { width: 861px; height: 484px; background-color: #070707; } .video_img { width: 861px; height: 484px; } & > img.video_img_rt { width: 320px; height: 480px; margin-left: 20px; } > span { display: block; line-height: 30px; padding: 5px 150px; text-align: right; letter-spacing: 2px; } } .aut-box { width: $maxWidth; min-width: 1350px; height: 965px; background-color: #151515; } .aut-wrap { position: relative; width: $comWidth; height: 965px; margin: 0 auto; padding: 75px 22px 0; font-size: 16px; color: #b9b9b9; > div { position: relative; width: 100%; height: 414px; margin: 0 auto 60px; letter-spacing: 2px; text-align: left; > img { float: left; width: 790px; height: 414px; margin-right: 55px; } > img.aut-logo { position: absolute; left: 30px; bottom: 45px; width: 265px; height: 59px; } > h4 { line-height: 55px; font-size: 34px; color: $wColor; } > p { margin-bottom: 55px; line-height: 55px; font-size: 26px; color: $wColor; } > span { display: block; line-height: 30px; letter-spacing: 1px; } } > img.aut-lf { width: 457px; height: 304px; } > img.center { width: 457px; height: 304px; margin-left: 10px; } > img.aut-side { position: absolute; right: 36px; bottom: 50px; } > p { margin-top: 25px; padding-right: 405px; text-align: center; letter-spacing: 2px; } } .quality-box { width: $maxWidth; min-width: 1350px; height: 840px; background: $blackColor no-repeat center center; } .quality-wrap { width: $comWidth; height: 840px; margin: 0 auto; padding-top: 130px; text-align: center; letter-spacing: 2px; color: #d6d6d8; > h5 { margin-top: 35px; line-height: 40px; font-size: 34.06px; color: $wColor; } > div { margin: 20px 0 30px 0; line-height: 40px; font-size: 34.06px; color: $wColor; } > p { padding: 0 220px; line-height: 30px; font-size: 18px; } > ul { width: $midWidth; margin: 70px auto; padding-left: 135px; text-align: center; &:after { content: ''; display: block; clear: both; } > li { float: left; width: 180px; height: 200px; margin: 0 35px; > img { width: 133px; height: 133px; margin-bottom: 20px; background: no-repeat; } > p { line-height: 30px; font-size: 16px; } } } } .show-wrap { position: relative; width: $comWidth; height: 836px; margin: 0 auto; font-size: 18px; a:hover { text-decoration: underline; } .showCont { position: absolute; top: 80px; left: 150px; width: 350px; height: 700px; text-align: center; letter-spacing: 2px; img { width: 300px; height: 510px; } p { margin: 35px 0 30px 0; line-height: 30px; } span, b { font-size: 30px; color: $wColor; } } } .show-one { width: $maxWidth; min-width: $comWidth; height: 836px; background: no-repeat center center; } .show-two { width: $maxWidth; min-width: $comWidth; height: 833px; background: no-repeat center center; .showContTwo { left: 880px; p { color: #ddd; } } } .show-three { width: $maxWidth; min-width: $comWidth; height: 836px; background: no-repeat center center; .showContThree { color: #1A1817; span, b { font-size: 35px; font-weight: bold; color: #1A1817; } } } .footer { width: $maxWidth; min-width: 1350px; padding-top: 40px; background-color: $blackColor; color: #756f6f; letter-spacing: 2px; &:after { content: ''; display: block; clear: both; } .footerUP { width: 1170px; margin :0 auto; padding-bottom: 40px; text-align: center; &:after { content: ''; display: block; clear: both; } } .weixin { width: 100px; height: 100px; margin-right: 38px; } a:hover{text-decoration:underline;} .footerNav { margin-top: 8px; &:after { content: ''; display: block; clear: both; } >li { float: left; line-height: 30px; font-size: 14px; >a { display: inline-block; margin: 0 20px; vertical-align: middle; } } } .footer-main { padding: 20px 0 0 20px; line-height: 30px; font-size: 14px; vertical-align: middle; img { vertical-align: middle; } } .footerDown { width: $maxWidth; min-width: 1350px; height: 62px; margin: 0 auto; text-align: center; background-color: #151515; a { display: inline-block; margin: 20px ; } } } //以下是空军系样式 //---------------------- .k-box { width: $maxWidth; min-width: $comWidth; } .k-textTitle { margin-bottom: 40px; font-size: 30px; line-height: 30px; } .k-textLtitle { font-size: 16px; line-height: 16px; } .k-wrap{ width: 100%; min-width: $comWidth; height: 699px; background: no-repeat center; } .k-biaopan { width: 1350px; margin:0 auto; >img { width: 1350px; height: 822px; } .bpTitle { position:absolute; top:85px; width: 100%; text-align: center; } } .k-jiXin { width: 1350px; margin:0 auto; >img { width: 1350px; height: 808px; } .jiXinTitle { position: absolute; top: 375px; width: 100%; text-align: center; color: #000; } } .k-biaoJing { width: 1350px; margin:0 auto; >img { width: 1350px; height: 830px; } .bioaJingTitle { position: absolute; top:85px; width:100%; text-align: center; } .bioaJingTip { position: absolute; top:765px; left: 378px; width:630px; span { font-size: 16px; margin-right: 119px; } } } .k-wrap-ft { width: $maxWidth; min-width: $comWidth; margin: 0 auto; padding-top: 85px; text-align: center; background-color: #151515; a:hover{ text-decoration: underline; } .watchListBox { width:963px; margin: 0 auto; overflow: hidden; } } .watchList { width: 990px; margin: 80px auto 0; letter-spacing: 2px; &:after { content: ''; display: block; clear: both; } li { float: left; margin-right: 27px; margin-bottom: 80px; img { width: 220px; height: 325px; } p{ margin: 7px 0 10px; font-size: 14px; } span { font-size: 14px; } b { font-size: 16px; font-weight: normal; } } } //以下是海军系列样式 //---------------------------- .h-bg{ width: $maxWidth; min-width: $comWidth; height: 699px; background: no-repeat center; } .h-box { width: $maxWidth; min-width: $comWidth; background: no-repeat center 0; } .specialty { width: $comWidth; height: 800px; margin: 0 auto; .specialtyText { position: absolute; top: 160px; left: 190px; width: 505px; text-align: left; .specialtyTitle { margin-bottom: 24px; line-height: 49px; font-size: 32px; color: #fff; } } .specialtyTipUp { left: 177px; top: 500px; } .specialtyTipDown { left: 177px; top: 645px; } } .description { width: $comWidth; height: 696px; margin: 0 auto; .descriptionText { position: absolute; top: 70px; left: 190px; width: 1010px; text-align: center; .descriptionTitle { margin-bottom: 34px; line-height: 32px; font-size: 32px; color: #fff; } } } .compared { height: 677px; } //以下是品牌故事样式 //----------------------------- .s-banner { width: $maxWidth; min-width: 1400px; height: 600px; background: no-repeat center; >div { position: relative; width: 1400px; height:100%; margin:0 auto; } } .s-banner-cont{ position:absolute; top:295px; left: 250px; width:920px; height: 200px; >h1 { margin-bottom: 30px; line-height: 34px; font-size:34px; text-align: center; color:#fff; letter-spacing: 5px; } >p { line-height:32px; font-size: 18px; color: #c1c1c1; letter-spacing: 2px; } } .origin { width: $maxWidth; min-width: 1400px; margin: 0 auto; padding-top: 66px; font-size: 16px; line-height: 30px; letter-spacing: 2px; background-color: #151515; .origin-title { width: 1400px; margin: 0 auto 35px; letter-spacing: 10px; } > .origin-hd { position: relative; width: 1255px; margin: 0 auto 113px; padding-top: 46px; > div { float: left; width: 580px; margin-right: 55px; height: 100%; > h2 { margin-bottom: 7px; font-size: 31px; color: $wColor; } > P { margin-top: 32px; } } > img { width: 605px; height: 530px; margin-top: 2px; } > p { position: absolute; right: 267px; bottom: 100px; width: 240px; line-height: 30px; font-size: 12px; } } .origin-bd-box{ width: 100%; min-width: 1255px; background: #151515 no-repeat center; .origin-bd { width: 1255px; height: 770px; margin: 0 auto 115px; .origin-bd-main { float: left; width: 625px; height: 435px; margin-right: 45px; > img { width: 614px; height: 403px; } > p { font-size: 14px; text-align: left; } } .origin-bd-slide { float: left; width: 550px; height: 435px; > h3 { font-size: 32px; margin: 14px 0 40px; color: $wColor; } > p { font-size: 16px; } } > ul { float: left; width: 1255px; height: 320px; margin: 30px auto; > li { float: left; margin-left: 14px; &:first-child { margin-left: 0; } > img { width: 409px; height: 271px; } > p { font-size: 14px; text-align: center; } } } } } .origin-ft { width: 1255px; height: 541px; margin: 0 auto; text-align: center; .storyQjain { width: 333px; height: 542px; margin:0 30px 0 10px; .text-wrap-storyQjain { position: absolute; top: 0; left: 0; width: 333px; height: 542px; text-align: right; .withRight{ text-align: right; } } } } } .idea { width: $maxWidth; min-width: 1400px; height: auto; margin: 0 auto; padding-top: 126px; background-color: #151515; > h1 { width: 1400px; margin: 0 auto; padding-bottom: 40px; text-align: center; line-height: 38px; font-size: 38px; letter-spacing: 10px; border-bottom: 1px solid #ccc; color: $wColor } > div { position: relative; width: 1255px; margin: 35px auto 0; >span{ position: absolute; top: -35px; left: 581px; display: block; width: 80px; height: 2px; background-color: #ccc; } > img { width: 1255px; margin-bottom: 28px; } } } .series { padding-top: 78px; padding-bottom: 60px; } //以下是品牌实力样式 //----------------------------- .title-space{ letter-spacing: 10px; } .title-tenSpace{ letter-spacing: 10px; } .pin-hd-top{ margin-bottom: 95px; } .text-wrap-flagLeft{ position: absolute; top:0; left:0; width: 575px; padding-top:5px; .hgroup-textLeft{ text-align: left; } } .flag-cont{ margin-top:50px; line-height: 30px; font-size: 16px; } .text-wrap-flag { position:absolute; top: 55%; left: 0; width: 590px; &:after { content:''; display: block; clear: both; } .flag-title{ font-size: 24px; margin-bottom: 30px; color: #fff; } >ul { float:left; li{ float:left; margin-right: 50px; line-height: 44px; >img{ vertical-align: middle; margin-right: 10px; margin-bottom: 3px; } >span{ font-size: 16px; letter-spacing: 2px; } } } } .t-title { width: 100%; min-width:1400px; height: 277px; padding-top: 104px; background: #151515 no-repeat center; > h1 { position: relative; width: 1400px; margin: 0 auto; padding-bottom: 40px; text-align: center; line-height: 38px; font-size: 38px; letter-spacing:10px; border-bottom:1px solid #c1c1c1; color:#fff; &:after { content: ''; position: absolute; left: 50%; bottom: -3px; width: 80px; height: 2px; margin-left: -45px; background-color: #ccc; } } } .pin-hd{ width:100%; min-width: 1400px; height: 448px; text-align: center; background: #151515 no-repeat center; } .pin-bd{ position: relative; width: 100%; min-width: 1400px; height: 1120px; margin: 0 auto; background: #151515 no-repeat center; .text-wrap-pinContTpo{ position: absolute; top: 265px; left:50%; width:715px; margin-left:-357px; text-align: center; } } .pin-ft{ position: relative; width: 100%; min-width: 1400px; height: 854px; margin: 0 auto; padding-top:128px; background-color:#151515; text-align: center; >h2{ margin-bottom:30px; line-height: 34px; font-size: 34px; color:#fff; letter-spacing: 3px; } >p{ line-height: 30px; font-size: 16px; letter-spacing: 2px; } >img{ width:401px; height:554px; margin: 50px 0 100px; } .pin-ft-imgCenter { margin-left: 20px; margin-right: 20px; } } .jinis{ width:100%; min-width: 1400px; background-color:#151515; } .jinisi-hd{ width: 1255px; margin:0 auto; text-align: center; >h2{ line-height: 32px; font-size: 32px; margin-bottom: 30px; color:#fff; letter-spacing: 3px; } >p{ line-height: 30px; font-size:16px; letter-spacing: 2px; } >img { margin: 40px 0 107px; } .ji-hd-first{ width:843px; height:586px; margin-right: 16px; } .ji-hd-last{ width: 391px; height: 587px; } } .jinisi-bd{ width: 1255px; margin:0 auto; text-align: center; >h2{ margin-bottom: 45px; line-height: 32px; font-size:32px; color:#fff; letter-spacing: 3px; } >video{ width:835px; height:469px; margin-bottom:35px; } } .jinisi-ft{ width: 1255px; margin:0 auto; text-align: center; >img { vertical-align:top; } .ji-ft-hd{ margin: 0 14px 14px 0; } .ji-ft-ft{ margin-right: 14px; } >p{ line-height:30px; font-size: 16px; margin-top: 15px; letter-spacing: 2px; } } .yanfa{ width:100%; min-width: 1400px; padding-top:120px; background-color:#151515; } .yanfa-hd{ width: 1255px; margin: 0 auto; text-align: center; > h2 { margin-bottom: 48px; line-height: 32px; font-size: 32px; letter-spacing: 3px; color:#fff; } >p { line-height: 30px; font-size: 16px; letter-spacing: 2px; } } .yanfa-bd { width: 1255px; margin: 0 auto; padding-top: 56px; &:after { content:''; display:block; clear:both; } .yanfa-bd-main{ float:left; width: 714px; margin-right: 25px; >img { width:714px; height:411px; } >h3 { margin: 22px 0 32px; line-height: 26px; font-size: 26px; color: #fff; letter-spacing: 3px; } >p { padding-right:22px; line-height: 30px; font-size:16px; letter-spacing: 1px; } } .yanfa-bd-slide { float:left; width: 512px; >img { width:512px; height:411px; } >h3 { margin: 22px 0 32px; line-height: 26px; font-size: 26px; color: #fff; letter-spacing: 3px; } >p { line-height: 30px; font-size:16px; letter-spacing: 1px; } } } .yanfa-ft>p { text-align: center; font-size: 16px; line-height: 30px; letter-spacing: 2px; } .yanfa-ft-img { display: block; width: 1255px; height: 1310px; margin:62px auto 20px; text-align: center; } .jiduan { width: 100%; min-width: 1400px; padding-top: 90px; margin: 0 auto; background-color: #151515; >img { display: block; width:1257px; height:1255px; margin:0 auto; } } //极端测试 //--------- .wrapper-outer { width: 100%; min-width: 1400px; background-color: #151515; } .wrapper { width: 1400px; margin: 0 auto; padding-top: 90px; .wrapper-title { margin-bottom: 55px; line-height: 32px; font-size: 32px; text-align: center; color: #fff; letter-spacing: 2px; } .content { width: 1255px; margin: 0 auto; .jiduan-main { float: left; width: 780px; margin-right: 30px; >img { width: 779px; height: 465px; margin-bottom: 40px; } .text-wrap-jiduan { width: 720px; } .jgroup-title { line-height: 26px; font-size: 26px; color: #fff; margin-bottom: 25px; } } .jiduan-slide { width: 444px; height: 640px; } } .wrapper-footer { width: 1255px; margin: 30px auto 0; &:after { content: ''; display: block; clear: both; } .ft-box { width:619px; >img { width: 619px; height: 441px; } >p { line-height: 30px; font-size: 16px; letter-spacing: 2px; text-align: center; } } .ft-main { margin-right: 15px; } } } .title-tese{ height: 250px; } .tese { width: 100%; min-width: 1400px; padding-bottom: 84px; background-color: #151515; >div { width: 1400px; margin: 0 auto; img { display: block; margin: 0 auto; background: url(images/none.png) no-repeat 100% 100%; } } } .tese-hd { width:1254px; height:551px; margin: 0 auto; >img { width:1253px; height:551px; } } .tese-bd { width:1255px; height:552px; margin: 0 auto; >img { width:1255px; height:552px; } } .tese-ft { width: 1253px; height: 552px; margin: 0 auto; >img { width: 1254px; height: 552px; } } //以下是手表知识样式 //-------------------- .l-Bgbox { width: $maxWidth; min-width: 1400px; background: no-repeat center 0; } .l-box { width: $maxWidth; min-width: 1400px; } .l-banner{ width: 1400px; height: 954px; margin: 0 auto; padding-top: 100px; .l-bannerText { position: absolute; top: 280px; right: 58px; width: 600px; .l-bannerTitle { margin-bottom: 30px; line-height: 49px; font-size: 32px; } } .bannerTipUp { right: 132px; top: 640px; } .bannerTipDown { right: 132px; top: 785px; } } .l-compared { height: 855px; } .threeKey { width: 1400px; height: 795px; margin: 0 auto; padding-top: 100px; .subtitle { line-height: 30px; font-size: 16px; text-align: center; } .threeKeytip { position: absolute; top: 690px; left: 225px; font-size: 16px; letter-spacing: 2px; .cen { margin: 0 350px; } } } .why { width: 1400px; height: 1700px; margin: 0 auto; text-align: center; .whyText { position: absolute; left: 50%; width: 880px; margin-left: -440px; } .whyTextTop { top: 130px; } .whyTextMid { top: 700px; } .whyTextFt { top: 1115px; } .whyTextTip { top: 1025px; span { margin-right: 18px; margin-left: 34px; } } .whyTextGrade { top: 1580px; color: #999CA1; } .whyTitle { margin-bottom: 40px; line-height: 30px; font-size: 30px; } } .cap { width: 1400px; margin: 0 auto; padding-top: 90px; color: #000; .capText { width: 855px; margin: 0 auto; text-align: center; .capTitle { line-height: 30px; font-size: 30px; margin-bottom: 40px; } } .capMd { width: 1255px; margin: 50px auto 0; &:after { content:''; display: block; clear: both; } .capMdTitle { margin-bottom: 10px; font-size: 18px; } .pic-box + .pic-box { margin-top: 0; } .capMdText { position: absolute; top: 107px; left: 390px; color: #c1c1c1; } } .capFt { width: 1254px; margin: 0 auto; .capFtText { position: absolute; left: 710px; top: 135px; } } } .BackCover { width: 1400px; height: 703px; margin: 0 auto; padding-top: 85px; .BackCoverTitle { margin-bottom: 50px; line-height: 30px; font-size: 30px; text-align: center; } .BackCoverPicbox { width: 995px; margin: 0 auto; } .BackCoverText { position: absolute; top: 125px; left: 100px; } } .accuracy { width:1400px; min-height: 2975px; margin: 0 auto; padding-top: 100px; h1 { border-color: #9D9D9D; &:after { background-color: #9D9D9D; } } .accuracyPicbox { width: 1257px; margin: 0 auto; .accuracyTitle { margin-bottom: 30px; line-height: 32px; font-size: 32px; } .accuracyTextUp { position: absolute; top: 230px; right: 80px; } .accuracyTextDown { position :absolute; top: 133px; left: 165px; width: 460px; } } .content { width: 940px; margin: 70px auto 60px; line-height: 30px; text-align: center; font-size: 16px; letter-spacing: 2px; color: #000; } .ronda,.eta { display: block; width: 1300px; height: 700px; margin: 0 auto; } } .infoArticle { width: 1400px; height: 475px; margin: 0 auto; padding-top: 90px; .infoArticleList { width: 840px; min-height: 500px; margin: 50px auto 0; padding: 0 30px; line-height: 30px; font-size: 16px; letter-spacing: 2px; a:hover { text-decoration: underline; } } .more { margin-top: 40px; text-align: right; } } //以下是文章页样式 //---------------- .article-outer { width: $maxWidth; min-width: $comWidth; background-color: #FFF; } .article-wrap { width: 990px; min-height: 1080px; margin: 0 auto; color: #000; letter-spacing: 2px; } ul.articleNav { width:100%; height: 72px; line-height: 72px; li { float: left; margin-right: 15px; a { color: #777; } } } .articleTitle { margin: 15px 0; line-height: 40px; font-size: 28px; } .articleSth { height: 15px; margin-bottom: 30px; color: #777; } .article { padding-bottom: 155px; .articleSubTitle { margin-bottom: 29px; line-height: 16px; font-size: 16px; font-weight: bold; } p { margin-bottom: 45px; line-height: 24px; font-size: 14px; } .articlePic { text-align: center; } } .articleList-wrap { width: 800px; margin: 0 auto; padding: 85px 100px; .articleListTitle { text-align: center; } .articleList { line-height: 35px; font-size: 16px; white-space: nowrap; a:hover { text-decoration: underline; } a:visited { color: #d71c11; } } } .page { width: 335px; margin: 30px auto; .clickedBtn { background-color: #333; color: #fff !important; } .hasborderBtn { border: 1px solid #e6e6e6; } .pgBtn { display: inline-block; width: 30px; height: 30px; margin-left: 5px; vertical-align: top; font-size: 14px; line-height: 30px; text-align: center; color: #666; } .pgBtnBox { display: inline-block; } .pgTo { display: inline-block; width: 52px; height: 30px; vertical-align: top; font-size: 14px; line-height: 30px; text-align: center; color: #666; input { width: 30px; height: 27px; text-align: center; vertical-align: top; border: none; } span { font-size: 20px; } } }