/**重置标签默认样式*/ * { margin: 0; padding: 0; } html { width: 100%; } body { font-family: "pingfang sc", "proxima nova", "helvetica neue", "helvetica", "hiragino sans gb", "stheitisc light", "microsoft yahei", "arial", "sans-serif" !important; } @media screen and (min-width:1200px) { #ylasmindex { width: 100%; background-color: #fff !important; } .ylhead { width: 100%; height: 600px; background-image: ; background-repeat: no-repeat; background-size: cover; } .ylhead .ylheader { box-sizing: border-box; width: 100%; height: 69px; } .ylhead .ylheader .center { width: 1065px; height: 100%; margin: 0 auto; position: relative; padding-top: 20px; } .ylhead .ylheader .center .logo { width: 136px; height: 38px; background-repeat: no-repeat; background-position: center; background-size: cover; background-image: ; } .ylhead .ylheader .center .logo:hover { cursor: pointer; } .ylhead .ylheader .center .consult { width: 88px; height: 30px; font-size: 14px; color: #ffffff; line-height: 30px; text-align: center; box-sizing: border-box; border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 2px; position: absolute; right: 0; top: 50%; transform: translatey(-50%); } .ylhead .ylheader .center .consult:hover { cursor: pointer; } .ylhead .bannerinner { width: 1065px; margin: 155px auto 189px; } .ylhead .bannerinner .title { font-size: 38px; font-weight: 300; color: #ffffff; line-height: 50px; margin-bottom: 15px; } .ylhead .bannerinner .desc { font-size: 15px; font-weight: 300; color: #ffffff; line-height: 25px; } .ylhead .bannerinner .linkdetail { width: 140px; height: 44px; line-height: 44px; background: #0076eb; border-radius: 2px; font-size: 14px; color: #ffffff; text-align: center; margin-top: 55px; } .ylhead .bannerinner .linkdetail:hover { cursor: pointer; } .ylmain { width: 100%; } .ylmain .listone { width: 100%; height: 742px; box-sizing: border-box; overflow: hidden; } .ylmain .listone p.title { width: 100%; text-align: center; font-size: 32px; font-weight: 400; color: #061329; margin-top: 80px; } .ylmain .listone ul.switchtab-mobile { display: none; } .ylmain .listone ul.switchtab { width: 912px; height: 108px; margin: 0 auto; list-style: none; margin-top: 50px; } .ylmain .listone ul.switchtab li { width: 152px; height: 100%; float: left; text-align: center; position: relative; } .ylmain .listone ul.switchtab li .active { color: #0076eb !important; } .ylmain .listone ul.switchtab li span.iconfont { font-size: 45px; display: block; position: relative; } .ylmain .listone ul.switchtab li span.iconfont span.text { font-size: 14px; font-weight: 400; color: #494a4d; position: absolute; bottom: -20px; left: 50%; transform: translatex(-50%); } .ylmain .listone ul.switchtab li p.bottomline { width: 100px; height: 14px; background-image: ; background-size: 100%; position: absolute; bottom: -14px; left: 50%; transform: translatex(-50%); } .ylmain .listone ul.listonedetail { width: 100%; height: 450px; background: #f8f9fa; } .ylmain .listone ul.listonedetail li.lione { width: 960px; height: 100%; margin: 0 auto; list-style: none; display: flex; align-items: center; justify-content: space-between; box-sizing: border-box; } .ylmain .listone ul.listonedetail li.lione h4.title { height: 100%; font-size: 30px; font-weight: 400; color: #061329; line-height: 450px; } .ylmain .listone ul.listonedetail li.lione ul.points li { list-style: none; line-height: 52px; font-size: 16px; font-weight: 300; color: #494a4d; position: relative; } .ylmain .listone ul.listonedetail li.lione ul.points li .ltp { display: block; width: 16px; height: 16px; background-image: ; background-size: 100%; position: absolute; left: -24px; top: 50%; transform: translatey(-50%); } .ylmain .listone ul.listonedetail li.lione div.img { width: 400px; height: 400px; } .ylmain .listone ul.listonedetail li.lione div.img img { width: 100%; height: 100%; } .ylmain .listtwo { width: 100%; height: 500px; overflow: hidden; padding-bottom: 100px; box-sizing: content-box !important; webkit-box-sizing: content-box !important; } .ylmain .listtwo p.title { width: 100%; text-align: center; font-size: 32px; font-weight: 400; color: #061329; margin-top: 80px; margin-bottom: 100px; box-sizing: border-box; } .ylmain .listtwo .list { width: 100%; display: flex; justify-content: space-around; padding: 0 80px; box-sizing: border-box; } .ylmain .listtwo .list li { list-style: none; width: 212px; } .ylmain .listtwo .list li div.img { width: 78px; height: 78px; background-image: ; background-size: 100%; margin: 0 auto; } .ylmain .listtwo .list li div.img2 { background-image: ; } .ylmain .listtwo .list li div.img3 { background-image: ; } .ylmain .listtwo .list li div.img4 { background-image: ; } .ylmain .listtwo .list li h4.title { width: 100%; height: 25px; text-align: center; font-size: 18px; font-weight: 400; color: #061329; line-height: 25px; margin: 50px 0 10px 0; box-sizing: border-box; } .ylmain .listtwo .list li p.desc { width: 100%; height: 96px; text-align: center; font-size: 13px; font-weight: 300; color: #494a4d; line-height: 24px; } .ylmain .listthree { width: 100%; background: #f8f9fa; padding-bottom: 100px; } .ylmain .listthree p.title { width: 100%; text-align: center; font-size: 32px; font-weight: 400; color: #061329; padding-top: 100px; padding-bottom: 80px; } .ylmain .listthree ul.list-mobile { display: none; } .ylmain .listthree ul.list { box-sizing: border-box; width: 100%; padding: 0 75px; display: flex; justify-content: space-around; } .ylmain .listthree ul.list li { list-style: none; width: 280px; height: 190px; background-color: #fff; position: relative; } .ylmain .listthree ul.list li .img { width: 240px; height: 90px; background-size: 100%; background-repeat: no-repeat; position: absolute; left: 50%; top: 50%; transform: translatey(-50%) translatex(-50%); } .ylmain .listthree ul.list li .img1 { background-image: ; } .ylmain .listthree ul.list li .img2 { background-image: ; } .ylmain .listthree ul.list li .img3 { background-image: ; } .ylmain .listthree ul.list li .img4 { background-image: ; } .ylmain div.zixun { width: 100%; height: 218px; background-image: ; background-size: cover; background-position: center; padding-top: 57px; box-sizing: border-box; } .ylmain div.zixun .title { width: 100%; text-align: center; height: 45px; font-size: 32px; font-weight: 400; color: #ffffff; line-height: 45px; margin-bottom: 23px; } .ylmain div.zixun .link { width: 139px; height: 42px!important; line-height: 42px!important; background: #0076eb; border-radius: 2px; margin: 0 auto; font-size: 16px; font-weight: 400; color: #ffffff; text-align: center; } .ylmain div.zixun .link:hover { cursor: pointer; } .ylmain div.footer { width: 100%; height: 228px; background: #192531; padding: 52px 0; box-sizing: border-box; position: relative; } .ylmain div.footer ul.icon { width: 460px; margin: 0 auto; display: flex; } .ylmain div.footer ul.icon li { flex-shrink: 0; list-style: none; width: 42px!important; height: 42px!important; border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 50%; position: relative; text-align: center; line-height: 42px; } .ylmain div.footer ul.icon li span.iconfont { color: #fff; font-size: 24px; } .ylmain div.footer ul.icon li span.text { position: absolute; width: 60px; bottom: -50px; left: 50%; transform: translatex(-50%); font-size: 14px; font-weight: 100; color: #ffffff; } .ylmain div.footer ul.icon li:hover { cursor: pointer; } .ylmain div.footer ul.icon li:nth-child(2) { margin: 0 175px; } .ylmain div.footer div.ma { width: 122px; height: 122px; position: absolute; right: 126px; top: 50%; transform: translatey(-50%); background-image: ; background-size: 100%; } .ylmain div.footer div.copyright { width: 100%; text-align: center; height: 53px; font-size: 11px; font-weight: 300; color: #606875; line-height: 53px; position: absolute; bottom: 0; } } @media screen and (max-width: 1199px) { .ylhead { width: 100%; height: 360px; background-image: ; background-repeat: no-repeat; background-size: cover; box-sizing: border-box; } .ylhead .ylheader { box-sizing: border-box; width: 100%; height: 50px; background-color: #020915; padding-right: 10px; } .ylhead .ylheader .center { width: 100%; height: 100%; margin: 0 auto; position: relative; padding-top: 10px; } .ylhead .ylheader .center .logo { width: 88px; height: 25px; margin-left: 10px; background-repeat: no-repeat; background-position: center; background-size: cover; background-image: ; } .ylhead .ylheader .center .consult { width: 80px; height: 30px; font-size: 14px; background-color: #006edb; color: #ffffff; line-height: 30px; text-align: center; box-sizing: border-box; border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 2px; position: absolute; right: 0; top: 50%; transform: translatey(-50%); } .ylhead .bannerinner { width: 92%; margin: 0 auto; text-align: center; box-sizing: border-box; } .ylhead .bannerinner .title { font-size: 38px; font-weight: 300; color: #ffffff; line-height: 50px; margin-bottom: 15px; } .ylhead .bannerinner .desc { font-size: 15px; font-weight: 300; color: #ffffff; line-height: 25px; } .ylhead .bannerinner .linkdetail { width: 140px; height: 44px; line-height: 44px; background: #0076eb; border-radius: 2px; font-size: 14px; color: #ffffff; text-align: center; margin-top: 55px; margin: 40px auto 0; } div.ylmain { width: 100%; } div.ylmain div.listone { width: 100%; } div.ylmain div.listone p.title { width: 224px; height: 90px; text-align: center; margin: 40px auto; font-size: 32px; font-weight: 400; color: #061329; line-height: 45px; } div.ylmain div.listone ul.switchtab { display: none; } div.ylmain div.listone ul.switchtab-mobile { width: 100%; } div.ylmain div.listone ul.switchtab-mobile li.outli { width: 100%; height: 60px; line-height: 60px; border-top: 1px solid #e6e6e6; overflow: hidden; position: relative; box-sizing: border-box; } div.ylmain div.listone ul.switchtab-mobile li.outli p.bottomline { display: none; } div.ylmain div.listone ul.switchtab-mobile li.outli span.rt { color: #5d6b83; display: block; width: 28px; height: 28px; font-size: 28px; position: absolute; right: 10px; top: 50%; margin-top: -30px; } div.ylmain div.listone ul.switchtab-mobile li.outli span.lt { color: #5d6b83; display: block; width: 32px; height: 32px; font-size: 32px; position: relative; margin-left: 30px; } div.ylmain div.listone ul.switchtab-mobile li.outli span.lt span.text { display: block; height: 32px; width: 300px; font-size: 18px; font-weight: 400; color: #494a4d; position: absolute; top: 0; left: 40px; } div.ylmain div.listone ul.switchtab-mobile li.outli span.active { color: #0076eb !important; } div.ylmain div.listone ul.switchtab-mobile li.outli span.active span.text { color: #0076eb !important; font-weight: 700; } div.ylmain div.listone ul.switchtab-mobile li.outli div.detail { width: 100%; height: 174px; background: #f8f9fa; } div.ylmain div.listone ul.switchtab-mobile li.detail { width: 100%; background: #f8f9fa; padding: 0 30px; box-sizing: border-box; } div.ylmain div.listone ul.switchtab-mobile li.detail div.inner { width: 100%; height: 100%; padding: 0 10px; display: flex; justify-content: space-between; box-sizing: border-box; align-items: center; } div.ylmain div.listone ul.switchtab-mobile li.detail div.inner h4.title { height: 100%; font-size: 20px; font-weight: 400; color: #0076eb; } div.ylmain div.listone ul.switchtab-mobile li.detail div.inner ul.points { padding: 10px 0; margin-left: 30px; } div.ylmain div.listone ul.switchtab-mobile li.detail div.inner ul.points li { list-style: none; line-height: 38px; font-size: 14px; font-weight: 300; color: #494a4d; position: relative; width: 150px; } div.ylmain div.listone ul.switchtab-mobile li.detail div.inner ul.points li .ltp { display: block; width: 16px; height: 16px; background-image: ; background-size: 100%; position: absolute; left: -24px; top: 50%; transform: translatey(-50%); } div.ylmain div.listone ul.listonedetail { display: none; } div.ylmain .listtwo { width: 100%; height: 600px; } div.ylmain .listtwo p.title { width: 100%; text-align: center; font-size: 32px; font-weight: 400; color: #061329; margin-top: 80px; margin-bottom: 20px; } div.ylmain .listtwo .list { width: 100%; justify-content: space-around; padding: 0 10px; box-sizing: border-box; } div.ylmain .listtwo .list li { list-style: none; width: 50%; float: left; padding: 0 20px; box-sizing: border-box; margin-top: 20px; } div.ylmain .listtwo .list li div.img { width: 70px; height: 70px; background-image: ; background-size: 100%; margin: 0 auto; } div.ylmain .listtwo .list li div.img2 { background-image: ; } div.ylmain .listtwo .list li div.img3 { background-image: ; } div.ylmain .listtwo .list li div.img4 { background-image: ; } div.ylmain .listtwo .list li h4.title { width: 100%; height: 25px; text-align: center; font-size: 18px; font-weight: 400; color: #061329; line-height: 25px; margin: 20px 0 10px 0; } div.ylmain .listtwo .list li p.desc { width: 100%; text-align: center; font-size: 13px; font-weight: 300; color: #494a4d; line-height: 24px; } div.ylmain div.listthree { width: 100%; overflow: hidden; background: #f8f9fa; } div.ylmain div.listthree p.title { width: 100%; font-size: 32px; font-weight: 400; color: #061329; text-align: center; margin-top: 60px; margin-bottom: 20px; } div.ylmain div.listthree ul.list { display: none; } div.ylmain div.listthree div.list-mobile { width: 100%; padding: 0 10px; box-sizing: border-box; padding-bottom: 30px; } div.ylmain div.listthree div.list-mobile ul { width: 100%; display: flex; } div.ylmain div.listthree div.list-mobile ul li { list-style: none; width: 50%; height: 200px; background-color: #fff; padding: 20px; box-sizing: border-box; margin: 10px; } div.ylmain div.listthree div.list-mobile ul li div.img { width: 100%; height: 100%; background-size: 100%; background-repeat: no-repeat; background-position: center; } div.ylmain div.listthree div.list-mobile ul li div.img1 { background-image: ; } div.ylmain div.listthree div.list-mobile ul li div.img2 { background-image: ; } div.ylmain div.listthree div.list-mobile ul li div.img3 { background-image: ; } div.ylmain div.listthree div.list-mobile ul li div.img4 { background-image: ; } div.ylmain div.zixun { width: 100%; height: 200px; background-image: ; background-size: cover; background-repeat: no-repeat; background-position: center; padding-top: 45px; box-sizing: border-box; } div.ylmain div.zixun div.title { width: 100%; font-size: 32px; font-weight: 400; color: #ffffff; text-align: center; } div.ylmain div.zixun div.link { width: 139px; height: 42px!important; background: #0076eb; border-radius: 2px; text-align: center; margin: 0 auto; line-height: 42px!important; margin-top: 23px; font-size: 16px; font-weight: 400; color: #ffffff; } div.ylmain div.footer { width: 100%; height: 200px; background: #192531; position: relative; padding-top: 40px; box-sizing: border-box; } div.ylmain div.footer ul.icon { width: 100%; display: flex; justify-content: space-around; } div.ylmain div.footer ul.icon li { flex-shrink: 0; list-style: none; width: 42px!important; height: 42px!important; border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 50%; position: relative; text-align: center; line-height: 42px; } div.ylmain div.footer ul.icon li span.iconfont { color: #fff; font-size: 24px; } div.ylmain div.footer ul.icon li span.text { font-size: 14px; position: absolute; width: 60px; bottom: -50px; left: 50%; transform: translatex(-50%); font-weight: 100; color: #ffffff; } div.ylmain div.footer div.ma { display: none; } div.ylmain div.footer div.copyright { width: 100%; position: absolute; bottom: 20px; text-align: center; font-size: 10px; font-weight: 400; color: #606875; } }