.index { width: 100%; height: 80px; } .index-header-wraper { width: 100%; position: absolute; top: 0; background: rgba(0, 0, 0, 0.36); color: #ffffff; z-index: 1000; } .header { width: 1200px; left: 50%; top: 0; left: calc(-550%); height: 89px; margin: 0 auto; } .header .header_logo { float: left; height: 89px; line-height: 89px; cursor: pointer; } .header .header_logo img { margin-top: 20px; } .header .header_nav { float: left; margin-left: 224px; } .header .header_nav ul { font-size: 18px; font-family: MicrosoftYaHei; font-weight: 400; text-align: center; cursor: pointer; } .header .header_nav ul li { float: left; width: 80px; height: 86px; line-height: 86px; margin: 0 10px; } .header .header_nav ul li:hover { border-bottom: 2px solid #21d06e; color: #21d06e; } .header .header_nav ul .isActive { border-bottom: 2px solid #21d06e; color: #21d06e; } .index-view { margin-top: 89px; } iframe { display: block; width: 100%; } .footer .wraper { width: 100%; background: #444444; } .footer .wraper .top { padding-top: 40px; margin: 0 auto; width: 1200px; height: 300px; } .footer .wraper .top .router-anchor li:hover { color: #1BB65F; cursor: pointer; } .footer .wraper .top .about, .footer .wraper .top .contact, .footer .wraper .top .wchat { width: 33%; float: left; } .footer .wraper .top .about p, .footer .wraper .top .contact p, .footer .wraper .top .wchat p { height: 16px; font-size: 16px; font-family: MicrosoftYaHei; font-weight: bold; color: #ffffff; margin-bottom: 37px; } .footer .wraper .top .about ul, .footer .wraper .top .contact ul, .footer .wraper .top .wchat ul { height: 157px; font-size: 14px; font-family: MicrosoftYaHei; font-weight: 400; color: #eeeeee; line-height: 36px; width: 430px; } .footer .wraper .top .about ul li, .footer .wraper .top .contact ul li, .footer .wraper .top .wchat ul li { width: 100%; } .footer .wraper .top .about .wchatImg, .footer .wraper .top .contact .wchatImg, .footer .wraper .top .wchat .wchatImg { width: 190px; height: 190px; } .footer .wraper .top .about .wchatImg img, .footer .wraper .top .contact .wchatImg img, .footer .wraper .top .wchat .wchatImg img { width: 100%; } .footer .wraper .top .contact .foottitle { width: 70px; float: left; text-align: justify; text-justify: distribute-all-lines; /*ie6-8*/ text-align-last: justify; /* ie9*/ -moz-text-align-last: justify; /*ff*/ -webkit-text-align-last: justify; /*chrome 20+*/ } .footer .wraper .top .contact .footdes { margin-left: 5px; float: left; width: 300px; text-align: left; } .footer .wraper .top .wchat { text-align: center; } .footer .wraper .top .wchat img { margin-left: 159px; } .footer .wraper .bottom { font-size: 16px; width: 100%; height: 49px; line-height: 49px; text-align: center; background: #333333; color: #fff; } .footer .wraper .bottom .lawdes:hover { cursor: pointer; color: #1BB65F; }