/* 首页 */ .p-home .g-about { margin: 0 auto; width: 1000px; height: 463px; margin-bottom: 20px; } .p-home .g-about h4{ height: 140px; position: relative; padding-top: 40px; } .p-home .g-about h4:after { content: 'ABOUT'; display: inline-block; color: #f9f9f9; position: absolute; font-size: 72px; left: 30px; z-index: 2; font-weight: bold; top: 25px; } .p-home .g-about h4 span{ font-size: 38px; position: relative; z-index: 99; line-height: 100px; } .p-home .g-about h4 span:before { content: ''; display: inline-block; position: absolute; left: -185px; top: 0px; bottom: 0; margin: auto; width: 170px; height: 20px; background-image: url(../frame/img-8.png); } .p-home .g-about h4 ul { height: 100px; float: right; width: 300px; padding-top: 35px; } .p-home .g-about h4 ul li { width: 40px; height: 30px; float: right; margin-left: 30px; text-align: center; cursor: pointer; position: relative; } .p-home .g-about h4 ul li >div { width: 220px; height:0px; position: absolute; left: -90px; right: 0; margin: auto; overflow: hidden; } .p-home .g-about h4 ul li >div b { display: inline-block; width: 220px; height: 40px; background: rgba(0,0,0,.6); position: absolute; top: 11px; left: 0; margin: auto; border-radius: 6px; line-height: 40px; color: #fff; font-size: 14px; } .p-home .g-about h4 ul li >div:before { content: ''; display: inline-block; width: 220px; height: 11px; background-image: url(../frame/icon-1.png); position: absolute; left: 0; right: 0; margin: auto; top: 0px; } .p-home .g-about h4 ul li:hover i{ color: #2740bf; transition: color .5s; -moz-transition: color .5s; -webkit-transition: color .5s; -o-transition: color .5s; } .p-home .g-about h4 ul li:hover div{ height: 51px; transition: height .5s; -moz-transition: height .5s; -webkit-transition: height .5s; -o-transition: height .5s; } .p-home .g-about h4 ul li i { line-height: 30px; font-size: 24px; color: #c5c5c5; } .p-home .g-about .left { width: 300px; display: inline-block; margin-right: 50px; float: left; text-align: right; } .p-home .g-about .left img { width: 200px; height: 260px; display: inline-block; background: #eee; } .p-home .g-about .right { width: 650px; display: inline-block; float: right; } .p-home .g-about .right p { font-size: 15px; color: #333; line-height: 26px; text-indent: 2em; margin-bottom: 10px; } .p-home .g-about .right ul { padding-top: 20px; } .p-home .g-about .right a { display: inline-block; width: 100px; cursor: pointer; } .p-home .g-about .right a:hover i{ color: #2e4c96; } .p-home .g-about .right a:hover span{ color: #000; } .p-home .g-about .right a i { font-weight: bold; font-size: 20px; color: #21325b; display: block; padding-bottom:5px; } .p-home .g-about .right a span { display: block; font-size: 12px; color: #333; } .p-home .g-direction { margin: 0 auto; width: 1000px; } .p-home .g-direction h4 { height: 140px; text-align: center; position: relative; padding-top: 40px; } .p-home .g-direction h4:after { content: 'DIRECTION'; display: inline-block; color: #f9f9f9; position: absolute; font-size: 72px; left: 0; right: 0; top: 25px; margin: auto; z-index: 2; font-weight: bold; } .p-home .g-direction h4 span{ font-size: 38px; position: relative; z-index: 99; line-height: 100px; } .p-home .g-direction h4 span:before { content: ''; display: inline-block; position: absolute; left: -320px; top: 0px; bottom: 0; margin: auto; width: 170px; height: 20px; background-image: url(../frame/img-8.png); } .p-home .g-direction h4 span:after { content: ''; display: inline-block; position: absolute; right: -320px; top: 0px; bottom: 0; margin: auto; width: 170px; height: 20px; background-image: url(../frame/img-9.png); } .p-home .g-direction ul { height: 500px; padding: 50px 0; } .p-home .g-direction a { width: 200px; height: 400px; float: left; padding: 0 10px; padding-top: 50px; font-size: 18px; filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); } .p-home .g-direction a:hover { margin-top: -30px; filter: grayscale(0%); -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); transition: filter .5s,margin-top .5s; -moz-transition: filter .5s,margin-top .5s; -webkit-transition: filter .5s,margin-top .5s; -o-transition: filter .5s,margin-top .5s; } .p-home .g-direction a:nth-child(2n) { padding-top: 260px; background: #eee; } .p-home .g-direction a:nth-child(1){ background-image: url(../frame/img-2.jpg); } .p-home .g-direction a:nth-child(2){ background-image: url(../frame/img-3.jpg); } .p-home .g-direction a:nth-child(3){ background-image: url(../frame/img-4.jpg); } .p-home .g-direction a:nth-child(4){ background-image: url(../frame/img-5.jpg); } .p-home .g-direction a:nth-child(5){ background-image: url(../frame/img-6.jpg); } .p-home .g-direction a i { display: block; color: #fff; } .p-home .g-direction a span { padding-bottom: 5px; display: block; padding-bottom: 10px; color: #fff; } .p-home .g-direction a p{ display: block; font-size: 14px; color: #aaa; } /* 团队成员 */ .p-team .m-menu { padding-top: 50px; } .g-team { width: 1000px; margin: 0 auto; padding-top: 100px; overflow: auto; } .g-team .item { width: 395px; height: 170px; border: 1px solid #e5e5e5; margin-left: 80px; position: relative; padding-left: 90px; padding-top: 20px; float: left; margin-bottom: 120px; } .g-team .item:nth-child(2n){ margin-left: 130px; } .g-team .item img { width: 140px; height: 190px; background: #eee; position: absolute; left: -80px; top: -50px; } .g-team .item span { display: inline-block; position: absolute; left: 87px; top: -45px; font-size: 24px; } .g-team .item ul li { font-size: 15px; line-height: 38px; position: relative; padding-left: 20px; } .g-team .item ul li:before { content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 3px; background: #2740bf; position: absolute; top: 0; bottom: 0; left: 0; margin: 15px 0 0 0; } .p-project { } .p-project .g-project { width: 1000px; margin: 0 auto; padding: 50px 0 0 0; } .p-project .g-project .item{ width: 100%; height: 160px; display: table; cursor: pointer; } .p-project .g-project .item:hover { box-shadow: 0px 6px 18px 0px rgba(8, 4, 5, 0.08); transition: all .2s; -moz-transition: all .2s; -webkit-transition: all .2s; -o-transition: all .2s; } .p-project .g-project .item .left { width: 150px; height: 160px; text-align: center; display: table-cell; vertical-align: middle; color: #333; } .p-project .g-project .item .left span { display: block; font-size: 18px; } .p-project .g-project .item .left i { display: block; font-size: 12px; padding: 5px 0; } .p-project .g-project .item .left p { display: block; font-size: 16px; } .p-project .g-project .item .center { height: 160px; width: 190px; display: table-cell; vertical-align: middle; } .p-project .g-project .item .center img { width: 160px; height: 90px; background: #eee; } .p-project .g-project .item .right { height: 160px; display: table-cell; vertical-align: middle; } .p-project .g-project .item .right p { color: #333; padding-bottom: 10px; } .p-project .g-project .item .right span { font-size: 14px; color: #666; } /* 项目成果页 */ .p-results .g-box { width: 1000px; margin: 0 auto; overflow: auto; } .p-results .m-list { width: 1000px; margin: 0 auto } .p-results .g-box .m-menu2 { width: 200px; float: left; } .p-results .g-box .m-list { width: 750px; float: right; } .p-results .g-box .m-menu { width: 100%; margin: auto; text-align: left; padding-top: 0; } /* 研究方向页 */ .p-direction .g-box{ width: 1000px; margin: 0 auto; overflow: auto; padding-top: 50px; } .p-direction .g-box .m-menu2 { width: 200px; float: left; } .p-direction .g-box .m-content { width: 750px; float: right; } /* 详细内容页 */ .p-article { } .p-article .m-content { padding-top: 30px; } /*团队成员页*/ .g-team .item .teamname{FONT-SIZE: 24px; POSITION: absolute; LEFT: 87px; DISPLAY: inline-block; TOP: -45px;}